diff options
Diffstat (limited to 'app/assets/stylesheets/pages')
| -rw-r--r-- | app/assets/stylesheets/pages/labels.scss | 4 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/merge_requests.scss | 368 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/notes.scss | 1 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/projects.scss | 39 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/settings.scss | 57 |
5 files changed, 24 insertions, 445 deletions
diff --git a/app/assets/stylesheets/pages/labels.scss b/app/assets/stylesheets/pages/labels.scss index 15d4a0fec9a..29f2d15008b 100644 --- a/app/assets/stylesheets/pages/labels.scss +++ b/app/assets/stylesheets/pages/labels.scss @@ -91,12 +91,10 @@ .prioritized-labels:not(.is-not-draggable) & { cursor: grab; - border: 1px solid transparent; &:hover, &:focus-within { - background-color: $white; - border-color: $gray-50; + background-color: $blue-50; } &:active { diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss deleted file mode 100644 index 0a17b2c47a4..00000000000 --- a/app/assets/stylesheets/pages/merge_requests.scss +++ /dev/null @@ -1,368 +0,0 @@ -/** - * MR -> show: Automerge widget - * - */ -$tabs-holder-z-index: 250; -$comparison-empty-state-height: 62px; - -.space-children { - @include clearfix; - - > * { - float: left; - } - - > *:not(:first-child) { - margin-left: 10px; - } -} - -.media-section { - @include media-breakpoint-down(md) { - align-items: flex-start; - - .media-body { - flex-direction: column; - align-items: flex-start; - } - } - - .code-text { - @include media-breakpoint-up(lg) { - align-self: center; - flex: 1; - } - } -} - -.mr-state-widget { - .accept-merge-holder { - .accept-action { - .accept-merge-request { - &.ci-preparing, - &.ci-pending, - &.ci-running { - @include btn-blue; - } - - &.ci-skipped, - &.ci-failed, - &.ci-canceled, - &.ci-error { - @include btn-red; - } - } - } - } -} - -.mr_source_commit, -.mr_target_commit { - margin-bottom: 0; - - .commit { - margin: 0; - padding: 10px; - list-style: none; - - &:hover { - background: none; - } - } -} - -.compare-commit-empty { - min-height: $comparison-empty-state-height; -} - -.commits-empty { - text-align: center; - - h4 { - padding-top: 20px; - padding-bottom: 10px; - } - - svg { - width: 230px; - } -} - -.nothing-here-block { - img { - width: 230px; - } -} - -.mr-list { - .merge-request { - padding: 10px $gl-padding; - display: flex; - - .issuable-info-container { - flex: 1; - } - - .merge-request-title { - margin-bottom: 2px; - - .ci-status-link { - svg { - height: 16px; - width: 16px; - position: relative; - top: 3px; - } - - &:hover, - &:focus { - text-decoration: none; - } - } - } - } -} - -.card-new-merge-request { - .card-header { - padding: 5px 10px; - font-weight: $gl-font-weight-bold; - line-height: 25px; - } - - .card-body { - padding: 10px 5px; - } - - .card-footer { - padding: 0; - - .btn { - min-width: auto; - } - } - - .commit { - .commit-row-title { - margin-bottom: 4px; - } - - .item-title { - @include media-breakpoint-up(sm) { - width: 45%; - } - } - - .avatar { - left: 0; - top: 2px; - } - } - - .btn-clipboard { - margin-right: 5px; - padding: 0; - background: transparent; - } - - .ci-status-link { - margin-right: 5px; - } -} - -.merge-request-select { - padding-left: 5px; - padding-right: 5px; - margin-bottom: 10px; - - &:last-child { - margin-bottom: 0; - } - - @include media-breakpoint-up(xs) { - float: left; - width: 50%; - margin-bottom: 0; - } - - .gl-dropdown-custom-toggle { - @include gl-w-full; - } -} - -.issuable-form-select-holder { - display: inline-block; - width: 250px; - - .dropdown-menu-toggle { - width: 100%; - } -} - -.table-holder { - .ci-table { - th { - background-color: $white; - color: $gl-text-color-secondary; - } - } -} - -.merge-request-tabs-holder { - top: $calc-application-header-height; - z-index: $tabs-holder-z-index; - background-color: $body-bg; - border-bottom: 1px solid $border-color; - - @include media-breakpoint-up(md) { - position: sticky; - } - - &.affix { - left: 0; - transition: right 0.15s; - - @include media-breakpoint-down(xs) { - right: 0; - } - } - - .nav-links { - border: 0; - } -} - -.limit-container-width { - .merge-request-tabs-container { - max-width: $limited-layout-width; - margin-left: auto; - margin-right: auto; - - .inner-page-scroll-tabs { - background-color: $white; - margin-left: -$gl-padding; - padding-left: $gl-padding; - } - } -} - -.merge-request-tabs-container { - @include media-breakpoint-down(xs) { - .discussion-filter-container { - margin-bottom: $gl-padding-4; - } - } - - .discussion-filter-container { - &:not(:only-child) { - margin: $gl-padding-4; - } - } - - .merge-request-tabs { - height: $grid-size * 6; - } -} - -.container-fluid { - // Negative margins for mobile/tablet screen - .diffs.tab-pane { - margin: 0 (-$gl-padding); - } -} - -// Wrap MR tabs/buttons so you don't have to scroll on desktop -@include media-breakpoint-down(md) { - .merge-request-tabs-container { - flex-direction: column-reverse; - } -} - -@include media-breakpoint-down(lg) { - .right-sidebar-expanded { - .merge-request-tabs-container { - flex-direction: column-reverse; - align-items: flex-start; - } - } -} - -.limit-container-width:not(.container-limited) { - .merge-request-tabs-holder .merge-request-tabs-container { - max-width: $limited-layout-width - ($gl-padding * 2); - } -} - -.fork-sprite { - margin-right: -5px; -} - -// Hack alert: we've rewritten `btn` class in a way that -// we've broken it and it is not possible to use with `btn-link` -// which causes a blank button when it's disabled and hovering -// The css in here is the boostrap one -.btn-link-retry { - &[disabled] { - cursor: not-allowed; - box-shadow: none; - opacity: 0.65; - - &:hover { - color: $gray-500; - text-decoration: none; - } - } -} - -.merge-request-details .file-finder-overlay.diff-file-finder { - position: fixed; - z-index: 99999; - background: $black-transparent; -} - -.mr-compare { - .diff-file .file-title-flex-parent { - top: calc(#{$calc-application-header-height} + #{$mr-tabs-height}); - } -} - -.mr-experience-survey-wrapper { - // setting this explicitly because: - // diff-files-holder has z-index 203 - // z-index 9999 utility class breaks tooltips - z-index: 210; -} - -.mr-experience-survey-body { - width: 300px; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); -} - -.mr-experience-survey-legal { - order: 1; -} - -.mr-experience-survey-logo { - width: 16px; - - svg { - max-width: 100%; - } -} - -.survey-slide-up-enter { - transform: translateY(10px); - opacity: 0; -} - -.survey-slide-up-enter-active { - @include gl-transition-slow; -} - -.mr-compare-dropdown { - @include gl-w-full; - - .gl-button-text { - @include gl-w-full; - } -} diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss index 005fbc8b058..2722893d04c 100644 --- a/app/assets/stylesheets/pages/notes.scss +++ b/app/assets/stylesheets/pages/notes.scss @@ -222,6 +222,7 @@ $system-note-icon-m-left: $avatar-m-left + $icon-size-diff / $avatar-m-ratio; .discussion-reply-holder { border: 1px solid $border-color; + background-color: $white; } } diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 8cf0bebfc4e..b9cae28537d 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -65,7 +65,6 @@ white-space: normal; } - .deploy-project-label, .key-created-at { svg { vertical-align: text-top; @@ -83,18 +82,6 @@ .deploy-project-list { margin-bottom: -$gl-padding-4; - - a.deploy-project-label { - margin-right: $gl-padding-4; - margin-bottom: $gl-padding-4; - color: $gl-text-color-secondary; - background-color: $gray-50; - line-height: $gl-btn-line-height; - - &:hover { - color: $blue-600; - } - } } .vs-public { @@ -493,32 +480,6 @@ } } -.protected-branches-list, -.protected-tags-list { - margin-bottom: 32px; - - .settings-message { - margin: 0; - border-radius: 0 0 1px 1px; - padding: 20px 0; - border: 0; - } - - .table-bordered { - border-radius: 1px; - - th:not(:last-child), - td:not(:last-child) { - border-right: solid 1px transparent; - } - } - - .flash-container { - padding: 0; - } -} - - .compare-revision-cards { @media (max-width: $breakpoint-lg) { .swap-button { diff --git a/app/assets/stylesheets/pages/settings.scss b/app/assets/stylesheets/pages/settings.scss index 728eb1fe441..0ec342b9332 100644 --- a/app/assets/stylesheets/pages/settings.scss +++ b/app/assets/stylesheets/pages/settings.scss @@ -50,25 +50,7 @@ } } -.ci-variable-table, -.deploy-freeze-table, -.ci-secure-files-table { - table { - tr { - td, - th { - padding-left: 0; - } - - // When tables are "stacked", restore td padding - @media(max-width: map-get($grid-breakpoints, lg)) { - td { - padding-left: $gl-spacing-scale-5; - } - } - } - } - +.deploy-freeze-table { @media(max-width: map-get($grid-breakpoints, lg)-1) { .truncated-container { justify-content: flex-end; @@ -76,26 +58,27 @@ } } -.settings-section { - @include gl-pt-6; - - &::after { - content: ''; - display: block; - @include gl-pb-5; - } +.settings-section::after { + content: ''; + display: block; + @include gl-mb-7; } .settings-section, -.settings-section-no-bottom + .settings-section { +.settings-section-no-bottom ~ .settings-section { @include gl-pt-0; } +// Fix for sticky header when there is no search bar. +.flash-container + .settings-section { + @include gl-pt-3; +} + .settings-section ~ .settings-section { @include gl-pt-6; } -.settings-section:not(.settings-section-no-bottom) + .settings-section { +.settings-section:not(.settings-section-no-bottom) ~ .settings-section { @include gl-border-t; } @@ -124,21 +107,25 @@ $sticky-header-z-index: 98; display: block; height: $gl-padding-8; position: sticky; - top: calc(#{$calc-application-header-height} + 40px); - box-shadow: 0 1px 1px $gray-200; + top: calc(#{$calc-application-header-height} + 36px); + box-shadow: 0 1px 0 $gray-100; } } .settings-sticky-header-inner { position: sticky; - padding: $gl-padding $gl-padding $gl-padding-12; + padding: $gl-padding-12 $gl-padding $gl-padding-8; margin: #{-$gl-padding} #{-$gl-padding} 0; background: $body-bg; } .settings-sticky-footer { bottom: 0; - padding-top: $gl-padding-8; - padding-bottom: $gl-padding-8; - box-shadow: 0 #{-$gl-padding-4} $gl-padding-12 $gl-padding-4 $body-bg; + padding: $gl-padding-8 0; + box-shadow: 0 -1px 0 $gray-100; +} + +// Header shouldn't be sticky if only one section on page +.settings-sticky-header:first-of-type:last-of-type { + position: static; } |