forked from Kieran/snort
note reaction adjustments
This commit is contained in:
parent
a27730c3d3
commit
52ddac5ef5
@ -40,6 +40,18 @@
|
||||
padding-left: 46px;
|
||||
}
|
||||
|
||||
.note .footer .footer-reactions {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
@media (min-width: 720px) {
|
||||
.note .footer .footer-reactions {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.note>.footer .ctx-menu {
|
||||
background-color: var(--note-bg);
|
||||
color: var(--font-secondary-color);
|
||||
|
@ -186,23 +186,24 @@ export default function NoteFooter(props: NoteFooterProps) {
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="footer">
|
||||
<Menu menuButton={<div className="reaction-pill">
|
||||
<div className="reaction-pill-icon">
|
||||
<Dots />
|
||||
</div>
|
||||
</div>} menuClassName="ctx-menu">
|
||||
{menuItems()}
|
||||
</Menu>
|
||||
<div className="footer">
|
||||
<div className="footer-reactions">
|
||||
{tipButton()}
|
||||
{reactionIcons()}
|
||||
<div className={`reaction-pill ${reply ? 'reacted' : ''}`} onClick={(e) => setReply(s => !s)}>
|
||||
<div className="reaction-pill-icon">
|
||||
<Reply />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{reactionIcons()}
|
||||
{tipButton()}
|
||||
<Menu menuButton={<div className="reaction-pill">
|
||||
<div className="reaction-pill-icon">
|
||||
<Dots />
|
||||
</div>
|
||||
</div>}
|
||||
menuClassName="ctx-menu"
|
||||
>
|
||||
{menuItems()}
|
||||
</Menu>
|
||||
</div>
|
||||
<NoteCreator
|
||||
autoFocus={true}
|
||||
@ -212,6 +213,6 @@ export default function NoteFooter(props: NoteFooterProps) {
|
||||
setShow={setReply}
|
||||
/>
|
||||
<LNURLTip svc={author?.lud16 || author?.lud06} onClose={() => setTip(false)} show={tip} />
|
||||
</>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
@ -1,5 +1,4 @@
|
||||
.reaction {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.reaction > .note {
|
||||
|
@ -106,8 +106,7 @@ html.light .card {
|
||||
|
||||
.card>.footer {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
margin-top: 12px;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
button {
|
||||
|
Loading…
Reference in New Issue
Block a user