diff --git a/app/editor/components/Styles.ts b/app/editor/components/Styles.ts index da14f32d2..fddb46d72 100644 --- a/app/editor/components/Styles.ts +++ b/app/editor/components/Styles.ts @@ -14,7 +14,7 @@ const EditorStyles = styled.div<{ font-family: ${(props) => props.theme.fontFamily}; font-weight: ${(props) => props.theme.fontWeight}; font-size: 1em; - line-height: 1.7em; + line-height: 1.6em; width: 100%; > div { @@ -97,6 +97,7 @@ const EditorStyles = styled.div<{ } .image { + margin: .5em 0; text-align: center; max-width: 100%; clear: both; @@ -406,11 +407,14 @@ const EditorStyles = styled.div<{ a:not(.heading-name) { text-decoration: underline; } - } - .notice-block.tip, - .notice-block.warning { - font-weight: 500; + p:first-child { + margin-top: 0; + } + + p:last-child { + margin-bottom: 0; + } } .notice-block .content { @@ -423,8 +427,6 @@ const EditorStyles = styled.div<{ height: 24px; align-self: flex-start; margin-${(props) => (props.rtl ? "left" : "right")}: 4px; - position: relative; - top: 1px; } .notice-block.tip { @@ -484,7 +486,7 @@ const EditorStyles = styled.div<{ } p { - margin: 0; + margin: 0.5em 0; span:first-child + br:last-child { display: none; @@ -739,6 +741,7 @@ const EditorStyles = styled.div<{ background: ${(props) => props.theme.codeBackground}; border-radius: 4px; border: 1px solid ${(props) => props.theme.codeBorder}; + margin: .5em 0; -webkit-font-smoothing: initial; font-family: ${(props) => props.theme.fontFamilyMono}; @@ -756,7 +759,6 @@ const EditorStyles = styled.div<{ -ms-hyphens: none; hyphens: none; color: ${(props) => props.theme.code}; - margin: 0; code { font-size: 13px; diff --git a/shared/editor/nodes/Image.tsx b/shared/editor/nodes/Image.tsx index a23607359..c8613f0d0 100644 --- a/shared/editor/nodes/Image.tsx +++ b/shared/editor/nodes/Image.tsx @@ -544,6 +544,7 @@ const Caption = styled.p` background: none; resize: none; user-select: text; + margin: 0 !important; cursor: text; &:empty:not(:focus) {