mirror of
https://github.com/luminous-devs/lume.git
synced 2024-10-02 18:00:47 +00:00
improve spacing
This commit is contained in:
parent
1c3119577f
commit
5c48ebe103
40
package.json
40
package.json
@ -21,7 +21,7 @@
|
|||||||
"@evilmartians/harmony": "^1.1.0",
|
"@evilmartians/harmony": "^1.1.0",
|
||||||
"@getalby/sdk": "^2.5.0",
|
"@getalby/sdk": "^2.5.0",
|
||||||
"@nostr-dev-kit/ndk": "^2.0.5",
|
"@nostr-dev-kit/ndk": "^2.0.5",
|
||||||
"@nostr-dev-kit/ndk-cache-dexie": "^2.0.3",
|
"@nostr-dev-kit/ndk-cache-dexie": "^2.0.5",
|
||||||
"@nostr-fetch/adapter-ndk": "^0.13.1",
|
"@nostr-fetch/adapter-ndk": "^0.13.1",
|
||||||
"@radix-ui/react-alert-dialog": "^1.0.5",
|
"@radix-ui/react-alert-dialog": "^1.0.5",
|
||||||
"@radix-ui/react-avatar": "^1.0.4",
|
"@radix-ui/react-avatar": "^1.0.4",
|
||||||
@ -32,9 +32,9 @@
|
|||||||
"@radix-ui/react-popover": "^1.0.7",
|
"@radix-ui/react-popover": "^1.0.7",
|
||||||
"@radix-ui/react-toolbar": "^1.0.4",
|
"@radix-ui/react-toolbar": "^1.0.4",
|
||||||
"@radix-ui/react-tooltip": "^1.0.7",
|
"@radix-ui/react-tooltip": "^1.0.7",
|
||||||
"@tanstack/query-sync-storage-persister": "^5.4.3",
|
"@tanstack/query-sync-storage-persister": "^5.8.1",
|
||||||
"@tanstack/react-query": "^5.7.0",
|
"@tanstack/react-query": "^5.8.1",
|
||||||
"@tanstack/react-query-persist-client": "^5.7.0",
|
"@tanstack/react-query-persist-client": "^5.8.1",
|
||||||
"@tauri-apps/api": "2.0.0-alpha.11",
|
"@tauri-apps/api": "2.0.0-alpha.11",
|
||||||
"@tauri-apps/cli": "2.0.0-alpha.17",
|
"@tauri-apps/cli": "2.0.0-alpha.17",
|
||||||
"@tauri-apps/plugin-clipboard-manager": "2.0.0-alpha.3",
|
"@tauri-apps/plugin-clipboard-manager": "2.0.0-alpha.3",
|
||||||
@ -67,7 +67,7 @@
|
|||||||
"idb-keyval": "^6.2.1",
|
"idb-keyval": "^6.2.1",
|
||||||
"immer": "^10.0.3",
|
"immer": "^10.0.3",
|
||||||
"light-bolt11-decoder": "^3.0.0",
|
"light-bolt11-decoder": "^3.0.0",
|
||||||
"lru-cache": "^10.0.1",
|
"lru-cache": "^10.0.2",
|
||||||
"markdown-to-jsx": "^7.3.2",
|
"markdown-to-jsx": "^7.3.2",
|
||||||
"media-chrome": "^1.5.2",
|
"media-chrome": "^1.5.2",
|
||||||
"minidenticons": "^4.2.0",
|
"minidenticons": "^4.2.0",
|
||||||
@ -76,32 +76,32 @@
|
|||||||
"qrcode.react": "^3.1.0",
|
"qrcode.react": "^3.1.0",
|
||||||
"re-resizable": "^6.9.11",
|
"re-resizable": "^6.9.11",
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-currency-input-field": "^3.6.11",
|
"react-currency-input-field": "^3.6.12",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
"react-hook-form": "^7.48.1",
|
"react-hook-form": "^7.48.2",
|
||||||
"react-hotkeys-hook": "^4.4.1",
|
"react-hotkeys-hook": "^4.4.1",
|
||||||
"react-medium-image-zoom": "^5.1.8",
|
"react-medium-image-zoom": "^5.1.8",
|
||||||
"react-router-dom": "^6.18.0",
|
"react-router-dom": "^6.18.0",
|
||||||
"react-string-replace": "^1.1.1",
|
"react-string-replace": "^1.1.1",
|
||||||
"reactflow": "^11.9.4",
|
"reactflow": "^11.10.1",
|
||||||
"sonner": "^1.1.0",
|
"sonner": "^1.2.0",
|
||||||
"tailwind-scrollbar": "^3.0.5",
|
"tailwind-scrollbar": "^3.0.5",
|
||||||
"tauri-controls": "^0.2.0",
|
"tauri-controls": "^0.2.0",
|
||||||
"tippy.js": "^6.3.7",
|
"tippy.js": "^6.3.7",
|
||||||
"tiptap-markdown": "^0.8.3",
|
"tiptap-markdown": "^0.8.4",
|
||||||
"virtua": "^0.16.1",
|
"virtua": "^0.16.2",
|
||||||
"zustand": "^4.4.6"
|
"zustand": "^4.4.6"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@tailwindcss/typography": "^0.5.10",
|
"@tailwindcss/typography": "^0.5.10",
|
||||||
"@trivago/prettier-plugin-sort-imports": "^4.2.1",
|
"@trivago/prettier-plugin-sort-imports": "^4.3.0",
|
||||||
"@types/html-to-text": "^9.0.3",
|
"@types/html-to-text": "^9.0.4",
|
||||||
"@types/node": "^20.8.10",
|
"@types/node": "^20.9.0",
|
||||||
"@types/react": "^18.2.34",
|
"@types/react": "^18.2.37",
|
||||||
"@types/react-dom": "^18.2.14",
|
"@types/react-dom": "^18.2.15",
|
||||||
"@types/youtube-player": "^5.5.9",
|
"@types/youtube-player": "^5.5.10",
|
||||||
"@typescript-eslint/eslint-plugin": "^6.9.1",
|
"@typescript-eslint/eslint-plugin": "^6.10.0",
|
||||||
"@typescript-eslint/parser": "^6.9.1",
|
"@typescript-eslint/parser": "^6.10.0",
|
||||||
"@vitejs/plugin-react-swc": "^3.4.1",
|
"@vitejs/plugin-react-swc": "^3.4.1",
|
||||||
"autoprefixer": "^10.4.16",
|
"autoprefixer": "^10.4.16",
|
||||||
"clsx": "^2.0.0",
|
"clsx": "^2.0.0",
|
||||||
@ -117,7 +117,7 @@
|
|||||||
"lint-staged": "^15.0.2",
|
"lint-staged": "^15.0.2",
|
||||||
"postcss": "^8.4.31",
|
"postcss": "^8.4.31",
|
||||||
"prettier": "^3.0.3",
|
"prettier": "^3.0.3",
|
||||||
"prettier-plugin-tailwindcss": "^0.5.6",
|
"prettier-plugin-tailwindcss": "^0.5.7",
|
||||||
"prop-types": "^15.8.1",
|
"prop-types": "^15.8.1",
|
||||||
"tailwind-merge": "^1.14.0",
|
"tailwind-merge": "^1.14.0",
|
||||||
"tailwindcss": "^3.3.5",
|
"tailwindcss": "^3.3.5",
|
||||||
|
1272
pnpm-lock.yaml
1272
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
@ -36,17 +36,17 @@ export function HomeScreen() {
|
|||||||
const dbWidgets = await db.getWidgets();
|
const dbWidgets = await db.getWidgets();
|
||||||
const defaultWidgets = [
|
const defaultWidgets = [
|
||||||
{
|
{
|
||||||
id: '99999',
|
id: '9998',
|
||||||
title: 'Newsfeed',
|
|
||||||
content: '',
|
|
||||||
kind: WIDGET_KIND.newsfeed,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: '99998',
|
|
||||||
title: 'Notification',
|
title: 'Notification',
|
||||||
content: '',
|
content: '',
|
||||||
kind: WIDGET_KIND.notification,
|
kind: WIDGET_KIND.notification,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
id: '9999',
|
||||||
|
title: 'Newsfeed',
|
||||||
|
content: '',
|
||||||
|
kind: WIDGET_KIND.newsfeed,
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
return [...defaultWidgets, ...dbWidgets];
|
return [...defaultWidgets, ...dbWidgets];
|
||||||
|
@ -2,14 +2,7 @@ import { Link, NavLink } from 'react-router-dom';
|
|||||||
import { twMerge } from 'tailwind-merge';
|
import { twMerge } from 'tailwind-merge';
|
||||||
|
|
||||||
import { ActiveAccount } from '@shared/accounts/active';
|
import { ActiveAccount } from '@shared/accounts/active';
|
||||||
import {
|
import { ChatsIcon, ComposeIcon, HomeIcon, NwcIcon, RelayIcon } from '@shared/icons';
|
||||||
ChatsIcon,
|
|
||||||
ComposeIcon,
|
|
||||||
ExploreIcon,
|
|
||||||
HomeIcon,
|
|
||||||
NwcIcon,
|
|
||||||
RelayIcon,
|
|
||||||
} from '@shared/icons';
|
|
||||||
|
|
||||||
import { compactNumber } from '@utils/number';
|
import { compactNumber } from '@utils/number';
|
||||||
|
|
||||||
@ -87,29 +80,6 @@ export function Navigation() {
|
|||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</NavLink>
|
</NavLink>
|
||||||
<NavLink
|
|
||||||
to="/explore"
|
|
||||||
preventScrollReset={true}
|
|
||||||
className="inline-flex flex-col items-center justify-center"
|
|
||||||
>
|
|
||||||
{({ isActive }) => (
|
|
||||||
<>
|
|
||||||
<div
|
|
||||||
className={twMerge(
|
|
||||||
'inline-flex aspect-square h-auto w-full items-center justify-center rounded-lg',
|
|
||||||
isActive
|
|
||||||
? 'bg-black/10 text-black dark:bg-white/10 dark:text-white'
|
|
||||||
: 'text-black/50 dark:text-neutral-400'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<ExploreIcon className="h-6 w-6" />
|
|
||||||
</div>
|
|
||||||
<div className="text-sm font-medium text-black dark:text-white">
|
|
||||||
Explore
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</NavLink>
|
|
||||||
</div>
|
</div>
|
||||||
<div className="flex shrink-0 flex-col gap-3 p-1">
|
<div className="flex shrink-0 flex-col gap-3 p-1">
|
||||||
<Link
|
<Link
|
||||||
|
@ -15,7 +15,7 @@ export function TextKind({ content, textmode }: { content: string; textmode?: bo
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={'min-w-0 px-3'}>
|
<div className={'min-w-0 px-3'}>
|
||||||
<div className="break-p select-text whitespace-pre-line leading-normal text-neutral-900 dark:text-neutral-100">
|
<div className="break-p select-text leading-normal text-neutral-900 dark:text-neutral-100">
|
||||||
{parsedContent}
|
{parsedContent}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -18,7 +18,7 @@ export function ImagePreview({ url }: { url: string }) {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Zoom key={url} zoomMargin={50} IconUnzoom={() => <CancelIcon className="h-4 w-4" />}>
|
<Zoom key={url} zoomMargin={50} IconUnzoom={() => <CancelIcon className="h-4 w-4" />}>
|
||||||
<div className="group relative mt-2">
|
<div className="group relative my-2">
|
||||||
<img
|
<img
|
||||||
src={url}
|
src={url}
|
||||||
alt={url}
|
alt={url}
|
||||||
|
@ -43,7 +43,7 @@ export function LinkPreview({ url }: { url: string }) {
|
|||||||
to={url}
|
to={url}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noreferrer"
|
rel="noreferrer"
|
||||||
className="flex w-full flex-col rounded-lg bg-neutral-100 dark:bg-neutral-900"
|
className="my-2 flex w-full flex-col rounded-lg bg-neutral-100 dark:bg-neutral-900"
|
||||||
>
|
>
|
||||||
{isImage(data.image) ? (
|
{isImage(data.image) ? (
|
||||||
<img
|
<img
|
||||||
|
@ -12,7 +12,7 @@ export function VideoPreview({ url }: { url: string }) {
|
|||||||
return (
|
return (
|
||||||
<MediaController
|
<MediaController
|
||||||
key={url}
|
key={url}
|
||||||
className="mt-2 aspect-video w-full overflow-hidden rounded-lg"
|
className="my-2 aspect-video w-full overflow-hidden rounded-lg"
|
||||||
>
|
>
|
||||||
<video slot="media" src={url} preload="metadata" muted />
|
<video slot="media" src={url} preload="metadata" muted />
|
||||||
<MediaLoadingIndicator slot="centered-chrome"></MediaLoadingIndicator>
|
<MediaLoadingIndicator slot="centered-chrome"></MediaLoadingIndicator>
|
||||||
|
@ -51,7 +51,7 @@ export function TitleBar({
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-1 flex justify-end">
|
<div className="col-span-1 flex justify-end">
|
||||||
{id !== '9999' ? (
|
{id !== '9999' && id !== '9998' ? (
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={() => removeWidget.mutate(id)}
|
onClick={() => removeWidget.mutate(id)}
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { ArticleIcon, BellIcon, MediaIcon, PlusIcon } from '@shared/icons';
|
import { ArticleIcon, MediaIcon, PlusIcon } from '@shared/icons';
|
||||||
import { TitleBar } from '@shared/titleBar';
|
import { TitleBar } from '@shared/titleBar';
|
||||||
import { AddGroupFeeds, AddHashtagFeeds, WidgetWrapper } from '@shared/widgets';
|
import { AddGroupFeeds, AddHashtagFeeds, WidgetWrapper } from '@shared/widgets';
|
||||||
|
|
||||||
@ -117,38 +117,6 @@ export function WidgetList({ widget }: { widget: Widget }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="rounded-xl bg-neutral-100 p-3 dark:bg-neutral-900">
|
|
||||||
<h3 className="mb-2.5 text-sm font-semibold uppercase text-neutral-700 dark:text-neutral-300">
|
|
||||||
Other
|
|
||||||
</h3>
|
|
||||||
<div className="flex flex-col gap-3">
|
|
||||||
<div className="inline-flex h-14 w-full items-center justify-between rounded-lg bg-white px-3 hover:shadow-md hover:shadow-neutral-200/50 dark:hover:shadow-neutral-800/50">
|
|
||||||
<div className="inline-flex items-center gap-2.5">
|
|
||||||
<div className="inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md bg-neutral-100">
|
|
||||||
<BellIcon className="h-4 w-4" />
|
|
||||||
</div>
|
|
||||||
<p className="font-medium">Notification</p>
|
|
||||||
</div>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onClick={() =>
|
|
||||||
replaceWidget.mutate({
|
|
||||||
currentId: widget.id,
|
|
||||||
widget: {
|
|
||||||
kind: WIDGET_KIND.notification,
|
|
||||||
title: 'Notification',
|
|
||||||
content: '',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}
|
|
||||||
className="inline-flex h-6 items-center gap-1 rounded-md bg-neutral-100 pl-1.5 pr-2.5 text-sm font-medium hover:bg-blue-500 hover:text-white dark:bg-neutral-900"
|
|
||||||
>
|
|
||||||
<PlusIcon className="h-3 w-3" />
|
|
||||||
Add
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</WidgetWrapper>
|
</WidgetWrapper>
|
||||||
|
@ -49,8 +49,8 @@ export function useRichContent(content: string, textmode: boolean = false) {
|
|||||||
let videos: string[] = [];
|
let videos: string[] = [];
|
||||||
let events: string[] = [];
|
let events: string[] = [];
|
||||||
|
|
||||||
const text = content;
|
const text = content.replace(/\n\s*\n/g, '\n');
|
||||||
const words = text.split(/(\s+)/);
|
const words = text.split(/( |\n)/);
|
||||||
|
|
||||||
if (!textmode) {
|
if (!textmode) {
|
||||||
images = words.filter((word) => IMAGES.some((el) => word.endsWith(el)));
|
images = words.filter((word) => IMAGES.some((el) => word.endsWith(el)));
|
||||||
@ -151,6 +151,10 @@ export function useRichContent(content: string, textmode: boolean = false) {
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
parsedContent = reactStringReplace(parsedContent, '\n', (match, i) => {
|
||||||
|
return <div key={'n-' + i} className="h-2" />;
|
||||||
|
});
|
||||||
|
|
||||||
if (typeof parsedContent[0] === 'string') {
|
if (typeof parsedContent[0] === 'string') {
|
||||||
parsedContent[0] = parsedContent[0].trimStart();
|
parsedContent[0] = parsedContent[0].trimStart();
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user