style nav links
continuous-integration/drone/push Build is passing Details

This commit is contained in:
Florian Sorg 2020-12-18 19:54:33 +01:00
parent 5ac9d54b64
commit 4dd047f891
1 changed files with 26 additions and 23 deletions

View File

@ -133,29 +133,27 @@ h1 {
border-bottom: 2px $text-color solid;
}
main {
a {
text-decoration: none;
color: $highlight-1;
text-shadow: -1px 1px 0 $background, 0 1px 0 $background, 1px 1px 0 $background;
background: repeat-x center bottom / 10em 2px;
background-image: linear-gradient(
to right,
$highlight-3 0%, $highlight-3 10%,
$highlight-1 10%, $highlight-1 20%,
$highlight-2 20%, $highlight-2 30%,
$highlight-3 30%, $highlight-3 40%,
$highlight-2 40%, $highlight-2 50%,
$highlight-3 50%, $highlight-3 60%,
$highlight-1 60%, $highlight-1 70%,
$highlight-3 70%, $highlight-3 80%,
$highlight-1 80%, $highlight-1 90%,
$highlight-2 90%, $highlight-2 100%
);
a:not(.nav-logo) {
text-decoration: none;
color: $highlight-1;
text-shadow: -1px 1px 0 $background, 0 1px 0 $background, 1px 1px 0 $background;
background: repeat-x center bottom / 10em 2px;
background-image: linear-gradient(
to right,
$highlight-3 0%, $highlight-3 10%,
$highlight-1 10%, $highlight-1 20%,
$highlight-2 20%, $highlight-2 30%,
$highlight-3 30%, $highlight-3 40%,
$highlight-2 40%, $highlight-2 50%,
$highlight-3 50%, $highlight-3 60%,
$highlight-1 60%, $highlight-1 70%,
$highlight-3 70%, $highlight-3 80%,
$highlight-1 80%, $highlight-1 90%,
$highlight-2 90%, $highlight-2 100%
);
&:hover, &:focus {
animation: cycle-link-background 2s steps(4) infinite 0ms;
}
&:hover, &:focus {
animation: cycle-link-background 2s steps(4) infinite 0ms;
}
}
@ -224,6 +222,7 @@ iframe {
.nav-logo {
@include heading;
text-decoration: none;
color: $text-color;
margin: 0 auto;
@ -241,7 +240,11 @@ iframe {
.nav-link {
align-self: center;
padding: 0.5em;
margin: 0 0.5em;
padding: 0.5em 0;
background-position: center bottom 0.4em;
color: $text-color;
font-family: Orbitron,Montserrat,sans-serif;
&.nav-link-active {
color: $highlight-1;