Cleanup ad container css
- Non hardcoded way to reserve space. - Replace hardcoded margin.
This commit is contained in:
parent
f979f9b575
commit
1b0b9cad94
2 changed files with 3 additions and 8 deletions
|
@ -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;
|
||||||
|
|
|
@ -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', {
|
||||||
|
|
Loading…
Reference in a new issue