From a558241865c4716ad932b8851f311571c8eb120a Mon Sep 17 00:00:00 2001
From: Brent Miller <brentwmiller93@gmail.com>
Date: Sun, 19 Jul 2020 21:29:33 -0400
Subject: [PATCH] type; logo; hides unused sections for now

---
 assets/svgs/logo.svg  |  2 +-
 components/Hero.vue   | 16 +++++++++-------
 layouts/default.vue   |  2 +-
 pages/index.vue       |  4 ++--
 pages/style-guide.vue | 16 +++++++++++++++-
 tailwind.config.js    |  1 +
 6 files changed, 29 insertions(+), 12 deletions(-)

diff --git a/assets/svgs/logo.svg b/assets/svgs/logo.svg
index bac8f81..6a216e1 100644
--- a/assets/svgs/logo.svg
+++ b/assets/svgs/logo.svg
@@ -1 +1 @@
-<svg width="200" height="280" viewBox="0 0 200 280" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="a" maskUnits="userSpaceOnUse" x="0" y="0" width="200" height="280"><path d="M0 222.048V60.404c0-3.877 4.206-5.173 8.176-2.927 6.29 3.559 25.64 15.096 32.912 20.046 7.117 4.846 8.597 7.106 8.597 10.095l1.252 106.809c.004.352.194.677.5.854l46.817 27.062c.303.175.675.179.982.011l48.242-26.492a1 1 0 00.009-1.748l-48.234-27.089a1 1 0 01-.51-.872v-54.729c0-.354.187-.682.492-.862l47.084-27.724a1 1 0 00-.008-1.728L99.235 53.994a.992.992 0 00-.984-.008c-6.927 3.888-21.425 11.99-27.81 15.422-6.542 3.517-13.628 1.465-16.353 0-7.757-4.605-24.78-14.819-30.818-18.838-6.037-4.019-2.515-7.954 0-9.419C42.977 29.848 84.15 6.238 91.195 2.22c7.044-4.019 15.094-1.675 18.239 0l90.074 53.085a1 1 0 01.492.861v53.47a1 1 0 01-.515.875l-48.852 27.097a1 1 0 000 1.749l48.852 27.097a.999.999 0 01.515.874v54.724a.975.975 0 01-.484.856c-26.389 15.387-80.581 46.973-90.082 52.465-9.345 5.401-9.463 5.33-17.91.2l-.329-.2L.499 222.914a1 1 0 01-.499-.866z" fill="#88D7FF"/></mask><g mask="url(#a)"><path fill="#88D7FF" d="M-55.285-71.614h391.057v451.318H-55.285z"/><path d="M88.446 58.949L59.329 31.153c-.84-.802.179-2.148 1.16-1.532l37.12 23.307c2.36 1.338.6 1.316-.04 1.675l-8.004 4.488a.947.947 0 01-1.12-.142zM147.864 194.468l43.294 25.332c.991.893-.175 2.43-1.327 1.749l-53.933-20.933c-.73-.432.533-.775 1.273-1.191l9.251-5.197c.308-.114.621-.281 1.442.24zM144.638 83.801l42.664-25.151c.913-.842-.168-2.282-1.23-1.64l-51.22 20.298c-2.965 1.352-.659 1.389.025 1.777l8.555 4.855c.39.22.877.165 1.206-.139zM155.381 135.474l-49.386 27.73c-1.068.946.107 2.66 1.337 1.95l58.551-21.623c5.04-1.962.956-1.875.193-2.351l-9.301-5.84c-.434-.271-.16-.552-1.394.134zM98.912 222.737l-41.126 28.454c-1.121.479-1.65-1.15-.6-1.854l33.71-32.811c.637.436.637.436 1.34.798l7.416 4.357c.823-.354.466.046-.74 1.056zM50.688 194.642L7.365 169.661c-.912-.809.333-1.984 1.418-1.337l44.086 16.414c-.121.763-.121.763-.147 1.554l-.763 8.567c.672.592.159.44-1.27-.217z" fill="#111779"/></g></svg>
\ No newline at end of file
+<svg width="200" height="280" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="a" maskUnits="userSpaceOnUse" x="0" y="0" width="200" height="280"><path d="M0 222.048V60.404c0-3.877 4.206-5.173 8.176-2.927 6.29 3.559 25.64 15.096 32.912 20.046 7.117 4.846 8.597 7.106 8.597 10.095l1.252 106.809c.004.352.194.677.5.854l46.817 27.062c.303.175.675.179.982.011l48.242-26.492a1 1 0 00.009-1.748l-48.234-27.089a1 1 0 01-.51-.872v-54.729c0-.354.187-.682.492-.862l47.084-27.724a1 1 0 00-.008-1.728L99.235 53.994a.992.992 0 00-.984-.008c-6.927 3.888-21.425 11.99-27.81 15.422-6.542 3.517-13.628 1.465-16.353 0-7.757-4.605-24.78-14.819-30.818-18.838-6.037-4.019-2.515-7.954 0-9.419C42.977 29.848 84.15 6.238 91.195 2.22c7.044-4.019 15.094-1.675 18.239 0l90.074 53.085a1 1 0 01.492.861v53.47a1 1 0 01-.515.875l-48.852 27.097a1 1 0 000 1.749l48.852 27.097a.999.999 0 01.515.874v54.724a.975.975 0 01-.484.856c-26.389 15.387-80.581 46.973-90.082 52.465-9.345 5.401-9.463 5.33-17.91.2l-.329-.2L.499 222.914a1 1 0 01-.499-.866z" fill="#88D7FF"/></mask><g mask="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M335.772-71.614H-55.284v451.318h391.056V-71.614zM59.329 31.153l29.117 27.796a.947.947 0 001.12.142l8.002-4.488c.139-.078.33-.138.52-.198.69-.216 1.37-.429-.48-1.477L60.49 29.621c-.981-.616-2 .73-1.16 1.532zM191.158 219.8l-43.294-25.332c-.776-.492-1.099-.37-1.391-.259l-.051.019-9.251 5.197a9.034 9.034 0 01-.582.286c-.645.298-1.248.576-.691.905l53.933 20.933c1.152.681 2.318-.856 1.327-1.749zm-46.69-135.872a3.03 3.03 0 00.173-.115h.001c.059-.042.118-.083.18-.12l42.296-24.935a1.08 1.08 0 00.327-.266c.608-.807-.278-1.963-1.224-1.558l-.133.061c-.057.027-.114.054-.172.078l-51.064 20.235c-2.3 1.048-1.428 1.306-.602 1.55.239.07.474.14.627.227l8.555 4.855a1.03 1.03 0 001.036-.011zm-38.473 79.276l49.386-27.73c.957-.532 1.007-.482 1.184-.307.051.051.113.112.21.173l9.301 5.84c.184.115.562.197.959.284 1.245.27 2.67.579-1.152 2.067l-58.551 21.623c-1.23.71-2.405-1.004-1.337-1.95zm-7.083 59.533l-41.126 28.454c-1.121.479-1.65-1.15-.6-1.854l33.71-32.811c.637.436.637.436 1.34.798l7.416 4.357c.823-.354.466.046-.74 1.056zM7.365 169.661l43.323 24.981c1.43.657 1.943.809 1.271.217l.763-8.567c.026-.791.026-.791.147-1.554L8.783 168.324c-1.084-.647-2.33.528-1.418 1.337z" fill="#88D7FF"/></g></svg>
\ No newline at end of file
diff --git a/components/Hero.vue b/components/Hero.vue
index a6ac58d..80829ca 100644
--- a/components/Hero.vue
+++ b/components/Hero.vue
@@ -1,17 +1,19 @@
 <template>
   <section class="container flex items-center justify-center h-full mx-auto">
     <div class="absolute top-0 left-0 w-1/2 h-full -ml-12 bg-secondary-50"></div>
-    <div class="relative flex flex-col">
-      <h1 class="font-extrabold leading-none text-96 text-primary-500">
+    <div class="relative flex flex-col p-4">
+      <h1 class="font-extrabold leading-none md:text-96 text-48 text-primary-500">
         I'm a
         <br />
-        <span class="text-secondary-500">web developer</span>
-        ,
+        <span class="text-secondary-500">web developer</span>,
       </h1>
       <p class="mt-4 text-2xl">
-        building web sites and web apps for
-        <a class="font-bold hover:underline text-primary-500" href="https://skycatchfire.com" target="_blank">SKYCATCHFIRE</a>
-        .
+        building websites and apps for
+        <a
+          class="font-bold hover:underline text-primary-500"
+          href="https://skycatchfire.com"
+          target="_blank"
+        >SKYCATCHFIRE</a>.
       </p>
     </div>
     <dots class="absolute top-9/12 left-10/12" />
diff --git a/layouts/default.vue b/layouts/default.vue
index 50de698..81cf7d2 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="flex flex-col min-h-screen font-body text-dark-primary">
-    <navigation />
+    <!-- <navigation /> -->
     <nuxt class="flex-grow" />
     <footer class="w-full py-12 bg-primary-500 h-half">
       <div class="container flex justify-between mx-auto text-xs text-secondary-500">
diff --git a/pages/index.vue b/pages/index.vue
index b8f8ff4..a0d0b47 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -4,7 +4,7 @@
       <hero />
     </div>
 
-    <div class="container mx-auto mt-40">
+    <!-- <div class="container mx-auto mt-40">
       <div class="w-10/12 mx-auto">
         <h2 class="relative flex items-center text-lg font-bold tracking-wider uppercase text-secondary-500">
           <dots class="absolute left-0 -mt-4 -ml-16 -z-1" />
@@ -54,7 +54,7 @@
           </svg>
         </nuxt-link>
       </div>
-    </div>
+    </div>-->
   </div>
 </template>
 
diff --git a/pages/style-guide.vue b/pages/style-guide.vue
index 604b716..f6f19e7 100644
--- a/pages/style-guide.vue
+++ b/pages/style-guide.vue
@@ -2,16 +2,30 @@
   <div class="mt-24">
     <div class="container w-8/12 mx-auto mb-20">
       <h1>Style Guide</h1>
+      <hr />
 
       <h2>Colors</h2>
       <ul class="grid grid-cols-4 gap-1">
-        <li v-for="color in colors" :key="color" class="flex flex-col items-center justify-center w-full border" :class="`border-${color}`">
+        <li
+          v-for="color in colors"
+          :key="color"
+          class="flex flex-col items-center justify-center w-full border"
+          :class="`border-${color}`"
+        >
           <span class="w-full h-16" :class="`bg-${color}`"></span>
           <span class="p-3">{{ color }}</span>
         </li>
       </ul>
+      <hr />
 
       <h2>Typography</h2>
+      <hr />
+      <h1>Heading One</h1>
+      <h2>Heading Two</h2>
+      <h3>Heading Three</h3>
+      <h4>Heading Four</h4>
+      <h5>Heading Five</h5>
+      <h6>Heading Six</h6>
     </div>
   </div>
 </template>
diff --git a/tailwind.config.js b/tailwind.config.js
index 82f63a8..5b93399 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -123,6 +123,7 @@ module.exports = {
         },
       },
       fontSize: {
+        '48': '3rem',
         '80': '5rem',
         '96': '6rem',
       },