Commit 50e410e2 authored by Phil Hughes's avatar Phil Hughes

Merge branch '239816-convert-stylesheets-pages-diff-scss-into-page-specific-bundle' into 'master'

Convert stylesheets/pages/diff.scss into page specific bundle

See merge request gitlab-org/gitlab!44556
parents 1ed54ff5 6d85960c
......@@ -8,7 +8,6 @@
@import './pages/commits';
@import './pages/deploy_keys';
@import './pages/detail_page';
@import './pages/diff';
@import './pages/editor';
@import './pages/environment_logs';
@import './pages/error_list';
......
......@@ -70,3 +70,4 @@
@import 'framework/spinner';
@import 'framework/card';
@import 'framework/editor-lite';
@import 'framework/diffs';
......@@ -267,6 +267,7 @@
}
}
}
//.view.swipe
.view.onion-skin {
.onion-skin-frame {
......@@ -335,6 +336,7 @@
}
}
}
//.view.onion-skin
}
......@@ -961,15 +963,13 @@ table.code {
.frame.click-to-comment,
.btn-transparent.image-diff-overlay-add-comment {
position: relative;
cursor: image-url('illustrations/image_comment_light_cursor.svg')
$image-comment-cursor-left-offset $image-comment-cursor-top-offset,
cursor: image-url('illustrations/image_comment_light_cursor.svg') $image-comment-cursor-left-offset $image-comment-cursor-top-offset,
auto;
// Retina cursor
// scss-lint:disable DuplicateProperty
cursor: image-set(image-url('illustrations/image_comment_light_cursor.svg') 1x,
image-url('illustrations/image_comment_light_cursor@2x.svg') 2x)
$image-comment-cursor-left-offset $image-comment-cursor-top-offset,
image-url('illustrations/image_comment_light_cursor@2x.svg') 2x) $image-comment-cursor-left-offset $image-comment-cursor-top-offset,
auto;
.comment-indicator {
......@@ -1078,85 +1078,6 @@ table.code {
position: relative;
}
.diff-tree-list {
position: -webkit-sticky;
position: sticky;
$top-pos: $header-height + $mr-tabs-height + $mr-version-controls-height + 15px;
top: $top-pos;
max-height: calc(100vh - #{$top-pos});
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-files-holder {
flex: 1;
min-width: 0;
z-index: 201;
}
.compare-versions-container {
min-width: 0;
}
.tree-list-holder {
height: 100%;
.file-row {
margin-left: 0;
margin-right: 0;
}
}
.tree-list-scroll {
max-height: 100%;
padding-bottom: $grid-size;
overflow-y: scroll;
overflow-x: auto;
}
.tree-list-search {
flex: 0 0 34px;
.form-control {
padding-left: 30px;
}
}
.tree-list-icon {
top: 50%;
left: 10px;
transform: translateY(-50%);
&,
svg {
fill: $gl-text-color-tertiary;
}
}
.tree-list-clear-icon {
right: 10px;
left: auto;
line-height: 0;
}
.discussion-collapsible {
margin: 0 $gl-padding $gl-padding 71px;
......@@ -1172,30 +1093,6 @@ table.code {
}
}
@media (max-width: map-get($grid-breakpoints, md)-1) {
.diffs .files {
@include fixed-width-container;
flex-direction: column;
.diff-tree-list {
position: relative;
top: 0;
// !important is required to override inline styles of resizable sidebar
width: 100% !important;
}
.tree-list-holder {
max-height: calc(50px + 50vh);
padding-right: 0;
}
}
.discussion-collapsible {
margin: $gl-padding;
margin-top: 0;
}
}
.image-diff-overlay,
.image-diff-overlay-add-comment {
top: 0;
......@@ -1218,3 +1115,15 @@ table.code {
display: none;
}
}
@media (max-width: map-get($grid-breakpoints, md)-1) {
.diffs .files {
@include fixed-width-container;
flex-direction: column;
}
.discussion-collapsible {
margin: $gl-padding;
margin-top: 0;
}
}
@import 'mixins_and_variables_and_functions';
.compare-versions-container {
min-width: 0;
}
.diff-files-holder {
flex: 1;
min-width: 0;
z-index: 201;
}
.diff-tree-list {
position: -webkit-sticky;
position: sticky;
$top-pos: $header-height + $mr-tabs-height + $mr-version-controls-height + 15px;
top: $top-pos;
max-height: calc(100vh - #{$top-pos});
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);
}
}
.tree-list-holder {
height: 100%;
.file-row {
margin-left: 0;
margin-right: 0;
}
}
.tree-list-scroll {
max-height: 100%;
padding-bottom: $grid-size;
overflow-y: scroll;
overflow-x: auto;
}
.tree-list-search {
flex: 0 0 34px;
.form-control {
padding-left: 30px;
}
}
.tree-list-icon {
top: 50%;
left: 10px;
transform: translateY(-50%);
&,
svg {
fill: var(--gray-400, $gray-400);
}
}
.tree-list-clear-icon {
right: 10px;
left: auto;
line-height: 0;
}
@media (max-width: map-get($grid-breakpoints, md)-1) {
.diffs .files {
.diff-tree-list {
position: relative;
top: 0;
// !important is required to override inline styles of resizable sidebar
width: 100% !important;
}
.tree-list-holder {
max-height: calc(50px + 50vh);
padding-right: 0;
}
}
}
......@@ -8,6 +8,7 @@
- suggest_changes_help_path = help_page_path('user/discussions/index.md', anchor: 'suggest-changes')
- number_of_pipelines = @pipelines.size
- mr_action = j(params[:tab].presence || 'show')
- add_page_specific_style 'page_bundles/merge_requests'
- add_page_specific_style 'page_bundles/pipelines'
- add_page_specific_style 'page_bundles/reports'
......
......@@ -182,6 +182,7 @@ module Gitlab
config.assets.precompile << "page_bundles/issues_list.css"
config.assets.precompile << "page_bundles/jira_connect.css"
config.assets.precompile << "page_bundles/merge_conflicts.css"
config.assets.precompile << "page_bundles/merge_requests.css"
config.assets.precompile << "page_bundles/milestone.css"
config.assets.precompile << "page_bundles/pipeline.css"
config.assets.precompile << "page_bundles/pipelines.css"
......
.approvals-body {
@include media-breakpoint-up(md) {
display: flex;
align-items: center;
}
.approve-btn {
vertical-align: baseline;
}
.approvals-required-text {
svg {
position: relative;
top: 3px;
}
}
}
.approvals-footer {
display: flex;
.approvers-prefix {
display: flex;
align-items: center;
flex-wrap: wrap;
}
.approvers-list {
display: flex;
align-items: center;
margin-left: 7px;
}
.avatar-placeholder {
color: $gray-darkest;
}
.unapprove-btn {
border: 0;
background: transparent;
cursor: pointer;
&:hover {
color: $gl-text-color-secondary;
text-decoration: none;
}
&:focus {
outline: none;
}
}
}
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment