CSS for header count

The64thGamer · Sep 11, 2024 · c792e62 · c792e62
1 parent df8a64c
commit c792e62
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 6 deletions.
diff --git a/themes/sixtyth-fortran/assets/css/main.css b/themes/sixtyth-fortran/assets/css/main.css
@@ -52,8 +52,6 @@ ul {
   inline-size: 40em;
 }
 
-
-
 .list-page-summary {
   margin-left: 3rem;
 }
@@ -68,6 +66,29 @@ ul {
   color: var(--yellow); 
 }
 
+.fun-text{
+  text-align: center;
+  margin: 0;
+  font-size: 1.25em;
+  font-family: "RockoFLF";
+  letter-spacing: .1rem;
+  color: var(--white);
+}
+.fun-text strong{
+  color: var(--yellow);
+  display: inline-block;
+  animation: wave 3s ease-in-out infinite;
+}
+
+@keyframes wave {
+  0%,100% {
+    transform: translateY(-.15em);
+  }
+  50% {
+    transform: translateY(.15em);
+  }
+}
+
 
 header {
 

diff --git a/themes/sixtyth-fortran/layouts/partials/header.html b/themes/sixtyth-fortran/layouts/partials/header.html
@@ -1,6 +1,3 @@
-<div style="display: flex; justify-content: center; align-items: center;">
-    <img src="/UI/CEPLogo.png" alt="Logo" style="max-height: 6.5vw;">
-</div>
 {{ $contributorCounts := dict }} <!-- Initialize an empty dictionary to store contributor counts -->
 
 {{ range .Site.RegularPages }} <!-- Loop through all regular pages (articles) -->
@@ -27,6 +24,11 @@
 <!-- Count of unique contributors -->
 {{ $contributorCount := len $sortedContributors }}
 
-<Center><h3>Now at <strong>{{ len .Site.RegularPages }}</strong> articles contributed by <strong>{{ $contributorCount }}</strong> users.</h3></Center>
+<div style="display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0.5vw;">
+  <img src="/UI/CEPLogo.png" alt="Logo" style="max-height: 6.5vw;">
+  <div class="fun-text">
+    Now at <strong>{{ len .Site.RegularPages }}</strong> articles contributed by <strong>{{ $contributorCount }}</strong> users.
+  </div>
+</div>
 
 {{ partial "menu.html" (dict "menuID" "main" "page" .) }}