refactor: 完善样式

This commit is contained in:
robin 2022-10-11 10:27:57 +08:00 committed by mingcheng
parent 3b359aeb68
commit 63bf1774f1
3 changed files with 56 additions and 8 deletions

View File

@ -9,17 +9,32 @@ const Heading: FC<IEditorContext> = (context) => {
const { t } = useTranslation('translation', { keyPrefix: 'editor' });
const headerList = [
{
text: `<h4 class="mb-0">${t('heading.options.h4')}</h4>`,
text: `<h1 class="mb-0 h3">${t('heading.options.h1')}</h1>`,
level: 1,
label: t('heading.options.h1'),
},
{
text: `<h2 class="mb-0 h4">${t('heading.options.h2')}</h2>`,
level: 2,
label: t('heading.options.h2'),
},
{
text: `<h3 class="mb-0 h5">${t('heading.options.h3')}</h3>`,
level: 3,
label: t('heading.options.h3'),
},
{
text: `<h4 class="mb-0 h6">${t('heading.options.h4')}</h4>`,
level: 4,
label: t('heading.options.h4'),
},
{
text: `<h5 class="mb-0">${t('heading.options.h5')}</h5>`,
text: `<h5 class="mb-0 fs-14">${t('heading.options.h5')}</h5>`,
level: 5,
label: t('heading.options.h5'),
},
{
text: `<h6 class="mb-0">${t('heading.options.h6')}</h6>`,
text: `<h6 class="mb-0 fs-12">${t('heading.options.h6')}</h6>`,
level: 6,
label: t('heading.options.h6'),
},

View File

@ -90,9 +90,12 @@
"heading": {
"text": "Heading",
"options": {
"h4": "Heading 2",
"h5": "Heading 3",
"h6": "Heading 4"
"h1": "Heading 1",
"h2": "Heading 2",
"h3": "Heading 3",
"h4": "Heading 4",
"h5": "Heading 5",
"h6": "Heading 6"
}
},
"help": {
@ -847,4 +850,4 @@
}
}
}
}
}

View File

@ -28,7 +28,10 @@ a {
}
.fs-14 {
font-size: 14px;
font-size: 0.875rem;
}
.fs-12 {
font-size: 0.75rem;
}
.pic-auth-modal {
@ -141,6 +144,30 @@ a {
}
.fmt {
width: 100%;
h1 {
@extend .fs-3;
margin-top: 2rem;
}
h2 {
@extend .fs-4;
margin-top: 2rem;
}
h3 {
@extend .fs-5;
margin-top: 2rem;
}
h4 {
@extend .fs-6;
margin-top: 2rem;
}
h5 {
@extend .fs-14;
margin-top: 2rem;
}
h6 {
@extend .fs-12;
margin-top: 2rem;
}
img {
max-width: 100%;
}
@ -163,6 +190,9 @@ a {
padding: 1rem;
color: #6c757d;
background-color: #e9ecef;
p {
color: $body-color;
}
> p:last-child {
margin-bottom: 0;
}