diff --git a/_includes/head.html b/_includes/head.html index bf04f1c..8a6a90e 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -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"); diff --git a/_sass/site/fonts.scss b/_sass/site/fonts.scss index 507f65e..3997c68 100644 --- a/_sass/site/fonts.scss +++ b/_sass/site/fonts.scss @@ -30,5 +30,5 @@ h3, h4, h5, h6 { } p { - font-family: "tiempos-regular", "sans-serif"; + font-family: "IBM Plex Sans", "sans-serif"; } \ No newline at end of file diff --git a/_sass/site/page.scss b/_sass/site/page.scss index eb34d6c..d58ce27 100644 --- a/_sass/site/page.scss +++ b/_sass/site/page.scss @@ -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%; + } } } }