Lighten background and soften shadows

This commit is contained in:
Joseph Hutchinson
2018-03-28 15:35:41 -04:00
parent 1fdf88ba0d
commit 74b73473b3
2 changed files with 10 additions and 4 deletions

View File

@@ -1,7 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}" dir="ltr"> <html lang="{{ .Site.LanguageCode }}" dir="ltr">
{{ partial "head.html" . }} {{ partial "head.html" . }}
<body style="background-color: #f3f3f3;"> <body style="background-color: #f9f9f9;">
{{ partial "header.html" . }} {{ partial "header.html" . }}
<div class="card-content-container"> <div class="card-content-container">
<header class="list-header"> <header class="list-header">

View File

@@ -22,7 +22,7 @@ strong {
text-align: center; text-align: center;
background-color: rgba(255, 255, 255, 0.97); background-color: rgba(255, 255, 255, 0.97);
-webkit-backdrop-filter: blur(0.5em); -webkit-backdrop-filter: blur(0.5em);
box-shadow: 0 0.3em 1.5em 0 rgba(0, 0, 0, 0.1); box-shadow: 0 0.3em 1.5em 0 rgba(0, 0, 0, 0.05);
} }
.nav-header { .nav-header {
margin: 0 0; margin: 0 0;
@@ -46,6 +46,12 @@ strong {
} }
.post-figure { .post-figure {
margin: 1.5em 0; margin: 1.5em 0;
opacity: 0;
animation: fadein 0.3s ease-out 0.2s forwards;
}
@keyframes fadein {
from { opacity: 0;}
to { opacity: 1;}
} }
.post > p:first-of-type::first-letter { .post > p:first-of-type::first-letter {
font-family: 'LatoLatinWebHeavyItalic'; font-family: 'LatoLatinWebHeavyItalic';
@@ -106,11 +112,11 @@ img {
text-decoration: none; text-decoration: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
transition: transform 0.3s, box-shadow 0.3s; transition: transform 0.3s, box-shadow 0.3s;
box-shadow: 0 0.2em 0.5em 0 rgba(0, 0, 0, 0.1), 0 0 0.1em 0 rgba(0, 0, 0, 0.05); box-shadow: 0 0.2em 0.7em 0 rgba(0, 0, 0, 0.1), 0 0 0.2em 0 rgba(0, 0, 0, 0.05);
} }
.card-link-wrapper-active { .card-link-wrapper-active {
transform: scale(0.95); transform: scale(0.95);
box-shadow: 0 0.15em 0.5em 0 rgba(0, 0, 0, 0.15); box-shadow: 0 0.1em 0.5em 0 rgba(0, 0, 0, 0.15);
} }
.card { .card {
padding: 1em; padding: 1em;