Merge pull request #38 from wasinsandiego/main

A google font and some text styling

index.html

@@ -11,6 +11,12 @@
       content="The OpenTF Foundation. Supporting an impartial, open, and community-driven Terraform." />
 
     <link rel="canonical" href="/" />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600&display=swap"
+      rel="stylesheet"
+    />
     <link rel="stylesheet" type="text/css" href="style.css">
   </head>
 

style.css

@@ -10,11 +10,15 @@
   }
 }
 
+html {font-size: 100%;} /*16px*/
+
 body {
+  background: white;
   color: rgb(75 85 99);
-  font-size: 1.5rem;
-  line-height: 2rem;
 
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+  line-height: 1.75;
   padding-top: 2rem;
   padding-bottom: 2rem;
 }
@@ -24,6 +28,7 @@ div.container {
 }
 
 p {
+  margin-bottom: 1rem;
   padding-top: 0.25rem;
   padding-bottom: 0.25rem;
   text-align: justify;
@@ -39,14 +44,37 @@ li {
   margin-right: auto;
 }
 
+h1, h2, h3, h4, h5 {
+  margin: 3rem 0 1.38rem;
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 500;
+  line-height: 1.3;
+}
+
 h1 {
+  margin-top: 0;
   text-align: center;
-  line-height: 3rem;
+  font-size: 2.488rem;
+}
+
+h2 {font-size: 2.074rem;}
+
+h3 {font-size: 1.728rem;}
+
+h4 {font-size: 1.44rem;}
+
+h5 {font-size: 1.2rem;}
+
+small, .text_small {font-size: 0.833rem;}
+
+a {
+  color: #5569ff;
+  font-weight: 500;
+  text-decoration: none;
 }
 
-h2 {
-  margin-top: 50px;
-  margin-bottom: 10px;
+a:hover {
+  text-decoration: underline;
 }
 
 .font-bold {
@@ -236,3 +264,14 @@ h2 {
   background-color: #1DA851;
   border-color: #1DA851;
 }
+
+@media (prefers-color-scheme: dark) {
+  body {
+    background: rgb(33 37 43);
+    color: rgb(228 228 228);
+  }
+
+  a {
+    color: #7b8bff;
+  }
+}