diff options
Diffstat (limited to 'src/css/_sommaire.scss')
-rwxr-xr-x | src/css/_sommaire.scss | 78 |
1 files changed, 40 insertions, 38 deletions
diff --git a/src/css/_sommaire.scss b/src/css/_sommaire.scss index 44a3b1e..0eadd0b 100755 --- a/src/css/_sommaire.scss +++ b/src/css/_sommaire.scss @@ -1,9 +1,11 @@ .sommaire_blien { line-height: 1.45rem; - color: #121311; font-size: 0.8em; font-weight: bold; - font-family: monospace, serif; + + /* Theme style */ + color: #121311; + &:before { content: "/"; } @@ -12,12 +14,14 @@ text-decoration: none; } a:hover, a:focus { + /* Theme style */ color: #BBAABB; } } #side-bar { text-align: center; + font-family: ui-monospace, Menlo, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Cousine", Courier New, monospace, sans-serif; ul { columns: 2; @@ -29,8 +33,21 @@ color: inherit; #logo-ache { + &:hover { + filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.4)); + } filter: none; } + #ache a { + text-decoration: none; + color: inherit; + &:hover { + text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.4); + text-decoration: underline royalblue 10%; + text-undefline-offset: 5px; + } + text-shadow: none; + } #desc_intro { text-shadow: 0 1px 0 #DDD; } @@ -50,9 +67,23 @@ @mixin darkMode { background: #101110; color: #FFF; + #logo-ache { + &:hover { + filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.4)) invert(1); + } filter: invert(1); } + #ache a { + text-decoration: none; + color: inherit; + &:hover { + text-shadow: 0px 2px 8px rgba(255, 255, 255, 0.9); + text-decoration: underline goldenrod 10%; + text-underline-offset: 5px; + } + text-shadow: none; + } #desc_intro { text-shadow: 2px 4px 0 #333; } @@ -74,10 +105,6 @@ &.dark { @include darkMode; } - - h1 { - font-family: monospace, "Helvetica Neue", Arial, sans-serif; - } svg { margin: 0 auto; display: block; @@ -90,6 +117,7 @@ height: 100%; transition: left 0.5s ease-in 0.25s; + /* Theme style */ border-right: 3px solid rgba(51, 51, 51, 0.1); &.hidden { @@ -101,6 +129,8 @@ #desc_intro { padding-left: 10px; padding-right: 10px; + + /* Theme style */ text-shadow: 2px 4px 0 #DDD; } #desc { @@ -109,11 +139,9 @@ padding-left: 15px; padding-right: 15px; font-size: 1.05em; - font-family: monospace, "Helvetica Neue", Arial, sans-serif; } .about { font-size: 0.8em; - font-family: monospace; align-items: center; justify-content: center; } @@ -135,12 +163,13 @@ display: inline-block; width: 20%; text-align: left; - color: #121311; font-size: 0.8em; font-weight: bold; - font-family: monospace, serif; - text-shadow: 0 1px 0 #DDD; margin: auto; + + /* Theme style */ + color: #121311; + text-shadow: 0 1px 0 #DDD; } #ontheweb { visibility: hidden; @@ -164,30 +193,3 @@ } } } - -.lab { - height: 200px; - width: 100%; - - @media #{$gt-gsm} { - position: absolute; - left: 0; - bottom: 0px; - } - @media screen and (max-height: 749px) { - visibility: hidden; - } -} -.lab a svg { - opacity: 0.45; -} -.lab a svg:hover { - opacity: 1; -} -/* -<nav> -<div id="sommaire_blien">Accueil</div> -<div id="sommaire_blien">Blog</div> -<div id="sommaire_blien">Liens</div> -</nav> - */ |