mirror of https://github.com/FreeTubeApp/FreeTube
65 lines
1019 B
SCSS
65 lines
1019 B
SCSS
.card {
|
|
margin-block: 0 60px;
|
|
margin-inline: auto;
|
|
inline-size: 85%;
|
|
|
|
@media only screen and (max-width: 680px) {
|
|
inline-size: 90%;
|
|
}
|
|
}
|
|
|
|
.brand {
|
|
text-align: center;
|
|
}
|
|
|
|
.logo {
|
|
max-inline-size: 100%;
|
|
inline-size: 500px;
|
|
}
|
|
|
|
.version {
|
|
text-align: center;
|
|
font-size: 2em;
|
|
}
|
|
|
|
.about-chunks {
|
|
display: grid;
|
|
grid-gap: 16px;
|
|
grid-template-columns: 1fr 1fr;
|
|
margin-block: 80;
|
|
margin-inline: auto;
|
|
max-inline-size: 860px;
|
|
|
|
@media only screen and (max-width: 650px) {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
}
|
|
|
|
.chunk {
|
|
align-items: start;
|
|
background-color: var(--bg-color);
|
|
border-radius: 8px;
|
|
box-shadow: 0 1px 4px -1px rgb(0 0 0 / 50%);
|
|
display: grid;
|
|
grid-gap: 6px 14px;
|
|
grid-template: 'icon title' auto 'icon content' 1fr / auto 1fr;
|
|
justify-content: start;
|
|
margin: 0;
|
|
padding: 18px;
|
|
word-break: break-word;
|
|
|
|
@each $area in icon title content {
|
|
.#{$area} {
|
|
grid-area: $area;
|
|
}
|
|
}
|
|
|
|
.icon {
|
|
font-size: 24px;
|
|
}
|
|
|
|
.title {
|
|
margin: 0;
|
|
}
|
|
}
|