diff options
Diffstat (limited to 'app/assets/stylesheets/framework/diffs.scss')
-rw-r--r-- | app/assets/stylesheets/framework/diffs.scss | 247 |
1 files changed, 23 insertions, 224 deletions
diff --git a/app/assets/stylesheets/framework/diffs.scss b/app/assets/stylesheets/framework/diffs.scss index 8d1fb5eb55f..f7cd5d7e183 100644 --- a/app/assets/stylesheets/framework/diffs.scss +++ b/app/assets/stylesheets/framework/diffs.scss @@ -43,7 +43,7 @@ z-index: 120; &.is-sidebar-moved { - --initial-top: calc(#{$header-height} + #{$mr-tabs-height + 28px}); + --initial-top: calc(#{$header-height} + #{$mr-tabs-height + 24px}); } .with-system-header & { @@ -578,78 +578,6 @@ table.code { } } -// Merge request diff grid layout -.diff-grid { - .diff-td { - // By default min-width is auto with 1fr which causes some overflow problems - // https://gitlab.com/gitlab-org/gitlab/-/issues/296222 - min-width: 0; - } - - .diff-grid-row { - display: grid; - grid-template-columns: 1fr 1fr; - - &.diff-grid-row-full { - grid-template-columns: 1fr; - } - } - - .diff-grid-left, - .diff-grid-right { - display: grid; - // Zero width column is a placeholder for the EE inline code quality diff - // see ee/.../diffs.scss for more details - grid-template-columns: 50px 8px 0 1fr; - } - - .diff-grid-2-col { - grid-template-columns: 100px 1fr !important; - - &.parallel { - grid-template-columns: 50px 1fr !important; - } - } - - .diff-grid-comments { - display: grid; - grid-template-columns: 1fr 1fr; - } - - .diff-grid-drafts { - display: grid; - grid-template-columns: 1fr 1fr; - } - - &.inline-diff-view { - .diff-grid-comments { - display: grid; - grid-template-columns: 1fr; - } - - .diff-grid-drafts { - display: grid; - grid-template-columns: 1fr; - } - - .diff-grid-row { - grid-template-columns: 1fr; - } - - .diff-grid-left, - .diff-grid-right { - // Zero width column is a placeholder for the EE inline code quality diff - // see ee/../diffs.scss for more details - grid-template-columns: 50px 50px 8px 0 1fr; - } - } -} - -// Merge request diff grid layout overrides -.diff-table.code .diff-tr.line_holder .diff-td.line_content.parallel { - width: unset; -} - .diff-stats { align-items: center; padding: 0 1rem; @@ -730,68 +658,6 @@ table.code { } } -.diff-comment-avatar-holders { - position: absolute; - margin-left: -$gl-padding; - z-index: 100; - @include code-icon-size(); - - &:hover { - .diff-comment-avatar, - .diff-comments-more-count { - @for $i from 1 through 4 { - $x-pos: 14px; - - &:nth-child(#{$i}) { - @if $i == 4 { - $x-pos: 14.5px; - } - - transform: translateX((($i * $x-pos) - $x-pos)); - - &:hover { - transform: translateX((($i * $x-pos) - $x-pos)); - } - } - } - } - - .diff-comments-more-count { - padding-left: 2px; - padding-right: 2px; - width: auto; - } - } -} - -.diff-comment-avatar, -.diff-comments-more-count { - position: absolute; - left: 0; - margin-right: 0; - border-color: $white; - cursor: pointer; - transition: all 0.1s ease-out; - @include code-icon-size(); - - @for $i from 1 through 4 { - &:nth-child(#{$i}) { - z-index: (4 - $i); - } - } - - .avatar { - @include code-icon-size(); - } -} - -.diff-comments-more-count { - padding-left: 0; - padding-right: 0; - overflow: hidden; - @include code-icon-size(); -} - .diff-comments-more-count, .diff-notes-collapse, .diff-codequality-collapse { @@ -867,70 +733,6 @@ table.code { } } - -.diff-file-changes { - max-width: 560px; - width: 100%; - z-index: 150; - min-height: $dropdown-min-height; - max-height: $dropdown-max-height; - overflow-y: auto; - margin-bottom: 0; - - @include media-breakpoint-up(sm) { - left: $gl-padding; - } - - .dropdown-input .dropdown-input-search { - pointer-events: all; - } - - .diff-changed-file { - display: flex; - padding-top: 8px; - padding-bottom: 8px; - min-width: 0; - } - - .diff-file-changed-icon { - margin-top: 2px; - } - - .diff-changed-file-content { - display: flex; - flex-direction: column; - min-width: 0; - } - - .diff-changed-file-name, - .diff-changed-blank-file-name { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - - .diff-changed-blank-file-name { - color: $gl-text-color-tertiary; - font-style: italic; - } - - .diff-changed-file-path { - color: $gl-text-color-tertiary; - } - - .diff-changed-stats { - margin-left: auto; - white-space: nowrap; - } -} - -.diff-file-changes-path { - flex: 1; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - .note-container { background-color: $gray-light; border-top: 1px solid $white-normal; @@ -1007,27 +809,6 @@ table.code { } } -// Notes tweaks for the Changes tab ONLY -.diff-tr { - .timeline-discussion-body { - clear: left; - - .note-body { - margin-top: 0 !important; - } - } - - .timeline-entry img.avatar { - margin-top: -2px; - margin-right: $gl-padding-8; - } - - // tiny adjustment to vertical align with the note header text - .discussion-collapsible .timeline-icon { - padding-top: 2px; - } -} - .files:not([data-can-create-note]) .frame { cursor: auto; } @@ -1097,6 +878,7 @@ table.code { .discussion-notes { min-height: 35px; + background-color: transparent; &:first-child { // First child does not have the jagged borders @@ -1121,6 +903,17 @@ table.code { display: none; } } + + ul.notes { + li.toggle-replies-widget, + .discussion-reply-holder { + margin-left: 2.5rem; + + .reply-author-avatar { + height: 1.5rem; + } + } + } } .discussion-body .image .frame { @@ -1183,9 +976,15 @@ table.code { bottom: 100vh; } -.diff-line-expand-button { - &:hover, - &:focus { - @include gl-bg-gray-200; +.diff-grid-row.expansion.match { + border-top: 1px solid var(--diff-expansion-background-color); + border-bottom: 1px solid var(--diff-expansion-background-color); + + &:first-child { + border-top: 0; + } + + &:last-child { + border-bottom: 0; } } |