Add base stylesheet/configure base heading font sizes

featurist · Jan 13, 2020 · 440c4c8 · 440c4c8
1 parent ae46e9a
commit 440c4c8
Show file tree

Hide file tree

Showing 3 changed files with 89 additions and 77 deletions.
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -97,7 +97,7 @@
       <footer class="Footer">
         <div class="Container">
           <section class="sponsors">
-            <h1>Sponsors</h1>
+            <h2>Sponsors</h2>
             <div class="sponsors-logos">
               <a class="sponsors-logo" href="https://featurist.co.uk" target="_blank"><img src="<%=asset_pack_path("media/logos/featurist.svg")%>"></a>
             </div>

diff --git a/frontend/styles/application.css b/frontend/styles/application.css
@@ -5,6 +5,7 @@
 @import "leaflet-gesture-handling/dist/leaflet-gesture-handling.css";
 @import "sidebar-v2/css/leaflet-sidebar.css";
 @import "./base/variables";
+@import "./base/base";
 @import "./components/alert";
 @import "./components/app";
 @import "./components/breadcrumb";
@@ -22,79 +23,3 @@
 @import "./components/nav";
 @import "./components/page_header";
 @import "./components/sponsors";
-
-@font-face {
-  font-family: "fira_sansregular";
-  font-style: normal;
-  font-weight: normal;
-  src:
-    url("../fonts/firasans-regular-webfont.woff2") format("woff2"),
-    url("../fonts/firasans-regular-webfont.woff") format("woff"),
-    url("../fonts/firasans-regular-webfont.svg#fira_sansregular") format("svg");
-}
-
-html {
-  box-sizing: border-box;
-  height: 100%;
-}
-
-*,
-*::before,
-*::after {
-  box-sizing: inherit;
-}
-
-body {
-  color: #4c4c4c;
-  font-family: "fira_sansregular";
-  font-size: 1em;
-  height: 100%;
-  line-height: 1.5;
-  margin: 0;
-  padding: 0;
-}
-
-h1 {
-  font-size: 1.5em;
-}
-
-section {
-  margin-bottom: 10px;
-  padding: 5px;
-}
-
-a {
-  color: inherit;
-  text-decoration: underline;
-}
-
-p {
-  margin: 0;
-}
-
-.u-hidden {
-  display: none;
-}
-
-ul {
-  padding-left: 10px;
-}
-
-li {
-  list-style-type: none;
-}
-
-input[type=text],
-input[type=url],
-input[type=email],
-input[type=password],
-input[type=number],
-input[type=tel] {
-  font-size: 17px;
-  height: 40px;
-  line-height: 40px;
-}
-
-input[type=checkbox] {
-  margin: 5px;
-}
diff --git a/frontend/styles/base/base.css b/frontend/styles/base/base.css
@@ -0,0 +1,87 @@
+@font-face {
+  font-family: "fira_sansregular";
+  font-style: normal;
+  font-weight: normal;
+  src:
+    url("../fonts/firasans-regular-webfont.woff2") format("woff2"),
+    url("../fonts/firasans-regular-webfont.woff") format("woff"),
+    url("../fonts/firasans-regular-webfont.svg#fira_sansregular") format("svg");
+}
+
+html {
+  box-sizing: border-box;
+  height: 100%;
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: inherit;
+}
+
+body {
+  color: #4c4c4c;
+  font-family: "fira_sansregular";
+  font-size: 1em;
+  height: 100%;
+  line-height: 1.5;
+  margin: 0;
+  padding: 0;
+}
+
+h1 {
+  font-size: 2em;
+}
+
+h2 {
+  font-size: 1.5em;
+}
+
+h3 {
+  font-size: 1.25em;
+}
+
+h4 {
+  font-size: 0.75em;
+}
+
+section {
+  margin-bottom: 10px;
+  padding: 5px;
+}
+
+a {
+  color: inherit;
+  text-decoration: underline;
+}
+
+p {
+  margin: 0;
+}
+
+.u-hidden {
+  display: none;
+}
+
+ul {
+  padding-left: 10px;
+}
+
+li {
+  list-style-type: none;
+}
+
+input[type=text],
+input[type=url],
+input[type=email],
+input[type=password],
+input[type=number],
+input[type=tel] {
+  font-size: 17px;
+  height: 40px;
+  line-height: 40px;
+}
+
+input[type=checkbox] {
+  margin: 5px;
+}