1 files changed, 16 insertions, 15 deletions

diff --git a/assets/css/components/_outer-button.scss b/assets/css/components/_outer-button.scss
index b92dd9e..774281d 100644
--- a/assets/css/components/_outer-button.scss
+++ b/assets/css/components/_outer-button.scss
@@ -7,13 +7,9 @@
                 --bg: prop(--colors --accent --color, $global: true),
                 --fg: prop(--colors --bg-hi, $global: true),
             ),
-            --icon: (
+            --inverted: (
                 --fg: prop(--colors --fg-lo, $global: true),
                 --bg: prop(--colors --bg-hi, $global: true),
-                --hover: (
-                    --fg: prop(--colors --bg-hi, $global: true),
-                    --bg: prop(--colors --accent --color, $global: true),
-                )
             )
         )
     ));
@@ -24,9 +20,17 @@
         transition:       background-color .2s, color .2s;
         background-color: prop(--colors --bg);
         color:            prop(--colors --fg);
+        font-size:        1rem;
         font-weight:      450;
         text-decoration:  none;
 
+        @include modifier('scroll-top') {
+            position: fixed;
+            z-index:  9000;
+            right:    0;
+            bottom:   0;
+        }
+
         @include element('icon') {
             display:          flex;
             position:         relative;
@@ -36,19 +40,16 @@
             width:            prop(--dims --outer, $global: true);
             height:           100%;
             transition:       background-color .2s, color .2s;
-            background-color: prop(--colors --icon --bg);
-            color:            prop(--colors --icon --fg);
         }
 
-        @include modifier('icon-only') {
-            @include element('icon') {
-                background-color: prop(--colors --bg);
-                color:            prop(--colors --fg);
-            }
+        @include modifier('inverted') {
+            background-color: prop(--colors --inverted --bg);
+            color:            prop(--colors --inverted --fg);
         }
-
-        &:hover {
-            @include multi('&', 'element' 'icon') {
+        
+        &:link,
+        &:visited {
+            &:hover {
                 background-color: prop(--colors --hover --bg);
                 color:            prop(--colors --hover --fg);
             }