From 74fcf4bafbaf61047e2372de03ccd985549ea790 Mon Sep 17 00:00:00 2001
From: alexsparkes <alexsparkes@gmail.com>
Date: Mon, 20 May 2024 10:06:00 +0100
Subject: [PATCH] fix: consistent ui fade in transition

---
 src/features/greeting/greeting.scss | 1 +
 src/features/quote/quote.scss       | 4 ++++
 src/features/time/clock.scss        | 1 +
 src/features/weather/weather.scss   | 2 ++
 src/scss/index.scss                 | 2 ++
 5 files changed, 10 insertions(+)

diff --git a/src/features/greeting/greeting.scss b/src/features/greeting/greeting.scss
index 51be411b..0a57fc09 100644
--- a/src/features/greeting/greeting.scss
+++ b/src/features/greeting/greeting.scss
@@ -4,6 +4,7 @@
   cursor: initial;
   user-select: none;
   font-weight: 600;
+  animation: fadeIn 1s;
 
   --shadow-shift: 0.2rem;
 }
diff --git a/src/features/quote/quote.scss b/src/features/quote/quote.scss
index 59fb9226..5fc5c077 100644
--- a/src/features/quote/quote.scss
+++ b/src/features/quote/quote.scss
@@ -101,6 +101,10 @@ h1.quoteauthor {
   align-items: flex-start;
   padding: 20px;
   text-align: left;
+
+  .title, .subtitle {
+    text-transform: capitalize;
+  }
 }
 
 .author-holder {
diff --git a/src/features/time/clock.scss b/src/features/time/clock.scss
index 4a56d7e2..f4d9f06e 100644
--- a/src/features/time/clock.scss
+++ b/src/features/time/clock.scss
@@ -6,6 +6,7 @@
   cursor: initial;
   user-select: none;
   font-weight: 600;
+  animation: fadeIn 1s;
 
   --shadow-shift: 0.4rem;
 }
diff --git a/src/features/weather/weather.scss b/src/features/weather/weather.scss
index 24ff4144..bbb5b06f 100644
--- a/src/features/weather/weather.scss
+++ b/src/features/weather/weather.scss
@@ -13,6 +13,8 @@
   display: flex;
   flex-flow: column;
 
+  animation: fadeIn 1s;
+
   &:hover {
     height: auto;
     transition: 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
diff --git a/src/scss/index.scss b/src/scss/index.scss
index 8417bf37..d91fe64b 100644
--- a/src/scss/index.scss
+++ b/src/scss/index.scss
@@ -33,6 +33,8 @@ body {
     justify-content: center;
     align-items: center;
     gap: 20px;
+
+    animation: fadeIn 1s;
   }
 
   &.no-textBorder {