Commit e227ef52 authored by Ashur Cabrera's avatar Ashur Cabrera
Browse files

WIP

parent c997b0ca
......@@ -10,8 +10,13 @@ if( process.env.NETLIFY )
}
}
module.exports = {
let site = {
title: "Eleventy Clock",
subtitle: "A terribly inefficient timepiece. By Ashur Cabrera.",
subtitle: "A terribly inefficient timepiece",
origin: origin,
about: "https://multiline.co/mment/2020/09/eleventy-clock/"
};
site.metadataDescription = `${site.subtitle}. Made by Ashur Cabrera.`;
module.exports = site;
......@@ -5,18 +5,18 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="title" content="{{ site.title }}">
<meta name="description" content="{{ site.subtitle }}">
<meta name="description" content="{{ site.metadataDescription }}">
<meta property="og:type" content="website">
<meta property="og:url" content="{{ site.origin }}">
<meta property="og:title" content="{{ site.title }}">
<meta property="og:description" content="{{ site.subtitle }}">
<meta property="og:description" content="{{ site.metadataDescription }}">
<meta property="og:image" content="{{ site.origin }}/card.png">
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="{{ site.origin }}">
<meta property="twitter:title" content="{{ site.title }}">
<meta property="twitter:description" content="{{ site.subtitle }}">
<meta property="twitter:description" content="{{ site.metadataDescription }}">
<meta property="twitter:image" content="{{ site.origin }}/card.png">
{%- set pageTitle -%}
......@@ -43,6 +43,10 @@
</style>
</head>
<body>
<header>
<a class="[][][ about ][]" href="{{ site.about }}"><span>About this website</span></a>
</header>
<div class="[ center flex ][ container ][][]">
<main class="[][ relative ][][]">
......@@ -73,7 +77,7 @@
window.location.replace( `/${h}:${m}/` );
{%- endif %}
{%- if tock -%}
{%- if update_time -%}
let now = new Date();
setTimeout( () => window.location.replace( "/" ), 1000 * (60 - now.getSeconds()) )
{%- endif %}
......
......@@ -61,7 +61,7 @@ body {
, 0 -3vw 1vw 0.5vw {{ colors.red[700] }} inset
;
border-radius: var( --corner-radius );
border-radius: var( --clock-body-radius );
}
/* Knob */
......
......@@ -36,6 +36,7 @@ body {
--black: {{ colors.gray[900] }};
--white: {{ colors.yellow[100] }};
--red-400: {{ colors.red[400] }};
--teal-500: {{ colors.teal[500] }};
--yellow-100: {{ colors.yellow[100] }};
--yellow-200: {{ colors.yellow[200] }};
--yellow-300: {{ colors.yellow[300] }};
......@@ -52,11 +53,33 @@ body {
/* Clock */
--clock-width: 80vw;
--clock-height: calc( var( --clock-width ) * 0.4 );
--clock-body-radius: 4vw;
font-size: 16px;
font-family: var( --font-time );
}
.about {
--size: 6vmin;
display: block;
position: absolute;
top: calc( var( --size ) / 2 ); right: calc( var( --size ) / 2 );
height: var( --size );
width: var( --size );
background: url( /info.svg ) no-repeat;
background-size: contain;
border-radius: 50%;
box-shadow: 0 0 1.5vmin var( --teal-500 );
}
.about span {
display: block;
overflow: hidden;
height: 0; width: 0;
}
.container {
height: 100%;
width: 100vw;
......
......@@ -3,7 +3,7 @@ layout: layouts/base.njk
stylesheets:
- clock.css
tock: true
update_time: true
pagination:
data: times
......
<svg width="48" height="48" xmlns="http://www.w3.org/2000/svg"><path d="M24 1.5a22.43 22.43 0 0115.91 6.59A22.43 22.43 0 0146.5 24a22.43 22.43 0 01-6.59 15.91A22.43 22.43 0 0124 46.5a22.43 22.43 0 01-15.91-6.59A22.43 22.43 0 011.5 24 22.43 22.43 0 018.09 8.09 22.43 22.43 0 0124 1.5zm-1.735 19.034a5.044 5.044 0 00-.141.02 2.399 2.399 0 01.75 1.527c.087.586.091 1.182-.002 1.865-.09.448-.186.895-.287 1.341l-.152.655-.462 1.944c-.096.407-.202.816-.31 1.224-.28 1.07-.57 2.139-.619 3.315-.028.406.063.8.25 1.129.166.294.41.538.732.681.573.26 1.203.331 1.81.2a2.56 2.56 0 01-.19-.198c-.379-.437-.646-1.064-.67-1.98a4.45 4.45 0 01.069-1.018c.262-1.243.532-2.483.811-3.72.117-.515.251-1.022.385-1.53.287-1.085.584-2.169.65-3.318.029-.49-.053-.948-.267-1.319a1.456 1.456 0 00-.76-.644 3.214 3.214 0 00-1.597-.174zm3.759-8.034a1.48 1.48 0 00-1.264.678 1.487 1.487 0 00-.132 1.435c.173.383.502.66.877.795.366.132.783.13 1.152-.058.28-.143.507-.36.656-.617.135-.232.206-.497.183-.767-.037-.435-.193-.813-.466-1.076-.257-.248-.61-.382-1.006-.39z" fill="#1B202C" stroke="#FEFFF0" stroke-width="3" fill-rule="evenodd"/></svg>
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment