CSS: Added link hover animation and updated font to load locally
This commit is contained in:
parent
ad6023cc4a
commit
d572056467
1 changed files with 28 additions and 30 deletions
|
@ -1,3 +1,6 @@
|
|||
@import "https://kemonomimi.gay/common/fonts/CherryBombOne.css";
|
||||
@import "https://kemonomimi.gay/common/fonts/IBMPlexMono.css";
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -9,6 +12,31 @@ body {
|
|||
font-family: 'IBM Plex Mono', monospace;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #18272F;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 4px;
|
||||
border-radius: 4px;
|
||||
background-color: #f5c2e7;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
transform-origin: right;
|
||||
transform: scaleX(0);
|
||||
transition: transform .3s ease-in-out;
|
||||
}
|
||||
|
||||
a:hover::before {
|
||||
transform-origin: left;
|
||||
transform: scaleX(1);
|
||||
}
|
||||
|
||||
a:link {
|
||||
color: #89b4fa
|
||||
}
|
||||
|
@ -42,36 +70,6 @@ pre {
|
|||
font-size: 15px;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'IBM Plex Mono';
|
||||
src: url("font/plex/IBMPlexMono-Regular.woff2") format("woff2");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'IBM Plex Mono';
|
||||
src: url("font/plex/IBMPlexMono-Bold.woff2") format("woff2");
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'IBM Plex Mono';
|
||||
src: url("font/plex/IBMPlexMono-Italic.woff2") format("woff2");
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'IBM Plex Mono';
|
||||
src: url("font/plex/IBMPlexMono-BoldItalic.woff2") format("woff2");
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Cherry Bomb One';
|
||||
src: url("font/cherrybombone/CherryBombOne-Regular.woff2") format("woff2");
|
||||
}
|
||||
|
||||
ul {
|
||||
display: inline-block;
|
||||
margin: auto;
|
||||
|
|
Loading…
Reference in a new issue