Content added Content deleted
mNo edit summary |
m (adding bg color for dark mode) |
||
(11 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
.song-video { |
.song-video { |
||
display: inline-grid; |
display: inline-grid; |
||
margin |
margin: 15px 15px 0 0; |
||
⚫ | |||
margin-right: 10px; |
|||
width: 320px; |
|||
} |
} |
||
Line 11: | Line 12: | ||
font-weight: bold; |
font-weight: bold; |
||
background-color: var(--theme-primary-0); |
background-color: var(--theme-primary-0); |
||
⚫ | |||
.song-video .content { |
|||
display: flex; |
|||
⚫ | |||
flex-wrap: wrap; |
|||
} |
} |
||
Line 48: | Line 43: | ||
body.skin-citizen .song-video .info .ih { |
body.skin-citizen .song-video .info .ih { |
||
border-radius: var(--border-radius--small); |
border-radius: var(--border-radius--small); |
||
⚫ | |||
html.skin-citizen-dark .song-video .header, |
|||
html.skin-citizen-dark .song-video .info .ih { |
|||
border: 1px solid var(--border-color-base); |
|||
background-color: var(--color-surface-1) !important; |
|||
} |
|||
body.skin-citizen .song-video .video { |
|||
border-radius: var(--border-radius--small); |
|||
overflow: hidden; |
|||
} |
} |
Latest revision as of 13:21, 31 March 2023
.song-video {
display: inline-grid;
margin: 15px 15px 0 0;
gap: 5px;
width: 320px;
}
.song-video .header {
text-align: center;
padding: 5px;
margin-bottom: 5px;
font-weight: bold;
background-color: var(--theme-primary-0);
}
.song-video .video {
height: 180px;
flex: 1 0 320px;
text-align: center;
}
.song-video .info {
display: grid;
grid-template-columns: 120px 1fr;
grid-auto-rows: min-content;
gap: 5px;
}
.song-video .info .ih {
padding: 5px 10px;
font-weight: bold;
background-color: var(--theme-primary-0);
}
.song-video .info .id {
padding: 5px;
}
/*
* Citizen skin
*/
body.skin-citizen .song-video .header,
body.skin-citizen .song-video .info .ih {
border-radius: var(--border-radius--small);
}
html.skin-citizen-dark .song-video .header,
html.skin-citizen-dark .song-video .info .ih {
border: 1px solid var(--border-color-base);
background-color: var(--color-surface-1) !important;
}
body.skin-citizen .song-video .video {
border-radius: var(--border-radius--small);
overflow: hidden;
}