feat: redesign about us
Change-Id: I24e4ac2c64bc85c31c4009ca1eb50de6d3090462
diff --git a/content/en_index.php b/content/en_index.php
index a7e6100..38bfcb3 100644
--- a/content/en_index.php
+++ b/content/en_index.php
@@ -1,7 +1,7 @@
<?php
/**
- * Copyright (c) 2005, 2018, 2021, 2023 Eclipse Foundation and others.
+ * Copyright (c) 2005, 2018, 2021, 2023, 2024 Eclipse Foundation and others.
*
* This program and the accompanying materials are made
* available under the terms of the Eclipse Public License 2.0
@@ -14,68 +14,363 @@
?>
<div id="maincontent">
<div id="midcolumn">
- <h1><?php print $pageTitle; ?></h1>
- <p>
- The Eclipse Foundation provides our global community of individuals and organisations with a business-friendly environment for
- open source software collaboration and innovation. We host the <a href="https://eclipseide.org/">Eclipse IDE</a>, <a href="https://adoptium.net/">Adoptium</a>,
- <a href="https://sdv.eclipse.org/">Software Defined Vehicle</a>, <a href="https://jakarta.ee/">Jakarta EE</a>, and over 410+ open source
- <a href="https://www.eclipse.org/projects/">projects</a>, including runtimes, tools, specifications, and frameworks for cloud and edge applications,
- IoT, AI, automotive, systems engineering, open processor designs, and many others. Headquartered in Brussels, Belgium, the Eclipse Foundation is an international
- non-profit association supported by over 360 <a href="https://www.eclipse.org/membership/">members</a>. To learn more, follow us on social media
- <a href="https://x.com/EclipseFdn">@eclipsefdn</a> or <a href="https://www.linkedin.com/company/eclipse-foundation/">LinkedIn</a>.
- </p>
- <h2>Origins</h2>
- <p>
- The <a href="/eclipse/">Eclipse Project</a> was originally created by
- IBM in November 2001 and supported by a consortium of software vendors. The Eclipse Project
- continues to be used by millions of developers.
- </p>
- <p>The Eclipse Foundation was created in January 2004 as an independent not-for-profit
- corporation to act as the steward of the Eclipse community. The independent not-for-profit
- corporation was created to allow a vendor-neutral, open, and transparent community to be
- established around Eclipse.</p>
- <h2>Structure</h2>
- <p>
- The Eclipse community consists of individual developers and organizations spanning many
- industries. The Foundation employs a full-time <a href="/org/foundation/staff.php">professional staff</a> to provide services to the community. The Eclipse Foundation is funded
- by annual dues from our <a href="/membership">members</a> and governed
- by a <a href="/org/foundation/directors.php">Board of Directors</a>.
- Strategic Developers and Strategic Consumers hold seats on this Board, as do representatives
- elected by Add-in Providers and Open Source committers. Eclipse committers are typically
- employed by organizations or are independent developers that volunteer their time to work on
- the Eclipse projects.
- </p>
- <h2>Services</h2>
- <p>
- The Eclipse Foundation provides four key services to the Eclipse community: 1) <a href="/org/services/#IP_Management">IP Management</a>, 2) <a href="/org/services/#Ecosystem">Ecosystem Development and Marketing</a>,
- 3) <a href="/org/services/#Development">Development Process</a>, and 4) <a href="/org/services/#IT">IT Infrastructure</a>. Full-time staff are associated with each of these areas and work with
- the greater Eclipse community to assist in meeting the needs of stakeholders.
- </p>
- <h2>A Unique Model for Open Source Development</h2>
- <p>The Eclipse Foundation has been established to serve the Eclipse open source projects and the
- Eclipse community. As an independent not-for-profit corporation, the Foundation and the
- Eclipse governance model ensures no single entity is able to control the strategy, policies or
- operations of the Eclipse community.</p>
- <p>The Foundation is focused on creating an environment for successful open source projects and
- to promote the adoption of Eclipse technology in commercial and open source solutions. Through
- services like IP Due Diligence, annual release trains, development community support, and
- ecosystem development, the Eclipse model of open source development is a unique and proven
- model for open source development.</p>
- </div>
- <div id="rightcolumn">
- <div class="sideitem">
- <h6>Related Links</h6>
- <ul>
- <li><a href="../membership/">Membership</a></li>
- <li><a href="../membership/become_a_member/">Become a member</a></li>
- </ul>
- </div>
- <div class="sideitem">
- <h6>Thank you!</h6>
+ <section class="container">
+ <h1><?php print $pageTitle; ?></h1>
<p>
- Thanks to our many <a href="/corporate_sponsors/">Corporate Sponsors</a>
- for their generous donations to our infrastructure.
+ The Eclipse Foundation provides our global community of individuals and
+ organisations with a business-friendly environment for open source software
+ collaboration and innovation.
</p>
- </div>
+ </section>
+ <section class="container margin-bottom-60">
+ <h2>What We Do</h2>
+ <p>
+ We have a proven track record of enabling community-led and
+ industry-ready open source innovation earned over two decades. We host
+ <a href="https://adoptium.net">Adoptium</a>,
+ <a href="https://sdv.eclipse.org">Software Defined Vehicle</a>,
+ <a href="https://jakarta.ee">Jakarta EE</a>,
+ <a href="https://eclipseide.org">Eclipse IDE</a>,
+ and 410+ open source projects, including runtimes, tools, specifications,
+ and frameworks for enterprise, cloud, edge, automotive, AI, embedded,
+ IoT, systems engineering, open processor designs, and many others.
+ Supported by over 360 members globally, the Eclipse Foundation has an
+ established international reach and reputation.
+ </p>
+ </section>
+ <section class="what-we-do-links-section dark row g-black">
+ <div class="container">
+ <div class="row row-no-gutters">
+ <div class="col-sm-offset-4 col-sm-4 col-xs-12">
+ <a class="link-tile link-unstyled bg-primary-light" href="/topics/automotive-and-mobility/">
+ Automotive & Mobility
+ </a>
+ </div>
+ <div class="col-sm-4 col-xs-12">
+ <a class="link-tile link-unstyled bg-neutral-flat-darker" href="/topics/edge-and-iot/">
+ IoT & Edge
+ </a>
+ </div>
+ <div class="col-sm-4 col-xs-12">
+ <a class="link-tile link-unstyled bg-neutral-flat-dark" href="/topics/cloud-native/">
+ Cloud Native
+ </a>
+ </div>
+ <div class="col-sm-4 col-xs-12">
+ <a class="link-tile link-unstyled bg-neutral-flat" href="/topics/ide/">
+ Developer Tools & IDEs
+ </a>
+ </div>
+ <div class="col-xs-24 margin-top-30 text-center fw-500 text-primary-light what-we-do-links-section-sublinks">
+ <a class="text-primary-light" href="https://projects.eclipse.org/">Find a Project</a></a>
+ </div>
+ </div>
+ </div>
+ </section>
+ <section class="our-approach-section row padding-y-60">
+ <div class="container">
+ <div class="col-sm-12">
+ <h2 class="margin-bottom-40">Our Approach to Open Source <br>Development</h2>
+ <p>
+ Our focus is to create an environment for successful open source
+ projects and to promote the adoption of Eclipse technology in
+ commercial and open source solutions. Through these services, we
+ provide our communities with a proven model for open source
+ development:
+ </p>
+ </div>
+ <div class="col-sm-12">
+ <div class="big-quote margin-x-auto margin-bottom-60">
+ <img class="img img-responsive" src="./images/about/big-quote.png" alt="" />
+ </div>
+ <p class="margin-top-40">
+ “Our customers like the idea that we're not reinventing all of the
+ technologies ourselves, and that we're using and participating in
+ open source projects that are governed by a well-known, independent
+ foundation”
+ </p>
+ <p>— Glenn Ergeerts, CTO, Aloxy</p>
+ </div>
+ </div>
+ <div class="container padding-top-60 padding-bottom-40 text-black">
+ <div class="row row-no-gutters">
+ <div class="col-sm-4 col-sm-offset-4 col-xs-12">
+ <a class="link-tile link-unstyled bg-neutral-flat" href="/org/services/#IP_Management">
+ IP Management
+ </a>
+ </div>
+ <div class="col-sm-4 col-xs-12">
+ <a class="link-tile link-unstyled bg-neutral-flat-dark" href="/org/services/#Ecosystem">
+ Ecosystem Development & Marketing
+ </a>
+ </div>
+ <div class="col-sm-4 col-xs-12">
+ <a class="link-tile link-unstyled bg-neutral-flat-darker" href="/org/services/#Development">
+ Development Process
+ </a>
+ </div>
+ <div class="col-sm-4 col-xs-12">
+ <a class="link-tile link-unstyled bg-primary-light" href="/org/services/#IT">
+ IT Infrastructure
+ </a>
+ </div>
+ </div>
+ </div>
+ </section>
+ <section class="driving-shared-innovation-section row featured-section-row featured-section-row-dark text-center">
+ <div class="container padding-y-60">
+ <h3 class="h2 margin-bottom-40">Driving Shared Innovation</h3>
+ <p>
+Whether you intend on contributing to Eclipse technologies that are
+important to your product strategy, or simply want to explore a
+specific innovation area with like-minded organizations, the Eclipse
+Foundation is the open source home for industry collaboration.
+ </p>
+ </div>
+ <div class="circular-container circular-container-white text-black overflow-hidden">
+ <div class="big-quote margin-x-auto margin-bottom-30">
+ <img class="img img-responsive" src="./images/about/big-quote.png" alt="" />
+ </div>
+ <p class="break-spaces">
+“Even if we're competitors in the market, the ability to work together
+on projects and share common platforms is highly valuable.”
+— Cédric Brun, CEO, OBEO
+ </p>
+ <a class="btn btn-secondary btn-lg btn-pill" href="/collaborations/">Learn More</a>
+ </div>
+ <div class="subsection padding-y-60 margin-top-60">
+ <div class="container">
+ <h3 class="h2 margin-bottom-40">Our Collaborations</h3>
+ <div
+ class="eclipsefdn-weighted-collaborations"
+ data-count="3"
+ data-cache="true"
+ data-skeleton-load="true"
+ >
+ </div>
+ </div>
+ </div>
+ </section>
+ <section class="who-we-are-section row text-center padding-y-60">
+ <div class="container">
+ <h2 id="who-we-are">Who We Are</h2>
+ <p>
+ The Eclipse Foundation is an international non-profit association
+ supported by member organisations who value open source as a key
+ enabler for their business strategies.
+ </p>
+ <h3 class="h4 fw-600 margin-top-40" id="our-members">Our Members</h3>
+ <ul class="eclipsefdn-members-list margin-top-30 margin-bottom-60" data-ml-template="carousel"></ul>
+ <div class="row row-no-gutters text-black">
+ <div class="col-sm-8">
+ <div class="rollover-tile bg-neutral-flat padding-y-30" tabindex="0">
+ <h3 class="h4 fw-600">Join Our Team</h3>
+ <div class="rollover-tile-content">
+ <p>
+ Join a collaborative team built around the core values of
+ service, respect, professionalism, and collegiality. We work
+ together to make a difference for our members and open source
+ communities.
+ </p>
+ <a class="btn btn-primary btn-block margin-top-40" href="/careers/">Join Us</a>
+ </div>
+ </div>
+ </div>
+ <div class="col-sm-8">
+ <div class="rollover-tile bg-primary-light text-black padding-y-30" tabindex="0">
+ <h3 class="h4 fw-600">Our History</h3>
+ <div class="rollover-tile-content">
+ <p>
+ The Eclipse Project was created by IBM in November 2001 and
+ supported by a consortium of software vendors. The Eclipse
+ Project continues to be used by millions of developers. The
+ Eclipse Foundation was created in January 2004 as an
+ independent not-for-profit corporation to act as the steward
+ of the Eclipse community. The independent not-for-profit
+ corporation was created to allow a vendor-neutral, open, and
+ transparent community to be established around Eclipse.
+ </p>
+ </div>
+ </div>
+ </div>
+ <div class="col-sm-8">
+ <div class="rollover-tile bg-neutral-flat-darker text-black padding-y-30" tabindex="0">
+ <h3 class="h4 fw-600">Our Connection to Europe</h3>
+ <div class="rollover-tile-content">
+ <p>
+ The Eclipse Foundation is an independent non-profit corporation
+ based in Brussels. Our open source development model fosters
+ digital transformation in Europe and beyond.
+ </p>
+ <div class="btn-group btn-group-justified" role="group">
+ <a class="btn btn-primary" href="https://outreach.eclipse.foundation/hubfs/EuropeanOpenSourceWhitePaper-June2021.pdf">White Paper</a>
+ <a class="btn btn-primary" href="https://www.eclipse.org/europe/eclipse-fact-sheet.pdf">Fact Sheet</a>
+ <a class="btn btn-primary" href="https://www.eclipse.org/europe/eclipse-slide-deck.pdf">Slide Deck</a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
</div>
-</div>
\ No newline at end of file
+</div>
+
+<style>
+ .what-we-do-links-section {
+ padding-top: 15rem;
+ padding-bottom: 2rem;
+ background: url('./images/about/what-we-do.jpg');
+ background-repeat: no-repeat;
+ background-size: cover;
+ }
+
+ .driving-shared-innovation-section {
+ background: url('./images/about/shared-innovation.jpg');
+ background-repeat: no-repeat;
+ background-size: cover;
+ padding-top: 0;
+ padding-bottom: 0;
+ }
+
+ .driving-shared-innovation-section .subsection {
+ padding-top: 36rem;
+ border-top: 4px solid #00000044;
+ background-color: #ffffff66;
+ backdrop-filter: blur(5px);
+ }
+
+ .driving-shared-innovation-section.featured-section-row-dark,
+ .driving-shared-innovation-section.featured-section-row-dark .h2 {
+ color: white;
+ }
+
+ .who-we-are-section a.rollover-tile {
+ display: block;
+ }
+
+ .who-we-are-section .rollover-tile-content {
+ min-height: 24rem;
+ }
+
+ .who-we-are-section .rollover-tile h3 {
+ user-select: none;
+ }
+
+ .dark a {
+ color: white;
+ }
+
+ .link-tile,
+ .dark .link-tile {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ aspect-ratio: 1;
+ width: 100%;
+ color: black;
+ text-align: center;
+ font-size: 2rem;
+ font-weight: 500;
+ }
+
+ .bg-neutral-flat-darker {
+ background-color: #adacab;
+ }
+
+ .bg-black {
+ background-color: black;
+ }
+
+ .btn-pill {
+ border-radius: 9999px;
+ }
+
+ .circular-container {
+ position: relative;
+ left: 0;
+ display: inline-flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ }
+
+ .circular-container::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ z-index: -1;
+ height: 100%;
+ aspect-ratio: 1;
+ border-radius: 50%;
+ }
+
+ .circular-container-white::before {
+ background-color: white;
+ }
+
+ .our-approach-section .big-quote {
+ width: 10rem;
+ }
+
+ .break-spaces {
+ white-space: break-spaces;
+ }
+
+ .driving-shared-innovation-section .circular-container {
+ position: relative;
+ z-index: 2;
+ padding: 9rem;
+ margin-bottom: -36rem;
+ }
+
+ @media (min-width: 768px) {
+ .driving-shared-innovation-section .circular-container {
+ padding: 14rem;
+ }
+ }
+
+ .driving-shared-innovation-section .big-quote {
+ width: 10rem;
+ }
+
+ .eclipsefdn-weighted-collaborations:not([data-template-id]) {
+ flex-direction: column;
+ }
+
+ @media (min-width: 768px) {
+ .eclipsefdn-weighted-collaborations:not([data-template-id]) {
+ flex-direction: row;
+ }
+ }
+
+ .eclipsefdn-weighted-collaborations:not([data-template-id]) .weighted-collaboration {
+ border: 3px solid transparent;
+ background-color: white;
+ transition: border-color .2s ease-in;
+ }
+ .eclipsefdn-weighted-collaborations:not([data-template-id]) .weighted-collaboration:hover {
+ border-color: #ffa02e;
+ }
+
+ .circular-container-white::before {
+ background-color: white;
+ }
+
+ .what-we-do-links-section-sublinks {
+ font-size: 1.5rem;
+ text-shadow: 0px 0px 4px black, 0px 0px 4px #00000066, 0px 0px 14px #00000066;
+ }
+
+ .rollover-tile-content {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ box-shadow: 0 7px 10px #00000022;
+ }
+
+ .dark .text-primary-light {
+ color: #ffa02e;
+ }
+</style>
diff --git a/images/about/big-quote.png b/images/about/big-quote.png
new file mode 100644
index 0000000..32c82b0
--- /dev/null
+++ b/images/about/big-quote.png
Binary files differ
diff --git a/images/about/its-in-our-code.gif b/images/about/its-in-our-code.gif
new file mode 100644
index 0000000..42f26a0
--- /dev/null
+++ b/images/about/its-in-our-code.gif
Binary files differ
diff --git a/images/about/shared-innovation.jpg b/images/about/shared-innovation.jpg
new file mode 100644
index 0000000..5524f2f
--- /dev/null
+++ b/images/about/shared-innovation.jpg
Binary files differ
diff --git a/images/about/what-we-do.jpg b/images/about/what-we-do.jpg
new file mode 100644
index 0000000..06a1914
--- /dev/null
+++ b/images/about/what-we-do.jpg
Binary files differ
diff --git a/index.php b/index.php
index 7e39ec4..a83644f 100644
--- a/index.php
+++ b/index.php
@@ -23,12 +23,59 @@
$Theme->setPageTitle($pageTitle);
$Theme->setPageKeywords("about, documents, history");
$Theme->setPageAuthor("Mike Milinkovich");
+$Theme->setThemeVariables(array('main_container_classes' => 'container-fluid'));
+
+ob_start();
+?>
+<div class="featured-jumbotron jumbotron">
+ <div class="container">
+ <p class="sr-only">
+ Respect, Community, Innovation, Transparency — it's in our code.
+ </p>
+ <div class="video-wrapper">
+ <video
+ preload="metadata"
+ autoplay
+ muted
+ loop
+ >
+ <source src="https://gitlab.eclipse.org/eclipsefdn/it/websites/eclipse.org/uploads/3b01fcc1d273ebeab4824a70180489c2/it_s_in_our_code__2_.mp4" type="video/mp4">
+ </video>
+ </div>
+ </div>
+</div>
+<style>
+ .featured-jumbotron {
+ padding: 0;
+ background-color: black;
+ }
+ .featured-jumbotron video {
+ position: relative;
+ width: 100%;
+ height: 100%;
+ }
+
+ .featured-jumbotron .video-wrapper {
+ position: relative;
+ }
+ .featured-jumbotron .video-wrapper::after {
+ content: '';
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ top: 0;
+ left: 0;
+ background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 5%, rgba(0,0,0,0) 10%, rgba(0,0,0,0) 50%, rgba(0,0,0,0) 90%, rgba(0,0,0,1) 95%, rgba(0,0,0,1) 100%);
+ }
+</style>
+<?php
+$extra_header_html = ob_get_clean();
+$Theme->setExtraHeaderHtml($extra_header_html);
ob_start();
include("content/en_" . $App->getScriptName());
$html = ob_get_clean();
-$Theme->setNav($Nav);
$Theme->setHtml($html);
$Theme->generatePage();
