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:creator" content="@appflowy" />
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
</head>
<body id="body">
<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}`;
return db.view_metas.get(name);
});
}, [namespace, publishName]);
const service = useContext(AFConfigContext)?.service;
const navigate = useNavigate();
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) {
const { data, meta, rows } = await fetcher();
console.log('revalidatePublishView', name);
await db.view_metas.put(
{
publish_name: name,
@ -211,11 +212,14 @@ export async function revalidatePublishView<
},
name
);
console.log('revalidatePublishView', name, 'done');
for (const [key, value] of Object.entries(rows ?? {})) {
const row = await openCollabDB(`${name}_${key}`);
if (rows) {
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);

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) {
const name = `${namespace}_${publishName}`;
console.log('getPublishView', name);
const isLoaded = this.publishViewLoaded.has(name);
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
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 ? (
<>
<div className={'text-base font-medium'}>{t('publish.hasNotBeenPublished')}</div>
<div className={'text-base font-medium'}>{t('publish.databaseHasNotBeenPublished')}</div>
</>
) : (
<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) {
switch (level) {
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:
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:
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:
return 'text-lg pt-[4px] font-bold';
return 'text-[1rem] pt-[4px] font-bold';
case 5:
return 'pt-[4px] font-bold';
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;
setNotFound(false);
setDoc(undefined);
try {
doc = await service?.getPublishView(namespace, publishName);
} 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
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 crumbs = useMemo(() => {
const ancestors = viewMeta?.ancestor_views || [];
let icon = viewMeta?.icon;
try {
const extra = viewMeta?.extra ? JSON.parse(viewMeta.extra) : {};
return ancestors.map((ancestor) => {
let icon;
icon = extra.icon || icon;
} catch (e) {
// ignore
}
try {
const extra = ancestor?.extra ? JSON.parse(ancestor.extra) : {};
return ancestors.map((ancestor) => ({
viewId: ancestor.view_id,
name: ancestor.name,
icon: icon || String(viewMeta?.layout),
}));
icon = extra.icon?.value || JSON.parse(ancestor.icon || '')?.value;
} catch (e) {
// ignore
}
return {
viewId: ancestor.view_id,
name: ancestor.name,
icon: icon || String(viewMeta?.layout),
};
});
}, [viewMeta]);
return (

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

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

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 (
<div className={'flex w-full flex-col items-center'}>
{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
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={`relative mx-16 mb-9 mt-[52px] w-[964px] min-w-0 max-w-full overflow-visible max-md:mx-4`}>
<div className={'flex items-center gap-4 px-16 text-[2.25rem] font-bold leading-[1.5em] max-sm:text-[7vw]'}>
<div className={`view-icon`}>{icon?.value}</div>
<div className={'flex flex-1 items-center gap-2 overflow-hidden'}>
<div className={'font-bold leading-[1.5em]'}>
{name || <span className={'text-text-placeholder'}>{t('menuAppHeader.defaultNewPageName')}</span>}
</div>
</div>
{name || <span className={'text-text-placeholder'}>{t('menuAppHeader.defaultNewPageName')}</span>}
</div>
</div>
</div>

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

@ -51,10 +51,13 @@ body {
opacity: 60%;
}
.icon {
font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', 'Twemoji Mozilla', sans-serif;
}
.view-icon {
@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;
white-space: nowrap;
}

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

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