diff --git a/static/assets/fonts/ah.ttf b/static/assets/fonts/ah.ttf
new file mode 100644
index 0000000..cdcfcc5
Binary files /dev/null and b/static/assets/fonts/ah.ttf differ
diff --git a/static/assets/gifs/flowerzdark.png b/static/assets/gifs/flowerzdark.png
new file mode 100644
index 0000000..fe69649
Binary files /dev/null and b/static/assets/gifs/flowerzdark.png differ
diff --git a/static/assets/gifs/kitty-1.gif b/static/assets/gifs/kitty-1.gif
new file mode 100644
index 0000000..257d523
Binary files /dev/null and b/static/assets/gifs/kitty-1.gif differ
diff --git a/static/assets/gifs/nurple-static-bright.gif b/static/assets/gifs/nurple-static-bright.gif
new file mode 100644
index 0000000..13b1b99
Binary files /dev/null and b/static/assets/gifs/nurple-static-bright.gif differ
diff --git a/static/assets/gifs/red-stars.gif b/static/assets/gifs/red-stars.gif
new file mode 100644
index 0000000..118c59d
Binary files /dev/null and b/static/assets/gifs/red-stars.gif differ
diff --git a/static/assets/gifs/stars3.gif b/static/assets/gifs/stars3.gif
new file mode 100644
index 0000000..717ad16
Binary files /dev/null and b/static/assets/gifs/stars3.gif differ
diff --git a/static/style.css b/static/style.css
index 5172b24..471a393 100644
--- a/static/style.css
+++ b/static/style.css
@@ -133,6 +133,7 @@ table {
/* Animations */
+
@keyframes fadeInNOut {
0% {
opacity: 0;
@@ -196,6 +197,11 @@ table {
}
}
+@font-face {
+ font-family: "AH";
+ src: url("assets/fonts/ah.ttf") format("truetype");
+}
+
:root {
--lavender: #cdb4db;
@@ -211,10 +217,11 @@ table {
::selection {
text-shadow: 0px 0px 3px var(--darkerer-pink);
-
}
+
+
body {
background-size: cover;
background-position: center;
@@ -239,6 +246,10 @@ body {
background-image: url(assets/images/tiledbgpink.webp);
}
+ &:has(#content about) {
+ background-image: url(assets/gifs/flowerzdark.png);
+ }
+
main {
padding-top: 8rem;
}
@@ -256,7 +267,7 @@ body {
cute-container {
background-image: url(assets/gifs/weirdstone.png);
- width: min(90svw, 850px);
+ width: min(90svw, 1000px);
min-height: 70svh;
height: auto;
border: 5px solid var(--lavender);
@@ -494,6 +505,10 @@ home-content {
gap: 2rem;
}
+ bibou-message {
+ font-style: italic;
+ color: var(--grey-500)
+ }
bibou-container {
position: relative;
@@ -654,10 +669,40 @@ home-content {
music {
display: flex;
- flex-direction: column;
+ flex-direction: row;
flex-wrap: wrap;
justify-content: center;
- align-items: center;
+ align-items: stretch;
+
+ vertical-marquee {
+ position: fixed;
+ left: 0;
+ top: 0;
+ height: 100svh;
+ width: 100svw;
+ overflow: hidden;
+ z-index: -1;
+ pointer-events: none;
+ font-size: 10rem;
+ animation: fadeInNOut 10s infinite;
+
+ vertical-marquee-inner {
+ position: absolute;
+ top: 0;
+ display: flex;
+ flex-direction: column;
+
+ text {
+ display: block;
+ font-family: "AH", sans-serif;
+ font-size: 1.1rem;
+ line-height: 24px;
+ color: red;
+ opacity: 0.5;
+ }
+ }
+ }
+
box {
border-radius: 0.4rem;
@@ -941,8 +986,11 @@ mini-player {
pink-statusbar {
display: none;
}
+
}
+ /* Music page */
+
/* Miniplayer */
mini-player {
diff --git a/templates/partials/home.html b/templates/partials/home.html
index 4bef8ca..67813fd 100644
--- a/templates/partials/home.html
+++ b/templates/partials/home.html
@@ -54,6 +54,7 @@
width="30px" alt="Instagram logo" />
+ Consult the wisdom of the Bibou, if thou darest...
diff --git a/templates/partials/music.html b/templates/partials/music.html
index d308c54..144e7ed 100644
--- a/templates/partials/music.html
+++ b/templates/partials/music.html
@@ -1,5 +1,25 @@
+
-
\ No newline at end of file
+
+
\ No newline at end of file