multistream-magic / style.css
maqzek's picture
I want you to make a copy of https://rgg.land/live it's a multi-stream site for viewing twitch streams, but it is made for specific event, without an ability to change streamers. I just want to be able to change streamers, number of 'windows' and that's basically it. Do not add any pictures or additional info, minimalistic is how I like it.
1ec46cb verified
/* Custom scrollbar */
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: #1a1a1a;
}
::-webkit-scrollbar-thumb {
background: #4b5563;
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: #6b7280;
}
/* Stream iframe styling */
.stream-iframe {
aspect-ratio: 16/9;
width: 100%;
border: none;
border-radius: 8px;
background-color: #111827;
}
/* Layout classes */
.layout-1 {
grid-template-columns: 1fr !important;
}
.layout-2 {
grid-template-columns: repeat(2, 1fr) !important;
}
.layout-3 {
grid-template-columns: repeat(3, 1fr) !important;
}
.layout-4 {
grid-template-columns: repeat(4, 1fr) !important;
}
.layout-6 {
grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 1024px) {
.layout-6 {
grid-template-columns: repeat(6, 1fr) !important;
}
}
.layout-9 {
grid-template-columns: repeat(3, 1fr) !important;
}
@media (min-width: 1024px) {
.layout-9 {
grid-template-columns: repeat(9, 1fr) !important;
}
}