adding all svgs and partials to handle them in order to ask for help in the forums.

[theme-danix.xyz.git] / assets / sass / main.scss

diff --git a/assets/sass/main.scss b/assets/sass/main.scss
index 55e11c4..3948ad1 100644 (file)
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -2,13 +2,12 @@
 
 // BOURBON 
 @import "bourbon/bourbon";
-// FONT-AWESOME v6.2.1
-@import "fa-v6/fontawesome";
-@import "fa-v6/brands";
+
 // MY COLOR DEFINITIONS
 @import "colors";
+
 // GOOGLE FONTS
-@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,400;0,600;1,400;1,600&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,400;0,600;1,400;1,600&family=Red+Hat+Mono&display=swap');
 
 html {
        margin: 0;
@@ -76,8 +75,7 @@ html {
                                                                a {
                                                                        color: $dark-orange;
                                                                        &:hover {
-                                                                               animation-name: fa-bounce;
-                                                                               color: shade($dark-orange, 60%);
+                                                                               color: shade($dark-orange, 40%);
                                                                        }
                                                                }
                                                        }
@@ -91,4 +89,40 @@ html {
 .screen-reader-text,
 .hidden {
        @include hide-visually;
-}
\ No newline at end of file
+}
+pre {
+       margin: 1em;
+       padding: 0.7em;
+       max-width: 90vw;
+       background-color: $light-grey;
+       color: $light-orange;
+       font-size: 1.4em;
+       font-family: 'Red Hat Mono', monospace;
+}
+div#backtotop {
+       color: $light-orange !important;
+       & a {
+               position: fixed;
+               right: 2em;
+               bottom: 2em;
+               border-radius: 100%;
+               background-color: $dark-orange;
+               padding: 0.5rem;
+               border: none;
+               cursor: pointer;
+               display: block;
+               width: 2em;
+               height: 2em;
+               color: $dark-grey;
+               & i {
+                       color: inherit;
+               }
+       }
+}
+.inline-svg {
+       display: inline-block;
+       height: 1.15rem;
+       width: 1.15rem;
+       top: 0.15rem;
+       position: relative;
+}