[Content Improvements] Update landing page layout

assets/stylesheets/pages/_landing.scss

@@ -1,3 +1,4 @@
+
 .why-swift-list {
   list-style: none;
   padding-left: 0;
@@ -23,7 +24,122 @@
       margin-bottom: 0;
     }
   }
+}
+
+.link-grid {
+  ul {
+    display: grid;
+    align-items: stretch;
+    gap: 1rem;
+    padding: 0;
+    grid-template-columns: repeat(1, 1fr);
+
+    @media (min-width: 1000px) {
+      grid-template-columns: repeat(3, 1fr);
+    }
+  }
+
+  li {
+    list-style: none;
+    padding-left: 0;
+    display: flex;
+
+    a {
+      border-radius: var(--border-radius);
+      border: 1px solid var(--color-text);
+      color: var(--color-text);
+      display: block;
+      padding: .5rem 0;
+      text-align: center;
+      flex-grow: 1;
+
+      .flex-container {
+        display: flex;
+        flex-direction: column;
+        height: 100%;
+
+        .latest-release-container {
+          flex-grow: 1;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
+      }
+
+      &:hover {
+        background-color: var(--color-text);
+        color: var(--color-fill);
+        text-decoration: none;
+
+        img {
+          filter: invert(1);
+        }
+
+        .latest-release-container {
+          span {
+            border-color: var(--color-fill);
+          }
+        }
+      }
+
+      img {
+        height: 64px;
+        width: 64px;
+        display: block;
+        margin: 0 auto;
+      }
+    }
+  }
+}
+
+.latest-release-container {
+  span {
+    padding: .2rem .5rem;
+    border: 2px solid var(--color-text);
+    font-weight: bold;
+    border-radius: 4px;
+  }
+}
+
+.use-cases, .getting-involved {
+  list-style: none;
+  display: grid;
+  gap: 1rem;
+  padding: 0;
+
+  li {
+    border: 1px solid var(--color-fill-tertiary);
+    border-radius: var(--border-radius);
+    padding: 1rem;
+    display: flex;
+    flex-direction: column;
+
+    h3 {
+      line-height: 1.4;
+      font-size: 1.4rem;
+      padding-top: 0;
+    }
+
+    p {
+      flex-grow: 1;
+      color: var(--color-secondary-label);
+      margin-bottom: 0;
+    }
+  }
+
+  .cta-secondary {
+    margin-top: 1rem;
+  }
+}
+
+.use-cases {
+  @media (min-width: 1000px) {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
 
+.getting-involved,
+.why-swift-list  {
   @media (min-width: 1000px) {
     grid-template-columns: repeat(3, 1fr);
   }

index.md

@@ -8,17 +8,42 @@ atom: true
 
 Swift is a general-purpose programming language built using a modern approach to safety, performance, and software design patterns.
 
-<div class="links links-list-nostyle" markdown="1">
-  - [Latest release: 5.7](/blog/swift-5.7-released)
-  - [Get started](/getting-started)
-  - [Read the docs](/documentation)
+<div class="link-grid" markdown="1">
+  <ul>
+    <li>
+      <a href="/blog/swift-5.7-released">
+        <div class="flex-container">
+          <div class="latest-release-container">
+          <span>
+            5.7
+          </span>
+          </div>
+          Latest release
+        </div>
+      </a>
+    </li>
+
+    <li>
+      <a href="/getting-started">
+        <img src="/assets/images/landing-page/hiker.svg" />
+        Get started
+      </a>
+    </li>
+
+    <li>  
+      <a href="/documentation">
+        <img src="/assets/images/landing-page/book.svg" />
+        Read the docs
+      </a>
+    </li>
+  </ul>
 </div>
 
-## Why Swift?
+## why swift?
 
 <ul class="why-swift-list">
   <li>
-    <h3>Safe</h3>
+    <h3>safe</h3>
     <p>
       Swift prioritizes safety and clarity, ensuring that code behaves in a safe manner while also promoting clear and concise programming practices.
     </p>
@@ -43,51 +68,54 @@ Swift is a general-purpose programming language built using a modern approach to
 
 ## Use cases
 
-### Apple platforms
-
-Swift is a powerful and intuitive programming language on macOS, iOS, watchOS, tvOS and beyond. Swift code is safe by design, yet also produces software that is optimized to run lightning-fast.
-
-<div class="links links-list-nostyle" markdown="1">
-  - [[TODO] Learn more about Swift on Apple platforms](#)
-</div>
-
-### Server
+<ul class="use-cases">
+  <li>
+    <h3>Apple platforms</h3>
+    <p>
+      Swift is a powerful and intuitive programming language on macOS, iOS, watchOS, tvOS and beyond. Swift code is safe by design, yet also produces software that is optimized to run lightning-fast.
+    </p>
 
-Ever dreamed of using the same programming language on both your mobile applications and their server back-ends? Swift's small footprint, quick startup time, and deterministic performance make it specifically suitable for Server applications.
+    <a href="" class="cta-secondary">[TODO] Learn more</a>
+  </li>
+  <li>
+    <h3>Server</h3>
+    <p>
+      Ever dreamed of using the same programming language on both your mobile applications and their server back-ends? Swift's small footprint, quick startup time, and deterministic performance make it specifically suitable for Server applications.
+    </p>
 
-<div class="links links-list-nostyle" markdown="1">
-  - [Learn more about Swift on Server](/server/)
-</div>
+    <a href="/server" class="cta-secondary">Learn more</a>
+  </li>
+</ul>
 
 ## Getting involved
 
 Everyone is welcome to contribute to Swift. Contributing doesn’t just mean submitting pull requests—there are many different ways for you to get involved, including answering questions on the forums, reporting or triaging bugs, and participating in the Swift evolution process.
 
 No matter how you want to get involved, we ask that you first learn what’s expected of anyone who participates in the project by reading the [Community Overview](/community/). If you’re contributing code, you should also know how to build and run Swift from the repository, as described in [Source Code](/source-code/).
 
-### Design
-
-Anyone with a good idea can help shape the future features and direction of the language. To reach the best possible solution to a problem, we discuss and iterate on ideas in a public forum.
-
-<div class="links links-list-nostyle" markdown="1">
-  - [The Swift Evolution Process](/contributing/#swift-evolution)
-</div>
-
-### Code
-
-Swift welcomes developers from all walks of life, with different backgrounds, and with a wide range of experience. A diverse community has more great ideas, more unique perspectives, and produces more great code.
-
-<div class="links links-list-nostyle" markdown="1">
-  - [Learn more](/contributing/#contributing-code)
-</div>
-
-### Troubleshoot
-
-Reporting issues is a great way for anyone to help improve Swift. Nearly as important is triaging those issues to ensure that they are reproducible, small, and unique.
-
-<div class="links links-list-nostyle" markdown="1">
-  - [Learn more](/contributing/#triaging-bugs)
-</div>
+<ul class="getting-involved">
+  <li>
+    <h3>Design</h3>
+    <p>
+      Help shape the future of Swift by participating in <em>the Swift evolution process</em>.
+    </p>
+    <a href="/contributing/#swift-evolution" class="cta-secondary">Learn more</a>
+  </li>
+  <li>
+    <h3>Code</h3>
+    <p>
+      Contribute to the Swift compiler, standard library, and other core components of the project.
+    </p>
+    <a href="/contributing/#contributing-code" class="cta-secondary">Learn more</a>
+  </li>
+  <li>
+    <h3>Troubleshoot</h3>
+    <p>
+      Help improve the quality of Swift by reporting and triaging bugs.
+    </p>
+    <a href="/contributing/#triaging-bugs" class="cta-secondary">Learn more</a>
+  </li>
+</ul>
 
 ## What's new