support updates

style/cake.svg

@@ -0,0 +1 @@
+<svg clip-rule="evenodd" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="1.5" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><metadata/><path d="m0 0h32v32h-32z" fill="none"/><path d="m15.086 6.532c.129-.53.401-1.019.793-1.411l1-1c.562-.562 1.325-.878 2.121-.878s1.559.316 2.121.878c.251.251.507.507.758.758.268.268.48.581.628.922 2.498.742 4.839 1.987 6.87 3.68.384.32.623.519.623.519v13l-28 7v-13z" fill="none" stroke="#000" stroke-width="4"/><path d="m2 19v-2l2-1 23-7 3 1v13l-2 .5z" fill="#ccc"/><path d="m28 18.5v5l-26 6.5v-5l1-1 24-6zm-26 4.5v-4l24.757-6.189c.299-.075.616-.008.858.182.243.189.385.48.385.788v2.719l-1 1.5-24 5.5-1-.5z" fill="#eaae53"/><path d="m28 18.5-26 6.5v-2l26-6.5z" fill="#da6363"/><path d="m2 17 15-12c4.523 0 8.903 1.586 12.377 4.481.384.32.623.519.623.519l-28 7z" fill="#fff"/><path d="m16 11c-.265 0-.52-.105-.707-.293-.188-.187-.293-.442-.293-.707v-2.757c0-.796.316-1.559.879-2.122l1-1c.562-.562 1.325-.878 2.121-.878s1.559.316 2.121.878c.251.251.507.507.758.758.562.562.878 1.325.878 2.121s-.316 1.559-.878 2.121c-.353.353-.702.702-1 1-.563.563-1.326.879-2.122.879-.85 0-1.964 0-2.757 0z" fill="#d72d35"/></svg>

style/shiny/gallery.css

@@ -116,17 +116,12 @@ body {
   box-shadow: var(--focus-box);
 }
 
-.item[data-date]::before {
-  content: attr(data-date);
-}
-
-
 figure {
   margin: 0;
   padding: 0;
 }
 
-figcaption, .item::before {
+figcaption .date, figcaption .title {
   position: absolute;
   width: 100%;
   border: 1px solid var(--text-col);
@@ -134,10 +129,11 @@ figcaption, .item::before {
   text-align: center;
   background: hsl(0, 0%, 0%, 75%);
   font-size: 80%;
+  text-shadow: none;
 }
 
-figcaption { bottom: -1px; left: -1px; }
-.item::before { top: -1px; left: -1px; }
+figcaption .date { top: -1px; left: -1px; }
+figcaption .title { bottom: -1px; left: -1px; }
 
 .year-marker {
   grid-area: auto / 1;
@@ -164,19 +160,31 @@ figcaption { bottom: -1px; left: -1px; }
   transform: scaleX(110%);
 }
 
-.item.nsfw::after {
-  --size: calc(1/4 * var(--image-size));
-  content: url(../18_plus_white.svg);
+.item.nsfw::before, .item[data-updated="true"]::after {
   height: var(--size);
   width: var(--size);
 
   display: inline-block;
   position: absolute;
+
+}
+
+.item.nsfw::before {
+  --size: calc(1/4 * var(--image-size));
+  --base-transform: rotate(var(--nsfw-sticker-rotate));
+  content: url(../18_plus_white.svg);
   top: calc(1em + 3px);
   right: 3px;
-
-  transform: rotate(var(--nsfw-sticker-rotate));
   mix-blend-mode: multiply;
+  transform: var(--base-transform);
+}
+
+.item[data-updated="true"]::after {
+  --size: calc(1/4 * var(--image-size));
+  content: url(../sparkles.svg);
+  bottom: calc(1em + 3px);
+  right: 3px;
+  mix-blend-mode: overlay;
 }
 
 footer {
@@ -187,30 +195,33 @@ footer {
 
 
 @media (hover) {
-  .item:hover figcaption, .item:hover::before {
+  .item:hover .date, .item:hover .title,
+  .item:hover::before, .item:hover::after {
     filter: opacity(20%);
   }
 
-  @media (prefers-reduced-motion) {
-    .item:hover figcaption {
-      transform: translateY(80%);
-    }
-  }
-
   @media (prefers-reduced-motion: no-preference) {
-    figcaption, .item::before {
+    figcaption .date, figcaption .title, .item::before, .item::after {
       transition-property: filter, transform;
-      transition-duration: 0.25s;
+      transition-duration: 0.15s;
       transition-timing-function: ease-in-out;
     }
 
-    .item:hover figcaption {
+    .item:hover .title {
       transform: translate(-20%, 80%) rotateZ(7deg);
     }
 
-    .item:hover::before {
+    .item:hover .date {
       transform: translate(20%, -80%) rotateZ(7deg);
     }
+
+    .item:hover::before {
+      transform: translate(1.5em, -1.5em) var(--base-transform);
+    }
+
+    .item:hover::after {
+      transform: translate(1.5em, 1.5em);
+    }
   }
 }
 
@@ -219,10 +230,14 @@ footer {
     height: min-content;
   }
 
-  figcaption {
+  figcaption .date, figcaption .title {
     position: initial;
   }
 
+  figcaption .date::after {
+    content: ':';
+  }
+
   .item a {
     display: block;
     height: var(--image-size);

style/shiny/single.css

@@ -132,6 +132,28 @@ body {
   margin: 0.35em;
 }
 
+#updates dl {
+  display: grid;
+  grid-template-columns: min-content auto;
+  grid-gap: 0.5em;
+  align-items: baseline;
+}
+
+#updates dt {
+  font-size: 80%;
+  font-weight: 700;
+  grid-area: auto / 1;
+}
+
+#updates dd {
+  grid-area: auto / 2;
+}
+
+.updated {
+  font-size: 90%;
+  font-style: italic;
+}
+
 footer {
   text-align: center;
   margin-top: 1em;

style/sparkles.svg

@@ -0,0 +1 @@
+<svg clip-rule="evenodd" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="1.5" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><metadata/><g fill="none"><path d="m0 0h32v32h-32z"/><path d="m14 15 5.5-2.5 2.5-8.5 2.5 8.5 5.5 2.5-5.5 2.5-2.5 8.5-2.5-8.5z" stroke="#000" stroke-width="4"/><path d="m4 23 3.5-1.5 1.5-5.5 1.5 5.5 3.5 1.5-3.5 1.5-1.5 5.5-1.5-5.5z" stroke="#000" stroke-width="4"/><path d="m2 7 2-1 1-4 1 4 2 1-2 1-1 4-1-4z" stroke="#000" stroke-width="4"/></g><path d="m14 15 5.5-2.5 2.5-8.5 2.5 8.5 5.5 2.5-5.5 2.5-2.5 8.5-2.5-8.5z" fill="#fdef24"/><path d="m4 23 3.5-1.5 1.5-5.5 1.5 5.5 3.5 1.5-3.5 1.5-1.5 5.5-1.5-5.5z" fill="#fdef24"/><path d="m2 7 2-1 1-4 1 4 2 1-2 1-1 4-1-4z" fill="#fdef24"/></svg>