yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-10-13 09:03:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

WYSIWYG: Fix preview styles

Browse Source
This commit is contained in:
Gustav Hansen 2023-01-24 15:02:24 +01:00
parent a7df0940c0
commit e7915a01f2
1 changed files with 22 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
packages/core/admin/admin/src/content-manager/components/PreviewWysiwyg/Wrapper.js
View File

@ -9,9 +9,8 @@ const Wrapper = styled.div`
padding: ${({ theme }) => `${theme.spaces[3]} ${theme.spaces[4]}`}; padding: ${({ theme }) => `${theme.spaces[3]} ${theme.spaces[4]}`};
font-size: ${14 / 16}rem; font-size: ${14 / 16}rem;
background-color: ${({ theme }) => theme.colors.neutral0}; background-color: ${({ theme }) => theme.colors.neutral0};
z-index: 2;
cursor: not-allowed;
color: ${({ theme }) => theme.colors.neutral800}; color: ${({ theme }) => theme.colors.neutral800};
line-height: ${({ theme }) => theme.lineHeights[6]};
h1, h1,
h2, h2,
@ -19,12 +18,12 @@ const Wrapper = styled.div`
h4, h4,
h5, h5,
h6 { h6 {
margin-block-start: 10px; margin-block-start: ${({ theme }) => theme.spaces[2]};
margin-block-end: 10px; margin-block-end: ${({ theme }) => theme.spaces[2]};
} }
p { p {
margin-bottom: 10px; margin-bottom: ${({ theme }) => theme.spaces[2]};
} }
h1 { h1 {
@ -56,13 +55,13 @@ const Wrapper = styled.div`
} }
blockquote { blockquote {
margin-top: 41px; margin-top: ${({ theme }) => theme.spaces[8]};
margin-bottom: 34px; margin-bottom: ${({ theme }) => theme.spaces[7]};
font-size: ${14 / 16}rem; font-size: ${14 / 16}rem;
font-weight: 400; font-weight: 400;
border-left: 5px solid #eee; border-left: 4px solid ${({ theme }) => theme.colors.neutral150};
font-style: italic; font-style: italic;
padding: 10px 20px; padding: ${({ theme }) => theme.spaces[2]} ${({ theme }) => theme.spaces[5]};
} }
img { img {
@ -91,9 +90,18 @@ const Wrapper = styled.div`
pre, pre,
code { code {
font-size: 13px; font-size: ${14 / 16}rem;
border-radius: 3px; border-radius: 4px;
background-color: #002b36; /*
Hard coded since the color is the same between themes,
theme.colors.neutral800 changes between themes.
Matches the color of the JSON Input component.
*/
background-color: #32324d;
max-width: 100%;
overflow: auto;
padding: ${({ theme }) => theme.spaces[2]};
} }
/* Inline code */ /* Inline code */
@ -105,21 +113,6 @@ const Wrapper = styled.div`
} }
} }
.warning {
background-color: #faa684;
padding: 30px;
border-radius: 3px;
}
.tip {
padding: 30px;
border-radius: 3px;
}
.footnote-ref,
.footnote-backref {
color: #007bff;
}
ol { ol {
list-style-type: decimal; list-style-type: decimal;
margin-block-start: ${({ theme }) => theme.spaces[4]}; margin-block-start: ${({ theme }) => theme.spaces[4]};
@ -127,6 +120,7 @@ const Wrapper = styled.div`
margin-inline-start: 0px; margin-inline-start: 0px;
margin-inline-end: 0px; margin-inline-end: 0px;
padding-inline-start: ${({ theme }) => theme.spaces[4]}; padding-inline-start: ${({ theme }) => theme.spaces[4]};
ol, ol,
ul { ul {
margin-block-start: 0px; margin-block-start: 0px;
@ -141,6 +135,7 @@ const Wrapper = styled.div`
margin-inline-start: 0px; margin-inline-start: 0px;
margin-inline-end: 0px; margin-inline-end: 0px;
padding-inline-start: ${({ theme }) => theme.spaces[4]}; padding-inline-start: ${({ theme }) => theme.spaces[4]};
ul, ul,
ol { ol {
margin-block-start: 0px; margin-block-start: 0px;