Mirrored_Repos/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2024-08-30 18:12:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: some style

Browse Source
This commit is contained in:
Kilu 2024-06-26 19:04:17 +08:00
parent 990c149c75
commit 4cef37d9a7
13 changed files with 48 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/appflowy_web_app/index.html
View File

@ -26,6 +26,8 @@
/> />
<meta name="twitter:site" content="@appflowy" /> <meta name="twitter:site" content="@appflowy" />
<meta name="twitter:creator" content="@appflowy" /> <meta name="twitter:creator" content="@appflowy" />
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
</head> </head>
<body id="body"> <body id="body">
<div id="root"></div> <div id="root"></div>

2
frontend/appflowy_web_app/src/application/publish/context.tsx
View File

@ -34,7 +34,7 @@ export const PublishProvider = ({
const name = `${namespace}_${publishName}`; const name = `${namespace}_${publishName}`;
return db.view_metas.get(name); return db.view_metas.get(name);
}); }, [namespace, publishName]);
const service = useContext(AFConfigContext)?.service; const service = useContext(AFConfigContext)?.service;
const navigate = useNavigate(); const navigate = useNavigate();
const toView = useCallback( const toView = useCallback(

10
frontend/appflowy_web_app/src/application/services/js-services/cache/index.ts vendored
View File

@ -202,6 +202,7 @@ export async function revalidatePublishView<
>(name: string, fetcher: Fetcher<T>, collab: YDoc) { >(name: string, fetcher: Fetcher<T>, collab: YDoc) {
const { data, meta, rows } = await fetcher(); const { data, meta, rows } = await fetcher();
console.log('revalidatePublishView', name);
await db.view_metas.put( await db.view_metas.put(
{ {
publish_name: name, publish_name: name,
@ -211,11 +212,14 @@ export async function revalidatePublishView<
}, },
name name
); );
console.log('revalidatePublishView', name, 'done');
for (const [key, value] of Object.entries(rows ?? {})) { if (rows) {
const row = await openCollabDB(`${name}_${key}`); for (const [key, value] of Object.entries(rows)) {
const row = await openCollabDB(`${name}_${key}`);
applyYDoc(row, new Uint8Array(value)); applyYDoc(row, new Uint8Array(value));
}
} }
const state = new Uint8Array(data); const state = new Uint8Array(data);

2
frontend/appflowy_web_app/src/application/services/js-services/index.ts
View File

@ -53,6 +53,8 @@ export class AFClientService implements AFService {
async getPublishView(namespace: string, publishName: string) { async getPublishView(namespace: string, publishName: string) {
const name = `${namespace}_${publishName}`; const name = `${namespace}_${publishName}`;
console.log('getPublishView', name);
const isLoaded = this.publishViewLoaded.has(name); const isLoaded = this.publishViewLoaded.has(name);
const doc = await getPublishView( const doc = await getPublishView(
() => { () => {

6
frontend/appflowy_web_app/src/components/editor/components/blocks/database/DatabaseBlock.tsx
View File

@ -96,11 +96,13 @@ export const DatabaseBlock = memo(
</> </>
) : ( ) : (
<div <div
className={'mt-[10%] flex h-full w-full flex-col items-center gap-2 px-16 text-text-caption max-md:px-4'} className={
'flex h-full w-full flex-col items-center justify-center gap-2 rounded border border-line-divider bg-fill-list-active px-16 text-text-caption max-md:px-4'
}
> >
{notFound ? ( {notFound ? (
<> <>
<div className={'text-base font-medium'}>{t('publish.hasNotBeenPublished')}</div> <div className={'text-base font-medium'}>{t('publish.databaseHasNotBeenPublished')}</div>
</> </>
) : ( ) : (
<CircularProgress /> <CircularProgress />

8
frontend/appflowy_web_app/src/components/editor/components/blocks/heading/utils.ts
View File

@ -1,13 +1,13 @@
export function getHeadingCssProperty(level: number) { export function getHeadingCssProperty(level: number) {
switch (level) { switch (level) {
case 1: case 1:
return 'text-3xl pt-[10px] max-md:pt-[1.5vw] pb-[4px] max-md:pb-[1vw] font-bold max-sm:text-[6vw]'; return 'text-[1.75rem] pt-[10px] max-md:pt-[1.5vw] pb-[4px] max-md:pb-[1vw] font-bold max-sm:text-[6vw]';
case 2: case 2:
return 'text-2xl pt-[8px] max-md:pt-[1vw] pb-[2px] max-md:pb-[0.5vw] font-bold max-sm:text-[5vw]'; return 'text-[1.55rem] pt-[8px] max-md:pt-[1vw] pb-[2px] max-md:pb-[0.5vw] font-bold max-sm:text-[5vw]';
case 3: case 3:
return 'text-xl pt-[4px] font-bold max-sm:text-[4vw]'; return 'text-[1.25rem] pt-[4px] font-bold max-sm:text-[4vw]';
case 4: case 4:
return 'text-lg pt-[4px] font-bold'; return 'text-[1rem] pt-[4px] font-bold';
case 5: case 5:
return 'pt-[4px] font-bold'; return 'pt-[4px] font-bold';
case 6: case 6:

1
frontend/appflowy_web_app/src/components/publish/PublishView.tsx
View File

@ -19,6 +19,7 @@ export function PublishView({ namespace, publishName }: PublishViewProps) {
let doc; let doc;
setNotFound(false); setNotFound(false);
setDoc(undefined);
try { try {
doc = await service?.getPublishView(namespace, publishName); doc = await service?.getPublishView(namespace, publishName);
} catch (e) { } catch (e) {

2
frontend/appflowy_web_app/src/components/publish/header/BreadcrumbItem.tsx
View File

@ -53,7 +53,7 @@ function BreadcrumbItem({ crumb, disableClick = false }: { crumb: Crumb; disable
} }
}} }}
> >
{renderCrumbIcon(icon)} <span className={'icon'}>{renderCrumbIcon(icon)}</span>
<span <span
className={!disableClick ? 'max-w-[250px] truncate hover:text-text-title hover:underline' : 'flex-1 truncate'} className={!disableClick ? 'max-w-[250px] truncate hover:text-text-title hover:underline' : 'flex-1 truncate'}
> >

27
frontend/appflowy_web_app/src/components/publish/header/PublishViewHeader.tsx
View File

@ -10,21 +10,24 @@ export function PublishViewHeader() {
const viewMeta = usePublishContext()?.viewMeta; const viewMeta = usePublishContext()?.viewMeta;
const crumbs = useMemo(() => { const crumbs = useMemo(() => {
const ancestors = viewMeta?.ancestor_views || []; const ancestors = viewMeta?.ancestor_views || [];
let icon = viewMeta?.icon;
try { return ancestors.map((ancestor) => {
const extra = viewMeta?.extra ? JSON.parse(viewMeta.extra) : {}; let icon;
icon = extra.icon || icon; try {
} catch (e) { const extra = ancestor?.extra ? JSON.parse(ancestor.extra) : {};
// ignore
}
return ancestors.map((ancestor) => ({ icon = extra.icon?.value || JSON.parse(ancestor.icon || '')?.value;
viewId: ancestor.view_id, } catch (e) {
name: ancestor.name, // ignore
icon: icon || String(viewMeta?.layout), }
}));
return {
viewId: ancestor.view_id,
name: ancestor.name,
icon: icon || String(viewMeta?.layout),
};
});
}, [viewMeta]); }, [viewMeta]);
return ( return (

14
frontend/appflowy_web_app/src/components/publish/useViewMeta.ts
View File

@ -75,19 +75,7 @@ export function useViewMeta() {
return; return;
}, [viewMeta?.icon]); }, [viewMeta?.icon]);
const cover = useMemo(() => { const cover = extra?.cover as ViewMetaCover;
if (extra) {
try {
const extraObj = JSON.parse(extra);
return extraObj.cover as ViewMetaCover;
} catch (e) {
return;
}
}
return;
}, [extra]);
const viewId = viewMeta?.view_id; const viewId = viewMeta?.view_id;
const name = viewMeta?.name; const name = viewMeta?.name;

17
frontend/appflowy_web_app/src/components/view-meta/ViewMetaPreview.tsx
View File

@ -59,21 +59,10 @@ export function ViewMetaPreview({ icon, cover, name }: ViewMetaProps) {
return ( return (
<div className={'flex w-full flex-col items-center'}> <div className={'flex w-full flex-col items-center'}>
{cover && <ViewCover coverType={coverType} coverValue={coverValue} />} {cover && <ViewCover coverType={coverType} coverValue={coverValue} />}
<div className={`relative mx-16 w-[964px] min-w-0 max-w-full overflow-visible max-md:mx-4`}> <div className={`relative mx-16 mb-9 mt-[52px] w-[964px] min-w-0 max-w-full overflow-visible max-md:mx-4`}>
<div <div className={'flex items-center gap-4 px-16 text-[2.25rem] font-bold leading-[1.5em] max-sm:text-[7vw]'}>
style={{
position: coverValue ? 'absolute' : 'relative',
bottom: '100%',
width: '100%',
}}
className={'flex items-center gap-2 px-14 py-8 text-4xl max-md:px-2 max-sm:text-[7vw]'}
>
<div className={`view-icon`}>{icon?.value}</div> <div className={`view-icon`}>{icon?.value}</div>
<div className={'flex flex-1 items-center gap-2 overflow-hidden'}> {name || <span className={'text-text-placeholder'}>{t('menuAppHeader.defaultNewPageName')}</span>}
<div className={'font-bold leading-[1.5em]'}>
{name || <span className={'text-text-placeholder'}>{t('menuAppHeader.defaultNewPageName')}</span>}
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

5
frontend/appflowy_web_app/src/styles/app.scss
View File

@ -51,10 +51,13 @@ body {
opacity: 60%; opacity: 60%;
} }
.icon {
font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', 'Twemoji Mozilla', sans-serif;
}
.view-icon { .view-icon {
@apply flex w-fit leading-[1.5em] cursor-pointer rounded-lg py-2 text-[1.5em]; @apply flex w-fit leading-[1.5em] cursor-pointer rounded-lg py-2 text-[1.5em];
font-family: "Apple Color Emoji", "Segoe UI Emoji", NotoColorEmoji, "Noto Color Emoji", "Segoe UI Symbol", "Android Emoji", EmojiSymbols; font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', 'Twemoji Mozilla', sans-serif;
line-height: 1em; line-height: 1em;
white-space: nowrap; white-space: nowrap;
} }

3
frontend/resources/translations/en.json
View File

@ -2030,6 +2030,7 @@
}, },
"publish": { "publish": {
"hasNotBeenPublished": "This page hasn't been published yet", "hasNotBeenPublished": "This page hasn't been published yet",
"reportPage": "Report page" "reportPage": "Report page",
"databaseHasNotBeenPublished": "This database hasn't been published yet"
} }
} }