diff options
author | ache <ache@ache.one> | 2024-08-12 02:19:50 +0200 |
---|---|---|
committer | ache <ache@ache.one> | 2024-08-12 02:19:50 +0200 |
commit | 27aee65fdba660607792336319be4c6e3b544e41 (patch) | |
tree | 42d751f6f7a142ecb9f07fe1d7d044d0139bd982 /src/css/_sommaire.scss | |
parent | Support for legal notice (diff) |
Change menu name
Diffstat (limited to 'src/css/_sommaire.scss')
-rwxr-xr-x | src/css/_sommaire.scss | 64 |
1 files changed, 54 insertions, 10 deletions
diff --git a/src/css/_sommaire.scss b/src/css/_sommaire.scss index 0eadd0b..1141df0 100755 --- a/src/css/_sommaire.scss +++ b/src/css/_sommaire.scss @@ -7,13 +7,16 @@ color: #121311; &:before { - content: "/"; + content: "~"; } + a { outline: none; text-decoration: none; } - a:hover, a:focus { + + a:hover, + a:focus { /* Theme style */ color: #BBAABB; } @@ -28,6 +31,7 @@ list-style-type: none; padding-left: 0; } + @mixin lightMode { background: #F5F6F5; color: inherit; @@ -36,28 +40,36 @@ &: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; } + .sommaire_blien { text-shadow: 0 1px 0 #444; color: #686868; + a { color: #686868; } } + .about { color: #666; } @@ -72,43 +84,63 @@ &: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; } + .sommaire_blien { text-shadow: 0 1px 0 #444; color: #F5F5F5; + a { color: #F5F5F5; } } + .about { color: #BBB; } } - @media (prefers-color-scheme: light) { @include lightMode; } - @media (prefers-color-scheme: dark) { @include darkMode; } - &.light { @include lightMode; } - &.dark { @include darkMode; } + @media (prefers-color-scheme: light) { + @include lightMode; + } + + @media (prefers-color-scheme: dark) { + @include darkMode; + } + + &.light { + @include lightMode; + } + + &.dark { + @include darkMode; + } svg { margin: 0 auto; display: block; } + @media #{$gt-gsm} { position: fixed; top: 0; @@ -117,7 +149,7 @@ height: 100%; transition: left 0.5s ease-in 0.25s; - /* Theme style */ + /* Theme style */ border-right: 3px solid rgba(51, 51, 51, 0.1); &.hidden { @@ -126,6 +158,7 @@ } } } + #desc_intro { padding-left: 10px; padding-right: 10px; @@ -133,6 +166,7 @@ /* Theme style */ text-shadow: 2px 4px 0 #DDD; } + #desc { font-size: 90%; margin-top: 15px; @@ -140,25 +174,32 @@ padding-right: 15px; font-size: 1.05em; } + .about { font-size: 0.8em; align-items: center; justify-content: center; } -.about > .type_wrap { + +.about>.type_wrap { display: inline-flex; } -.type_wrap > .type { + +.type_wrap>.type { animation: typing 1.5s steps(22); width: 20ch; white-space: nowrap; overflow: hidden; } + @keyframes typing { 0% { width: 0; - }; + } + + ; } + .about_bar { display: inline-block; width: 20%; @@ -171,12 +212,15 @@ color: #121311; text-shadow: 0 1px 0 #DDD; } + #ontheweb { visibility: hidden; } + @media #{$gt-gsm} { #ontheweb { visibility: visible; + @media screen and (max-height: 519px) { visibility: hidden; } |