feat: add new blocks for project resource page

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>

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;
   }
 }
-*/