From e5c43a25e06779ddc44e20ff6c09dfa5b8eb14e8 Mon Sep 17 00:00:00 2001
From: Hendrik Niefeld <hello@niefeld.com>
Date: Wed, 5 Aug 2020 21:24:39 +0200
Subject: [PATCH] update blog index desktop

---
 homepage/theme/static/css/fix.css      | 23 +++++++++++++++++++++--
 homepage/theme/templates/archives.html |  8 ++++----
 2 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/homepage/theme/static/css/fix.css b/homepage/theme/static/css/fix.css
index 8db5b80..f29ac9a 100644
--- a/homepage/theme/static/css/fix.css
+++ b/homepage/theme/static/css/fix.css
@@ -54,8 +54,14 @@ COLORS
 .cclr-bg-white-fade-metrics {
 	background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%), #F3F0E7;
 }
-
-
+.cclr-bg-white-responsive {
+	background-color: #f9f7f2;
+}
+@media only screen and (min-width: 60rem) {
+	.cclr-bg-white-responsive {
+		background-color: #ffffff;
+	}
+}
 /* ---------------------------------------------------
 LAYOUT
 ----------------------------------------------------*/
@@ -281,6 +287,19 @@ body {
 .f25 {
   font-size: 1.9rem;
 }
+.f26 {
+  font-size: 1.9rem;
+}
+@media only screen and (min-width: 60em) {
+	.f26 {
+	  font-size: 2.25rem;
+	}
+}
+@media only screen and (min-width: 60em) {
+	.f26 {
+	  font-size: 1.9rem;
+	}
+}
 span {
   display: table;
 }
diff --git a/homepage/theme/templates/archives.html b/homepage/theme/templates/archives.html
index 48a843f..5e51d94 100644
--- a/homepage/theme/templates/archives.html
+++ b/homepage/theme/templates/archives.html
@@ -8,15 +8,15 @@
 {% set cta_index = True %}
 
 {% block content %}
-  <div class="mw8 center bg-white pr4-l">
+  <div class="mw8 center cclr-bg-white-responsive pr5-l">
     <div class="flex flex-wrap mt0 mt5-l">
     {% for article in articles %}
       <div class="w-100 w-50-l">
         {% if loop.index != 1 %}
-          <hr class="mb5 b--none dn-l">
+          <hr class="mb5 b--none db dn-l">
         {% endif %}
         <article class="w-100 mt5-m mt0-l gray">
-          <div class="mw8 center pv5 ph3 ph5-m pr0-l pl4-l bg-white">
+          <div class="mw8 center pv5 ph3 ph5-m pr0-l pl5-l bg-white">
               <figure class="larger-image mb4">
                 <a href="{{ article.slug }}">
                   <img alt="{{ article.title }}" src="{{ article.image_url }}"/>
@@ -25,7 +25,7 @@
               <h6 class="f5 lh-solid normal ma0 light-silver">
                 {{ article.date | strftime('%d %b %Y') }}{% if article.modified %}(article.updated {{ article.modified | strftime('%d %b %Y') }}){% endif %}, {{ article.author }}
               </h6>
-              <h1 class="f2 normal lh-title mt3 ma0 mb3 light-silver">
+              <h1 class="f26 normal lh-title mt3 ma0 mb3 light-silver">
                 <a href="{{ article.slug }}" class="link b dim gray">{{ article.title }}</a>
               </h1>
               <p class="">