ritual/ritual.sh
ritual/ritual.sh
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Started adding some navigation options

Browse source 
For pages I want to add...
This commit is contained in:
Dan 2025-12-08 14:35:27 +00:00
parent 3006bff575
commit 99e89f7e84
4 changed files with 380 additions and 225 deletions
Download patch file Download diff file Expand all files Collapse all files

148
assets/sass/style.scss
View file

@ -1,5 +1,6 @@
@import "partials/global-styles";
@import "partials/music";
@import "partials/vu-meter";
@import "partials/terminal";
@import "partials/now-playing";
@ -1536,153 +1537,6 @@ body {
border-radius: 50%;
}
/* iPod group container - maintains relative positioning */
.ipod-group {
position: absolute;
bottom: 6%;
right: 34%;
width: 150px;
height: 100px;
z-index: 15;
}
/* iPod 5th Generation */
.ipod {
position: absolute;
top: 0;
left: 52px;
width: 45px;
height: 70px;
background: linear-gradient(145deg, #f0f0f0, #d0d0d0);
border-radius: 8px;
box-shadow:
0 3px 10px rgba(0, 0, 0, 0.6),
inset 0 1px 3px rgba(255, 255, 255, 0.5),
inset 0 -1px 3px rgba(0, 0, 0, 0.2);
transform: rotate(-8deg);
z-index: 2;
}
.ipod::before {
content: "";
position: absolute;
top: 8px;
left: 50%;
transform: translateX(-50%);
width: 32px;
height: 22px;
background: linear-gradient(180deg, #1a1a2a 0%, #0a0a1a 100%);
border-radius: 2px;
box-shadow: inset 0 0 5px rgba(0, 100, 150, 0.3);
}
.ipod-wheel {
position: absolute;
bottom: 8px;
left: 50%;
transform: translateX(-50%);
width: 32px;
height: 30px;
background: radial-gradient(
circle at center,
#fff 0%,
#fff 35%,
#ddd 35%,
#ccc 100%
);
border-radius: 50%;
box-shadow:
inset 0 1px 2px rgba(0, 0, 0, 0.2),
0 1px 3px rgba(0, 0, 0, 0.3);
}
.ipod-wheel::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 12px;
height: 12px;
background: #e8e8e8;
border-radius: 50%;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
}
/* Earbuds/IEMs - redesigned to look like in-ear monitors */
.earbud {
position: absolute;
width: 10px;
height: 12px;
background: linear-gradient(135deg, #2a2a3a 0%, #1a1a2a 50%, #0a0a1a 100%);
border-radius: 40% 60% 60% 40% / 50% 50% 50% 50%;
box-shadow:
0 2px 4px rgba(0, 0, 0, 0.6),
inset 1px 1px 2px rgba(255, 255, 255, 0.1);
z-index: 3;
}
/* IEM tips */
.earbud::after {
content: "";
position: absolute;
width: 6px;
height: 6px;
background: radial-gradient(
circle,
rgba(200, 200, 200, 0.3),
rgba(100, 100, 100, 0.2)
);
border-radius: 50%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/* IEM nozzle/sound bore */
.earbud::before {
content: "";
position: absolute;
width: 3px;
height: 5px;
background: linear-gradient(180deg, #444 0%, #222 100%);
border-radius: 2px;
top: 3px;
left: 50%;
transform: translateX(-50%);
}
.earbud-left {
top: 85px;
left: 0px;
transform: rotate(-25deg);
}
.earbud-right {
top: 80px;
left: 120px;
transform: rotate(35deg);
}
/* Cable SVG positioned in container */
.ipod-cables {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 1;
}
/* Purple-blue gradient for cable */
.ipod-cables defs stop.cable-start {
stop-color: #6b4fb3;
}
.ipod-cables defs stop.cable-end {
stop-color: #4169e1;
}
/* Import a nice cursive font */
@import url("https://fonts.googleapis.com/css2?family=Neonderthaw&display=swap");