feat: smooth transitions for the time element

aplosdev · Aug 29, 2024 · 6d731b4 · 6d731b4
1 parent def86b4
commit 6d731b4
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -32,6 +32,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 - Make the progress bar use 100% of the width
 
+- Smooth transitions for the `time` element
+
 ### Removed
 
 - Remove fallback for "Make navigation links' URL be provided with `url` not `link`

diff --git a/src/styles/components/_semantics.scss b/src/styles/components/_semantics.scss
@@ -42,6 +42,7 @@ time {
   color: var(--color-accent);
   font-weight: 700;
   font-size: 0.875rem;
+  transition: border 0.1s ease, font-weight 0.1s ease;
 
   strong {
     display: inline-block;
@@ -66,7 +67,7 @@ time {
     font-weight: 800;
 
     strong {
-      animation: none;
+      animation: blink 1.5s infinite alternate;
     }
   }
 }