mirror of
https://github.com/Unleash/unleash.git
synced 2024-12-22 19:07:54 +01:00
docs: use grid for videos in smaller formats.
This commit is contained in:
parent
132cba741c
commit
2a6504e581
@ -76,42 +76,46 @@ html[data-theme='dark'] .header-github-link:before {
|
||||
/* } */
|
||||
/* } */
|
||||
|
||||
|
||||
.unleash-video-container {
|
||||
display: grid;
|
||||
--gap: .5em;
|
||||
--gap: 0.5em;
|
||||
--border-radius: var(--ifm-alert-border-radius);
|
||||
gap: var(--gap);
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 450px) {
|
||||
.unleash-video-container {
|
||||
grid-template-columns: 1fr min(250px, 25%);
|
||||
}
|
||||
}
|
||||
|
||||
.unleash-video-container p {
|
||||
background: var(--ifm-color-success-contrast-background);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.unleash-video-container > .videos {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.unleash-video-container > .videos {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
|
||||
gap: var(--gap);
|
||||
}
|
||||
|
||||
.unleash-video-container .video-wrapper {
|
||||
padding: .5rem;
|
||||
.unleash-video-container .video-wrapper {
|
||||
padding: 0.5rem;
|
||||
border-radius: var(--border-radius);
|
||||
background: var(--ifm-color-info-contrast-background);
|
||||
}
|
||||
|
||||
.unleash-video-container iframe {
|
||||
.unleash-video-container iframe {
|
||||
aspect-ratio: 16/9;
|
||||
}
|
||||
|
||||
.unleash-video-container > .admonition {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 450px) {
|
||||
.unleash-video-container {
|
||||
grid-template-columns: 1fr min(250px, 25%);
|
||||
}
|
||||
.unleash-video-container > .videos {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--gap);
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user