diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-08-19 12:08:42 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-08-19 12:08:42 +0300 |
commit | b76ae638462ab0f673e5915986070518dd3f9ad3 (patch) | |
tree | bdab0533383b52873be0ec0eb4d3c66598ff8b91 /app/assets/stylesheets | |
parent | 434373eabe7b4be9593d18a585fb763f1e5f1a6f (diff) |
Add latest changes from gitlab-org/gitlab@14-2-stable-eev14.2.0-rc42
Diffstat (limited to 'app/assets/stylesheets')
27 files changed, 244 insertions, 252 deletions
diff --git a/app/assets/stylesheets/_jh/application_jh.scss b/app/assets/stylesheets/_jh/application_jh.scss new file mode 100644 index 00000000000..9d9918d5bbd --- /dev/null +++ b/app/assets/stylesheets/_jh/application_jh.scss @@ -0,0 +1,5 @@ +/* + This is a noop-file. In JH: + jh/app/assets/stylesheets/_jh/application_jh.scss + will take precedence over it and import more styles + */ diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 9ef1b58ed24..40228b93e01 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -24,6 +24,9 @@ // EE-only stylesheets @import 'application_ee'; +// JH-only stylesheets +@import 'application_jh'; + /* print styles */ @media print { @import 'print'; diff --git a/app/assets/stylesheets/components/content_editor.scss b/app/assets/stylesheets/components/content_editor.scss new file mode 100644 index 00000000000..64abf5574fa --- /dev/null +++ b/app/assets/stylesheets/components/content_editor.scss @@ -0,0 +1,56 @@ +.ProseMirror { + td, + th, + li { + :only-child { + margin-bottom: 0 !important; + } + } + + ul[data-type='taskList'] { + list-style: none; + padding: 0; + + li { + margin: 0 !important; + } + } + + [data-type='taskList'] { + p { + margin-bottom: 0; + } + + li { + > label, + > div { + display: inline-block; + vertical-align: top; + } + + > label { + padding: $gl-spacing-scale-1 $gl-spacing-scale-3 0 0; + margin: 0; + } + } + } +} + +.table-creator-grid-item { + box-shadow: inset 0 0 0 $gl-spacing-scale-2 $white, + inset $gl-spacing-scale-1 $gl-spacing-scale-1 0 #{$gl-spacing-scale-2 * 3 / 4} $gray-100, + inset #{-$gl-spacing-scale-1} #{-$gl-spacing-scale-1} 0 #{$gl-spacing-scale-2 * 3 / 4} $gray-100 !important; + + &.active { + box-shadow: inset 0 0 0 $gl-spacing-scale-2 $white, + inset $gl-spacing-scale-1 $gl-spacing-scale-1 0 $gl-spacing-scale-2 $blue-500, + inset #{-$gl-spacing-scale-1} #{-$gl-spacing-scale-1} 0 $gl-spacing-scale-2 $blue-500 !important; + } +} + +.table-dropdown .dropdown-menu { + @include gl-min-w-0; + @include gl-w-auto; + + @include gl-white-space-nowrap; +} diff --git a/app/assets/stylesheets/components/whats_new.scss b/app/assets/stylesheets/components/whats_new.scss index 7af97505749..4437b5b673d 100644 --- a/app/assets/stylesheets/components/whats_new.scss +++ b/app/assets/stylesheets/components/whats_new.scss @@ -36,7 +36,15 @@ } .with-performance-bar .whats-new-drawer { - margin-top: calc(#{$performance-bar-height} + #{$header-height}); + margin-top: $performance-bar-height + $header-height; +} + +.with-system-header .whats-new-drawer { + margin-top: $system-header-height + $header-height; +} + +.with-performance-bar.with-system-header .whats-new-drawer { + margin-top: $performance-bar-height + $system-header-height + $header-height; } .gl-badge.whats-new-item-badge { diff --git a/app/assets/stylesheets/framework/animations.scss b/app/assets/stylesheets/framework/animations.scss index a93c70c75d3..fa235f72e35 100644 --- a/app/assets/stylesheets/framework/animations.scss +++ b/app/assets/stylesheets/framework/animations.scss @@ -98,7 +98,6 @@ } .note-action-button, -.toolbar-btn, .dropdown-toggle-caret { @include transition(color); } diff --git a/app/assets/stylesheets/framework/blocks.scss b/app/assets/stylesheets/framework/blocks.scss index 10481294df5..264373451d5 100644 --- a/app/assets/stylesheets/framework/blocks.scss +++ b/app/assets/stylesheets/framework/blocks.scss @@ -6,7 +6,7 @@ .nothing-here-block { text-align: center; - padding: 20px; + padding: 16px; color: $gl-text-color; font-weight: $gl-font-weight-normal; font-size: 14px; diff --git a/app/assets/stylesheets/framework/diffs.scss b/app/assets/stylesheets/framework/diffs.scss index f8b1735207c..61a20c7a8fd 100644 --- a/app/assets/stylesheets/framework/diffs.scss +++ b/app/assets/stylesheets/framework/diffs.scss @@ -839,6 +839,18 @@ table.code { } } +.commits-container { + .diff-files-changed { + @include media-breakpoint-up(sm) { + top: $header-height; + + .with-performance-bar & { + top: $header-height + $performance-bar-height; + } + } + } +} + .diff-files-changed { .inline-parallel-buttons { position: relative; @@ -854,12 +866,12 @@ table.code { @include media-breakpoint-up(sm) { position: -webkit-sticky; position: sticky; - top: $header-height; + top: $header-height + $mr-tabs-height; background-color: $white; z-index: 200; .with-performance-bar & { - top: $header-height + $performance-bar-height; + top: $header-height + $mr-tabs-height + $performance-bar-height; } &.is-stuck { diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss index 144a396ea65..b05fbfaae6c 100644 --- a/app/assets/stylesheets/framework/dropdowns.scss +++ b/app/assets/stylesheets/framework/dropdowns.scss @@ -50,12 +50,6 @@ width: 100%; } - &.frequent-items-dropdown-menu { - padding: 0; - overflow-y: initial; - max-height: initial; - } - // `GlDropdown` specifies the `max-height` of `.gl-new-dropdown-inner` // as `$dropdown-max-height`, but the `max-height` rule above forces // the parent `.dropdown-menu` to be _slightly_ too small because of @@ -834,61 +828,11 @@ } } -header.header-content .dropdown-menu.frequent-items-dropdown-menu { - padding: 0; -} - .frequent-items-dropdown-container { display: flex; flex-direction: row; height: $grid-size * 40; - &.with-deprecated-styles { - width: 500px; - height: 354px; - - .section-header, - .frequent-items-list-container li.section-empty { - padding: 0 $gl-padding; - } - - .search-input-container { - position: relative; - padding: 4px $gl-padding; - - .search-icon { - position: absolute; - top: 13px; - right: 25px; - color: $gray-300; - } - } - - @include media-breakpoint-down(xs) { - flex-direction: column; - width: 100%; - height: auto; - flex: 1; - - .frequent-items-dropdown-sidebar, - .frequent-items-dropdown-content { - width: 100%; - } - - .frequent-items-dropdown-sidebar { - border-bottom: 1px solid $border-color; - border-right: 0; - } - } - - .frequent-items-list-container { - width: auto; - height: auto; - padding-bottom: 0; - } - } - - .frequent-items-dropdown-sidebar, .frequent-items-dropdown-content { @include gl-pt-3; } @@ -897,11 +841,6 @@ header.header-content .dropdown-menu.frequent-items-dropdown-menu { color: $almost-black; } - .frequent-items-dropdown-sidebar { - width: 30%; - border-right: 1px solid $border-color; - } - .frequent-items-dropdown-content { position: relative; width: 70%; diff --git a/app/assets/stylesheets/framework/files.scss b/app/assets/stylesheets/framework/files.scss index 5ad7ceecb2b..df78543f96d 100644 --- a/app/assets/stylesheets/framework/files.scss +++ b/app/assets/stylesheets/framework/files.scss @@ -15,6 +15,16 @@ border-top: 0; border-radius: $border-radius-default; + &.file-holder-top-border { + border-top: 1px solid $border-color; + + .file-title { + // Prevents the top border getting clipped by the background + border-top-left-radius: $border-radius-default; + border-top-right-radius: $border-radius-default; + } + } + &.file-holder-no-border { border: 0; } @@ -136,6 +146,13 @@ * Blame file */ &.blame { + // + // IMPORTANT PERFORMANCE OPTIMIZATION + // + // When viewinng a blame with many commits a lot of content is rendered on the page. + // The line below ensures that we only render what is visible to the user, thus reducing TBT in the browser. + content-visibility: auto; + table { border: 0; margin: 0; @@ -150,6 +167,12 @@ } td { + // + // IMPORTANT PERFORMANCE OPTIMIZATION + // + // When viewinng a blame with many commits a lot of content is rendered on the page. + // The line below ensures that we only render what is visible to the user, thus reducing TBT in the browser. + content-visibility: auto; border-top: 0; border-bottom: 0; @@ -509,6 +532,24 @@ span.idiff { } } +.version-link { + @include gl-display-inline-block; + @include gl-align-self-center; + @include gl-mt-2; + @include gl-w-5; + @include gl-h-5; + @include gl-float-left; + background-color: $gray-400; + mask-image: asset_url('icons-stacked.svg#doc-versions'); + mask-repeat: no-repeat; + mask-size: cover; + mask-position: center; + + &:hover { + background-color: $black; + } +} + // // IMPORTANT PERFORMANCE OPTIMIZATION BELOW // @@ -530,3 +571,18 @@ span.idiff { // will always be expanded to the maximum needed width. .blob-viewer[data-loading] .file-content.code .line:nth-of-type(1n+70):not(:last-of-type), .blob-viewer[data-loading] .file-content.code .file-line-num:nth-of-type(1n+70):not(:last-of-type) {display: none !important;} + +.blob-viewer[data-loading] .file-content.code .line:nth-of-type(69):not(:last-of-type), +.blob-viewer[data-loading] .file-content.code .file-line-num:nth-of-type(69):not(:last-of-type) { + &::after { + @include gl-display-block; + @include gl-font-weight-bold; + content: '\2026'; + } +} + +.blob-viewer[data-loading] .file-content.code .line:nth-of-type(69):not(:last-of-type) { + &::after { + @include gl-text-center; + } +} diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss index 65d914e47cf..ae46ff33ec0 100644 --- a/app/assets/stylesheets/framework/header.scss +++ b/app/assets/stylesheets/framework/header.scss @@ -27,17 +27,6 @@ $top-nav-hover-bg: var(--indigo-900-alpha-008, $indigo-900-alpha-008) !important display: none; } - .menu-expanded { - .more-icon { - display: none; - } - - .close-icon { - display: block; - margin: auto; - } - } - .header-content { width: 100%; display: flex; @@ -103,18 +92,6 @@ $top-nav-hover-bg: var(--indigo-900-alpha-008, $indigo-900-alpha-008) !important .navbar-collapse > ul.nav > li:not(.d-none) { margin: 0 2px; } - - &.menu-expanded { - @include media-breakpoint-down(xs) { - .hide-when-menu-expanded { - display: none; - } - - .navbar-collapse { - display: flex; - } - } - } } .navbar-collapse { @@ -673,19 +650,30 @@ $top-nav-hover-bg: var(--indigo-900-alpha-008, $indigo-900-alpha-008) !important } .top-nav-responsive-open { - .hide-when-top-nav-responsive-open { - @include media-breakpoint-down(xs) { + .more-icon { + display: none; + } + + .close-icon { + display: block; + margin: auto; + } + + @include media-breakpoint-down(xs) { + .navbar-collapse { + display: flex; + } + + .hide-when-top-nav-responsive-open { display: none !important; } - } - .top-nav-responsive { - @include media-breakpoint-down(xs) { + .top-nav-responsive { @include gl-display-block; } - } - .navbar-gitlab .header-content .title-container { - flex: 0; + .navbar-gitlab .header-content .title-container { + flex: 0; + } } } diff --git a/app/assets/stylesheets/framework/markdown_area.scss b/app/assets/stylesheets/framework/markdown_area.scss index 2a97009e605..7315bce1ed9 100644 --- a/app/assets/stylesheets/framework/markdown_area.scss +++ b/app/assets/stylesheets/framework/markdown_area.scss @@ -83,6 +83,7 @@ li.md-header-toolbar { margin-left: auto; display: none; + padding-bottom: $gl-padding-8; &.active { display: block; @@ -92,8 +93,8 @@ display: flex; justify-content: center; width: 100%; - padding-top: $gl-padding-top; - padding-bottom: $gl-padding-top; + flex-wrap: wrap; + margin-top: $gl-padding-8; } } } @@ -131,36 +132,6 @@ width: 100%; } -.toolbar-btn { - float: left; - padding: 0 7px; - background: transparent; - border: 0; - outline: 0; - - svg { - width: 14px; - height: 14px; - vertical-align: middle; - fill: $gl-text-color-secondary; - } - - &:hover, - &:focus { - svg { - fill: $blue-600; - } - } -} - -.toolbar-fullscreen-btn { - margin-right: -5px; - - @include media-breakpoint-down(xs) { - margin-right: 0; - } -} - .md-suggestion-diff { display: table !important; border: 1px solid $border-color !important; diff --git a/app/assets/stylesheets/framework/secondary_navigation_elements.scss b/app/assets/stylesheets/framework/secondary_navigation_elements.scss index f904ef11f5b..06eebb95438 100644 --- a/app/assets/stylesheets/framework/secondary_navigation_elements.scss +++ b/app/assets/stylesheets/framework/secondary_navigation_elements.scss @@ -14,7 +14,6 @@ a, button { padding: $gl-padding-8; - padding-bottom: $gl-padding-8 + 1; font-size: 14px; line-height: 28px; color: $gl-text-color-secondary; diff --git a/app/assets/stylesheets/framework/sidebar.scss b/app/assets/stylesheets/framework/sidebar.scss index e35feb8c62d..6b3201ba2b0 100644 --- a/app/assets/stylesheets/framework/sidebar.scss +++ b/app/assets/stylesheets/framework/sidebar.scss @@ -237,3 +237,7 @@ @include side-panel-toggle; border-bottom: 1px solid $border-color; } + +.edit-link { + margin-right: -$gl-spacing-scale-2; +} diff --git a/app/assets/stylesheets/framework/source_editor.scss b/app/assets/stylesheets/framework/source_editor.scss index a967d9a71f1..8b694b9be05 100644 --- a/app/assets/stylesheets/framework/source_editor.scss +++ b/app/assets/stylesheets/framework/source_editor.scss @@ -25,6 +25,21 @@ height: 500px; } +.source-editor-preview { + @include gl-display-flex; + + .md { + @include gl-overflow-scroll; + @include gl-px-6; + @include gl-py-4; + @include gl-w-full; + } + + .gl-source-editor { + @include gl-order-n1; + } +} + .monaco-editor.gl-source-editor { .margin-view-overlays { .line-numbers { diff --git a/app/assets/stylesheets/lazy_bundles/select2_overrides.scss b/app/assets/stylesheets/lazy_bundles/select2_overrides.scss index 272f94176d0..3e5271f84d5 100644 --- a/app/assets/stylesheets/lazy_bundles/select2_overrides.scss +++ b/app/assets/stylesheets/lazy_bundles/select2_overrides.scss @@ -14,7 +14,7 @@ .select2-choice { background: var(--white, $white); color: var(--gl-text-color, $gl-text-color); - border-color: var(--border-color, $border-color); + border-color: var(--gray-400, $gray-400); height: 34px; padding: $gl-vert-padding $gl-input-padding; font-size: $gl-font-size; @@ -41,7 +41,7 @@ } &:hover { - border-color: var(--gray-200, $gray-200); + border-color: var(--gray-400, $gray-400); color: var(--gl-text-color, $gl-text-color); } } @@ -99,7 +99,7 @@ background: var(--white, $white); box-shadow: 0 2px 4px $dropdown-shadow-color; border-radius: $gl-border-radius-base; - border: 1px solid var(--border-color, $border-color); + border: 1px solid var(--gray-400, $gray-400); min-width: 175px; color: var(--gl-text-color, $gl-text-color); z-index: 999; @@ -118,7 +118,7 @@ } .select2-drop.select2-drop-above.select2-drop-active { - border-top: 1px solid var(--border-color, $border-color); + border-top: 1px solid var(--gray-400, $gray-400); margin-top: -6px; } @@ -132,7 +132,7 @@ .select2-dropdown-open, .select2-dropdown-open.select2-drop-above { .select2-choice { - border-color: var(--border-color, $border-color); + border-color: var(--gray-400, $gray-400); outline: 0; } } @@ -140,7 +140,7 @@ .select2-container-multi { .select2-choices { border-radius: $border-radius-default; - border-color: var(--border-color, $border-color); + border-color: var(--gray-400, $gray-400); background: none; .select2-search-field input { @@ -153,7 +153,7 @@ .select2-search-choice { margin: 5px 0 0 8px; box-shadow: none; - border-color: var(--border-color, $border-color); + border-color: var(--gray-400, $gray-400); color: var(--gl-text-color, $gl-text-color); line-height: 15px; background-color: var(--gray-50, $gray-50); @@ -167,7 +167,7 @@ } &.select2-search-choice-focus { - border-color: var(--gl-text-color, $gl-text-color); + border-color: var(--gray-400, $gray-400); } } } @@ -197,7 +197,7 @@ background-origin: content-box; background-repeat: no-repeat; background-position: right 0 bottom 0 !important; - border: 1px solid var(--border-color, $border-color); + border: 1px solid var(--gray-400, $gray-400); border-radius: $border-radius-default; line-height: 16px; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; diff --git a/app/assets/stylesheets/page_bundles/boards.scss b/app/assets/stylesheets/page_bundles/boards.scss index 428bd90ddd7..10183f774b1 100644 --- a/app/assets/stylesheets/page_bundles/boards.scss +++ b/app/assets/stylesheets/page_bundles/boards.scss @@ -153,16 +153,16 @@ // pseudo-element that is the same size as our element, then // animate opacity/transform to give a soothing single pulse .board-column-highlighted::after { + @include gl-focus; content: ''; position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; + top: -1px; + bottom: -1px; + left: -1px; + right: -1px; pointer-events: none; opacity: 0; - z-index: -1; - box-shadow: 0 0 6px 3px $blue-200; + border-radius: $border-radius-default; animation-name: board-column-flash-border; animation-duration: 1.2s; animation-fill-mode: forwards; @@ -173,18 +173,11 @@ 0%, 100% { opacity: 0; - transform: scale(0.98); } 25%, 75% { opacity: 1; - transform: scale(0.99); - } - - 50% { - opacity: 1; - transform: scale(1); } } @@ -476,6 +469,10 @@ .gl-drawer-header { align-items: flex-start; } + + .labels-select-wrapper.is-embedded .labels-select-wrapper.is-embedded { + width: auto; + } } .board-header-collapsed-info-icon:hover { diff --git a/app/assets/stylesheets/page_bundles/import.scss b/app/assets/stylesheets/page_bundles/import.scss index 525481638f3..c74b5460e1a 100644 --- a/app/assets/stylesheets/page_bundles/import.scss +++ b/app/assets/stylesheets/page_bundles/import.scss @@ -22,16 +22,11 @@ .import-entities-target-select { &.disabled { - .import-entities-target-select-separator, - .select2-container.select2-container-disabled .select2-choice { + .import-entities-target-select-separator { color: var(--gray-400, $gray-400); border-color: var(--gray-100, $gray-100); background-color: var(--gray-10, $gray-10); } - - .select2-container.select2-container-disabled .select2-choice .select2-arrow { - background-color: var(--gray-10, $gray-10); - } } .import-entities-target-select-separator { @@ -39,20 +34,6 @@ background-color: var(--gray-10, $gray-10); } - .select2-container { - > .select2-choice { - .select2-arrow { - background-color: var(--white, $white); - } - - border-color: var(--gray-200, $gray-200); - color: var(--gray-900, $gray-900) !important; - background-color: var(--white, $white) !important; - border-top-right-radius: 0; - border-bottom-right-radius: 0; - } - } - .gl-form-input { box-shadow: inset 0 0 0 1px var(--gray-200, $gray-200); } diff --git a/app/assets/stylesheets/page_bundles/wiki.scss b/app/assets/stylesheets/page_bundles/wiki.scss index 5525ad66e42..1e6567189be 100644 --- a/app/assets/stylesheets/page_bundles/wiki.scss +++ b/app/assets/stylesheets/page_bundles/wiki.scss @@ -1,5 +1,6 @@ @import 'mixins_and_variables_and_functions'; @import 'highlight.js/scss/a11y-light'; +@import 'components/content_editor'; .title .edit-wiki-header { width: 780px; diff --git a/app/assets/stylesheets/pages/events.scss b/app/assets/stylesheets/pages/events.scss index c8da025131d..33d00027404 100644 --- a/app/assets/stylesheets/pages/events.scss +++ b/app/assets/stylesheets/pages/events.scss @@ -154,21 +154,6 @@ } } -/* - * Last push widget - */ -.event-last-push { - width: 100%; - display: flex; - align-items: center; - - .event-last-push-text { - @include str-truncated(100%); - font-size: 13px; - margin-right: $gl-padding; - } -} - @include media-breakpoint-down(xs) { .event-item { padding-left: 0; diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss index 8807ab5e597..071a5be073f 100644 --- a/app/assets/stylesheets/pages/merge_requests.scss +++ b/app/assets/stylesheets/pages/merge_requests.scss @@ -1003,10 +1003,10 @@ $tabs-holder-z-index: 250; .mr-compare { .diff-file .file-title-flex-parent { - top: $header-height + 51px; + top: $header-height + $mr-tabs-height + 36px; .with-performance-bar & { - top: $performance-bar-height + $header-height + 51px; + top: $performance-bar-height + $header-height + $mr-tabs-height + 36px; } } } diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss index c025d8569a7..34a03a07405 100644 --- a/app/assets/stylesheets/pages/note_form.scss +++ b/app/assets/stylesheets/pages/note_form.scss @@ -54,7 +54,7 @@ .common-note-form { .md-area { - padding: $gl-padding-top $gl-padding; + padding: $gl-padding-8 $gl-padding; border: 1px solid $border-color; border-radius: $border-radius-base; transition: border-color ease-in-out 0.15s, @@ -295,12 +295,6 @@ table { } } } - - @include media-breakpoint-down(xs) { - .btn { - width: 100%; - } - } } .discussion-reply-holder { diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss index 4a866489806..17bc40b4dec 100644 --- a/app/assets/stylesheets/pages/notes.scss +++ b/app/assets/stylesheets/pages/notes.scss @@ -649,7 +649,7 @@ $system-note-svg-size: 16px; @include media-breakpoint-down(xs) { width: 100%; - margin: $gl-padding-8 0; + margin: 0 0 $gl-padding-8; } .btn-group > .discussion-next-btn { diff --git a/app/assets/stylesheets/pages/search.scss b/app/assets/stylesheets/pages/search.scss index 5fbb2e6443f..8f5de73365b 100644 --- a/app/assets/stylesheets/pages/search.scss +++ b/app/assets/stylesheets/pages/search.scss @@ -13,10 +13,6 @@ $search-sidebar-max-width: 300px; border-bottom: 0; } } - - .blob-result { - margin: 5px 0; - } } .search-sidebar { diff --git a/app/assets/stylesheets/startup/startup-dark.scss b/app/assets/stylesheets/startup/startup-dark.scss index a497f56f3b8..a90751f772e 100644 --- a/app/assets/stylesheets/startup/startup-dark.scss +++ b/app/assets/stylesheets/startup/startup-dark.scss @@ -336,9 +336,6 @@ h1 { .d-none { display: none !important; } -.d-inline-block { - display: inline-block !important; -} .d-block { display: block !important; } @@ -363,11 +360,6 @@ h1 { display: block !important; } } -@media (min-width: 1200px) { - .d-xl-block { - display: block !important; - } -} .sr-only { position: absolute; width: 1px; @@ -488,7 +480,7 @@ body { .btn:active, .btn.active { background-color: #444; - border-color: #fafafa; + border-color: #4f4f4f; color: #fafafa; } .btn svg { @@ -1407,10 +1399,6 @@ svg.s16 { width: 16px; height: 16px; } -svg.s18 { - width: 18px; - height: 18px; -} svg.s32 { width: 32px; height: 32px; @@ -1499,12 +1487,6 @@ svg.s16 { height: 16px; margin-right: 8px; } -.avatar.s18, -.avatar-container.s18 { - width: 18px; - height: 18px; - margin-right: 8px; -} .avatar.s32, .avatar-container.s32 { width: 32px; @@ -1583,9 +1565,6 @@ svg.s16 { .rect-avatar.s16 { border-radius: 2px; } -.rect-avatar.s18 { - border-radius: 2px; -} .rect-avatar.s32, .nav-sidebar-inner-scroll > div.context-header diff --git a/app/assets/stylesheets/startup/startup-general.scss b/app/assets/stylesheets/startup/startup-general.scss index 76d10300307..0b2d34b6f5d 100644 --- a/app/assets/stylesheets/startup/startup-general.scss +++ b/app/assets/stylesheets/startup/startup-general.scss @@ -317,9 +317,6 @@ h1 { .d-none { display: none !important; } -.d-inline-block { - display: inline-block !important; -} .d-block { display: block !important; } @@ -344,11 +341,6 @@ h1 { display: block !important; } } -@media (min-width: 1200px) { - .d-xl-block { - display: block !important; - } -} .sr-only { position: absolute; width: 1px; @@ -1388,10 +1380,6 @@ svg.s16 { width: 16px; height: 16px; } -svg.s18 { - width: 18px; - height: 18px; -} svg.s32 { width: 32px; height: 32px; @@ -1480,12 +1468,6 @@ svg.s16 { height: 16px; margin-right: 8px; } -.avatar.s18, -.avatar-container.s18 { - width: 18px; - height: 18px; - margin-right: 8px; -} .avatar.s32, .avatar-container.s32 { width: 32px; @@ -1564,9 +1546,6 @@ svg.s16 { .rect-avatar.s16 { border-radius: 2px; } -.rect-avatar.s18 { - border-radius: 2px; -} .rect-avatar.s32, .nav-sidebar-inner-scroll > div.context-header diff --git a/app/assets/stylesheets/themes/_dark.scss b/app/assets/stylesheets/themes/_dark.scss index ea7aaaa8ec8..8e1438eaf8a 100644 --- a/app/assets/stylesheets/themes/_dark.scss +++ b/app/assets/stylesheets/themes/_dark.scss @@ -184,10 +184,24 @@ body.gl-dark { } } } + + .gl-datepicker-theme { + .pika-prev, + .pika-next { + filter: invert(0.9); + } + + .is-selected > .pika-button { + color: $gray-900; + } + + :not(.is-selected) > .pika-button:hover { + background-color: $gray-200; + } + } } -$border-white-light: $gray-900; -$border-white-normal: $gray-900; +$border-white-normal: $border-color; $body-bg: $gray-10; $input-bg: $white; diff --git a/app/assets/stylesheets/utilities.scss b/app/assets/stylesheets/utilities.scss index 10334d771b8..ccad503c1ed 100644 --- a/app/assets/stylesheets/utilities.scss +++ b/app/assets/stylesheets/utilities.scss @@ -87,12 +87,6 @@ padding-bottom: $gl-spacing-scale-8; } -// Will be moved to @gitlab/ui in https://gitlab.com/gitlab-org/gitlab-ui/-/issues/1495 -.gl-py-13 { - padding-top: $gl-spacing-scale-13; - padding-bottom: $gl-spacing-scale-13; -} - .gl-transition-property-stroke-opacity { transition-property: stroke-opacity; } @@ -203,6 +197,10 @@ margin-bottom: -$gl-spacing-scale-3; } +.gl-mr-n2 { + margin-right: -$gl-spacing-scale-2; +} + // Will be moved to @gitlab/ui in https://gitlab.com/gitlab-org/gitlab-ui/-/issues/1408 $gl-line-height-42: px-to-rem(42px); @@ -228,6 +226,10 @@ $gl-line-height-42: px-to-rem(42px); max-height: none !important; } +.gl-max-w-50p { + max-width: 50%; +} + // Will be moved to @gitlab/ui by https://gitlab.com/gitlab-org/gitlab-ui/-/issues/1465 .gl-popover { .popover-header { @@ -247,3 +249,12 @@ $gl-line-height-42: px-to-rem(42px); .gl-min-w-8 { min-width: $gl-spacing-scale-8; } + +// Will both be moved to @gitlab/ui by https://gitlab.com/gitlab-org/gitlab-ui/-/issues/1526 +.gl-opacity-6 { + opacity: 0.6; +} + +.gl-opacity-7 { + opacity: 0.7; +} |