Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-09-15 17:50:48 +02:00
Code Issues Projects Releases Wiki Activity

docs: remove unnecessary wrapping divs.

Browse Source
This commit is contained in:
Thomas Heartman 2022-01-26 13:12:22 +01:00
parent a853de45ce
commit 2c318546b6
2 changed files with 32 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
website/docs/how-to/VideoThing.jsx
View File

@ -3,37 +3,33 @@ import Admonition from '@theme/Admonition';
const Component = ({ videoUrls, children }) => { const Component = ({ videoUrls, children }) => {
return ( return (
<article className="unleash-video-wrapper"> <article className="unleash-video-container">
<div className="unleash-video-container"> <Admonition type="tip" title="Video content">
<Admonition type="tip" title="Video content"> {children}
{children} Hey! Did you know that the content in this guide is also
Hey! Did you know that the content in this guide is also available in video format? If that's more your speed, feel free
available in video format? If that's more your speed, feel to check out one of these related videos 🍿📽
free to check out one of these related videos 🍿📽 </Admonition>
</Admonition>
<div className="videos"> <div className="videos">
{videoUrls ? ( {videoUrls ? (
videoUrls.map((url) => ( videoUrls.map((url) => (
<div className="video-wrapper"> <iframe
<iframe key={url}
key={url} width="100%"
width="100%" height="auto"
height="auto" src={url}
src={url} title="YouTube video player"
title="YouTube video player" frameBorder="0"
frameBorder="0" allowFullScreen
allowFullScreen ></iframe>
></iframe> ))
</div> ) : (
)) <Admonition type="danger">
) : ( You need to provide YouTube video URLs for this
<Admonition type="danger"> component to work properly.
You need to provide YouTube video URLs for this </Admonition>
component to work properly. )}
</Admonition>
)}
</div>
</div> </div>
</article> </article>
); );

11
website/src/css/custom.css
View File

@ -67,6 +67,8 @@ html[data-theme='dark'] .header-github-link:before {
no-repeat; no-repeat;
} }
/* Video content container */
.unleash-video-container { .unleash-video-container {
display: grid; display: grid;
--gap: 0.5em; --gap: 0.5em;
@ -86,10 +88,6 @@ html[data-theme='dark'] .header-github-link:before {
gap: var(--gap); gap: var(--gap);
} }
.video-wrapper {
display: flex;
}
.unleash-video-container > .admonition { .unleash-video-container > .admonition {
box-shadow: none; box-shadow: none;
background-color: var(--unleash-color-admonition-background); background-color: var(--unleash-color-admonition-background);
@ -107,7 +105,10 @@ html[data-theme='dark'] .header-github-link:before {
grid-template-columns: 1fr min(250px, 25%); grid-template-columns: 1fr min(250px, 25%);
} }
.unleash-video-container > .videos { .unleash-video-container > .videos {
grid-template-columns: 1fr; display: flex;
flex-direction: column;
gap: var(--gap); gap: var(--gap);
} }
} }
/* end video content container */