From 27aee65fdba660607792336319be4c6e3b544e41 Mon Sep 17 00:00:00 2001 From: ache Date: Mon, 12 Aug 2024 02:19:50 +0200 Subject: Change menu name --- src/css/_sommaire.scss | 64 +++++++++++++++++++++++++++++++++++++++++-------- src/templates/left.tmpl | 6 +++-- 2 files changed, 58 insertions(+), 12 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; } diff --git a/src/templates/left.tmpl b/src/templates/left.tmpl index 712c1ab..457dece 100644 --- a/src/templates/left.tmpl +++ b/src/templates/left.tmpl @@ -9,8 +9,10 @@
{{{ intro.description }}}
{{{ intro.about }}}

{{{ intro.about_tags }}}
-- cgit v1.2.3-70-g09d2