Merge branch 'sgratzl/tuneimage' into sgratzl/news

Author: sgratzl

static/images/landing-page/API-image.jpg

@@ -62,22 +62,28 @@ $carousel-height: 500px;
   padding-top: 2rem;
   padding-bottom: 2rem;
 }
+
 .landing-gray-area {
   padding-top: 3rem;
-  padding-bottom: 3rem;
+  padding-bottom: 1rem;
   background-color: #eee;
 }
+
 .landing-entry {
   line-height: 48px;
+  margin-bottom: 2rem;
+
   .inline-svg-icon {
     font-size: x-large;
   }
+
   h2 {
     font-weight: 600;
     font-size: 14px;
     letter-spacing: 3px;
     text-transform: uppercase;
   }
+
   p {
     font-weight: 500;
     font-size: 28px;
@@ -99,6 +105,7 @@ $carousel-height: 500px;
 
 .entry-image {
   width: 100%;
+
   img {
     max-width: 100%;
     max-height: 100%;
@@ -108,6 +115,33 @@ $carousel-height: 500px;
   }
 }
 
+.landing-aspect-2-1 {
+  padding-top: 50% * 6 / 4 * 1.025;
+  position: relative;
+
+  > img {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+  }
+}
+
+@media screen and (max-width: $breakpoint-small) {
+  .landing-aspect-2-1 {
+    padding-top: 0;
+    height: 200px;
+    text-align: center;
+
+    > img {
+      position: relative;
+      width: initial;
+      height: initial;
+    }
+  }
+}
+
 .latest-news {
   padding: 0 50px;
 }

themes/delphi/assets/css/pages/_landing.scss

@@ -22,7 +22,7 @@ <h2>Our Team</h2>
         {{ partial "arrow-link.html" (dict "link" (relref . "team") "alt" "View all") }}
       </div>
       <div class="landing-entry grid-8-12">
-        <div class="entry-image">
+        <div class="entry-image landing-aspect-2-1">
           <img src="{{ "/images/landing-page/API-image.jpg" | relURL }}" alt="API Image" width="288" height="296" />
         </div>
         <h2>Our API</h2>

themes/delphi/layouts/landing.html

@@ -9,8 +9,6 @@ <h3 class="uk-card-title">
     </h3>
   </div>
   <div class="uk-card-footer">
-    <a href="{{ .link | relURL }}" title="Learn more"
-      >Learn more {{ partial "font-awesome.html" "solid/long-arrow-alt-right" }}</a
-    >
+    {{ partial "arrow-link.html" (dict "link" .link "alt" "Learn more") }}
   </div>
 </div>

themes/delphi/layouts/partials/landing/latest-card.html

@@ -6,11 +6,15 @@ <h2 class="uk-text-center">Latest News</h2>
   {{ end }}
   {{ $items := apply (.Site.GetPage "/blog").Pages "partial" "latest-blog" "." }}
 
+  <!-- {range first 0 ((.Site.GetPage "/news").Resources.ByType "page") }
+  { $items = $items | append (dict "source" "news" "title" .Title "date" .PublishDate "link" (relref $currentPage "flu#updates" ) ) }
+  {end} -->
+
   {{ $top := 6 }}
 
   <div class="uk-position-relative" tabindex="-1" uk-slider>
     <div class="uk-slider-container">
-      <ul class="uk-slider-items uk-child-width-1-2@s uk-child-width-1-4@m uk-grid uk-grid-match">
+      <ul class="uk-slider-items uk-child-width-1-2@s uk-child-width-1-3@m uk-grid uk-grid-match">
         {{ range first $top (sort $items "date" "desc") }}
           <li>
             {{ partial "landing/latest-card.html" . }}