New font and cool animations
This commit is contained in:
parent
27ab8f053a
commit
635deb7855
@ -4,16 +4,16 @@
|
||||
<link type="text/css" rel="stylesheet" href="./style.css">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Edu+VIC+WA+NT+Beginner:wght@600&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Edu+VIC+WA+NT+Beginner:wght@600&family=Righteous&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<span class="logo">billros.si</span>
|
||||
<nav>
|
||||
<ul>
|
||||
<li>Home</li>
|
||||
<li>Toons</li>
|
||||
<li>Games</li>
|
||||
<li><a href="#">Home</a></li>
|
||||
<li><a href="https://github.com/bassguitarbill">Github</a></li>
|
||||
<li><a href="https://whatguns.itch.io/">itch.io</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
25
style.scss
25
style.scss
@ -1,4 +1,5 @@
|
||||
$font-edu-vic: 'Edu VIC WA NT Beginner', cursive;
|
||||
$font-righteous: 'Righteous', cursive;
|
||||
|
||||
$color-bg: #2b0202;
|
||||
$color-logo: #e0a94a;
|
||||
@ -25,11 +26,35 @@ header {
|
||||
}
|
||||
|
||||
nav {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family: $font-righteous;
|
||||
ul {
|
||||
margin: 0%;
|
||||
li {
|
||||
display: inline;
|
||||
list-style: none;
|
||||
a {
|
||||
color: $color-logo-shadow;
|
||||
font-size: 24pt;
|
||||
padding-left: 12pt;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover {
|
||||
color: $color-logo;
|
||||
filter: drop-shadow(1px 1px 0px $color-logo-shadow);
|
||||
animation-name: light-up;
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes light-up {
|
||||
0% {
|
||||
color: $color-logo-shadow;
|
||||
}
|
||||
100% {
|
||||
color: $color-logo;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user