Review tweaks
This commit is contained in:
parent
e4b317f634
commit
b2f1818994
@ -32,6 +32,16 @@
|
||||
color: var(--font-secondary-color);
|
||||
border: 1px solid var(--font-secondary-color);
|
||||
border-radius: 16px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.note>.footer .ctx-menu li {
|
||||
display: grid;
|
||||
grid-template-columns: 2rem auto;
|
||||
}
|
||||
|
||||
.ctx-menu .red {
|
||||
color: var(--error);
|
||||
}
|
||||
|
||||
.note>.header img:hover, .note>.header .name>.reply:hover, .note .body:hover {
|
||||
@ -40,6 +50,7 @@
|
||||
|
||||
.note>.note-creator {
|
||||
margin-top: 12px;
|
||||
margin-left: 56px;
|
||||
}
|
||||
|
||||
@media (min-width: 720px) {
|
||||
|
@ -1,6 +1,6 @@
|
||||
import { useMemo, useState } from "react";
|
||||
import { useSelector } from "react-redux";
|
||||
import { faHeart, faReply, faThumbsDown, faTrash, faBolt, faRepeat, faEllipsisVertical, faShareNodes } from "@fortawesome/free-solid-svg-icons";
|
||||
import { faHeart, faReply, faThumbsDown, faTrash, faBolt, faRepeat, faEllipsisVertical, faShareNodes, faCopy } from "@fortawesome/free-solid-svg-icons";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { Menu, MenuItem } from '@szhsin/react-menu';
|
||||
|
||||
@ -126,7 +126,7 @@ export default function NoteFooter(props: NoteFooterProps) {
|
||||
}
|
||||
|
||||
async function share() {
|
||||
const url = `${window.location.protocol}//${window.location.host}/e/${hexToBech32("npub", ev.Id)}`;
|
||||
const url = `${window.location.protocol}//${window.location.host}/e/${hexToBech32("note", ev.Id)}`;
|
||||
if ("share" in window.navigator) {
|
||||
await window.navigator.share({
|
||||
title: "Snort",
|
||||
@ -137,40 +137,40 @@ export default function NoteFooter(props: NoteFooterProps) {
|
||||
}
|
||||
}
|
||||
|
||||
async function copyId() {
|
||||
await navigator.clipboard.writeText(hexToBech32("note", ev.Id));
|
||||
}
|
||||
|
||||
function menuItems() {
|
||||
return (
|
||||
<>
|
||||
<MenuItem onClick={() => react("-")}>
|
||||
<div className={`reaction-pill ${hasReacted('-') ? 'reacted' : ''}`}>
|
||||
<div className="reaction-pill-icon">
|
||||
<FontAwesomeIcon icon={faThumbsDown} />
|
||||
</div>
|
||||
<div className="reaction-pill-number">
|
||||
{formatShort(groupReactions[Reaction.Negative])}
|
||||
</div>
|
||||
<div>
|
||||
<FontAwesomeIcon icon={faThumbsDown} className={hasReacted('-') ? 'reacted' : ''} />
|
||||
|
||||
{formatShort(groupReactions[Reaction.Negative])}
|
||||
</div>
|
||||
Dislike
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => share()}>
|
||||
<div className="reaction-pill mr-auto">
|
||||
<div className="reaction-pill-icon">
|
||||
<FontAwesomeIcon icon={faShareNodes} />
|
||||
</div>
|
||||
</div>
|
||||
<FontAwesomeIcon icon={faShareNodes} />
|
||||
Share
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => copyId()}>
|
||||
<FontAwesomeIcon icon={faCopy} />
|
||||
Copy ID
|
||||
</MenuItem>
|
||||
|
||||
{isMine && (
|
||||
<MenuItem onClick={() => deleteEvent()}>
|
||||
<div className="reaction-pill trash-icon">
|
||||
<FontAwesomeIcon icon={faTrash} />
|
||||
</div>
|
||||
<FontAwesomeIcon icon={faTrash} className="red" />
|
||||
Delete
|
||||
</MenuItem>
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="footer">
|
||||
|
Loading…
Reference in New Issue
Block a user