diff options
Diffstat (limited to 'app/assets/stylesheets/pages')
| -rw-r--r-- | app/assets/stylesheets/pages/awards.scss | 25 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/builds.scss | 98 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/confirmation.scss | 10 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/detail_page.scss | 2 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/issuable.scss | 6 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/labels.scss | 138 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/merge_requests.scss | 10 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/note_form.scss | 46 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/notes.scss | 58 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/projects.scss | 18 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/search.scss | 6 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/xterm.scss | 19 |
12 files changed, 322 insertions, 114 deletions
diff --git a/app/assets/stylesheets/pages/awards.scss b/app/assets/stylesheets/pages/awards.scss index 37bf38fa65d..6211f3a52eb 100644 --- a/app/assets/stylesheets/pages/awards.scss +++ b/app/assets/stylesheets/pages/awards.scss @@ -1,6 +1,4 @@ .awards { - line-height: 34px; - .emoji-icon { width: 20px; height: 20px; @@ -9,8 +7,6 @@ .emoji-menu { position: absolute; - top: 100%; - left: 0; margin-top: 3px; z-index: 1000; min-width: 160px; @@ -23,7 +19,12 @@ opacity: 0; transform: scale(.2); transform-origin: 0 -45px; - transition: all .3s cubic-bezier(.87,-.41,.19,1.44); + transition: .3s cubic-bezier(.87,-.41,.19,1.44); + transition-property: transform, opacity; + + &.is-aligned-right { + transform-origin: 100% -45px; + } &.is-visible { pointer-events: all; @@ -94,20 +95,30 @@ .award-control { margin-right: 5px; + margin-bottom: 5px; padding-left: 5px; padding-right: 5px; line-height: 20px; outline: 0; + &:hover, &.active, &:active { - background-color: $white-dark; + background-color: $row-hover; + border-color: $row-hover-border; box-shadow: none; outline: 0; } + &.btn { + &:focus { + outline: 0; + } + } + &.is-loading { - .award-control-icon { + .award-control-icon-normal, + .emoji-icon { display: none; } diff --git a/app/assets/stylesheets/pages/builds.scss b/app/assets/stylesheets/pages/builds.scss index aa41565f812..e8f1935d239 100644 --- a/app/assets/stylesheets/pages/builds.scss +++ b/app/assets/stylesheets/pages/builds.scss @@ -3,12 +3,7 @@ background: #111; color: #fff; font-family: $monospace_font; - white-space: pre; - white-space: pre-wrap; /* css-3 */ - white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ - white-space: -pre-wrap; /* Opera 4-6 */ - white-space: -o-pre-wrap; /* Opera 7 */ - word-wrap: break-word; /* Internet Explorer 5.5+ */ + white-space: pre-wrap; overflow: auto; overflow-y: hidden; font-size: 12px; @@ -58,37 +53,92 @@ left: 70px; } } +} - .build-widget { - padding: 10px; - background: $background-color; - margin-bottom: 20px; - border-radius: 4px; +.build-header { + position: relative; + padding-right: 40px; - .title { - margin-top: 0; - color: #666; - line-height: 1.5; - } - .attr-name { - color: #777; - } + @media (min-width: $screen-sm-min) { + padding-right: 0; } - .alert-disabled { - background: $background-color; + a { + color: $gl-gray; - a { - color: #3084bb !important; + &:hover { + color: $gl-link-color; + text-decoration: none; } } + + code { + color: $code-color; + } + + .avatar { + float: none; + margin-right: 2px; + margin-left: 2px; + } } table.builds { - .build-link { a { color: $gl-dark-link-color; } } } + +.build-trace { + background: $ci-output-bg; + color: $ci-text-color; + white-space: pre; + overflow-x: auto; + font-size: 12px; + + .fa-refresh { + font-size: 24px; + } + + .bash { + display: block; + } +} + +.right-sidebar.build-sidebar { + padding-top: $gl-padding; + padding-bottom: $gl-padding; + + &.right-sidebar-collapsed { + display: none; + } + + .block { + width: 100%; + } + + .build-sidebar-header { + padding-top: 0; + + .gutter-toggle { + margin-top: 0; + } + } +} + +.build-detail-row { + margin-bottom: 5px; +} + +.build-light-text { + color: $gl-placeholder-color; +} + +.build-gutter-toggle { + position: absolute; + top: 50%; + right: 0; + margin-top: -17px; +} diff --git a/app/assets/stylesheets/pages/confirmation.scss b/app/assets/stylesheets/pages/confirmation.scss index 125f495d6d4..292225c5261 100644 --- a/app/assets/stylesheets/pages/confirmation.scss +++ b/app/assets/stylesheets/pages/confirmation.scss @@ -2,13 +2,21 @@ margin-bottom: 20px; border-bottom: 1px solid #eee; - > h1 { + > h1, h2, h3, h4, h5, h6 { font-weight: 400; } .lead { margin-bottom: 20px; } + + ul, ol { + padding-left: 0; + } + + li { + list-style-type: none; + } } .confirmation-content { diff --git a/app/assets/stylesheets/pages/detail_page.scss b/app/assets/stylesheets/pages/detail_page.scss index 5e61e61d85c..1b389d83525 100644 --- a/app/assets/stylesheets/pages/detail_page.scss +++ b/app/assets/stylesheets/pages/detail_page.scss @@ -29,8 +29,6 @@ margin-top: 6px; p { - overflow-x: auto; - &:last-child { margin-bottom: 0; } diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss index 787c387379e..ea453ce356a 100644 --- a/app/assets/stylesheets/pages/issuable.scss +++ b/app/assets/stylesheets/pages/issuable.scss @@ -29,7 +29,7 @@ } } -.issuable-sidebar { +.right-sidebar { a { color: inherit; } @@ -74,6 +74,10 @@ } } + .block-first { + padding-top: 0; + } + .title { color: $gl-text-color; margin-bottom: 10px; diff --git a/app/assets/stylesheets/pages/labels.scss b/app/assets/stylesheets/pages/labels.scss index e179bdf0048..bc65404a741 100644 --- a/app/assets/stylesheets/pages/labels.scss +++ b/app/assets/stylesheets/pages/labels.scss @@ -50,11 +50,26 @@ .label-row { .label-name { - display: inline-block; - width: 200px; + display: block; + margin-bottom: 10px; - @media (max-width: $screen-xs-min) { - display: block; + @media (min-width: $screen-sm-min) { + display: inline-block; + width: 200px; + margin-bottom: 0; + } + } + + .label-description { + display: block; + margin-bottom: 10px; + + @media (min-width: $screen-sm-min) { + display: inline-block; + width: 40%; + margin-left: 10px; + margin-bottom: 0; + vertical-align: middle; } } @@ -68,10 +83,6 @@ padding: 3px 4px; } -.label-subscription { - display: inline-block; -} - .dropdown-labels-error { padding: 5px 10px; margin-bottom: 10px; @@ -79,62 +90,95 @@ color: $white-light; } -@mixin labels-mobile { - @media (max-width: $screen-xs-min) { - display: block; - width: 100%; - margin-left: 0; - padding: 10px 0; - } -} +.manage-labels-list { + .btn-action { + color: $gl-dark-link-color; + .fa { + font-size: 18px; + vertical-align: middle; + } -.manage-labels-list { + &:hover { + color: $gl-link-color; - .prepend-left-10, .prepend-description-left { - display: inline-block; - width: 40%; - vertical-align: middle; + &.remove-row { + color: $gl-danger; + } + } + } - @include labels-mobile; + .dropdown { + @media (min-width: $screen-sm-min) { + float: right; + } } +} - .prepend-description-left { - width: 57%; +.prioritized-labels { + margin-bottom: 30px; - @include labels-mobile; + .add-priority { + display: none; + color: $gray-light; } +} - .pull-info-right { - float: right; +.other-labels { + .remove-priority { + display: none; + } +} - @media (max-width: $screen-xs-min) { - float: none; - } +.toggle-priority { + display: inline-block; + vertical-align: middle; - .action-buttons { - border-color: transparent; - padding: 6px; - color: $gl-text-color; + button { + border-color: transparent; + padding: 5px 8px; + vertical-align: top; + font-size: 14px; - &.label-subscribe-button { - padding-left: 0; - } + &:hover { + border-color: transparent; } + } +} - i { - color: $gl-text-color; +.filtered-labels { + .label-row { + &:not(:last-child) { + margin-right: 5px; } + } - .append-right-20 { - a { - color: $gl-text-color; - } + .label-remove { + border-left: 1px solid rgba(0, 0, 0, .1); + z-index: 3; + } - @media (max-width: $screen-xs-min) { - display: block; - margin-bottom: 10px; - } + .btn { + color: inherit; + } +} + +.label-options-toggle { + width: 100%; +} + +.label-subscribe-button { + .label-subscribe-button-loading { + display: none; + } + + &.disabled { + .label-subscribe-button-icon { + display: none; + } + + .label-subscribe-button-loading { + display: block; } } } diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss index 8046e203a99..a47f2580aa3 100644 --- a/app/assets/stylesheets/pages/merge_requests.scss +++ b/app/assets/stylesheets/pages/merge_requests.scss @@ -79,11 +79,14 @@ } &.ci-failed, - &.ci-canceled, &.ci-error { color: $gl-danger; } + &.ci-canceled { + color: $gl-gray; + } + a.monospace { color: inherit; } @@ -105,6 +108,11 @@ font-size: 17px; margin: 5px 0; color: $gl-gray-dark; + + &.has-conflicts .fa-exclamation-triangle { + color: $gl-warning; + } + } p:last-child { diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss index 7fa13e66b43..577dddae741 100644 --- a/app/assets/stylesheets/pages/note_form.scss +++ b/app/assets/stylesheets/pages/note_form.scss @@ -87,6 +87,39 @@ } } +.md-header .nav-links { + display: flex; + display: -webkit-flex; + flex-flow: row wrap; + -webkit-flex-flow: row wrap; + width: 100%; + + .pull-right { + // Flexbox quirk to make sure right-aligned items stay right-aligned. + margin-left: auto; + } +} + +.confidential-issue-warning { + background-color: $gray-normal; + border-radius: 3px; + padding: 3px 12px; + margin: auto; + margin-top: 0; + text-align: center; + font-size: 13px; + + @media (max-width: $screen-md-min) { + // On smaller devices the warning becomes the fourth item in the list, + // rather than centering, and grows to span the full width of the + // comment area. + order: 4; + -webkit-order: 4; + margin: 6px auto; + width: 100%; + } +} + .discussion-form { padding: $gl-padding-top $gl-padding; background-color: $white-light; @@ -96,17 +129,8 @@ display: none; font-size: 15px; - .form-actions { - padding-left: 20px; - - .btn-save { - float: left; - } - - .note-form-option { - float: left; - padding: 2px 0 0 25px; - } + .md-area { + background-color: #fff; } } diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss index a3e1ac13a43..0c084118753 100644 --- a/app/assets/stylesheets/pages/notes.scss +++ b/app/assets/stylesheets/pages/notes.scss @@ -69,6 +69,10 @@ ul.notes { .note-edit-form { display: block; + + &.current-note-edit-form + .note-awards { + display: none; + } } } @@ -116,8 +120,41 @@ ul.notes { } } + .note-awards { + .js-awards-block { + padding: 2px; + margin-top: 10px; + } + + .award-control { + font-size: 13px; + padding: 2px 5px; + } + } + .note-header { padding-bottom: 3px; + padding-right: 20px; + + @media (min-width: $screen-sm-min) { + padding-right: 0; + } + } + + .note-emoji-button { + .fa-spinner { + display: none; + } + + &.is-loading { + .fa-smile-o { + display: none; + } + + .fa-spinner { + display: inline-block; + } + } } } @@ -179,6 +216,8 @@ ul.notes { .discussion-header, .note-header { + position: relative; + a { color: inherit; @@ -215,6 +254,16 @@ ul.notes { color: $notes-action-color; } +.note-actions { + position: absolute; + right: 0; + top: 0; + + @media (min-width: $screen-sm-min) { + position: relative; + } +} + .discussion-actions { @media (max-width: $screen-md-max) { float: none; @@ -228,8 +277,13 @@ ul.notes { .note-action-button { display: inline-block; - margin-left: 10px; - line-height: 24px; + margin-left: 0; + line-height: 20px; + + @media (min-width: $screen-sm-min) { + margin-left: 10px; + line-height: 24px; + } .fa { color: $notes-action-color; diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index edef336481d..bb250904255 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -32,6 +32,15 @@ .container-fluid { position: relative; + + @media (min-width: $screen-md-max) { + .row { + display: flex; + -ms-flex-align: center; + -webkit-align-items: center; + -webkit-box-align: center; + } + } } .cover-controls { @@ -57,7 +66,6 @@ max-width: 86px; min-width: 86px; padding-right: 0; - margin: 11px 0; @media (max-width: $screen-md-max) { padding-left: 0; @@ -489,9 +497,11 @@ pre.light-well { margin: 0; } -.project-show-activity { - .activity-filter-block { - margin-top: -1px; + +.activity-filter-block { + .controls { + padding-bottom: 10px; + border-bottom: 1px solid $border-color; } } diff --git a/app/assets/stylesheets/pages/search.scss b/app/assets/stylesheets/pages/search.scss index 2bff70c8c64..ae524cd6bae 100644 --- a/app/assets/stylesheets/pages/search.scss +++ b/app/assets/stylesheets/pages/search.scss @@ -28,6 +28,7 @@ } .search-input { + padding-right: 20px; border: none; font-size: 14px; outline: none; @@ -47,6 +48,7 @@ display: inline-block; background-color: $location-badge-bg; vertical-align: top; + cursor: default; } .search-input-container { @@ -55,7 +57,7 @@ position: relative; } - .search-location-badge, .search-input-wrap { + .search-input-wrap { // Fallback if flexbox is not supported display: inline-block; } @@ -156,13 +158,11 @@ .search-holder { @media (min-width: $screen-sm-min) { display: -webkit-flex; - display: -ms-flexbox; display: flex; } .search-field-holder { -webkit-flex: 1 0 auto; - -ms-flex: 1 0 auto; flex: 1 0 auto; position: relative; margin-right: 0; diff --git a/app/assets/stylesheets/pages/xterm.scss b/app/assets/stylesheets/pages/xterm.scss index 3f28e402929..8d855ce99b0 100644 --- a/app/assets/stylesheets/pages/xterm.scss +++ b/app/assets/stylesheets/pages/xterm.scss @@ -11,18 +11,15 @@ $magenta: #cd00cd; $cyan: #00cdcd; $white: #e5e5e5; - $l-black: #7f7f7f; - $l-red: #f00; - $l-green: #0f0; - $l-yellow: #ff0; - $l-blue: #5c5cff; - $l-magenta: #f0f; - $l-cyan: #0ff; - $l-white: #fff; + $l-black: #373b41; + $l-red: #c66; + $l-green: #b5bd68; + $l-yellow: #f0c674; + $l-blue: #81a2be; + $l-magenta: #b294bb; + $l-cyan: #8abeb7; + $l-white: $ci-text-color; - .term-bold { - font-weight: bold; - } .term-italic { font-style: italic; } |