creating holiday post
This commit is contained in:
parent
ab60651148
commit
ccae7a4566
|
|
@ -42,4 +42,3 @@ menu:
|
|||
class: email
|
||||
url: mailto:yequari@32bit.cafe
|
||||
weight: 30
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,24 @@
|
|||
---
|
||||
title: "Reflecting on 2023"
|
||||
date: 2023-12-19T22:15:29-07:00
|
||||
draft: true
|
||||
layout: winter
|
||||
context: "This page is an entry into the 32-Bit Cafe's [2023 holiday event](https://32bit.cafe/holidays2023/)."
|
||||
---
|
||||
|
||||
## Things that happened
|
||||
|
||||
- Returned to the gym
|
||||
|
||||
- Did some stuff at the 32-bit cafe
|
||||
|
||||
- Changed jobs
|
||||
|
||||
- Programming projects
|
||||
|
||||
## Goals for 2024
|
||||
|
||||
- Fitness and diet goals
|
||||
|
||||
- Code more
|
||||
- Contribute to open source
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<meta charset="utf-8">
|
||||
<title>{{ .Page.Title }}</title>
|
||||
<link rel="preconnect" href="https://fonts.bunny.net">
|
||||
<link href="https://fonts.bunny.net/css?family=b612-mono:400|asar:400|bungee:400|nova-mono:400|krub:400|lalezar:400" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/css/winter.css">
|
||||
<link rel="icon" type="image/png" href="/favicon.png">
|
||||
<script src="/js/quotes.js"></script>
|
||||
<link rel="webmention" href="https://webmention.io/yequari.com/webmention" />
|
||||
<link rel="pingback" href="https://webmention.io/yequari.com/xmlrpc" />
|
||||
<script src="/js/webmention.js" async></script>
|
||||
{{ range .AlternativeOutputFormats -}}
|
||||
{{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
|
||||
{{ end -}}
|
||||
</head>
|
||||
<body>
|
||||
<div class="big">
|
||||
<div class="column">
|
||||
<main>
|
||||
{{- block "main" . }}{{- end }}
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
{{ define "main" }}
|
||||
<div id="winter"></div>
|
||||
<article class="h-entry content">
|
||||
<h1 class="p-name">{{ .Title }}</h1>
|
||||
<p><a href="/"><-- Return to yequari.com</a></p>
|
||||
<a class="p-author h-card hidden" href="https://yequari.com">yequari</a>
|
||||
<time class="dt-published" datetime={{.PublishDate }}>{{ .PublishDate.Format "Mon, Jan 02, 2006" }}</time>
|
||||
<a class="u-url permalink" href={{ .RelPermalink }}>Permalink</a>
|
||||
{{ partial "tags.html" .}}
|
||||
{{ if .Params.context }}
|
||||
<p class="context">{{ .Params.context | markdownify }}</p>
|
||||
{{ end }}
|
||||
<div class="e-content">
|
||||
{{ .Content }}
|
||||
</div>
|
||||
{{ partial "webmentions.html" }}
|
||||
<div id="webmentions"></div>
|
||||
</article>
|
||||
<script src="/js/winter.js"></script>
|
||||
{{ end }}
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
|
||||
@keyframes fall {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
top: 100vh;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes sway {
|
||||
0% {
|
||||
margin-left: 0;
|
||||
}
|
||||
25% {
|
||||
margin-left: 50px;
|
||||
}
|
||||
50% {
|
||||
margin-left: -50px;
|
||||
}
|
||||
75% {
|
||||
margin-left: 50px;
|
||||
}
|
||||
100% {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#winter {
|
||||
z-index: -1;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
transition: opacity 500ms;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.snow {
|
||||
animation: fall ease-in infinite, sway ease-in-out infinite;
|
||||
color: skyblue;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.content {
|
||||
max-width: fit-content;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.context {
|
||||
font-style: italic;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
|
|
@ -0,0 +1,37 @@
|
|||
console.log("winter");
|
||||
|
||||
const snowContent = ['❄', '❅', '❆']
|
||||
const snowflake = '● '
|
||||
const snowContainer = document.getElementById('winter');
|
||||
|
||||
const random = (num) => {
|
||||
return Math.floor(Math.random() * num);
|
||||
}
|
||||
|
||||
const getRandomStyles = () => {
|
||||
const top = random(100);
|
||||
const left = random(100);
|
||||
const dur = random(10) + 10;
|
||||
const size = random(15) + 15;
|
||||
return `
|
||||
top: -${top}%;
|
||||
left: ${left}%;
|
||||
font-size: ${size}px;
|
||||
animation-duration: ${dur}s;
|
||||
`;
|
||||
}
|
||||
|
||||
const createSnow = (num) => {
|
||||
for (var i = num; i > 0; i--) {
|
||||
var snow = document.createElement("div");
|
||||
snow.className = "snow";
|
||||
snow.style.cssText = getRandomStyles();
|
||||
snow.innerHTML = snowContent[random(2)];
|
||||
// snow.innerHTML = snowflake;
|
||||
snowContainer.append(snow);
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener("load", () => {
|
||||
createSnow(30)
|
||||
});
|
||||
Loading…
Reference in New Issue