X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/8367a94e90e5e1bf7d06defe30d570ade2f00599..refs/pull/5349/head:/resources/sass/styles.scss diff --git a/resources/sass/styles.scss b/resources/sass/styles.scss index 668cb5c85..2106f86e6 100644 --- a/resources/sass/styles.scss +++ b/resources/sass/styles.scss @@ -15,12 +15,18 @@ @import "forms"; @import "animations"; @import "tinymce"; +@import "editor"; @import "codemirror"; @import "components"; @import "header"; @import "footer"; @import "lists"; @import "pages"; +@import "content"; + +@media print { + @import "print"; +} // Jquery Sortable Styles .dragged { @@ -100,6 +106,10 @@ $loadingSize: 10px; } } +.inline.block .loading-container { + margin: $-xs $-s; +} + .skip-to-content-link { position: fixed; top: -52px; @@ -117,37 +127,6 @@ $loadingSize: 10px; } } -.contained-search-box { - display: flex; - height: 38px; - input, button { - border-radius: 0; - border: 1px solid #ddd; - @include lightDark(border-color, #ddd, #000); - margin-inline-start: -1px; - } - input { - flex: 5; - padding: $-xs $-s; - &:focus, &:active { - outline: 0; - } - } - button { - width: 60px; - } - button i { - padding: 0; - } - button.cancel.active { - background-color: $negative; - color: #EEE; - } - svg { - margin: 0; - } -} - .entity-selector { border: 1px solid #DDD; @include lightDark(border-color, #ddd, #111); @@ -163,6 +142,11 @@ $loadingSize: 10px; font-size: 16px; padding: $-s $-m; } + input[type="text"]:focus { + outline: 1px solid var(--color-primary); + border-radius: 3px 3px 0 0; + outline-offset: -1px; + } .entity-list { overflow-y: scroll; height: 400px; @@ -196,73 +180,21 @@ $loadingSize: 10px; font-size: 14px; } } -} - -.scroll-box { - max-height: 250px; - overflow-y: scroll; - border: 1px solid; - @include lightDark(border-color, #DDD, #000); - border-radius: 3px; - min-height: 20px; - @include lightDark(background-color, #EEE, #000); -} -.scroll-box-item { - border-bottom: 1px solid; - border-top: 1px solid; - @include lightDark(border-color, #DDD, #000); - margin-top: -1px; - @include lightDark(background-color, #FFF, #222); - display: flex; - padding: 1px; - &:last-child { - border-bottom: 0; - } - &:hover { - cursor: pointer; - @include lightDark(background-color, #f8f8f8, #333); - } - .handle { - color: #AAA; - cursor: grab; - } - .handle svg { - margin: 0; - } - > * { - padding: $-xs $-m; - } - .handle + * { - padding-left: 0; - } - &:hover .handle { - @include lightDark(color, #444, #FFF); - } - a:hover { - text-decoration: none; + &.small { + .entity-list-item { + padding: $-xs $-m; + } + .entity-list, .loading { + height: 300px; + } + input[type="text"] { + font-size: 13px; + padding: $-xs $-m; + height: auto; + } } } -input.scroll-box-search, .scroll-box-header-item { - font-size: 0.8rem; - padding: $-xs $-m; - border: 1px solid; - @include lightDark(border-color, #DDD, #000); - @include lightDark(background-color, #FFF, #222); - margin-bottom: -1px; - border-radius: 3px 3px 0 0; - width: 100%; - max-width: 100%; - height: auto; - line-height: 1.4; - color: #666; -} - -.scroll-box-search + .scroll-box, -.scroll-box-header-item + .scroll-box { - border-radius: 0 0 3px 3px; -} - .fullscreen { border:0; position:fixed; @@ -275,6 +207,14 @@ input.scroll-box-search, .scroll-box-header-item { z-index: 150; } +@include between($s, $m) { + #home-default > .grid.third { + display: block; + columns: 2; + column-gap: $-l !important; + } +} + .list-sort-container { display: inline-block; form { @@ -312,4 +252,9 @@ input.scroll-box-search, .scroll-box-header-item { transform: rotate(180deg); } } +} + +.import-item { + border-inline-start: 2px solid currentColor; + padding-inline-start: $-xs; } \ No newline at end of file