GitLab steht aufgrund wichtiger Wartungsarbeiten am Montag, den 8. März, zwischen 17:00 und 19:00 Uhr nicht zur Verfügung.

Commit e03d0b28 authored by connorshea's avatar connorshea

Follow the CSS Style Guide rules for HEX colors.

Use lowercase letters and shorthand values for HEX colors where
possible.

Discussed in #14299.
parent bc590ce6
......@@ -37,23 +37,23 @@
}
@mixin btn-green {
@include btn-color($green-light, $border-green-light, $green-normal, $border-green-normal, $green-dark, $border-green-dark, #FFFFFF);
@include btn-color($green-light, $border-green-light, $green-normal, $border-green-normal, $green-dark, $border-green-dark, #fff);
}
@mixin btn-blue {
@include btn-color($blue-light, $border-blue-light, $blue-normal, $border-blue-normal, $blue-dark, $border-blue-dark, #FFFFFF);
@include btn-color($blue-light, $border-blue-light, $blue-normal, $border-blue-normal, $blue-dark, $border-blue-dark, #fff);
}
@mixin btn-blue-medium {
@include btn-color($blue-medium-light, $border-blue-light, $blue-medium, $border-blue-normal, $blue-medium-dark, $border-blue-dark, #FFFFFF);
@include btn-color($blue-medium-light, $border-blue-light, $blue-medium, $border-blue-normal, $blue-medium-dark, $border-blue-dark, #fff);
}
@mixin btn-orange {
@include btn-color($orange-light, $border-orange-light, $orange-normal, $border-orange-normal, $orange-dark, $border-orange-dark, #FFFFFF);
@include btn-color($orange-light, $border-orange-light, $orange-normal, $border-orange-normal, $orange-dark, $border-orange-dark, #fff);
}
@mixin btn-red {
@include btn-color($red-light, $border-red-light, $red-normal, $border-red-normal, $red-dark, $border-red-dark, #FFFFFF);
@include btn-color($red-light, $border-red-light, $red-normal, $border-red-normal, $red-dark, $border-red-dark, #fff);
}
@mixin btn-gray {
......
......@@ -33,19 +33,19 @@
}
.q2 {
fill: #ACD5F2 !important;
fill: #acd5f2 !important;
}
.q3 {
fill: #7FA8D1 !important;
fill: #7fa8d1 !important;
}
.q4 {
fill: #49729B !important;
fill: #49729b !important;
}
.q5 {
fill: #254E77 !important;
fill: #254e77 !important;
}
.domain-background {
......
......@@ -39,6 +39,6 @@
}
.bs-callout-success {
background-color: #dff0d8;
border-color: #5cA64d;
border-color: #5ca64d;
color: #3c763d;
}
/** COLORS **/
.cgray { color: $gl-gray; }
.clgray { color: #BBB }
.clgray { color: #bbb }
.cred { color: $gl-text-red; }
.cgreen { color: $gl-text-green; }
.cdark { color: #444 }
......@@ -51,7 +51,7 @@ pre {
}
&.well-pre {
border: 1px solid #EEE;
border: 1px solid #eee;
background: #f9f9f9;
border-radius: 0;
color: #555;
......@@ -103,7 +103,7 @@ span.update-author {
}
.user-mention {
color: #2FA0BB;
color: #2fa0bb;
font-weight: bold;
}
......@@ -187,9 +187,9 @@ li.note {
.error-message {
padding: 10px;
background: #C67;
background: #c67;
margin: 0;
color: #FFF;
color: #fff;
a {
color: #fff;
......@@ -200,7 +200,7 @@ li.note {
.browser-alert {
padding: 10px;
text-align: center;
background: #C67;
background: #c67;
color: #fff;
font-weight: bold;
a {
......@@ -271,7 +271,7 @@ img.emoji {
table {
td.permission-x {
background: #D9EDF7 !important;
background: #d9edf7 !important;
text-align: center;
}
}
......@@ -280,7 +280,7 @@ table {
float: left;
text-align: center;
font-size: 32px;
color: #AAA;
color: #aaa;
width: 60px;
}
......@@ -347,7 +347,7 @@ table {
.profiler-button,
.profiler-controls {
border-color: #EEE !important;
border-color: #eee !important;
}
}
......
......@@ -261,7 +261,7 @@
position: absolute;
top: 10px;
right: 10px;
color: #C7C7C7;
color: #c7c7c7;
font-size: 12px;
pointer-events: none;
}
......
......@@ -84,7 +84,7 @@
&.blob-no-preview {
background: #eee;
text-shadow: 0 1px 2px #FFF;
text-shadow: 0 1px 2px #fff;
padding: 100px 0;
}
......@@ -124,7 +124,7 @@
}
td.line-numbers {
float: none;
border-left: 1px solid #DDD;
border-left: 1px solid #ddd;
}
td.lines {
padding: 0;
......
......@@ -41,8 +41,8 @@ input[type='search'].search-input {
}
input[type='text'].danger {
background: #F2DEDE!important;
border-color: #D66;
background: #f2dede!important;
border-color: #d66;
text-shadow: 0 1px 1px #fff
}
......
......@@ -23,13 +23,13 @@
&:hover {
background-color: $color-darker;
a {
color: #FFF;
color: #fff;
}
}
}
.collapse-nav a {
color: #FFF;
color: #fff;
background: $color;
}
......@@ -42,7 +42,7 @@
&:hover {
background-color: $color-dark;
color: #FFF;
color: #fff;
text-decoration: none;
}
}
......@@ -71,7 +71,7 @@
}
&.active a {
color: #FFF;
color: #fff;
background: $color-dark;
&.no-highlight {
......@@ -79,42 +79,42 @@
}
i {
color: #FFF
color: #fff
}
}
}
}
}
$theme-blue: #2980B9;
$theme-blue: #2980b9;
$theme-charcoal: #333c47;
$theme-graphite: #888888;
$theme-graphite: #888;
$theme-gray: #373737;
$theme-green: #019875;
$theme-violet: #554488;
$theme-violet: #548;
body {
&.ui_blue {
@include gitlab-theme(#BECDE9, $theme-blue, #1970A9, #096099);
@include gitlab-theme(#becde9, $theme-blue, #1970a9, #096099);
}
&.ui_charcoal {
@include gitlab-theme(#c5d0de, $theme-charcoal, #2b333d, #24272D);
@include gitlab-theme(#c5d0de, $theme-charcoal, #2b333d, #24272d);
}
&.ui_graphite {
@include gitlab-theme(#CCCCCC, $theme-graphite, #777777, #666666);
@include gitlab-theme(#ccc, $theme-graphite, #777, #666);
}
&.ui_gray {
@include gitlab-theme(#979797, $theme-gray, #272727, #222222);
@include gitlab-theme(#979797, $theme-gray, #272727, #222);
}
&.ui_green {
@include gitlab-theme(#AADDCC, $theme-green, #018865, #017855);
@include gitlab-theme(#adc, $theme-green, #018865, #017855);
}
&.ui_violet {
@include gitlab-theme(#9988CC, $theme-violet, #443366, #332255);
@include gitlab-theme(#98c, $theme-violet, #436, #325);
}
}
\ No newline at end of file
......@@ -7,8 +7,8 @@ header {
&.navbar-empty {
height: 58px;
background: #FFF;
border-bottom: 1px solid #EEE;
background: #fff;
border-bottom: 1px solid #eee;
.center-logo {
margin: 11px 0;
......@@ -28,7 +28,7 @@ header {
min-height: $header-height;
background-color: #fff;
border: none;
border-bottom: 1px solid #EEE;
border-bottom: 1px solid #eee;
.container-fluid {
width: 100% !important;
......@@ -47,7 +47,7 @@ header {
text-align: center;
&:hover, &:focus, &:active {
background-color: #FFF;
background-color: #fff;
}
}
......@@ -59,7 +59,7 @@ header {
right: 2px;
&:hover {
background-color: #EEE;
background-color: #eee;
}
&.active {
color: #7f8fa4;
......
......@@ -20,7 +20,7 @@
display: block;
float: left;
margin-right: 10px;
color: #FFF;
color: #fff;
font-size: $gl-font-size;
line-height: 25px;
......
......@@ -3,13 +3,13 @@
font-size: $font-size-base;
&.ui-datepicker-inline {
border: 1px solid #DDD;
border: 1px solid #ddd;
padding: 10px;
width: 270px;
.ui-datepicker-header {
background: #FFF;
border-color: #DDD;
background: #fff;
border-color: #ddd;
}
.ui-datepicker-calendar td a {
......@@ -19,7 +19,7 @@
}
&.ui-autocomplete {
border-color: #DDD;
border-color: #ddd;
padding: 0;
margin-top: 2px;
z-index: 1001;
......@@ -30,20 +30,20 @@
}
.ui-state-default {
border: 1px solid #FFF;
background: #FFF;
border: 1px solid #fff;
background: #fff;
color: #777;
}
.ui-state-highlight {
border: 1px solid #EEE;
background: #EEE;
border: 1px solid #eee;
background: #eee;
}
.ui-state-active {
border: 1px solid $gl-primary;
background: $gl-primary;
color: #FFF;
color: #fff;
}
.ui-state-hover,
......
......@@ -71,7 +71,7 @@
}
.md-preview-holder {
background: #FFF;
background: #fff;
border: 1px solid #ddd;
min-height: 169px;
padding: 5px;
......@@ -80,7 +80,7 @@
.markdown-area {
@include border-radius(0);
background: #FFF;
background: #fff;
border: 1px solid #ddd;
min-height: 140px;
max-height: 500px;
......
......@@ -75,7 +75,7 @@
@include clearfix;
padding: 10px 0;
border-bottom: 1px solid #EEE;
border-bottom: 1px solid #eee;
display: block;
margin: 0px;
......
......@@ -131,9 +131,9 @@
right: 0px;
top: 30%;
padding: 5px 15px;
background: #EEE;
background: #eee;
font-size: 20px;
color: #777;
z-index: 100;
@include box-shadow(0 1px 2px #DDD);
@include box-shadow(0 1px 2px #ddd);
}
......@@ -26,7 +26,7 @@
}
&.active a {
color: #000000;
color: #000;
border-bottom: 2px solid #4688f1;
}
......@@ -41,7 +41,7 @@
.top-area {
@include clearfix;
border-bottom: 1px solid #EEE;
border-bottom: 1px solid #eee;
.nav-text {
padding-top: 16px;
......
......@@ -229,7 +229,7 @@
.namespace-result {
.namespace-kind {
color: #AAA;
color: #aaa;
font-weight: normal;
}
.namespace-path {
......
......@@ -47,7 +47,7 @@
width: 100%;
.container-fluid {
background: #FFF;
background: #fff;
padding: 0 $gl-padding;
&.container-blank {
......@@ -103,7 +103,7 @@
}
&:hover {
background-color: #EEE;
background-color: #eee;
}
}
......
......@@ -95,7 +95,7 @@
}
&.label-inverse {
background-color: #333333;
background-color: #333;
}
}
......
......@@ -57,7 +57,7 @@ $component-active-bg: $brand-info;
$input-color: $text-color;
$input-border: #e7e9ed;
$input-border-focus: #7F8FA4;
$input-border-focus: #7f8fa4;
$legend-color: $text-color;
......@@ -125,8 +125,8 @@ $panel-inner-border: $border-color;
//
//##
$well-bg: #F9F9F9;
$well-border: #EEE;
$well-bg: #f9f9f9;
$well-border: #eee;
//== Code
//
......
......@@ -27,13 +27,13 @@
line-height: 10px;
color: #555;
vertical-align: middle;
background-color: #FCFCFC;
background-color: #fcfcfc;
border-width: 1px;
border-style: solid;
border-color: #CCC #CCC #BBB;
border-color: #ccc #ccc #bbb;
border-image: none;
border-radius: 3px;
box-shadow: 0px -1px 0px #BBB inset;
box-shadow: 0px -1px 0px #bbb inset;
}
h1 {
......
$row-hover: #f4f8fe;
$gl-text-color: #54565B;
$gl-text-green: #4A2;
$gl-text-red: #D12F19;
$gl-text-orange: #D90;
$gl-text-color: #54565b;
$gl-text-green: #4a2;
$gl-text-red: #d12f19;
$gl-text-orange: #d90;
$gl-header-color: #323232;
$gl-link-color: #333c48;
$md-text-color: #444;
......@@ -30,24 +30,24 @@ $gl-vert-padding: 6px;
$gl-padding-top:10px;
$gl-avatar-size: 40px;
$secondary-text: #7f8fa4;
$error-exclamation-point: #E62958;
$error-exclamation-point: #e62958;
$border-radius-default: 3px;
$list-title-color: #333333;
$list-text-color: #555555;
$list-title-color: #333;
$list-text-color: #555;
$btn-transparent-color: #8F8F8F;
$btn-transparent-color: #8f8f8f;
$ssh-key-icon-color: #8F8F8F;
$ssh-key-icon-color: #8f8f8f;
$ssh-key-icon-size: 18px;
$provider-btn-group-border: #E5E5E5;
$provider-btn-not-active-color: #4688F1;
$provider-btn-group-border: #e5e5e5;
$provider-btn-not-active-color: #4688f1;
/*
* Color schema
*/
$white-light: #FFFFFF;
$white-light: #fff;
$white-normal: #ededed;
$white-dark: #ededed;
......@@ -57,55 +57,55 @@ $gray-dark: #ededed;
$gray-darkest: #c9c9c9;
$green-light: #38ae67;
$green-normal: #2FAA60;
$green-dark: #2CA05B;
$green-normal: #2faa60;
$green-dark: #2ca05b;
$blue-light: #2EA8E5;
$blue-normal: #2D9FD8;
$blue-dark: #2897CE;
$blue-light: #2ea8e5;
$blue-normal: #2d9fd8;
$blue-dark: #2897ce;
$blue-medium-light: #3498CB;
$blue-medium: #2F8EBF;
$blue-medium-dark: #2D86B4;
$blue-medium-light: #3498cb;
$blue-medium: #2f8ebf;
$blue-medium-dark: #2d86b4;
$orange-light: rgba(252, 109, 38, 0.80);
$orange-normal: #E75E40;
$orange-dark: #CE5237;
$orange-normal: #e75e40;
$orange-dark: #ce5237;
$red-light: #F06559;
$red-normal: #E52C5A;
$red-dark: #D22852;
$red-light: #f06559;
$red-normal: #e52c5a;
$red-dark: #d22852;
$border-white-light: #F1F2F4;
$border-white-normal: #D6DAE2;
$border-white-dark: #C6CACF;
$border-white-light: #f1f2f4;
$border-white-normal: #d6dae2;
$border-white-dark: #c6cacf;
$border-gray-light: rgba(0, 0, 0, 0.06);
$border-gray-normal: rgba(0, 0, 0, 0.10);;
$border-gray-dark: #C6CACF;
$border-gray-dark: #c6cacf;
$border-green-light: #2FAA60;
$border-green-normal: #2CA05B;
$border-green-light: #2faa60;
$border-green-normal: #2ca05b;
$border-green-dark: #279654;
$border-blue-light: #2D9FD8;
$border-blue-normal: #2897CE;
$border-blue-dark: #258DC1;
$border-blue-light: #2d9fd8;
$border-blue-normal: #2897ce;
$border-blue-dark: #258dc1;
$border-orange-light: #fc6d26;
$border-orange-normal: #CE5237;
$border-orange-dark: #C14E35;
$border-orange-normal: #ce5237;
$border-orange-dark: #c14e35;
$border-red-light: #F24F41;
$border-red-normal: #D22852;
$border-red-dark: #CA264F;
$border-red-light: #f24f41;
$border-red-normal: #d22852;
$border-red-dark: #ca264f;
$help-well-bg: #FAFAFA;
$help-well-border: #E5E5E5;
$help-well-bg: #fafafa;
$help-well-border: #e5e5e5;
$warning-message-bg: #FBF2D9;
$warning-message-color: #9E8E60;
$warning-message-border: #F0E2BB;
$warning-message-bg: #fbf2d9;
$warning-message-color: #9e8e60;