@u-wave/react-server-list
Version:
Show a list of üWave servers.
84 lines (72 loc) • 1.46 kB
CSS
.usl-Loading {
width: 100%;
text-align: center;
}
.usl-DescriptionDialog-markdown {
max-width: 100%;
}
.usl-DescriptionDialog-markdown a:any-link {
/* for non-var() browsers */
color: #c72e6c;
/* link color may be set by outer app (eg the üWave web client) */
color: var(--link-color, #c72e6c);
}
.usl-DescriptionDialog-loading {
max-width: 100%;
display: flex;
justify-content: center;
overflow-y: hidden;
}
.usl-CurrentMedia {
position: relative;
}
.usl-CurrentMedia-image {
width: 100%;
padding-bottom: 75%;
background-color: black;
background-position: center center;
background-size: contain;
background-repeat: no-repeat;
}
.usl-CurrentMedia-nowPlaying {
box-sizing: border-box;
position: absolute;
width: 100%;
bottom: 0px;
color: white;
background: rgba(0, 0, 0, 0.75);
padding: 16px;
padding-top: 24px;
}
.usl-CurrentMedia-title {
margin: 0px;
font-size: 150%;
}
.usl-CurrentMedia-artist {
margin: 0px;
}
.usl-ServerThumbnail {
width: 360px;
margin: 0px 20px 20px 20px;
position: relative;
}
.usl-ServerThumbnail-header {
display: flex;
justify-content: space-between;
}
.usl-ServerThumbnail-link {
text-decoration: none;
}
.usl-ServerThumbnail-nobodyPlaying {
background: black;
color: white;
text-decoration: none;
}
.usl-ServerThumbnail-actions {
justify-content: end;
}
.usl-ServerList {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}