diff options
Diffstat (limited to 'app/assets/stylesheets/page_bundles')
-rw-r--r-- | app/assets/stylesheets/page_bundles/issues_show.scss | 41 |
1 files changed, 39 insertions, 2 deletions
diff --git a/app/assets/stylesheets/page_bundles/issues_show.scss b/app/assets/stylesheets/page_bundles/issues_show.scss index 9873a0121c0..ade649faaae 100644 --- a/app/assets/stylesheets/page_bundles/issues_show.scss +++ b/app/assets/stylesheets/page_bundles/issues_show.scss @@ -3,8 +3,8 @@ .description { ul, ol { - /* We're changing list-style-position to inside because the default of outside - * doesn't move the negative margin to the left of the bullet. */ + /* We're changing list-style-position to inside because the default of + * outside doesn't move negative margin to the left of the bullet. */ list-style-position: inside; } @@ -21,6 +21,43 @@ inset-block-start: 0.3rem; inset-inline-start: 1rem; } + + /* The inside bullet aligns itself to the bottom, which we see when text to the right of + * a multi-line list item wraps. We fix this by aligning it to the top, and excluding + * other elements adversely affected by this. Targeting ::marker doesn't seem to work. */ + > *:not(code):not(input):not(.gl-label) { + vertical-align: top; + } + + /* The inside bullet is treated like an element inside the li element, so when we have a + * multi-paragraph list item, the text doesn't start on the right of the bullet because + * it is a block level p element. We make it inline to fix this. */ + > p:first-of-type { + display: inline-block; + max-width: calc(100% - 1.5rem); + } + + /* We fix the other paragraphs not indenting to the + * right of the bullet due to the inside bullet. */ + p ~ a, + p ~ blockquote, + p ~ code, + p ~ details, + p ~ dl, + p ~ h1, + p ~ h2, + p ~ h3, + p ~ h4, + p ~ h5, + p ~ h6, + p ~ hr, + p ~ ol, + p ~ p, + p ~ table:not(.code), /* We need :not(.code) to override typography.scss */ + p ~ ul, + p ~ .markdown-code-block { + margin-inline-start: 1rem; + } } ul.task-list { |