X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/067cb9c5b7b020da6dda398773cd7236fa3b51f2..refs/pull/3433/head:/resources/sass/_text.scss diff --git a/resources/sass/_text.scss b/resources/sass/_text.scss index e62972497..51f315614 100644 --- a/resources/sass/_text.scss +++ b/resources/sass/_text.scss @@ -96,9 +96,6 @@ a { text-decoration: none; transition: filter ease-in-out 80ms; line-height: 1.6; - @include whenDark { - filter: brightness(1.3) saturate(0.7); - } &:hover { text-decoration: underline; } @@ -115,6 +112,13 @@ a { } } +a.no-link-style { + color: inherit; + &:hover { + text-decoration: none; + } +} + .blended-links a { color: inherit; svg { @@ -133,11 +137,14 @@ p, ul, ol, pre, table, blockquote { hr { border: 0; height: 1px; - @include lightDark(background, #eaeaea, #222); + @include lightDark(background, #eaeaea, #555); margin-bottom: $-l; &.faded { background-image: linear-gradient(to right, #FFF, #e3e0e0 20%, #e3e0e0 80%, #FFF); } + &.darker { + @include lightDark(background, #DDD, #666); + } &.margin-top, &.even { margin-top: $-l; } @@ -156,7 +163,6 @@ em, i, .italic { small, p.small, span.small, .text-small { font-size: 0.75rem; - @include lightDark(color, #5e5e5e, #999); } sup, .superscript { @@ -204,8 +210,9 @@ blockquote { display: block; position: relative; border-left: 4px solid var(--color-primary); - background-color: #F8F8F8; + @include lightDark(background-color, #f8f8f8, #333); padding: $-s $-m $-s $-xl; + overflow: auto; &:before { content: "\201C"; font-size: 2em; @@ -233,7 +240,7 @@ blockquote { font-size: 0.84em; border: 1px solid #DDD; border-radius: 3px; - @include lightDark(background-color, #f8f8f8f, #2b2b2b); + @include lightDark(background-color, #f8f8f8, #2b2b2b); @include lightDark(border-color, #DDD, #444); } @@ -272,13 +279,9 @@ ul, ol { } } ul { - padding-left: $-m * 1.3; - padding-right: $-m * 1.3; list-style: disc; ul { list-style: circle; - margin-top: 0; - margin-bottom: 0; } label { margin: 0; @@ -287,23 +290,34 @@ ul { ol { list-style: decimal; - padding-left: $-m * 2; - padding-right: $-m * 2; +} + +ol, ul { + padding-left: $-m * 2.0; + padding-right: $-m * 2.0; +} + +li > ol, li > ul { + margin-top: 0; + margin-bottom: 0; + margin-block-end: 0; + margin-block-start: 0; + padding-block-end: 0; + padding-block-start: 0; + padding-left: $-m * 1.2; + padding-right: $-m * 1.2; } li.checkbox-item, li.task-list-item { + display: list-item; list-style: none; - margin-left: - ($-m * 1.3); + margin-left: -($-m * 1.2); input[type="checkbox"] { margin-right: $-xs; } -} - -li > ol, li > ul { - margin-block-end: 0px; - margin-block-start: 0px; - padding-block-end: 0px; - padding-block-start: 0px; + li.checkbox-item, li.task-list-item { + margin-left: $-xs; + } } /* @@ -354,12 +368,21 @@ li > ol, li > ul { overflow-wrap: break-word; } -.limit-text { +.text-limit-lines-1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.text-limit-lines-2 { + // -webkit use here is actually standardised cross-browser: + // https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + overflow: hidden; +} + /** * Grouping */