early implementation of ari melody LIVE tracker

This commit is contained in:
ari melody 2025-06-17 01:15:08 +01:00
parent f7b3faf8e8
commit 9274796729
Signed by: ari
GPG key ID: CF99829C92678188
10 changed files with 335 additions and 39 deletions

View file

@ -6,6 +6,7 @@
--secondary: #f8e05b;
--tertiary: #f788fe;
--links: #5eb2ff;
--live: #fd3737;
}
@media (prefers-color-scheme: light) {

View file

@ -222,3 +222,84 @@ div#web-buttons {
transform: translate(-2px, -2px);
box-shadow: 1px 1px 0 #eee, 2px 2px 0 #eee;
}
#live-banner {
margin: 1em 0 2em 0;
padding: 1em;
border-radius: 4px;
border: 1px solid var(--primary);
box-shadow: 0 0 8px var(--primary);
}
#live-banner h2 {
margin: 0 0 .4em 0;
color: var(--on-background);
}
#live-banner p {
margin: 0;
}
.live-highlight {
color: var(--primary);
}
.live-preview {
display: flex;
flex-direction: row;
justify-content: center;
gap: 1em;
}
.live-preview div:first-of-type {
text-align: center;
}
.live-thumbnail {
border-radius: 4px;
}
.live-button {
margin: .2em;
padding: .4em .5em;
display: inline-block;
color: var(--primary);
border: 1px solid var(--primary);
border-radius: 4px;
transition: color .1s linear, background-color .1s linear, box-shadow .1s linear;
}
.live-button:hover {
color: var(--background);
background-color: var(--primary);
box-shadow: 0 0 8px var(--primary);
text-decoration: none;
}
.live-info {
display: flex;
flex-direction: column;
gap: .3em;
overflow-x: hidden;
}
.live-game {
overflow: hidden;
text-wrap: nowrap;
text-overflow: ellipsis;
}
.live-game .live-game-prefix {
opacity: .8;
}
.live-title {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.live-viewers {
opacity: .5;
}