diff --git a/src/components/Note/Note.module.scss b/src/components/Note/Note.module.scss index 6bd8c55..5a05a14 100644 --- a/src/components/Note/Note.module.scss +++ b/src/components/Note/Note.module.scss @@ -71,7 +71,7 @@ .message { color: var(--text-primary); word-break: break-word; - font-size: 15px; + font-size: 16px; font-weight: 400px; line-height: 20px; margin-top: 4px; diff --git a/src/components/Note/NoteHeader/NoteHeader.module.scss b/src/components/Note/NoteHeader/NoteHeader.module.scss index 0bdd850..4bef44e 100644 --- a/src/components/Note/NoteHeader/NoteHeader.module.scss +++ b/src/components/Note/NoteHeader/NoteHeader.module.scss @@ -57,6 +57,10 @@ max-width: 460px; color: var(--text-primary); margin-right: 2px; + + &.primary { + font-weight: 700; + } } .time{ margin: 0px; diff --git a/src/components/Note/NoteHeader/NoteHeader.tsx b/src/components/Note/NoteHeader/NoteHeader.tsx index 9830be4..e6d4e72 100644 --- a/src/components/Note/NoteHeader/NoteHeader.tsx +++ b/src/components/Note/NoteHeader/NoteHeader.tsx @@ -2,7 +2,7 @@ import { Component, createEffect, createSignal, Show } from 'solid-js'; import { MenuItem, NostrRelaySignedEvent, PrimalNote } from '../../../types/primal'; import styles from './NoteHeader.module.scss'; -import { date } from '../../../lib/dates'; +import { date, longDate, shortDate } from '../../../lib/dates'; import { nip05Verification, truncateNpub, userName } from '../../../stores/profile'; import { useIntl } from '@cookbook/solid-intl'; import { useToastContext } from '../../Toaster/Toaster'; @@ -20,7 +20,12 @@ import ConfirmModal from '../../ConfirmModal/ConfirmModal'; import { hexToNpub } from '../../../lib/keys'; import { hookForDev } from '../../../lib/devTools'; -const NoteHeader: Component<{ note: PrimalNote, openCustomZap?: () => void, id?: string }> = (props) => { +const NoteHeader: Component<{ + note: PrimalNote, + openCustomZap?: () => void, + id?: string, + primary?: boolean, +}> = (props) => { const intl = useIntl(); const toaster = useToastContext(); @@ -211,7 +216,7 @@ const NoteHeader: Component<{ note: PrimalNote, openCustomZap?: () => void, id?:
- + {authorName()} @@ -224,7 +229,9 @@ const NoteHeader: Component<{ note: PrimalNote, openCustomZap?: () => void, id?: class={styles.time} title={date(props.note.post?.created_at).date.toLocaleString()} > - {date(props.note.post?.created_at).label} + {props.primary ? + longDate(props.note.post?.created_at) : + date(props.note.post?.created_at).label}
= (props) => { data-event-bech32={props.note.post.noteId} >
- +
diff --git a/src/index.scss b/src/index.scss index 92a205e..036188f 100644 --- a/src/index.scss +++ b/src/index.scss @@ -191,6 +191,11 @@ a { overflow: hidden !important; } +.noteimage { + margin-block: 12px !important; + display: block !important; +} + .imageGrid { margin-block: 12px !important; display: grid; diff --git a/src/lib/dates.ts b/src/lib/dates.ts index 5cc9ee9..80eb0c0 100644 --- a/src/lib/dates.ts +++ b/src/lib/dates.ts @@ -8,6 +8,16 @@ export const shortDate = (timestamp: number | undefined) => { return dtf.format(date); }; +export const longDate = (timestamp: number | undefined) => { + if (!timestamp || timestamp < 0) { + return ''; + } + const date = new Date(timestamp * 1000); + const dtf = new Intl.DateTimeFormat('en-US', { dateStyle: 'full', timeStyle: 'short'}); + + return dtf.format(date); +}; + export const date = (postTimestamp: number, style: Intl.RelativeTimeFormatStyle = 'short', since?: number) => { const today = since ?? Math.floor((new Date()).getTime() / 1000); const date = new Date(postTimestamp * 1000);