1

Improve how links look

This commit is contained in:
Evan Pratten 2020-11-15 23:14:57 -05:00
parent 7418c6797d
commit 7eacd5acf3
No known key found for this signature in database
GPG Key ID: 93AC7B3D071356D3
3 changed files with 31 additions and 27 deletions

View File

@ -40,14 +40,18 @@
<link rel="preload" href="{{site.baseurl}}/assets/fonts/GT-Walsheim-Regular.woff" as="font" crossorigin="anonymous">
<link rel="preload" href="{{site.baseurl}}/assets/fonts/TiemposTextWeb-Regular.woff2" as="font"
crossorigin="anonymous">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap" rel="stylesheet">
<!-- Google fonts -->
<link href="https://fonts.googleapis.com/css?family=IBM+Plex+Mono:400,400i|IBM+Plex+Sans:100,100i,400,400i,700,700i"
rel="stylesheet">
<!-- Load fontawesome -->
<link rel="preload" href="/assets/external/fontawesome/webfonts/fa-solid-900.woff2" as="font" crossorigin="anonymous">
<link rel="preload" href="/assets/external/fontawesome/webfonts/fa-brands-400.woff2" as="font" crossorigin="anonymous">
<link rel="preload" href="/assets/external/fontawesome/webfonts/fa-solid-900.woff2" as="font"
crossorigin="anonymous">
<link rel="preload" href="/assets/external/fontawesome/webfonts/fa-brands-400.woff2" as="font"
crossorigin="anonymous">
<link rel="prefetch" as="style" href="/assets/external/fontawesome/css/fontawesome.min.css" crossorigin="anonymous">
<script>
var fa = document.createElement("link");

View File

@ -30,5 +30,5 @@ h3, h4, h5, h6 {
}
p {
font-family: "tiempos-regular", "sans-serif";
font-family: "IBM Plex Sans", "sans-serif";
}

View File

@ -84,35 +84,35 @@ table,
}
.inner-content-container {
a {
font-family: sans-serif;
text-decoration: none;
color: #212529;
position: relative;
transition: all .3s cubic-bezier(.2, 0, 0, 1);
z-index: 1;
&:after {
content: '';
display: block;
height: 2px;
position: absolute;
bottom: 0;
right: 0;
left: 0;
background-color: var(--color-blue);
p, h2, h3 {
a {
text-decoration: none;
position: relative;
transition: all .3s cubic-bezier(.2, 0, 0, 1);
transform-origin: bottom center;
z-index: -1;
}
&:hover {
color: var(--color-blue);
z-index: 1;
&:after {
content: '';
display: block;
height: 2px;
position: absolute;
bottom: 0;
right: 50%;
left: 50%;
// height: 50%;
background-color: var(--color-blue);
transition: all .3s cubic-bezier(.2, 0, 0, 1);
transform-origin: bottom center;
z-index: -1;
}
&:hover {
color: #212529;
&:after {
right: 0;
left: 0;
// height: 50%;
}
}
}
}