fix: Increase default breathing room in documents

closes #2878

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;
     }
+
+    p:first-child {
+      margin-top: 0;
     }
 
-  .notice-block.tip,
-  .notice-block.warning {
-    font-weight: 500;
+    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;

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) {