debian-mirror-gitlab/app/assets/stylesheets/pages/merge_conflicts.scss

294 lines
8 KiB
SCSS
Raw Normal View History

2017-08-17 22:00:37 +05:30
// Disabled to use the color map for creating color schemes
// scss-lint:disable ColorVariable
2016-09-13 17:45:13 +05:30
$colors: (
2018-11-18 11:00:15 +05:30
white-header-head-neutral : #e1fad7,
white-line-head-neutral : #effdec,
white-button-head-neutral : #9adb84,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
white-header-head-chosen : #baf0a8,
white-line-head-chosen : #e1fad7,
white-button-head-chosen : #52c22d,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
white-header-origin-neutral : #e0f0ff,
white-line-origin-neutral : #f2f9ff,
white-button-origin-neutral : #87c2fa,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
white-header-origin-chosen : #add8ff,
white-line-origin-chosen : #e0f0ff,
white-button-origin-chosen : #268ced,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
white-header-not-chosen : #f0f0f0,
white-line-not-chosen : $gray-light,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
dark-header-head-neutral : rgba(#3f3, .2),
dark-line-head-neutral : rgba(#3f3, .1),
dark-button-head-neutral : #40874f,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
dark-header-head-chosen : rgba(#3f3, .33),
dark-line-head-chosen : rgba(#3f3, .2),
dark-button-head-chosen : #258537,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
dark-header-origin-neutral : rgba(#2878c9, .4),
dark-line-origin-neutral : rgba(#2878c9, .3),
dark-button-origin-neutral : #2a5c8c,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
dark-header-origin-chosen : rgba(#2878c9, .6),
dark-line-origin-chosen : rgba(#2878c9, .4),
dark-button-origin-chosen : #1d6cbf,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
dark-header-not-chosen : rgba(#fff, .25),
dark-line-not-chosen : rgba(#fff, .1),
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
monokai-header-head-neutral : rgba(#a6e22e, .25),
monokai-line-head-neutral : rgba(#a6e22e, .1),
monokai-button-head-neutral : #376b20,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
monokai-header-head-chosen : rgba(#a6e22e, .4),
monokai-line-head-chosen : rgba(#a6e22e, .25),
monokai-button-head-chosen : #39800d,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
monokai-header-origin-neutral : rgba(#60d9f1, .35),
monokai-line-origin-neutral : rgba(#60d9f1, .15),
monokai-button-origin-neutral : #38848c,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
monokai-header-origin-chosen : rgba(#60d9f1, .5),
monokai-line-origin-chosen : rgba(#60d9f1, .35),
monokai-button-origin-chosen : #3ea4b2,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
monokai-header-not-chosen : rgba(#76715d, .24),
monokai-line-not-chosen : rgba(#76715d, .1),
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-light-header-head-neutral : rgba(#859900, .37),
solarized-light-line-head-neutral : rgba(#859900, .2),
solarized-light-button-head-neutral : #afb262,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-light-header-head-chosen : rgba(#859900, .5),
solarized-light-line-head-chosen : rgba(#859900, .37),
solarized-light-button-head-chosen : #94993d,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-light-header-origin-neutral : rgba(#2878c9, .37),
solarized-light-line-origin-neutral : rgba(#2878c9, .15),
solarized-light-button-origin-neutral : #60a1bf,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-light-header-origin-chosen : rgba(#2878c9, .6),
solarized-light-line-origin-chosen : rgba(#2878c9, .37),
solarized-light-button-origin-chosen : #2482b2,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-light-header-not-chosen : rgba(#839496, .37),
solarized-light-line-not-chosen : rgba(#839496, .2),
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-dark-header-head-neutral : rgba(#859900, .35),
solarized-dark-line-head-neutral : rgba(#859900, .15),
solarized-dark-button-head-neutral : #376b20,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-dark-header-head-chosen : rgba(#859900, .5),
solarized-dark-line-head-chosen : rgba(#859900, .35),
solarized-dark-button-head-chosen : #39800d,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-dark-header-origin-neutral : rgba(#2878c9, .35),
solarized-dark-line-origin-neutral : rgba(#2878c9, .15),
solarized-dark-button-origin-neutral : #086799,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-dark-header-origin-chosen : rgba(#2878c9, .6),
solarized-dark-line-origin-chosen : rgba(#2878c9, .35),
solarized-dark-button-origin-chosen : #0082cc,
2016-09-13 17:45:13 +05:30
2018-11-18 11:00:15 +05:30
solarized-dark-header-not-chosen : rgba(#839496, .25),
solarized-dark-line-not-chosen : rgba(#839496, .15)
2016-09-13 17:45:13 +05:30
);
2017-08-17 22:00:37 +05:30
// scss-lint:enable ColorVariable
2016-09-13 17:45:13 +05:30
@mixin color-scheme($color) {
2017-08-17 22:00:37 +05:30
.header.line_content,
.diff-line-num {
2016-09-13 17:45:13 +05:30
&.origin {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-header-origin-neutral);
border-color: map-get($colors, #{$color}-header-origin-neutral);
2016-09-13 17:45:13 +05:30
button {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-button-origin-neutral);
border-color: darken(map-get($colors, #{$color}-button-origin-neutral), 15);
2016-09-13 17:45:13 +05:30
}
&.selected {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-header-origin-chosen);
border-color: map-get($colors, #{$color}-header-origin-chosen);
2016-09-13 17:45:13 +05:30
button {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-button-origin-chosen);
border-color: darken(map-get($colors, #{$color}-button-origin-chosen), 15);
2016-09-13 17:45:13 +05:30
}
}
&.unselected {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-header-not-chosen);
border-color: map-get($colors, #{$color}-header-not-chosen);
2016-09-13 17:45:13 +05:30
button {
2018-11-18 11:00:15 +05:30
background-color: lighten(map-get($colors, #{$color}-button-origin-neutral), 15);
border-color: map-get($colors, #{$color}-button-origin-neutral);
2016-09-13 17:45:13 +05:30
}
}
}
2016-11-03 12:29:30 +05:30
2016-09-13 17:45:13 +05:30
&.head {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-header-head-neutral);
border-color: map-get($colors, #{$color}-header-head-neutral);
2016-09-13 17:45:13 +05:30
button {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-button-head-neutral);
border-color: darken(map-get($colors, #{$color}-button-head-neutral), 15);
2016-09-13 17:45:13 +05:30
}
&.selected {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-header-head-chosen);
border-color: map-get($colors, #{$color}-header-head-chosen);
2016-09-13 17:45:13 +05:30
button {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-button-head-chosen);
border-color: darken(map-get($colors, #{$color}-button-head-chosen), 15);
2016-09-13 17:45:13 +05:30
}
}
&.unselected {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-header-not-chosen);
border-color: map-get($colors, #{$color}-header-not-chosen);
2016-09-13 17:45:13 +05:30
button {
2018-11-18 11:00:15 +05:30
background-color: lighten(map-get($colors, #{$color}-button-head-neutral), 15);
border-color: map-get($colors, #{$color}-button-head-neutral);
2016-09-13 17:45:13 +05:30
}
}
}
}
.line_content {
&.origin {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-line-origin-neutral);
2016-09-13 17:45:13 +05:30
&.selected {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-line-origin-chosen);
2016-09-13 17:45:13 +05:30
}
&.unselected {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-line-not-chosen);
2016-09-13 17:45:13 +05:30
}
}
2016-11-03 12:29:30 +05:30
2016-09-13 17:45:13 +05:30
&.head {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-line-head-neutral);
2016-09-13 17:45:13 +05:30
&.selected {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-line-head-chosen);
2016-09-13 17:45:13 +05:30
}
&.unselected {
2018-11-18 11:00:15 +05:30
background-color: map-get($colors, #{$color}-line-not-chosen);
2016-09-13 17:45:13 +05:30
}
}
}
}
#conflicts {
.white {
@include color-scheme('white')
}
.dark {
@include color-scheme('dark')
}
.monokai {
@include color-scheme('monokai')
}
.solarized-light {
2018-11-18 11:00:15 +05:30
@include color-scheme('solarized-light')
2016-09-13 17:45:13 +05:30
}
.solarized-dark {
2018-11-18 11:00:15 +05:30
@include color-scheme('solarized-dark')
2016-09-13 17:45:13 +05:30
}
.diff-wrap-lines .line_content {
white-space: normal;
min-height: 19px;
}
.line_content.header {
position: relative;
button {
border-radius: 2px;
font-size: 10px;
position: absolute;
right: 10px;
padding: 0;
outline: none;
2017-08-17 22:00:37 +05:30
color: $white-light;
2016-09-13 17:45:13 +05:30
width: 75px; // static width to make 2 buttons have same width
height: 19px;
}
}
.btn-success .fa-spinner {
2017-08-17 22:00:37 +05:30
color: $white-light;
2016-09-13 17:45:13 +05:30
}
2016-11-03 12:29:30 +05:30
.editor-wrap {
&.is-loading {
.editor {
display: none;
}
.loading {
display: block;
}
}
&.saved {
.editor {
2018-03-17 18:26:18 +05:30
border-top: solid 2px $green-300;
2016-11-03 12:29:30 +05:30
}
}
2017-08-17 22:00:37 +05:30
2016-11-03 12:29:30 +05:30
.editor {
pre {
height: 350px;
2018-03-17 18:26:18 +05:30
border: 0;
2016-11-03 12:29:30 +05:30
border-radius: 0;
margin-bottom: 0;
}
}
.loading {
display: none;
}
}
.discard-changes-alert {
2017-08-17 22:00:37 +05:30
background-color: $gray-light;
2016-11-03 12:29:30 +05:30
text-align: right;
padding: $gl-padding-top $gl-padding;
color: $gl-text-color;
.discard-actions {
display: inline-block;
margin-left: 10px;
}
}
.resolve-conflicts-form {
2018-11-08 19:23:39 +05:30
h4 {
margin-top: 0;
}
.resolve-info {
@media(max-width: map-get($grid-breakpoints, lg)-1) {
margin-bottom: $gl-padding;
}
}
2016-11-03 12:29:30 +05:30
}
2016-09-13 17:45:13 +05:30
}