update overal typography
This commit is contained in:
@@ -54,7 +54,7 @@ export function AvatarUploader({ valueState }: { valueState: any }) {
|
||||
<button
|
||||
onClick={() => openFileDialog()}
|
||||
type="button"
|
||||
className="inline-flex h-6 items-center justify-center rounded bg-zinc-900 px-3 text-xs font-medium text-zinc-200 ring-1 ring-zinc-800 hover:bg-zinc-700"
|
||||
className="inline-flex h-6 items-center justify-center rounded bg-zinc-900 px-3 text-base font-medium text-white ring-1 ring-zinc-800 hover:bg-zinc-700"
|
||||
>
|
||||
{loading ? (
|
||||
<svg
|
||||
|
||||
@@ -33,7 +33,7 @@ export function ComposerModal() {
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => openModal()}
|
||||
className="inline-flex h-7 w-max items-center justify-center gap-1 rounded-md bg-fuchsia-500 px-2.5 text-xs font-medium text-zinc-200 shadow-button hover:bg-fuchsia-600 focus:outline-none"
|
||||
className="inline-flex h-8 w-max items-center justify-center gap-1 rounded-md bg-fuchsia-500 px-2.5 text-sm font-medium text-white shadow-button hover:bg-fuchsia-600 focus:outline-none"
|
||||
>
|
||||
<ComposeIcon width={14} height={14} />
|
||||
Compose
|
||||
@@ -76,7 +76,7 @@ export function ComposerModal() {
|
||||
className="text-zinc-500"
|
||||
/>
|
||||
</span>
|
||||
<div className="inline-flex h-6 w-max items-center justify-center gap-0.5 rounded bg-zinc-800 pl-3 pr-1.5 text-xs font-medium text-zinc-400 shadow-mini-button">
|
||||
<div className="inline-flex h-6 w-max items-center justify-center gap-0.5 rounded bg-zinc-800 pl-3 pr-1.5 text-base font-medium text-zinc-400 shadow-mini-button">
|
||||
New Post
|
||||
<ChevronDownIcon width={14} height={14} />
|
||||
</div>
|
||||
|
||||
@@ -48,9 +48,9 @@ const ImagePreview = ({
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => Transforms.removeNodes(editor, { at: path })}
|
||||
className="absolute right-2 top-2 inline-flex h-7 w-7 items-center justify-center gap-0.5 rounded bg-zinc-800 text-xs font-medium text-zinc-400 shadow-mini-button hover:bg-zinc-700"
|
||||
className="absolute right-2 top-2 inline-flex h-7 w-7 items-center justify-center gap-0.5 rounded bg-zinc-800 text-base font-medium text-zinc-400 shadow-mini-button hover:bg-zinc-700"
|
||||
>
|
||||
<TrashIcon width={14} height={14} className="text-zinc-100" />
|
||||
<TrashIcon width={14} height={14} className="text-white" />
|
||||
</button>
|
||||
</div>
|
||||
</figure>
|
||||
@@ -130,7 +130,7 @@ export function Post({ pubkey, privkey }: { pubkey: string; privkey: string }) {
|
||||
<button
|
||||
type="button"
|
||||
onClick={submit}
|
||||
className="inline-flex h-7 w-max items-center justify-center gap-1 rounded-md bg-fuchsia-500 px-3.5 text-xs font-medium text-zinc-200 shadow-button hover:bg-fuchsia-600"
|
||||
className="inline-flex h-7 w-max items-center justify-center gap-1 rounded-md bg-fuchsia-500 px-3.5 text-base font-medium text-white shadow-button hover:bg-fuchsia-600"
|
||||
>
|
||||
Post
|
||||
</button>
|
||||
|
||||
@@ -17,7 +17,7 @@ export function User({ data }: { data: any }) {
|
||||
loading="auto"
|
||||
/>
|
||||
</div>
|
||||
<h5 className="text-sm font-semibold leading-none text-zinc-100">
|
||||
<h5 className="text-base font-semibold leading-none text-white">
|
||||
{metadata?.display_name || metadata?.name || (
|
||||
<div className="h-3 w-20 animate-pulse rounded-sm bg-zinc-700" />
|
||||
)}
|
||||
|
||||
@@ -136,7 +136,7 @@ export default function EventCollector() {
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="inline-flex h-6 w-6 items-center justify-center rounded text-zinc-400 hover:bg-zinc-900 hover:text-zinc-200">
|
||||
<div className="inline-flex h-6 w-6 items-center justify-center rounded text-zinc-400 hover:bg-zinc-900 hover:text-white">
|
||||
<HeartBeatIcon width={14} height={14} />
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -8,7 +8,6 @@ export function Image(props) {
|
||||
return (
|
||||
<img
|
||||
{...props}
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
onError={addImageFallback}
|
||||
alt="lume default img"
|
||||
|
||||
@@ -36,7 +36,7 @@ export default function MultiAccounts() {
|
||||
<BellIcon
|
||||
width={16}
|
||||
height={16}
|
||||
className="text-zinc-400 group-hover:text-zinc-200"
|
||||
className="text-zinc-400 group-hover:text-white"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
@@ -61,16 +61,16 @@ export default function MultiAccounts() {
|
||||
<PlusIcon
|
||||
width={16}
|
||||
height={16}
|
||||
className="text-zinc-400 group-hover:text-zinc-200"
|
||||
className="text-zinc-400 group-hover:text-white"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col gap-0.5 text-center">
|
||||
<span className="text-sm font-black uppercase leading-tight text-zinc-600">
|
||||
<span className="text-base font-black uppercase leading-tight text-zinc-600">
|
||||
Lume
|
||||
</span>
|
||||
<span className="text-xs font-medium text-zinc-700">
|
||||
<span className="text-base font-medium text-zinc-700">
|
||||
v{APP_VERSION}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -29,23 +29,23 @@ export default function Navigation() {
|
||||
<div className="flex flex-col text-zinc-400">
|
||||
<ActiveLink
|
||||
href="/app/space"
|
||||
className="flex h-8 items-center gap-2.5 rounded-md px-2.5 text-[13px] font-semibold hover:text-zinc-200"
|
||||
className="flex h-8 items-center gap-2.5 rounded-md px-2.5 hover:text-white"
|
||||
activeClassName="bg-zinc-900/50 hover:bg-zinc-900"
|
||||
>
|
||||
<span className="inline-flex h-5 w-5 items-center justify-center rounded bg-zinc-900">
|
||||
<WorldIcon width={12} height={12} className="text-zinc-200" />
|
||||
<WorldIcon width={12} height={12} className="text-white" />
|
||||
</span>
|
||||
<span>Space</span>
|
||||
<span className="font-medium">Space</span>
|
||||
</ActiveLink>
|
||||
<ActiveLink
|
||||
href="/app/threads"
|
||||
className="flex h-8 items-center gap-2.5 rounded-md px-2.5 text-[13px] font-semibold hover:text-zinc-200"
|
||||
className="flex h-8 items-center gap-2.5 rounded-md px-2.5 hover:text-white"
|
||||
activeClassName=""
|
||||
>
|
||||
<span className="inline-flex h-5 w-5 items-center justify-center rounded bg-zinc-900">
|
||||
<ThreadsIcon width={12} height={12} className="text-zinc-200" />
|
||||
<ThreadsIcon width={12} height={12} className="text-white" />
|
||||
</span>
|
||||
<span>Threads</span>
|
||||
<span className="font-medium">Threads</span>
|
||||
</ActiveLink>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -17,7 +17,7 @@ export function NetworkStatusIndicator() {
|
||||
}`}
|
||||
/>
|
||||
</div>
|
||||
<p className="text-xs font-medium text-zinc-500">
|
||||
<p className="text-base font-medium text-zinc-500">
|
||||
{isOnline ? "Online" : "Offline"}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -44,10 +44,10 @@ export default function ProfileMetadata({ id }: { id: string }) {
|
||||
<div className="-mt-4 mb-8 px-4">
|
||||
<div>
|
||||
<div className="mb-3 flex flex-col">
|
||||
<h3 className="text-lg font-semibold leading-tight text-zinc-100">
|
||||
<h3 className="text-lg font-semibold leading-tight text-white">
|
||||
{profile?.display_name || profile?.name}
|
||||
</h3>
|
||||
<span className="text-sm leading-tight text-zinc-500">
|
||||
<span className="text-base leading-tight text-zinc-500">
|
||||
{profile?.username || (id && shortenKey(id))}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -42,7 +42,7 @@ export function Tooltip({
|
||||
{isOpen && (
|
||||
<div
|
||||
ref={refs.setFloating}
|
||||
className="w-max select-none rounded-md bg-zinc-800 px-4 py-2 text-xs font-medium leading-none text-zinc-100"
|
||||
className="w-max select-none rounded-md bg-zinc-800 px-4 py-2 text-base font-medium leading-none text-white"
|
||||
style={{
|
||||
position: strategy,
|
||||
top: y ?? 0,
|
||||
|
||||
Reference in New Issue
Block a user