mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-04 08:38:34 +00:00
fix(core): modify journal page title today style, add weekday tag (#5687)
fix [TOV-434](https://linear.app/affine-design/issue/TOV-434/修改-journal-中-「today」的字体大小和日期-title-大小) <picture> <source media="(prefers-color-scheme: dark)" srcset="https://github.com/toeverything/AFFiNE/assets/39363750/ac0ab085-5ff7-4d27-a0b1-11d97fdd8074"> <img width="100%" alt="" src="https://github.com/toeverything/AFFiNE/assets/39363750/3b311130-ded2-4651-badd-65dd059b7bc5"> </picture>
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
import { useJournalInfoHelper } from '@affine/core/hooks/use-journal';
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import type { Page } from '@blocksuite/store';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
import * as styles from './styles.css';
|
||||
|
||||
@@ -11,12 +12,17 @@ export const BlocksuiteEditorJournalDocTitle = ({ page }: { page: Page }) => {
|
||||
);
|
||||
const t = useAFFiNEI18N();
|
||||
|
||||
// TODO: i18n
|
||||
const day = dayjs(localizedJournalDate).format('dddd');
|
||||
|
||||
return (
|
||||
<span className="doc-title-container">
|
||||
<span>{localizedJournalDate}</span>
|
||||
{isTodayJournal ? (
|
||||
<span className={styles.titleTodayTag}>{t['com.affine.today']()}</span>
|
||||
) : null}
|
||||
) : (
|
||||
<span className={styles.titleDayTag}>{day}</span>
|
||||
)}
|
||||
</span>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { cssVar } from '@toeverything/theme';
|
||||
import { style } from '@vanilla-extract/css';
|
||||
|
||||
export const docEditorRoot = style({
|
||||
@@ -31,14 +32,25 @@ export const docContainer = style({
|
||||
flexGrow: 1,
|
||||
});
|
||||
|
||||
export const titleTodayTag = style({
|
||||
fontSize: 'var(--affine-font-base)',
|
||||
fontWeight: 400,
|
||||
color: 'var(--affine-brand-color)',
|
||||
const titleTagBasic = style({
|
||||
fontSize: cssVar('fontH4'),
|
||||
fontWeight: 600,
|
||||
padding: '0 4px',
|
||||
borderRadius: '4px',
|
||||
marginLeft: '4px',
|
||||
});
|
||||
export const titleDayTag = style([
|
||||
titleTagBasic,
|
||||
{
|
||||
color: cssVar('textSecondaryColor'),
|
||||
},
|
||||
]);
|
||||
export const titleTodayTag = style([
|
||||
titleTagBasic,
|
||||
{
|
||||
color: cssVar('brandColor'),
|
||||
},
|
||||
]);
|
||||
|
||||
export const pageReferenceIcon = style({
|
||||
verticalAlign: 'middle',
|
||||
|
||||
Reference in New Issue
Block a user