diff --git a/layouts/shortcodes/pages/projects/resources.html b/layouts/shortcodes/pages/projects/resources.html
index 4a257e6476aff2289875a683ca68f5e71cc913ff..68f31fde6c60c81a2edcc449a952f1191b71cab8 100644
--- a/layouts/shortcodes/pages/projects/resources.html
+++ b/layouts/shortcodes/pages/projects/resources.html
@@ -23,9 +23,10 @@
</div>
</div>
</div>
-<div class="row">
- <div class="col-md-12 bg-neutral-tinted bg-hover-darker">
+<div class="row margin-bottom-30">
+
+ <div class="tile-section-container col-md-12 bg-neutral-tinted bg-hover-darker">
<section class="tile-section padding-40 match-height-item-by-row">
<div class="tile-section-content">
<h2 class="h3 text-center">Eclipse Foundation Development Process</h2>
@@ -38,12 +39,14 @@
</p>
</div>
<div class="tile-section-end display-flex justify-content-center">
- <a class="btn btn-primary" href="/projects/dev_process/">Learn More</a>
+ <div class="btn-group">
+ <a class="btn btn-primary" href="/projects/dev_process/">Learn More</a>
+ </div>
</div>
</section>
</div>
- <div class="col-md-12 bg-neutral-flat-dark bg-hover-darker">
+ <div class="tile-section-container col-md-12 bg-neutral-flat-dark bg-hover-darker">
<section class="tile-section padding-40 match-height-item-by-row">
<div class="tile-section-content">
<h2 class="h3 text-center">Eclipse Foundation Project Handbook</h2>
@@ -51,14 +54,14 @@
become a committer on an existing one.</p>
</div>
<div class="tile-section-end display-flex justify-content-center">
- <a class="btn btn-primary" href="/projects/handbook/">Learn More</a>
+ <div class="btn-group">
+ <a class="btn btn-primary" href="/projects/handbook/">Learn More</a>
+ </div>
</div>
</section>
</div>
-</div>
-<div class="row padding-top-30 padding-bottom-30">
- <div class="col-md-12 bg-neutral-tinted bg-hover-darker">
+ <div class="tile-section-container col-md-12 bg-neutral-tinted bg-hover-darker">
<section class="tile-section padding-40 match-height-item-by-row">
<div class="tile-section-content">
<h2 class="h3 text-center">Committer Training</h2>
@@ -66,11 +69,13 @@
</p>
</div>
<div class="tile-section-end display-flex justify-content-center">
- <a class="btn btn-primary" href="/projects/training/">Learn More</a>
+ <div class="btn-group">
+ <a class="btn btn-primary" href="/projects/training/">Learn More</a>
+ </div>
</div>
</section>
</div>
- <div class="col-md-12 bg-neutral-flat-dark bg-hover-darker">
+ <div class="tile-section-container col-md-12 bg-neutral-flat-dark bg-hover-darker">
<section class="tile-section padding-40 match-height-item-by-row">
<div class="tile-section-content">
<h2 class="h3 text-center">EMO Office Hours</h2>
@@ -94,4 +99,41 @@
</div>
</section>
</div>
+
+ <div class="tile-section-container col-md-12 bg-neutral-tinted bg-hover-darker">
+ <section class="tile-section padding-40 match-height-item-by-row">
+ <div class="tile-section-content">
+ <h2 class="h3 text-center">Start a Project</h2>
+ <p>
+ Start your open source project at Eclipse. We fuel success with
+ infrastructure, community, and governance. Join us and amplify your
+ impact!
+ </p>
+ </div>
+ <div class="tile-section-end display-flex justify-content-center">
+ <div class="btn-group">
+ <a class="btn btn-primary" href="/projects/handbook/#starting">Learn More</a>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="tile-section-container col-md-12 bg-neutral-flat-dark bg-hover-darker">
+ <section class="tile-section padding-40 match-height-item-by-row">
+ <div class="tile-section-content">
+ <h2 class="h3 text-center">OpenChain Conformance</h2>
+ <p>
+ All projects at the Eclipse Foundation are developed under a process
+ that conforms to the ISO 5230 standard, making them fully OpenChain
+ conformant.
+ </p>
+ </div>
+ <div class="tile-section-end display-flex justify-content-center">
+ <div class="btn-group">
+ <a class="btn btn-primary" href="/openchain">Learn More</a>
+ </div>
+ </div>
+ </section>
+ </div>
+
</div>
diff --git a/less/page_css_file/projects/resources.less b/less/page_css_file/projects/resources.less
index 0a62f687a79035ccec5b948ea1f54be4bd653115..b655bd034c461895e7d122258c1e4596f99fe524 100644
--- a/less/page_css_file/projects/resources.less
+++ b/less/page_css_file/projects/resources.less
@@ -7,60 +7,47 @@
*
* Contributors:
* Christopher Guindon <chris.guindon@eclipse-foundation.org>
+ * Olivier Goulet <olivier.goulet@eclipse-foundation.org>
*
* SPDX-License-Identifier: EPL-2.0
*/
+
@import (reference) '../../styles.less';
-/*
-.page-projects-resources{
- h1{
- text-align: center;
- }
+.tile-section-container {
+ margin-bottom: 1rem;
+}
- h2{
- text-align: center;
- color: @brand-primary;
- margin-bottom: 25px;
- }
+.tile-section {
+ display: flex;
+ justify-content: stretch;
+ flex-direction: column;
+ text-align: center;
+}
- .col-md-12{
- background-color: #ede8e8;
+.tile-section-end {
+ flex-grow: 1;
+ align-items: flex-end;
+}
- padding-bottom:100px;
- h3{
- text-align: center;
- }
- .content{
- padding: 3rem 6rem;
- }
- a.btn {
- margin: auto;
- position: absolute;
- bottom: 20px;
- text-align: center;
- width: fit-content;
- left: 0;
- right: 0;
- }
- }
- .col-md-12:first-child{
- background-color: #d5d5d5;
+.tile-section .btn {
+ display: block;
+ width: 100%;
+}
+
+@media (min-width: @screen-sm-min) {
+ .tile-section .btn {
+ display: inline-block;
+ width: unset;
}
+}
+@media (min-width: @screen-md-min) {
.tile-section {
- display: flex;
- flex-direction: column;
- justify-content: flex-start;
- height: 100%;
-
- &-content {
- flex-grow: 1;
- }
+ text-align: left;
+ }
- &-end {
- justify-self: flex-end;
- }
+ .tile-section-container {
+ margin-bottom: 3rem;
}
}
-*/