draft: true
hidden: true
---
-{{<section container="full">}}
-{{<carousel class="mg-t-lg carousel-container-width">}}
-{{<getpages "projects" "hidden">}}
-{{</carousel>}}
+{{<section>}}
+ {{<media-block
+ title="Lead by a **dedicated community**"
+ media="/img/flatline/team-work.svg"
+ mediaMobilePosition="bottom"
+ alt="Illustration of three people carrying a large pie chart with one segment separated, symbolizing teamwork and data analysis."
+ class="block-space"
+ >}}
+ The Xen community is a dynamic and collaborative ecosystem comprised of developers, researchers, and enthusiasts dedicated to advancing open-source virtualization technology.
+With diverse backgrounds and expertise, members actively contribute to Xen's evolution, fostering innovation, sharing knowledge, and supporting one another through continuous development efforts.
+
+ <p class="mg-t-md">
+ <a href="/contribute/get-started" class="btn btn-primary">Get started <i class="fas fa-arrow-right"></i></a>
+ </p>
+ {{</media-block>}}
+{{</section>}}
+
+{{<section>}}
+
+ {{<media-block
+ title="Lead by a **dedicated community**"
+ media="/img/flatline/team-work.svg"
+ mediaPosition="right"
+ mediaMobilePosition="bottom"
+ alt="Illustration of three people carrying a large pie chart with one segment separated, symbolizing teamwork and data analysis."
+ class="block-space"
+ >}}
+ The Xen community is a dynamic and collaborative ecosystem comprised of developers, researchers, and enthusiasts dedicated to advancing open-source virtualization technology.
+With diverse backgrounds and expertise, members actively contribute to Xen's evolution, fostering innovation, sharing knowledge, and supporting one another through continuous development efforts.
+
+ <p class="mg-t-md">
+ <a href="/contribute/get-started" class="btn btn-primary">Get started <i class="fas fa-arrow-right"></i></a>
+ </p>
+ {{</media-block>}}
+{{</section>}}
+
+
+{{<section>}}
+ {{<media-block
+ title="Why Xen Project?"
+ media=`{{<youtube id="uuBhqwbaObE" title="Xen Project's Progress Toward Safety Certification" >}}`
+ animate="true"
+
+ >}}
+
+The Xen Project Hypervisor is uniquely placed to support a new range of use cases, building on top of 14 years of usage within the data center. In particular, its isolation and security features, flexible virtualization mode and architecture, driver disaggregation, and ARM support (only 47K lines of code) make it a perfect fit for embedded applications.
+
+{{</media-block>}}
+{{</section>}}
+
+{{<section>}}
+ {{<media-block
+ title="Basic concepts"
+ media="https://www.slideshare.net/slideshow/embed_code/key/hzJl1EbWmxfFUN"
+ alt="Slide for Unikraft's basic concepts on slideshare.net"
+ animate="true"
+ >}}
+The high-level goal of Unikraft is to be able to build unikernels targeted at specific applications without requiring the time-consuming, expert work that building such a unikernel requires today. An additional goal (or hope) of Unikraft is that all developers interested in unikernel development would contribute by supplying libraries rather than working on independent projects with different code bases as it is done now.
+{{</media-block>}}
+{{</section>}}
+
+{{<section>}}
+ {{<media-block
+ title="What is HVMI?"
+ media="https://xenproject.org/wp-content/uploads/sites/79/2020/07/github-hvmi-v2_Kek0TiK6.compressed.mp4"
+ alt="Video of a presentation about HVMI"
+ animate="true"
+ >}}
+HVMI stands for Hypervisor-based Memory Introspection. The technology leverages Virtual Machine Introspection (VMI) APIs in the Xen and KVM hypervisors. By gaining introspection of the raw memory of running guest virtual machines, HVMI can apply security logic to detect and prevent the use of common attack techniques, such as buffer overflows, heap spray, code injection, and so-on.
+{{</media-block>}}
{{</section>}}
.media-block {
- --gap: 1.7rem;
--content-gap: var(--sp-sm);
- --content-line-height: 1.66;
- --flex-direction: column-reverse;
- --media-max-width: 100%;
- --media-max-height: none;
- --basis: 100%;
- --col-width: 100%;
- --padding-v: 20px;
- --media-h-padding: 6.9vw;
+ --media-h-padding: 0;
--media-v-padding: 0;
- --animation-delay: 0.1s;
+ --gap: 20px;
+ --media-block-min-width: 296px;
display: flex;
- flex-wrap: nowrap;
- flex-direction: var(--flex-direction);
+ flex-wrap: wrap;
+ flex-direction: row-reverse;
justify-content: center;
align-items: center;
gap: var(--gap);
- &.image-small {
- --media-max-width: 200px;
- .media-block__media {
- flex: 0 1 20%;
- }
+ position: relative;
+
+ @include phone {
+ --media-block-min-width: 320px;
}
@include tablet {
- padding-top: var(--padding-v);
- padding-bottom: var(--padding-v);
+ --gap: 60px;
+ --media-h-padding: clamp(20px, 2%, 40px);
+ --media-v-padding: 0;
}
- @include media-max("tablet") {
- &.media-block--mobile-bottom {
- --flex-direction: column;
- }
+ @include desktop {
+ --media-h-padding: clamp(20px, 5%, 70px);
+ --gap: 80px;
+ }
+
+ &:has(.youtube-video-container),
+ &:has(.slide-container),
+ &:has(.slideshare-container),
+ &:has(video) {
+ --media-h-padding: 0 !important;
+ }
+ // &::before {
+ // content: "";
+ // position: absolute;
+ // top: 0;
+ // left: 50%;
+ // width: 1px;
+ // height: 100%;
+ // background-color: red;
+ // transform: translateX(-50%);
+ // }
- &.media-block--mobile-top {
- --flex-direction: column-reverse;
+ &.image-small {
+ .media-block__media {
+ --media-h-padding: 30%;
}
}
@include tablet {
- --gap: var(--sp-xl);
- --content-gap: var(--sp-xs);
- --content-line-height: 1.67;
- --flex-direction: row-reverse;
- --media-max-width: 100%;
- --media-max-height: 427px;
- --media-h-padding: 0;
- --basis: calc(50% - var(--gap) * 1);
- --col-width: var(--basis);
&.media-block--right {
- --flex-direction: row;
-
+ flex-direction: row;
&[data-animate] .media-block__media {
opacity: 0;
}
}
-
- &--right.animate .media-block__media {
- animation: slideFromRight 0.8s ease-out forwards;
- animation-delay: var(--animation-delay);
- }
-
- &--left.animate .media-block__media {
- animation: slideFromLeft 0.8s ease-out forwards;
- animation-delay: var(--animation-delay);
- }
-
- &[data-animate] .media-block__media {
- opacity: 0;
- }
}
&__label {
&__content,
&__media {
- flex: 1 1 var(--basis);
+ flex: 1 1 50%;
display: flex;
flex-direction: column;
justify-content: center;
}
+ &__media {
+ flex: 1 0 calc(50% - var(--gap));
+ }
+
&__content {
align-items: flex-start;
letter-spacing: 0.00625em;
}
&__media {
- width: var(--col-width);
+ min-width: var(--media-block-min-width);
+ display: flex;
+ justify-content: center;
align-items: center;
padding: var(--media-v-padding) var(--media-h-padding);
}
img {
- max-height: var(--media-max-height);
- max-width: var(--media-max-width);
width: 100%;
height: auto;
object-fit: contain;
}
}
+/* animations */
+.media-block {
+ &--right.animate .media-block__media {
+ animation: slideFromRight 0.8s ease-out forwards;
+ animation-delay: var(--animation-delay);
+ }
+
+ &--left.animate .media-block__media {
+ animation: slideFromLeft 0.8s ease-out forwards;
+ animation-delay: var(--animation-delay);
+ }
+
+ &[data-animate] .media-block__media {
+ opacity: 0;
+ }
+}
+
@keyframes slideFromRight {
from {
opacity: 0;