diff --git a/static/assets/css/index.css b/static/assets/css/index.css
index 9e57be3..e1503b8 100644
--- a/static/assets/css/index.css
+++ b/static/assets/css/index.css
@@ -10,11 +10,11 @@ j-wrap.index {
figure.centerpiece {
grid-area: centerpiece;
- padding: 2em 1em;
}
img.centerpiece {
height: 100%;
+ padding: 2em 0 4em 0;
}
h1 {
@@ -22,6 +22,7 @@ j-wrap.index {
text-align: center;
font-size: calc(1em + 2vw);
margin-bottom: 0.125em;
+ margin-top: 0;
}
nav {
@@ -50,6 +51,7 @@ j-wrap.index {
img.centerpiece:hover {
cursor: crosshair;
border-radius: 180px;
+ mask-image: none;
backdrop-filter:
blur(2px)
drop-shadow(4px 4px 10px red)
@@ -62,7 +64,8 @@ img.centerpiece {
animation-timing-function: linear;
animation-duration: 30s;
animation-iteration-count: infinite;
- mask-image: linear-gradient(90deg,
+ mask-image: repeating-radial-gradient(
+ circle at farthest-corner in hsl longer hue,
light-dark(#222, #000) 0%,
light-dark(#888, #444) 50%,
#fff 100%
@@ -84,7 +87,7 @@ img.five { animation-delay: -30s; }
10% {
filter:
hue-rotate(0deg)
- drop-shadow(0 0 8vw #3B050560)
+ drop-shadow(0 0 26vw #3B050580)
brightness(3)
blur(0.2px)
saturate(1)
@@ -106,7 +109,7 @@ img.five { animation-delay: -30s; }
60% {
filter:
hue-rotate(0deg)
- drop-shadow(0 0 8vw #66000060)
+ drop-shadow(0 0 26vw #66000080)
brightness(1)
blur(0.2px)
saturate(1)
diff --git a/templates/index.html b/templates/index.html
index 56f704e..a9cce96 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,25 +1,18 @@
{% extends "base.html" %}
+
{% block extra_head %}
-
+
{% endblock extra_head %}
+
{% block content %}
{% set medusa = get_url(path="images/discomedusae_gamma_dark.png") %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ {% set centerpieces = [ "one", "two", "three", "four", "five" ] %}
+ {% for class in centerpieces %}
+
+
+ {% endfor %}
IncandescĂȘncia