diff options
| author | Christine Dodrill <me@christine.website> | 2018-12-17 23:59:15 -0800 |
|---|---|---|
| committer | Christine Dodrill <me@christine.website> | 2018-12-17 23:59:15 -0800 |
| commit | 267e02c3377499b2e6b052b23c3fdd03550c05fb (patch) | |
| tree | f1d9f465b362578bac12ea58dd481eeae209d37b | |
| parent | a1d8b435f5e8266f66e571e21fc52753460bc00a (diff) | |
| download | xesite-267e02c3377499b2e6b052b23c3fdd03550c05fb.tar.xz xesite-267e02c3377499b2e6b052b23c3fdd03550c05fb.zip | |
snow :D
| -rw-r--r-- | blog/let-it-snow-2018-12-17.markdown | 11 | ||||
| -rw-r--r-- | css/snow.css | 16 | ||||
| -rw-r--r-- | static/img/snow/snow1.png | bin | 0 -> 3080 bytes | |||
| -rw-r--r-- | static/img/snow/snow2.png | bin | 0 -> 7494 bytes | |||
| -rw-r--r-- | templates/base.html | 10 |
5 files changed, 35 insertions, 2 deletions
diff --git a/blog/let-it-snow-2018-12-17.markdown b/blog/let-it-snow-2018-12-17.markdown new file mode 100644 index 0000000..3c008bb --- /dev/null +++ b/blog/let-it-snow-2018-12-17.markdown @@ -0,0 +1,11 @@ +--- +title: Let it Snow +date: 2018-12-17 +for: the lols +--- + +# Let it Snow + +I have very terribly added snow to this website for the holidays. See [the CSS](/css/snow.css) for how I did this, it's really low-tech. Feel free to steal this trick, it is low-effort for maximum niceness. I have the `background-color` of the `snowframe` class identical to the `background-color` of the main page. This and `opacity: 1.0` seems to be the ticket. + +Happy holidays, all. diff --git a/css/snow.css b/css/snow.css new file mode 100644 index 0000000..6a7fa23 --- /dev/null +++ b/css/snow.css @@ -0,0 +1,16 @@ +.snow { + background-image: + url(/static/img/snow/snow1.png), + url(/static/img/snow/snow2.png); + animation: snow 30s linear infinite; +} + +.snowframe { + opacity: 1.0; + background-color: #282828; +} + +@keyframes snow { + 0% {background-position: 0px 0px, 0px 0px, 0px 0px;} + 100% {background-position: 500px 1000px, 400px 400px, 300px 300px} +} diff --git a/static/img/snow/snow1.png b/static/img/snow/snow1.png Binary files differnew file mode 100644 index 0000000..10291d9 --- /dev/null +++ b/static/img/snow/snow1.png diff --git a/static/img/snow/snow2.png b/static/img/snow/snow2.png Binary files differnew file mode 100644 index 0000000..e5a3aee --- /dev/null +++ b/static/img/snow/snow2.png diff --git a/templates/base.html b/templates/base.html index c42feed..27264cb 100644 --- a/templates/base.html +++ b/templates/base.html @@ -6,6 +6,7 @@ <meta name="go-import" content="christine.website git https://github.com/Xe/site"> <link rel="stylesheet" href="/css/hack.css" /> <link rel="stylesheet" href="/css/gruvbox-dark.css" /> + <link rel="stylesheet" href="/css/snow.css" /> <link rel="manifest" href="/static/manifest.json" /> <link rel="alternate" type="application/rss+xml" href="https://christine.website/blog.rss" /> @@ -53,16 +54,21 @@ </style> {{ template "styles" . }} </head> - <body class="hack gruvbox-dark"> + <body class="snow hack gruvbox-dark"> {{ template "scripts" . }} <div class="container"> <header> <p><a href="/">Christine Dodrill</a> - <a href="/blog">Blog</a> - <a href="/contact">Contact</a> - <a href="/resume">Resume</a></p> </header> - {{ template "content" . }} + + <div class="snowframe"> + {{ template "content" . }} + </div> + <footer> <blockquote>Copyright 2018 Christine Dodrill. Any and all opinions listed here are my own and not representative of my employer.</blockquote> </footer> + <script> if (navigator.serviceWorker.controller) { console.log("Active service worker found, no need to register"); |
