diff options
Diffstat (limited to 'app/assets/stylesheets/page_bundles')
8 files changed, 74 insertions, 214 deletions
diff --git a/app/assets/stylesheets/page_bundles/alert_management_settings.scss b/app/assets/stylesheets/page_bundles/alert_management_settings.scss index fb7c1602cba..ed2707ffbcd 100644 --- a/app/assets/stylesheets/page_bundles/alert_management_settings.scss +++ b/app/assets/stylesheets/page_bundles/alert_management_settings.scss @@ -6,7 +6,6 @@ $stroke-size: 1px; @include gl-relative; @include gl-w-full; height: $stroke-size; - @include gl-display-inline-block; background-color: var(--gray-400, $gray-400); min-width: $gl-spacing-scale-5; diff --git a/app/assets/stylesheets/page_bundles/boards.scss b/app/assets/stylesheets/page_bundles/boards.scss index fdf9e157e1e..a00a71b07e7 100644 --- a/app/assets/stylesheets/page_bundles/boards.scss +++ b/app/assets/stylesheets/page_bundles/boards.scss @@ -40,8 +40,8 @@ [data-page$='epic_boards:index'], [data-page$='epic_boards:show'] { - .filter-form { - display: none; + .filtered-search-wrapper { + display: none !important; } } @@ -365,7 +365,7 @@ margin: 5px; } -.right-sidebar.issue-boards-sidebar { +.right-sidebar.boards-sidebar { .gutter-toggle { bottom: 15px; width: 22px; @@ -401,99 +401,6 @@ } } -.add-issues-modal { - background-color: rgba($black, 0.3); - z-index: 9999; -} - -.add-issues-container { - width: 90vw; - height: 85vh; - max-width: 1100px; - min-height: 500px; - padding: 25px 15px 0; - background-color: var(--white, $white); - box-shadow: 0 2px 12px rgba(var(--black, $black), 0.5); - - .empty-state { - &.add-issues-empty-state-filter { - flex-direction: column; - justify-content: center; - } - - .svg-content { - margin-top: -40px; - } - } -} - -.add-issues-header { - margin: -25px -15px -5px; - border-bottom: 1px solid $border-color; - border-top-right-radius: $border-radius-default; - border-top-left-radius: $border-radius-default; - - > h2 { - font-size: 18px; - } -} - -.add-issues-list-column { - width: 100%; - - @include media-breakpoint-up(sm) { - width: 50%; - } - - @include media-breakpoint-up(md) { - width: (100% / 3); - } -} - -.add-issues-list { - padding-top: 3px; - margin-left: -$gl-vert-padding; - margin-right: -$gl-vert-padding; - overflow-y: scroll; - - .board-card-parent { - padding: 0 5px 5px; - } - - .board-card { - border: 1px solid var(--gray-900, $gray-900); - box-shadow: 0 1px 2px rgba(var(--black, $black), 0.4); - cursor: pointer; - } -} - -.add-issues-footer { - margin: auto -15px 0; - padding-left: 15px; - padding-right: 15px; - border-bottom-right-radius: $border-radius-default; - border-bottom-left-radius: $border-radius-default; -} - -.add-issues-footer-to-list { - padding-left: $gl-vert-padding; - padding-right: $gl-vert-padding; - line-height: $input-height; -} - -.issue-card-selected { - position: absolute; - right: -3px; - top: -3px; - width: 17px; - background-color: var(--blue-500, $blue-500); - color: $white; - border: 1px solid var(--blue-600, $blue-600); - font-size: 9px; - line-height: 15px; - border-radius: 50%; -} - .board-card-info { color: var(--gray-500, $gray-500); white-space: nowrap; @@ -555,12 +462,28 @@ overflow-x: scroll; } - .issue-boards-sidebar { + .boards-sidebar { height: 100%; top: 0; } } +.boards-sidebar { + .sidebar-collapsed-icon { + display: none; + } +} + .board-header-collapsed-info-icon:hover { color: var(--gray-900, $gray-900); } + +.board-card-skeleton { + height: 110px; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); + + .board-card-skeleton-inner { + width: 340px; + height: 100px; + } +} diff --git a/app/assets/stylesheets/page_bundles/build.scss b/app/assets/stylesheets/page_bundles/build.scss index 34f88f9405a..b91850f1775 100644 --- a/app/assets/stylesheets/page_bundles/build.scss +++ b/app/assets/stylesheets/page_bundles/build.scss @@ -8,9 +8,9 @@ .archived-job { top: $header-height; border-radius: 2px 2px 0 0; - color: $orange-600; - background-color: $orange-50; - border: 1px solid $border-gray-normal; + color: var(--orange-600, $orange-600); + background-color: var(--orange-50, $orange-50); + border: 1px solid var(--border-color, $border-color); padding: 3px 12px; margin: auto; align-items: center; @@ -86,33 +86,17 @@ padding: 10px 0 9px; } - .header-action-buttons { - display: flex; - - @include media-breakpoint-down(xs) { - .sidebar-toggle-btn { - margin-top: 0; - margin-left: 10px; - max-height: 34px; - } - } - } - .header-content { a { - color: $gl-text-color; + color: var(--gl-text-color, $gl-text-color); &:hover { - color: $blue-600; + color: var(--blue-600, $blue-600); text-decoration: none; } } } - code { - color: $code-color; - } - .avatar { float: none; margin-right: 2px; @@ -160,12 +144,12 @@ .trigger-build-variable { font-weight: $gl-font-weight-normal; - color: $code-color; + color: var(--gray-950, $gray-950); } .trigger-build-value { padding: 2px 4px; - color: $black; + color: var(--black, $black); } .trigger-variables-table-cell { @@ -185,7 +169,7 @@ cursor: pointer; &:hover { - color: $gl-text-color; + color: var(--gl-text-color, $gl-text-color); } } @@ -223,7 +207,7 @@ } &.retried { - background-color: $gray-lightest; + background-color: var(--gray-10, $gray-10); } &:hover { @@ -231,10 +215,6 @@ } } } - - .link-commit { - color: var(--blue-600, $blue-600); - } } .build-sidebar { diff --git a/app/assets/stylesheets/page_bundles/ci_status.scss b/app/assets/stylesheets/page_bundles/ci_status.scss index 232d363b7f1..6b976106cc9 100644 --- a/app/assets/stylesheets/page_bundles/ci_status.scss +++ b/app/assets/stylesheets/page_bundles/ci_status.scss @@ -80,17 +80,3 @@ } } } - -.d-block.d-sm-none-inline { - .ci-status-link { - position: relative; - top: 2px; - left: 5px; - } -} - -.ci-status-link { - svg { - overflow: visible; - } -} diff --git a/app/assets/stylesheets/page_bundles/jira_connect.scss b/app/assets/stylesheets/page_bundles/jira_connect.scss index eb2dd6e578e..db4be3f18e8 100644 --- a/app/assets/stylesheets/page_bundles/jira_connect.scss +++ b/app/assets/stylesheets/page_bundles/jira_connect.scss @@ -4,37 +4,22 @@ @import 'bootstrap-vue/src/index'; @import '@gitlab/ui/src/scss/utilities'; -@import '@gitlab/ui/src/components/base/alert/alert'; // We should only import styles that we actually use. @import '@gitlab/ui/src/components/base/alert/alert'; @import '@gitlab/ui/src/components/base/avatar/avatar'; -@import '@gitlab/ui/src/components/base/badge/badge'; @import '@gitlab/ui/src/components/base/button/button'; @import '@gitlab/ui/src/components/base/icon/icon'; @import '@gitlab/ui/src/components/base/link/link'; @import '@gitlab/ui/src/components/base/loading_icon/loading_icon'; @import '@gitlab/ui/src/components/base/modal/modal'; @import '@gitlab/ui/src/components/base/pagination/pagination'; -@import '@gitlab/ui/src/components/base/tabs/tabs/tabs'; +@import '@gitlab/ui/src/components/base/table/table'; @import '@gitlab/ui/src/components/base/tooltip/tooltip'; +@import '@gitlab/ui/src/components/base/search_box_by_type/search_box_by_type'; -$atlaskit-border-color: #dfe1e6; $header-height: 40px; -.subscription-form { - .field-group-input { - display: flex; - padding-top: $gl-padding-4; - - .ak-button { - align-items: center; - height: auto; - margin-left: $btn-margin-5; - } - } -} - .jira-connect-header { min-height: $header-height; position: fixed; @@ -56,45 +41,7 @@ $header-height: 40px; } .jira-connect-app-body { - max-width: 600px; + max-width: 768px; margin-left: auto; margin-right: auto; } - -// for external_link buttons -svg { - fill: currentColor; - - &.s16 { - height: 16px; - width: 16px; - } -} - -.ak-field-group label { - text-align: left; -} - -.ak-button__appearance-primary { - &:hover { - color: $white; - text-decoration: none; - } - - svg { - align-self: center; - margin-left: 4px; - } -} - -.subscriptions { - tbody { - tr { - border-bottom: 1px solid $atlaskit-border-color; - } - - td { - padding: $gl-padding-8; - } - } -} diff --git a/app/assets/stylesheets/page_bundles/learn_gitlab.scss b/app/assets/stylesheets/page_bundles/learn_gitlab.scss index 189aefb330b..10a4a210d41 100644 --- a/app/assets/stylesheets/page_bundles/learn_gitlab.scss +++ b/app/assets/stylesheets/page_bundles/learn_gitlab.scss @@ -1,3 +1,11 @@ .learn-gitlab-info-card-content { height: 200px; } + +.learn-gitlab-section-card { + height: 400px; +} + +.learn-gitlab-section-card-header { + height: 165px; +} diff --git a/app/assets/stylesheets/page_bundles/merge_requests.scss b/app/assets/stylesheets/page_bundles/merge_requests.scss index 3263a5067ea..9fdc30359f8 100644 --- a/app/assets/stylesheets/page_bundles/merge_requests.scss +++ b/app/assets/stylesheets/page_bundles/merge_requests.scss @@ -9,6 +9,18 @@ min-width: 0; } +.with-system-header { + --system-header-height: #{$system-header-height}; +} + +.with-performance-bar { + --performance-bar-height: #{$performance-bar-height}; +} + +.review-bar-visible { + --review-bar-height: #{$mr-review-bar-height}; +} + .diff-tree-list { // This 11px value should match the additional value found in // /assets/stylesheets/framework/diffs.scss @@ -23,24 +35,13 @@ position: -webkit-sticky; position: sticky; - top: $top-pos; - max-height: calc(100vh - #{$top-pos}); + // Unitless zero values are not allowed in calculations https://stackoverflow.com/a/55391061 + // stylelint-disable-next-line length-zero-no-unit + top: calc(#{$top-pos} + var(--system-header-height, 0px) + var(--performance-bar-height, 0px)); + // stylelint-disable-next-line length-zero-no-unit + max-height: calc(100vh - #{$top-pos} - var(--system-header-height, 0px) - var(--performance-bar-height, 0px) - var(--review-bar-height, 0px)); z-index: 202; - .with-system-header & { - top: $top-pos + $system-header-height; - } - - .with-system-header.with-performance-bar & { - top: $top-pos + $system-header-height + $performance-bar-height; - } - - .with-performance-bar & { - $performance-bar-top-pos: $performance-bar-height + $top-pos; - top: $performance-bar-top-pos; - max-height: calc(100vh - #{$performance-bar-top-pos}); - } - .drag-handle { bottom: 16px; transform: translateX(10px); diff --git a/app/assets/stylesheets/page_bundles/pipeline.scss b/app/assets/stylesheets/page_bundles/pipeline.scss index d9ab52774bd..2f3cf889549 100644 --- a/app/assets/stylesheets/page_bundles/pipeline.scss +++ b/app/assets/stylesheets/page_bundles/pipeline.scss @@ -139,12 +139,28 @@ width: 186px; } +.gl-pipeline-job-width\! { + width: 186px !important; +} + .gl-linked-pipeline-padding { padding-right: 120px; } .gl-build-content { - @include build-content(); + display: inline-block; + padding: 8px 10px 9px; + width: 100%; + border: 1px solid var(--border-color, $border-color); + border-radius: 30px; + background-color: var(--white, $white); + + &:hover, + &:focus { + background-color: var(--gray-50, $gray-50); + border: 1px solid $dropdown-toggle-active-border-color; + color: var(--gl-text-color, $gl-text-color); + } } .gl-ci-action-icon-container { |