diff --git a/src/frontend/styles/components/page.pcss b/src/frontend/styles/components/page.pcss index 4727f42..7109556 100644 --- a/src/frontend/styles/components/page.pcss +++ b/src/frontend/styles/components/page.pcss @@ -58,6 +58,7 @@ &__title { @apply --text-content-title; margin-bottom: 10px; + line-height: 1.35em; } .cdx-marker { @@ -103,10 +104,12 @@ .block-header { @apply --text-header; + margin-top: 10px; display: flex; align-items: center; transform: translateX(-36px); cursor: text; + &--2 { @apply --text-header-2; } @@ -336,17 +339,7 @@ * ================== */ .block-list { - margin: 0; - list-style: outside; - padding-left: 40px; - - &--ordered { - list-style-type: decimal - } - - li:not(:last-of-type) { - margin-bottom: 8px; - } + @apply --text-list; } /** diff --git a/src/frontend/styles/components/writing.pcss b/src/frontend/styles/components/writing.pcss index 945c694..9a9a428 100644 --- a/src/frontend/styles/components/writing.pcss +++ b/src/frontend/styles/components/writing.pcss @@ -58,13 +58,17 @@ border-radius: 8px; } - .ce-paragraph a { - @apply --text-inline-link; + .ce-paragraph { + line-height: inherit; + + a { + @apply --text-inline-link; + } } .ce-header { @apply --text-header; - padding: 0; + padding: 0 0 10px; } h2.ce-header { @@ -75,10 +79,6 @@ @apply --text-header-3; } - .cdx-block { - padding: 0; - } - .inline-code { @apply --text-inline-code; } @@ -92,7 +92,11 @@ } .cdx-list { - padding-left: 40px; + @apply --text-list; + + &__item { + line-height: inherit; + } } @media (--desktop) { @@ -107,7 +111,7 @@ @apply --text-content-title; } -.ce-block { +.cdx-block { @apply --content-block; } diff --git a/src/frontend/styles/vars.pcss b/src/frontend/styles/vars.pcss index 4f16c94..2af7f66 100644 --- a/src/frontend/styles/vars.pcss +++ b/src/frontend/styles/vars.pcss @@ -148,7 +148,7 @@ * The common styles for the Page blocks as well as Editor blocks */ --content-block { - margin: 20px 0; + padding: 10px 0; } /** @@ -184,7 +184,7 @@ * Common styles for text headings (H2, H3, H4) */ --text-header { - margin: 28px 0 0; + margin: 20px 0 0; line-height: 1.35em; } @@ -257,6 +257,27 @@ } } + /** + * Styles for the List block + */ + --text-list { + margin: 0; + list-style: outside; + padding-left: 40px; + + &--ordered { + list-style-type: decimal + } + + li { + padding: 0; + + &:not(:last-of-type){ + margin-bottom: 8px; + } + } + } + } /**