6 files changed, 30 insertions, 79 deletions

diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss
index 71dc5d2..756ddb8 100644
--- a/assets/css/_vars.scss
+++ b/assets/css/_vars.scss
@@ -31,9 +31,7 @@ $gray7: hsl(220, 0%, 100%);
 
 @include store((
     --dims: (
-        --outer:         4rem,
-        --outer-spacing: 1.7rem,
-        --spacing-y:     4rem,
+        --outer: 4rem,
     ),
     --colors: (
         --bg-hi: $gray0, // Darker background
diff --git a/assets/css/components/_footer.scss b/assets/css/components/_footer.scss
index 225cd29..fcea457 100644
--- a/assets/css/components/_footer.scss
+++ b/assets/css/components/_footer.scss
@@ -18,8 +18,8 @@
             width:        100%;
             height:       100%;
             margin-top:   -1px;
-            margin-right: prop(--dims --outer-spacing, $global: true);
-            margin-left:  prop(--dims --outer-spacing, $global: true);
+            margin-right: prop(--container --dims --pad-x, $global: true);
+            margin-left:  prop(--container --dims --pad-x, $global: true);
             border-top:   1px solid prop(--colors --border);
             color:        prop(--colors --fg);
             line-height:  prop(--dims --outer, $global: true);
diff --git a/assets/css/components/_outer-button.scss b/assets/css/components/_outer-button.scss
index 774281d..d636f7d 100644
--- a/assets/css/components/_outer-button.scss
+++ b/assets/css/components/_outer-button.scss
@@ -11,6 +11,9 @@
                 --fg: prop(--colors --fg-lo, $global: true),
                 --bg: prop(--colors --bg-hi, $global: true),
             )
+        ),
+        --dims: (
+            --pad-x: 1.7rem,
         )
     ));
 
@@ -31,6 +34,11 @@
             bottom:   0;
         }
 
+        @include modifier('inverted') {
+            background-color: prop(--colors --inverted --bg);
+            color:            prop(--colors --inverted --fg);
+        }
+
         @include element('icon') {
             display:          flex;
             position:         relative;
@@ -39,20 +47,6 @@
             justify-content:  center;
             width:            prop(--dims --outer, $global: true);
             height:           100%;
-            transition:       background-color .2s, color .2s;
-        }
-
-        @include modifier('inverted') {
-            background-color: prop(--colors --inverted --bg);
-            color:            prop(--colors --inverted --fg);
-        }
-        
-        &:link,
-        &:visited {
-            &:hover {
-                background-color: prop(--colors --hover --bg);
-                color:            prop(--colors --hover --fg);
-            }
         }
 
         @include element('icon-symbol') {
@@ -63,10 +57,18 @@
 
         @include element('content') {
             height:        100%;
-            padding-right: prop(--dims --outer-spacing, $global: true);
-            padding-left:  prop(--dims --outer-spacing, $global: true);
+            padding-right: prop(--dims --pad-x);
+            padding-left:  prop(--dims --pad-x);
             line-height:   prop(--dims --outer, $global: true);
             white-space:   nowrap;
         }
+        
+        &:link,
+        &:visited {
+            &:hover {
+                background-color: prop(--colors --hover --bg);
+                color:            prop(--colors --hover --fg);
+            }
+        }
     }
 }
diff --git a/assets/css/layouts/_container.scss b/assets/css/layouts/_container.scss
index 0f569e4..ae23042 100644
--- a/assets/css/layouts/_container.scss
+++ b/assets/css/layouts/_container.scss
@@ -1,19 +1,15 @@
 @include namespace('container') {
     @include store((
         --dims: (
-            --pad-x: 3rem
+            --pad-x: 2rem,
+            --pad-y: 4rem,
         )
     ));
 
     @include store((
         --dims: (
-            --pad-x: 2rem
-        )
-    ), 'md');
-
-    @include store((
-        --dims: (
-            --pad-x: 4%
+            --pad-x: 1rem,
+            --pad-y: 3rem,
         )
     ), 'sm');
 
@@ -30,8 +26,8 @@
         }
 
         @include modifier('pad-y') {
-            padding-top:    prop(--dims --spacing-y, $global: true);
-            padding-bottom: prop(--dims --spacing-y, $global: true);
+            padding-top:    prop(--dims --pad-y);
+            padding-bottom: prop(--dims --pad-y);
         }
     }
 }
diff --git a/assets/css/layouts/_section.scss b/assets/css/layouts/_section.scss
index 3450858..70ace4c 100644
--- a/assets/css/layouts/_section.scss
+++ b/assets/css/layouts/_section.scss
@@ -2,7 +2,7 @@
     @include store((
         --colors: (
             --border: prop(--colors --obj-hi, $global: true),
-        )
+        ),
     ));
 
     @include layout(namespace()) {
@@ -33,8 +33,8 @@
                 width:        100%;
                 height:       100%;
                 margin-top:   -1px;
-                margin-right: prop(--dims --outer-spacing, $global: true);
-                margin-left:  prop(--dims --outer-spacing, $global: true);
+                margin-right: prop(--container --dims --pad-x, $global: true);
+                margin-left:  prop(--container --dims --pad-x, $global: true);
                 border-top:   1px solid prop(--colors --border);
             }
         }
diff --git a/templates/layouts/index copy.html b/templates/layouts/index copy.html
deleted file mode 100644
index bd7cd3f..0000000
--- a/templates/layouts/index copy.html
+++ /dev/null
@@ -1,45 +0,0 @@
-<main class="c-page s-page l-container l-container--content l-container--pad-y l-container--pad-v--first">
-    <div class="c-page__content">
-        <header class="c-hero u-hidden@sm-down" role="presentation">
-        $-- ' |      '     '             '     '            '   | |    |           '     '
-        $--   |      '     '             '       //\_       '   | ' .  |           '     '
-        $--  .|      '      ____,...,______..,_~``  -`..,   '   |    ' |           '     '
-        $--   |       _,~´"'  ,               .    ,~--´    '  _|  | . |~~.__      '     '
-        $-- | |    ,-"    _.-|~/  |..,____,) ,/,,"'         '_( | '    |)    )     '     '
-        $--  '|    \__,~"´   /:) /       |:\ \            ,~(    ) . | |  )   `,   '   _,--.
-        $-- ___\___.___:____(:/\_-,______\:.\_-,____.__\_.\______.__:___\__.___)_.___,/_____
-        $-- ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
-            
-        <pre class="c-hero__pre c-page__prefixed c-page__prefixed--pre u-mt0 u-hidden@sm-down">
-``  ' |      '     '             '     '            '   | |    |           '     '  
-``    |      '     '             '       <strong>//\_</strong>       '   | ' .  |           '     '  
-``   .|      '      <strong>____,...,______..,_~``  -`..,</strong>   '   |    ' |           '     '  
-``    |       <strong>_,~´"'  ,               .    ,~--´</strong>    '  _|  | . |~~.__      '     '  
-``  | |    <strong>,-"    _.-|~/  |..,____,) ,/,,"'</strong>         '_( | '    |)    )     '     '  
-``   '|    <strong>\__,~"´   /:) /       |:\ \</strong>            ,~(    ) . | |  )   `,   '   _,--.
-``     \   .   :    <strong>(:/\_-,      \:.\_-,</strong>    .  \ .\      .  :   \  .   ) . ' ,/     </pre>
-
-        </header>
-
-$body$
-    </div>
-</main>
-
-<footer class="c-footer l-container">
-  9thPK7O3xn
-</footer>
-
-<template id="header-sm">
-    $-- .|                     //\__      '  .'      |  . |           ' . ' 
-    $--  |      _.~-"""-----~``  ,-´      '   '      |'   |           '   ' 
-    $-- '|   .´  ,~'\ ).,__,)/,,"         ' . '      |  | |           '  .' 
-    $--  |_  `~´   (/\\,   (/\\,         _'   '_    _| '  |_         _'   '_
-
-    <pre class="c-hero__pre c-page__prefixed c-page__prefixed--pre u-mt0 $if(section.is_index)$u-hidden@sm-up$endif$">
-`` .|   <strong>                  //\__</strong>      '  .'      |  . |           ' . ' 
-``  |   <strong>   _.~-"""-----~``  ,-´</strong>      '   '      |'   |           '   ' 
-`` '|   <strong>.´  ,~'\ ).,__,)/,,"   </strong>      ' . '      |  | |           '  .' 
-``  |_  <strong>`~´   (/\\,   (/\\,    </strong>     _'   '_    _| '  |_         _'   '_</pre>
-</template>
-
-<script src="/index.js" type="text/javascript"></script>