Cleanup ad container css

- Non hardcoded way to reserve space.
- Replace hardcoded margin.
This commit is contained in:
infinite-persistence 2022-03-07 14:56:56 +08:00 committed by Thomas Zarebczan
parent f979f9b575
commit 1b0b9cad94
2 changed files with 3 additions and 8 deletions

View file

@ -26,11 +26,6 @@
flex-wrap: wrap; flex-wrap: wrap;
width: 100%; width: 100%;
.ad__container {
width: 314px;
height: 201px;
}
> div, > div,
ins { ins {
width: 100%; width: 100%;
@ -39,7 +34,7 @@
min-width: 15rem; min-width: 15rem;
} }
.ads__injected-video { .ad__container {
aspect-ratio: 16 / 9; aspect-ratio: 16 / 9;
} }
@ -57,7 +52,7 @@
} }
.ads__claim-text { .ads__claim-text {
margin-top: 5px; margin-top: var(--spacing-m);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;

View file

@ -120,7 +120,7 @@ function Ads(props: Props) {
const videoAd = ( const videoAd = (
<div className="ads__claim-item"> <div className="ads__claim-item">
<div className="ad__container"> <div className="ad__container">
<div id={adConfig.tag} className="ads__injected-video" style={{ display: 'none' }} /> <div id={adConfig.tag} style={{ display: 'none' }} />
</div> </div>
<div <div
className={classnames('ads__claim-text', { className={classnames('ads__claim-text', {