ekzyis
/
stacker.news
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix alert close styling and zap popover styling

This commit is contained in:
keyan 2023-08-25 19:03:02 -05:00
parent 46f235d60c
commit 3e4c189a1d
2 changed files with 14 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/upvote.js
View File

@ -34,9 +34,9 @@ const UpvotePopover = ({ target, show, handleClose }) => {
placement='right' placement='right'
> >
<Popover id='popover-basic'> <Popover id='popover-basic'>
<Popover.Body className='d-flex justify-content-between alert-dismissible' as='h3'>Zapping <Popover.Header className='d-flex justify-content-between alert-dismissible' as='h4'>Zapping
<button type='button' className='close' onClick={handleClose}><span aria-hidden='true'>×</span><span className='visually-hidden-focusable'>Close alert</span></button> <button type='button' className='btn-close' onClick={handleClose}><span className='visually-hidden-focusable'>Close alert</span></button>
</Popover.Body> </Popover.Header>
<Popover.Body> <Popover.Body>
<div className='mb-2'>Press the bolt again to zap {me?.tipDefault || 1} more sat{me?.tipDefault > 1 ? 's' : ''}.</div> <div className='mb-2'>Press the bolt again to zap {me?.tipDefault || 1} more sat{me?.tipDefault > 1 ? 's' : ''}.</div>
<div>Repeatedly press the bolt to zap more sats.</div> <div>Repeatedly press the bolt to zap more sats.</div>
@ -53,9 +53,9 @@ const TipPopover = ({ target, show, handleClose }) => (
placement='right' placement='right'
> >
<Popover id='popover-basic'> <Popover id='popover-basic'>
<Popover.Body className='d-flex justify-content-between alert-dismissible' as='h3'>Press and hold <Popover.Header className='d-flex justify-content-between alert-dismissible' as='h4'>Press and hold
<button type='button' className='close' onClick={handleClose}><span aria-hidden='true'>×</span><span className='visually-hidden-focusable'>Close alert</span></button> <button type='button' className='btn-close' onClick={handleClose}><span className='visually-hidden-focusable'>Close alert</span></button>
</Popover.Body> </Popover.Header>
<Popover.Body> <Popover.Body>
<div className='mb-2'>Press and hold bolt to zap a custom amount.</div> <div className='mb-2'>Press and hold bolt to zap a custom amount.</div>
<div>As you zap more, the bolt color follows the rainbow.</div> <div>As you zap more, the bolt color follows the rainbow.</div>

13
styles/globals.scss
View File

@ -91,6 +91,7 @@ $popover-max-width: 320px !default;
$popover-border-color: var(--theme-borderColor); $popover-border-color: var(--theme-borderColor);
$grid-gutter-width: 2rem; $grid-gutter-width: 2rem;
$toast-spacing: .5rem; $toast-spacing: .5rem;
$btn-close-bg: none;
:root, [data-bs-theme=light] { :root, [data-bs-theme=light] {
--theme-navLink: rgba(0, 0, 0, 0.55); --theme-navLink: rgba(0, 0, 0, 0.55);
@ -200,7 +201,7 @@ $toast-spacing: .5rem;
margin-left: auto; margin-left: auto;
padding-right: 1.5rem; padding-right: 1.5rem;
font-family: "lightning"; font-family: "lightning";
font-size: 150%; font-size: 160%;
line-height: 1rem; line-height: 1rem;
} }
@ -517,12 +518,14 @@ div[contenteditable] {
font-weight: bold; font-weight: bold;
} }
.alert-dismissible .close { .alert-dismissible .btn-close {
font-weight: 300; font-weight: 300;
font-family: 'lightning'; font-family: "lightning";
font-size: 150%;
line-height: 1;
} }
.popover-header.alert-dismissible .close { .popover-header.alert-dismissible .btn-close {
padding: .5rem !important; padding: .5rem !important;
} }
@ -541,7 +544,7 @@ div[contenteditable] {
} }
.alert-dismissible .close::after { .alert-dismissible .btn-close::after {
content: 'X'; content: 'X';
} }