index homepage

PublicisSapient · Sep 26, 2024 · 7072cd4 · 7072cd4
1 parent 6a6dfdf
commit 7072cd4
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 18 deletions.
diff --git a/content/body/index.php b/content/body/index.php
@@ -2,7 +2,7 @@
   <div class="homepage__hero--text">
     <div class="homepage__hero--copy">
       <!-- <h1 class="homepage__hero--heading"><?= $title ?></h1> -->
-       <h1 class="homepage__hero--heading"><img src="/images/accessible-text-svg/logo-enable-pink.svg" /> </h1>
+       <h1 class="homepage__hero--heading">Enable </h1>
       <p>A space for developers to learn and collaborate on making the web accessible.</p>
     </div>
 
@@ -72,7 +72,7 @@
     </li>
     <li>
       Not only do we want to help developers, but <strong>we want the help from developers to contribute their accessible code.</strong>
-      If you have a component that you'd like to submit - please put in a <!-- #TODO --> <a href="#">pr</a>
+      If you have a component that you'd like to submit - please put in a <!-- #TODO --> <a href="#">PR</a>.
     </li>
   </ul>
 </div>

diff --git a/css/index.css b/css/index.css
diff --git a/less/index.less b/less/index.less
@@ -19,11 +19,12 @@ a:-webkit-any-link {
         display: flex;
         flex-direction: column;
         justify-content: center;
-        font-size: 1.8rem;
+        font-size: 1.2rem;
 
         &--heading {
             font-family: @font-default-brand;
-            margin: 30px auto;
+            font-size: 4rem;
+            margin: 30px auto 10px;
             font-weight: normal;
             color: @pink;
 
@@ -48,7 +49,8 @@ a:-webkit-any-link {
         }
 
         p {
-            max-width: 40rem;
+            max-width: 50rem;
+            margin-bottom: -30px;
         }
     }
 
@@ -102,16 +104,23 @@ a:-webkit-any-link {
         }
 
         &--section {
-            font-size: 18px;
+            font-size: 16px;
             border-radius: 25px;
             // background-color: #fffffff2;
             background-color: #f4f7f5;
+            margin-bottom: 40px;
             padding: 20px;
             flex-grow: 1;
             width: 100%;
 
             p {
                 text-align: justify;
+                a {
+                    color: @orange;
+                }
+                // a:visited {
+                //     color: @dark-orange;
+                // }
             }
 
             @media @tablet-up {
@@ -146,8 +155,8 @@ a:-webkit-any-link {
             margin-top: 10px;
             margin-bottom: 20px;
             color: @dark-grey;
-            text-align: left;
-            display: flex;
+            text-align: center;
+            display: block;
             align-items: center;
 
             @media @desktop {
@@ -157,11 +166,13 @@ a:-webkit-any-link {
 
             &::before {
                 content: "";
-                display: inline-flex;
+                //display: inline-flex;
+                display: block;
                 width: 20px;
                 height: 20px;
                 border-radius: 50%;
-                margin-right: 20px;
+                margin: 0 auto 30px auto;
+                //margin-right: 20px;
                 padding: 20px;
                 background-size: 40px;
                 background-repeat: no-repeat;
@@ -231,6 +242,7 @@ a:-webkit-any-link {
         color: #fff;
         line-height: 1.5;
         padding: 20px;
+        //padding-bottom: -10px;
         text-align: center;
 
         @media @desktop {
@@ -243,6 +255,9 @@ a:-webkit-any-link {
             font-size: 1.8rem;
             color: #fff;
             display: inline-flex;
+            //DECIDING STILL IF IM KEEPING THIS ALIGN-ITEMS
+            align-items: stretch;
+            margin-bottom: 0px;
 
             @media @tablet-up {
                 font-size: 2.375rem;