Compare commits
2 Commits
d1a5e30059
...
4bd79d88d9
Author | SHA1 | Date |
---|---|---|
Rhiannon Morris | 4bd79d88d9 | |
Rhiannon Morris | cabe24377a |
|
@ -90,7 +90,7 @@
|
||||||
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
window.addEventListener('DOMContentLoaded', function() {
|
window.addEventListener('load', function() {
|
||||||
let link = document.getElementById('soundlink');
|
let link = document.getElementById('soundlink');
|
||||||
let miku = document.getElementById('miku');
|
let miku = document.getElementById('miku');
|
||||||
|
|
||||||
|
|
54
style.css
54
style.css
|
@ -11,15 +11,33 @@ body {
|
||||||
hsl(195deg, 100%, 67%),
|
hsl(195deg, 100%, 67%),
|
||||||
hsl(155deg, 70%, 62%)
|
hsl(155deg, 70%, 62%)
|
||||||
);
|
);
|
||||||
--bg-image:
|
|
||||||
image-set(url(media/bg.png) 1x,
|
|
||||||
url(media/bg_2x.png) 2x);
|
|
||||||
--size: 1.75rem;
|
--size: 1.75rem;
|
||||||
--weight: 600;
|
--weight: 600;
|
||||||
|
|
||||||
background:
|
background:
|
||||||
var(--bg-image) top center fixed,
|
-webkit-image-set(url(media/bg.png) 1x,
|
||||||
var(--gradient) fixed;
|
url(media/bg_2x.png) 2x)
|
||||||
|
top center fixed,
|
||||||
|
linear-gradient(135deg,
|
||||||
|
hsl(42deg, 92%, 70%),
|
||||||
|
hsl(348deg, 92%, 70%),
|
||||||
|
hsl(334deg, 100%, 80%),
|
||||||
|
hsl(234deg, 100%, 76%),
|
||||||
|
hsl(195deg, 100%, 67%),
|
||||||
|
hsl(155deg, 70%, 62%)
|
||||||
|
) fixed;
|
||||||
|
background:
|
||||||
|
image-set(url(media/bg.png) 1x,
|
||||||
|
url(media/bg_2x.png) 2x)
|
||||||
|
top center fixed,
|
||||||
|
linear-gradient(135deg,
|
||||||
|
hsl(42deg, 92%, 70%),
|
||||||
|
hsl(348deg, 92%, 70%),
|
||||||
|
hsl(334deg, 100%, 80%),
|
||||||
|
hsl(234deg, 100%, 76%),
|
||||||
|
hsl(195deg, 100%, 67%),
|
||||||
|
hsl(155deg, 70%, 62%)
|
||||||
|
) fixed;
|
||||||
background-blend-mode: overlay;
|
background-blend-mode: overlay;
|
||||||
|
|
||||||
font-family: 'Muller';
|
font-family: 'Muller';
|
||||||
|
@ -241,9 +259,31 @@ h1, h2 { --around-image: url(media/sparkles.svg); }
|
||||||
hsl(195deg, 60%, 44%),
|
hsl(195deg, 60%, 44%),
|
||||||
hsl(155deg, 60%, 55%)
|
hsl(155deg, 60%, 55%)
|
||||||
);
|
);
|
||||||
--bg-image:
|
|
||||||
|
background:
|
||||||
|
-webkit-image-set(url(media/bg_dim.png) 1x,
|
||||||
|
url(media/bg_2x_dim.png) 2x)
|
||||||
|
top center fixed,
|
||||||
|
linear-gradient(135deg,
|
||||||
|
hsl(42deg, 56%, 55%),
|
||||||
|
hsl(348deg, 56%, 55%),
|
||||||
|
hsl(334deg, 60%, 43%),
|
||||||
|
hsl(234deg, 60%, 40%),
|
||||||
|
hsl(195deg, 60%, 44%),
|
||||||
|
hsl(155deg, 60%, 55%)
|
||||||
|
) fixed;
|
||||||
|
background:
|
||||||
image-set(url(media/bg_dim.png) 1x,
|
image-set(url(media/bg_dim.png) 1x,
|
||||||
url(media/bg_2x_dim.png) 2x);
|
url(media/bg_2x_dim.png) 2x)
|
||||||
|
top center fixed,
|
||||||
|
linear-gradient(135deg,
|
||||||
|
hsl(42deg, 56%, 55%),
|
||||||
|
hsl(348deg, 56%, 55%),
|
||||||
|
hsl(334deg, 60%, 43%),
|
||||||
|
hsl(234deg, 60%, 40%),
|
||||||
|
hsl(195deg, 60%, 44%),
|
||||||
|
hsl(155deg, 60%, 55%)
|
||||||
|
) fixed;
|
||||||
}
|
}
|
||||||
|
|
||||||
main {
|
main {
|
||||||
|
|
Loading…
Reference in New Issue