From f9726ad9bea301e35e87d2f5727b7490493da06c Mon Sep 17 00:00:00 2001
From: Sebastian Kippe <sebastian@kip.pe>
Date: Fri, 19 Feb 2021 14:58:51 +0100
Subject: [PATCH 1/4] Use Open Sans as default font for everything

---
 app/javascript/stylesheets/base.scss          | 9 +--------
 app/javascript/stylesheets/tailwind.config.js | 2 +-
 2 files changed, 2 insertions(+), 9 deletions(-)

diff --git a/app/javascript/stylesheets/base.scss b/app/javascript/stylesheets/base.scss
index 1ca5f51..68ebb8b 100644
--- a/app/javascript/stylesheets/base.scss
+++ b/app/javascript/stylesheets/base.scss
@@ -1,17 +1,10 @@
 @layer base {
-  @font-face {
-    font-family: 'Raleway';
-    src: url('/fonts/raleway-light.woff') format('woff2');
-    font-weight: 300;
-    font-style: normal;
-  }
-
   body {
     line-height: 1;
   }
 
   h1, h2, h3 {
-    @apply font-heading font-light;
+    @apply font-light;
   }
 
   h1 {
diff --git a/app/javascript/stylesheets/tailwind.config.js b/app/javascript/stylesheets/tailwind.config.js
index c24557e..b8407c9 100644
--- a/app/javascript/stylesheets/tailwind.config.js
+++ b/app/javascript/stylesheets/tailwind.config.js
@@ -13,7 +13,7 @@ module.exports = {
   theme: {
     extend: {
       fontFamily: {
-        heading: ['Raleway']
+        sans: ['Open Sans', 'sans-serif']
       }
     },
   },
-- 
2.25.1


From 682c78c7c328180bc46d0b5b5d5ba996deac27c7 Mon Sep 17 00:00:00 2001
From: Sebastian Kippe <sebastian@kip.pe>
Date: Fri, 19 Feb 2021 15:11:53 +0100
Subject: [PATCH 2/4] Move headline styles to tailwind base

---
 app/assets/stylesheets/layout.scss   | 16 +---------------
 app/javascript/stylesheets/base.scss | 10 +++++++++-
 2 files changed, 10 insertions(+), 16 deletions(-)

diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index c0e6fba..27b7a62 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -18,7 +18,6 @@
     }
 
     h1 {
-      font-size: 1.8rem;
       color: #fff;
 
       span.project-name {
@@ -28,8 +27,7 @@
       span.icon {
         svg {
           display: inline-block;
-          height: 1.8rem;
-          margin-top: -0.1rem;
+          height: 1.875rem;
           vertical-align: top;
           width: auto;
         }
@@ -85,18 +83,6 @@ main {
     margin: 3rem auto;
   }
 
-  h2, h3 {
-    margin-bottom: 1.5em;
-  }
-
-  h2 {
-    font-size: 1.5rem;
-  }
-
-  h3 {
-    font-size: 1.25rem;
-  }
-
   p {
     line-height: 1.5rem;
     margin-bottom: 1rem;
diff --git a/app/javascript/stylesheets/base.scss b/app/javascript/stylesheets/base.scss
index 68ebb8b..d33fb96 100644
--- a/app/javascript/stylesheets/base.scss
+++ b/app/javascript/stylesheets/base.scss
@@ -8,6 +8,14 @@
   }
 
   h1 {
-    @apply uppercase;
+    @apply text-3xl uppercase;
+  }
+
+  h2 {
+    @apply text-2xl mb-8;
+  }
+
+  h3 {
+    @apply text-xl mb-6;
   }
 }
-- 
2.25.1


From 4eb40abc9c402ff21b20f0e6d4acff7f2313ee80 Mon Sep 17 00:00:00 2001
From: Sebastian Kippe <sebastian@kip.pe>
Date: Fri, 19 Feb 2021 15:24:07 +0100
Subject: [PATCH 3/4] Import webfont from shared URL

---
 app/javascript/stylesheets/buttons.scss | 6 +++---
 app/views/layouts/admin.html.erb        | 4 +---
 app/views/layouts/application.html.erb  | 4 +---
 app/views/layouts/signup.html.erb       | 4 +---
 4 files changed, 6 insertions(+), 12 deletions(-)

diff --git a/app/javascript/stylesheets/buttons.scss b/app/javascript/stylesheets/buttons.scss
index bb76577..75fd400 100644
--- a/app/javascript/stylesheets/buttons.scss
+++ b/app/javascript/stylesheets/buttons.scss
@@ -16,16 +16,16 @@
 
   .btn-gray {
     @apply bg-gray-100 hover:bg-gray-200
-    focus:ring-gray-300 focus:ring-opacity-75;
+           focus:ring-gray-300 focus:ring-opacity-75;
   }
 
   .btn-blue {
     @apply bg-blue-500 hover:bg-blue-600 text-white
-    focus:ring-blue-400 focus:ring-opacity-75;
+           focus:ring-blue-400 focus:ring-opacity-75;
   }
 
   .btn-red {
     @apply bg-red-600 hover:bg-red-700 text-white
-    focus:ring-red-500 focus:ring-opacity-75;
+           focus:ring-red-500 focus:ring-opacity-75;
   }
 }
diff --git a/app/views/layouts/admin.html.erb b/app/views/layouts/admin.html.erb
index 378a47e..8208035 100644
--- a/app/views/layouts/admin.html.erb
+++ b/app/views/layouts/admin.html.erb
@@ -4,14 +4,12 @@
     <title>Admin Panel | Kosmos Accounts</title>
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
-
     <meta name="viewport" content="width=device-width, initial-scale=1">
-
     <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
+    <link href="https://assets.kosmos.org/fonts/open-sans/open-sans.css" rel="stylesheet">
   </head>
-
   <body id="admin-panel">
     <div id="wrapper">
       <header>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 9be387d..8d5b5b7 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -4,14 +4,12 @@
     <title>Kosmos Accounts</title>
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
-
     <meta name="viewport" content="width=device-width, initial-scale=1">
-
     <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
+    <link href="https://assets.kosmos.org/fonts/open-sans/open-sans.css" rel="stylesheet">
   </head>
-
   <body>
     <div id="wrapper">
       <header>
diff --git a/app/views/layouts/signup.html.erb b/app/views/layouts/signup.html.erb
index 0f7a658..8960a0d 100644
--- a/app/views/layouts/signup.html.erb
+++ b/app/views/layouts/signup.html.erb
@@ -4,14 +4,12 @@
     <title>Sign up | Kosmos Accounts</title>
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
-
     <meta name="viewport" content="width=device-width, initial-scale=1">
-
     <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
+    <link href="https://assets.kosmos.org/fonts/open-sans/open-sans.css" rel="stylesheet">
   </head>
-
   <body class="layout-signup">
     <div id="wrapper">
       <header>
-- 
2.25.1


From 31cf353d3a5e3d915b62810e527715300545a3bd Mon Sep 17 00:00:00 2001
From: Sebastian Kippe <sebastian@kip.pe>
Date: Thu, 25 Feb 2021 18:04:02 +0100
Subject: [PATCH 4/4] Load remote fonts before other stylesheets

They won't apply when loaded afterwards.
---
 app/views/layouts/admin.html.erb       | 2 +-
 app/views/layouts/application.html.erb | 2 +-
 app/views/layouts/signup.html.erb      | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/views/layouts/admin.html.erb b/app/views/layouts/admin.html.erb
index 8208035..df44f3b 100644
--- a/app/views/layouts/admin.html.erb
+++ b/app/views/layouts/admin.html.erb
@@ -5,10 +5,10 @@
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link href="https://assets.kosmos.org/fonts/open-sans/open-sans.css" rel="stylesheet">
     <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
-    <link href="https://assets.kosmos.org/fonts/open-sans/open-sans.css" rel="stylesheet">
   </head>
   <body id="admin-panel">
     <div id="wrapper">
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 8d5b5b7..33ff55b 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -5,10 +5,10 @@
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link href="https://assets.kosmos.org/fonts/open-sans/open-sans.css" rel="stylesheet">
     <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
-    <link href="https://assets.kosmos.org/fonts/open-sans/open-sans.css" rel="stylesheet">
   </head>
   <body>
     <div id="wrapper">
diff --git a/app/views/layouts/signup.html.erb b/app/views/layouts/signup.html.erb
index 8960a0d..8d36e38 100644
--- a/app/views/layouts/signup.html.erb
+++ b/app/views/layouts/signup.html.erb
@@ -5,10 +5,10 @@
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link href="https://assets.kosmos.org/fonts/open-sans/open-sans.css" rel="stylesheet">
     <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
-    <link href="https://assets.kosmos.org/fonts/open-sans/open-sans.css" rel="stylesheet">
   </head>
   <body class="layout-signup">
     <div id="wrapper">
-- 
2.25.1