Video article style fixes

This commit is contained in:
kvakazyambra 2023-05-15 23:07:04 +03:00
parent 96baa8883e
commit 68eb7833e7
3 changed files with 16 additions and 3 deletions

View File

@ -150,7 +150,7 @@ export const FullArticle = (props: ArticleProps) => {
)} )}
</For> </For>
</div> </div>
<Show when={props.article.cover}> <Show when={props.article.cover && props.article.layout !== 'video'}>
<div <div
class={styles.shoutCover} class={styles.shoutCover}
style={{ 'background-image': `url('${imageProxy(props.article.cover)}')` }} style={{ 'background-image': `url('${imageProxy(props.article.cover)}')` }}

View File

@ -0,0 +1,12 @@
.videoContainer {
aspect-ratio: 16/9;
@include media-breakpoint-up(md) {
margin: 0 0 1em -16.6666%;
}
iframe {
height: 100%;
width: 100%;
}
}

View File

@ -1,7 +1,8 @@
import { Show } from 'solid-js' import { Show } from 'solid-js'
import styles from './VideoPlayer.module.scss'
export default (props: { url: string }) => ( export default (props: { url: string }) => (
<> <div class={styles.videoContainer}>
<Show when={props.url.includes('youtube.com')}> <Show when={props.url.includes('youtube.com')}>
<iframe <iframe
id="ytplayer" id="ytplayer"
@ -20,5 +21,5 @@ export default (props: { url: string }) => (
allowfullscreen allowfullscreen
/> />
</Show> </Show>
</> </div>
) )