mirror of
https://git.kescher.at/CatCatNya/catstodon.git
synced 2024-11-30 09:49:03 +01:00
[Glitch] Fix dismiss button overlapping with text in dismissable banners
Port 2a4fcc51fd
to glitch-soc
Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
parent
dfc05ec8df
commit
d3f14dd7d4
3 changed files with 10 additions and 5 deletions
|
@ -33,8 +33,6 @@ export const DismissableBanner: React.FC<PropsWithChildren<Props>> = ({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className='dismissable-banner'>
|
<div className='dismissable-banner'>
|
||||||
<div className='dismissable-banner__message'>{children}</div>
|
|
||||||
|
|
||||||
<div className='dismissable-banner__action'>
|
<div className='dismissable-banner__action'>
|
||||||
<IconButton
|
<IconButton
|
||||||
icon='times'
|
icon='times'
|
||||||
|
@ -42,6 +40,8 @@ export const DismissableBanner: React.FC<PropsWithChildren<Props>> = ({
|
||||||
onClick={handleDismiss}
|
onClick={handleDismiss}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div className='dismissable-banner__message'>{children}</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -1044,9 +1044,7 @@ $ui-header-height: 55px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__action {
|
&__action {
|
||||||
position: absolute;
|
float: right;
|
||||||
inset-inline-end: 0;
|
|
||||||
top: 0;
|
|
||||||
padding: 15px 10px;
|
padding: 15px 10px;
|
||||||
|
|
||||||
.icon-button {
|
.icon-button {
|
||||||
|
|
|
@ -113,4 +113,11 @@ body.rtl {
|
||||||
.fa-chevron-right::before {
|
.fa-chevron-right::before {
|
||||||
content: '\F053';
|
content: '\F053';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dismissable-banner,
|
||||||
|
.warning-banner {
|
||||||
|
&__action {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue