Harmonizing color variables

This commit is contained in:
2014-12-01 22:57:12 +01:00
parent c1f4308089
commit cfc7eb91b2
9 changed files with 90 additions and 89 deletions

View File

@@ -1,7 +1,7 @@
/* Standard Tags */ /* Standard Tags */
body, html { body, html {
background:white; background:$col_white;
font-family:Verdana, Arial; font-family:Verdana, Arial;
color:$col_blue; color:$col_blue;
background:$col_blue; background:$col_blue;
@@ -58,7 +58,7 @@ input[type=button], .clickable {
} }
select { select {
background:white; background:$col_white;
border:2px solid $col_blue; border:2px solid $col_blue;
padding:5px; padding:5px;
color:$col_blue; color:$col_blue;
@@ -221,7 +221,7 @@ a.button:hover {
} }
a.button:active { a.button:active {
background-color:$col_blue; background-color:$col_blue;
color:white; color:$col_white;
} }
a.button .fa { a.button .fa {
@@ -258,7 +258,7 @@ a.button.gimmespace {
} }
.addr:hover { .addr:hover {
background-color:white; background-color:$col_white;
} }
.maximized { .maximized {
@@ -364,12 +364,12 @@ a[href^="table"].internal_link span.item {
.step_box input, .step_box textarea, .step_box select, .step_box .read.textarea, .step_box .read.input { .step_box input, .step_box textarea, .step_box select, .step_box .read.textarea, .step_box .read.input {
margin-top:10px; margin-top:10px;
background:white; background:$col_white;
font-size:14px; font-size:14px;
border-width:1px; border-width:1px;
} }
.step_box input:disabled, .step_box textarea:disabled, .step_box select:disabled, .step_box input:hover:disabled, .step_box textarea:hover:disabled, .step_box select:hover:disabled { .step_box input:disabled, .step_box textarea:disabled, .step_box select:disabled, .step_box input:hover:disabled, .step_box textarea:hover:disabled, .step_box select:hover:disabled {
background-color:white; background-color:$col_white;
} }
.step_box input[type=text], .step_box textarea, .step_box .read.textarea, .step_box .read.input { .step_box input[type=text], .step_box textarea, .step_box .read.textarea, .step_box .read.input {
width:100%; width:100%;
@@ -377,7 +377,7 @@ a[href^="table"].internal_link span.item {
.step_box textarea, .step_box .read.textarea { .step_box textarea, .step_box .read.textarea {
height:200px; height:200px;
padding:5px; padding:5px;
background:white; background:$col_white;
border:1px solid $col_blue; border:1px solid $col_blue;
} }
.step_box .read.textarea, .step_box .read.input { .step_box .read.textarea, .step_box .read.input {
@@ -463,7 +463,7 @@ a[href^="table"].internal_link span.item {
height:210px; height:210px;
z-index:2; z-index:2;
border:1px solid $col_blue; border:1px solid $col_blue;
background:white; background:$col_white;
text-align:center; text-align:center;
} }
@@ -510,7 +510,7 @@ a.uploader_item_cancel {
.uploader_box .image_description { .uploader_box .image_description {
border-width:1px; border-width:1px;
padding:3px 5px; padding:3px 5px;
background:white; background:$col_white;
} }

View File

@@ -58,7 +58,7 @@
margin:10px; margin:10px;
} }
#logon .box { #logon .box {
background:white; background:$col_white;
overflow:auto; overflow:auto;
} }
#logon .box .key { #logon .box .key {

View File

@@ -6,3 +6,5 @@ $col_brighter_blue: #DCF2FB;
$col_new_blue: #0C8BCE; $col_new_blue: #0C8BCE;
$col_orange: #EFAB00; $col_orange: #EFAB00;
$col_bright_orange: #F2E1B5; $col_bright_orange: #F2E1B5;
$col_white: #FFFFFF;
$col_black: #000000;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -43,7 +43,7 @@
} }
#query { #query {
background:white; background:$col_white;
width:250px; width:250px;
} }
@@ -62,12 +62,11 @@
/* Main */ /* Main */
#main_container { #main_container {
background:white; background:$col_white;
/*padding:10px;*/
margin-left:30px; margin-left:30px;
position:relative; position:relative;
overflow:hidden; overflow:hidden;
border:10px solid white; border:10px solid $col_white;
} }
#page_title { #page_title {
@@ -84,7 +83,7 @@
line-height:32px; line-height:32px;
font-style:italic; font-style:italic;
font-weight:600; font-weight:600;
@include gradient-diag($col_bright_blue, #FFFFFF, 25%, 75%); @include gradient-diag($col_bright_blue, $col_white, 25%, 75%);
} }
#page_title h1 #title_feedback { #page_title h1 #title_feedback {
@@ -116,23 +115,23 @@
border-right:0 solid $col_blue; border-right:0 solid $col_blue;
background: $col_bright_blue; background: $col_bright_blue;
background: -moz-linear-gradient(top, $col_bright_blue 0%, #FFFFFF 25%); background: -moz-linear-gradient(top, $col_bright_blue 0%, $col_white 25%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,$col_bright_blue), color-stop(25%,#FFFFFF)); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,$col_bright_blue), color-stop(25%,$col_white));
background: -webkit-linear-gradient(top, $col_bright_blue 0%,#FFFFFF 25%); background: -webkit-linear-gradient(top, $col_bright_blue 0%,$col_white 25%);
background: -o-linear-gradient(top, $col_bright_blue 0%,#FFFFFF 25%); background: -o-linear-gradient(top, $col_bright_blue 0%,$col_white 25%);
background: -ms-linear-gradient(top, $col_bright_blue 0%,#FFFFFF 25%); background: -ms-linear-gradient(top, $col_bright_blue 0%,$col_white 25%);
background: linear-gradient(to bottom, $col_bright_blue 0%,#FFFFFF 25%); background: linear-gradient(to bottom, $col_bright_blue 0%,$col_white 25%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_bright_blue', endColorstr='#FFFFFF',GradientType=0 ); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_bright_blue', endColorstr='$col_white',GradientType=0 );
} }
#menu.opened { #menu.opened {
background: white; background: $col_white;
background: -moz-linear-gradient(left, #FFFFFF 75%, rgba(255,255,255,0) 100%); background: -moz-linear-gradient(left, $col_white 75%, rgba(255,255,255,0) 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(75%,#FFFFFF), color-stop(100%,rgba(255,255,255,0))); background: -webkit-gradient(linear, left top, right top, color-stop(75%,$col_white), color-stop(100%,rgba(255,255,255,0)));
background: -webkit-linear-gradient(left, #FFFFFF 75%,rgba(255,255,255,0) 100%); background: -webkit-linear-gradient(left, $col_white 75%,rgba(255,255,255,0) 100%);
background: -o-linear-gradient(left, #FFFFFF 75%,rgba(255,255,255,0) 100%); background: -o-linear-gradient(left, $col_white 75%,rgba(255,255,255,0) 100%);
background: -ms-linear-gradient(left, #FFFFFF 75%,rgba(255,255,255,0) 100%); background: -ms-linear-gradient(left, $col_white 75%,rgba(255,255,255,0) 100%);
background: linear-gradient(to right, #FFFFFF 75%,rgba(255,255,255,0) 100%); background: linear-gradient(to right, $col_white 75%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#00ffffff',GradientType=1 ); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_white', endColorstr='#00ffffff',GradientType=1 );
} }
#menu #menu_title { #menu #menu_title {
@@ -222,7 +221,7 @@
font-weight:bold; font-weight:bold;
padding-top:0; padding-top:0;
padding-bottom:5px; padding-bottom:5px;
border-bottom:1px solid #000000; border-bottom:1px solid #04357B;
margin-bottom:20px; margin-bottom:20px;
} }
@@ -255,25 +254,25 @@
font-weight:bold; font-weight:bold;
border:1px solid $col_blue; border:1px solid $col_blue;
cursor:pointer; cursor:pointer;
background: #FFFFFF; background: $col_white;
background: -moz-linear-gradient(top, #FFFFFF 15%, $col_bright_blue 85%); background: -moz-linear-gradient(top, $col_white 15%, $col_bright_blue 85%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,#FFFFFF), color-stop(85%,$col_bright_blue)); background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,$col_white), color-stop(85%,$col_bright_blue));
background: -webkit-linear-gradient(top, #FFFFFF 15%,$col_bright_blue 85%); background: -webkit-linear-gradient(top, $col_white 15%,$col_bright_blue 85%);
background: -o-linear-gradient(top, #FFFFFF 15%,$col_bright_blue 85%); background: -o-linear-gradient(top, $col_white 15%,$col_bright_blue 85%);
background: -ms-linear-gradient(top, #FFFFFF 15%,$col_bright_blue 85%); background: -ms-linear-gradient(top, $col_white 15%,$col_bright_blue 85%);
background: linear-gradient(to bottom, #FFFFFF 15%,$col_bright_blue 85%); background: linear-gradient(to bottom, $col_white 15%,$col_bright_blue 85%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='$col_bright_blue',GradientType=0 ); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_white', endColorstr='$col_bright_blue',GradientType=0 );
} }
#welcome span.milestone:hover { #welcome span.milestone:hover {
color:$col_orange; color:$col_orange;
border-color:$col_orange; border-color:$col_orange;
background: -moz-linear-gradient(top, #FFFFFF 15%, $col_bright_orange 85%); background: -moz-linear-gradient(top, $col_white 15%, $col_bright_orange 85%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,#FFFFFF), color-stop(85%,$col_bright_orange)); background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,$col_white), color-stop(85%,$col_bright_orange));
background: -webkit-linear-gradient(top, #FFFFFF 15%,$col_bright_orange 85%); background: -webkit-linear-gradient(top, $col_white 15%,$col_bright_orange 85%);
background: -o-linear-gradient(top, #FFFFFF 15%,$col_bright_orange 85%); background: -o-linear-gradient(top, $col_white 15%,$col_bright_orange 85%);
background: -ms-linear-gradient(top, #FFFFFF 15%,$col_bright_orange 85%); background: -ms-linear-gradient(top, $col_white 15%,$col_bright_orange 85%);
background: linear-gradient(to bottom, #FFFFFF 15%,$col_bright_orange 85%); background: linear-gradient(to bottom, $col_white 15%,$col_bright_orange 85%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='$col_bright_orange',GradientType=0 ); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_white', endColorstr='$col_bright_orange',GradientType=0 );
} }
#welcome span.milestone .fa { #welcome span.milestone .fa {
margin-right:5px; margin-right:5px;
@@ -313,7 +312,7 @@
min-height:100px; min-height:100px;
height:300px; height:300px;
font-family:courier; font-family:courier;
color:black; color:$col_black;
font-size:14px; font-size:14px;
} }
@@ -393,21 +392,21 @@
#code_container .code_reader ol li ::selection { #code_container .code_reader ol li ::selection {
background:#306897; background:#306897;
color:#FFFFFF; color:$col_white;
} }
#code_container .code_reader ol li ::-moz-selection { #code_container .code_reader ol li ::-moz-selection {
background:#306897; background:#306897;
color:#FFFFFF; color:$col_white;
} }
#code_container .code_reader .author_box { #code_container .code_reader .author_box {
background:$col_blue; background:$col_blue;
border:none; border:none;
color:white; color:$col_white;
} }
#code_container .code_reader .author_box * { #code_container .code_reader .author_box * {
color:white; color:$col_white;
} }
#code_container .code_reader .tab_left { #code_container .code_reader .tab_left {
@@ -420,7 +419,7 @@
#code_container .code_reader ol { #code_container .code_reader ol {
border-left: 1px solid #848484; border-left: 1px solid #848484;
background:white; background:$col_white;
margin:0; margin:0;
/*list-style-type:decimal-leading-zero;*/ /*list-style-type:decimal-leading-zero;*/
} }
@@ -430,7 +429,7 @@
margin:0; margin:0;
padding:0; padding:0;
border-left:1px dotted #398c8c; border-left:1px dotted #398c8c;
background:white; background:$col_white;
font-family:Courier New, Courier; font-family:Courier New, Courier;
font-size:12px; font-size:12px;
line-height:12px; line-height:12px;
@@ -460,7 +459,7 @@
#code_container .code_reader .field-symbol {color:#848484;} #code_container .code_reader .field-symbol {color:#848484;}
#code_container .code_reader .line {color:#848484;} #code_container .code_reader .line {color:#848484;}
#code_container .code_reader .line-number, #code_container .code_reader .line-post-number {color:#398c8c;} #code_container .code_reader .line-number, #code_container .code_reader .line-post-number {color:#398c8c;}
#code_container .code_reader .global {color:#000000;} #code_container .code_reader .global {color:$col_black;}
#code_container .code_reader .expand {font-weight:bold;} #code_container .code_reader .expand {font-weight:bold;}
#code_container .code_reader .comment span.code_part { #code_container .code_reader .comment span.code_part {
color:$col_blue; color:$col_blue;
@@ -481,7 +480,7 @@
/* Default code line */ /* Default code line */
#code_container .code_reader ol li span { #code_container .code_reader ol li span {
color:#000000; color:$col_black;
} }
#code_container .code_reader ol li span.code, ol li span.comment { #code_container .code_reader ol li span.code, ol li span.comment {
font-size:14px; font-size:14px;
@@ -533,7 +532,7 @@
cursor:pointer; cursor:pointer;
padding:0; padding:0;
z-index:1000; z-index:1000;
background: white 0 0 no-repeat; background: $col_white 0 0 no-repeat;
width:9px; width:9px;
height:9px; height:9px;
} }
@@ -652,7 +651,7 @@
background:$col_bright_blue; background:$col_bright_blue;
} }
#profile #user_history p.history_line:nth-child(even) { #profile #user_history p.history_line:nth-child(even) {
background:#FFFFFF; background:$col_white;
} }
#profile #user_history p.history_line:FIRST-CHILD { #profile #user_history p.history_line:FIRST-CHILD {
-moz-border-radius-topleft: 10px; -moz-border-radius-topleft: 10px;
@@ -694,25 +693,25 @@
#chat #chat_room { #chat #chat_room {
margin-right:175px; /* 165px + 10px (margin-left) */ margin-right:175px; /* 165px + 10px (margin-left) */
border:2px solid $col_blue; border:2px solid $col_blue;
background:white; background:$col_white;
height:100%; height:100%;
} }
.g_white_transparent { .g_white_transparent {
background: #000000 url("images/grad_white_transparent_50.png") repeat-x top; background: $col_black url("images/grad_white_transparent_50.png") repeat-x top;
/*-o-background-size: 100% 100%; /*-o-background-size: 100% 100%;
-moz-background-size: 100% 100%; -moz-background-size: 100% 100%;
-webkit-background-size: 100% 100%; -webkit-background-size: 100% 100%;
background-size: 100% 100%; background-size: 100% 100%;
background: -moz-linear-gradient( background: -moz-linear-gradient(
top, top,
#FFFFFF, $col_white,
rgba(255,255,255,0) rgba(255,255,255,0)
); );
background: -webkit-gradient( background: -webkit-gradient(
linear, linear,
left top, left bottom, left top, left bottom,
from(#FFFFFF), from($col_white),
to(rgba(255,255,255,0)) to(rgba(255,255,255,0))
);*/ );*/
} }
@@ -734,7 +733,7 @@
position:relative; position:relative;
height:20px; height:20px;
overflow:hidden; overflow:hidden;
background:white url("images/sap_gold_332.jpg") 50% 50% no-repeat; background:$col_white url("images/sap_gold_332.jpg") 50% 50% no-repeat;
} }
#chat #chat_room #chat_container #chat_messages { #chat #chat_room #chat_container #chat_messages {
@@ -757,7 +756,7 @@
vertical-align:middle; vertical-align:middle;
border:1px solid $col_blue; border:1px solid $col_blue;
padding:5px; padding:5px;
background:#FFFFFF; background:$col_white;
} }
#chat_messages p.U { #chat_messages p.U {
/*background-color:white;*/ /*background-color:white;*/
@@ -815,7 +814,7 @@
border:1px dashed #666666; border:1px dashed #666666;
padding:0 0 5px 0; padding:0 0 5px 0;
margin:5px 0; margin:5px 0;
background:white; background:$col_white;
} }
#chat_messages .help p { #chat_messages .help p {
padding:0 5px; padding:0 5px;
@@ -859,7 +858,7 @@
} }
#chat #chat_input input#message { #chat #chat_input input#message {
color:white; color:$col_white;
margin:0; margin:0;
padding:7px 0; padding:7px 0;
border:none; border:none;
@@ -972,7 +971,7 @@
} }
#chat #chat_chan .tab_bar span.chan:hover, #chat #chat_chan .tab_bar span#join_chan.active { #chat #chat_chan .tab_bar span.chan:hover, #chat #chat_chan .tab_bar span#join_chan.active {
background-color:$col_blue; background-color:$col_blue;
color:#FFFFFF; color:$col_white;
} }
#chat #chat_chan .tab_bar span.chan span.chan_title { #chat #chat_chan .tab_bar span.chan span.chan_title {
text-transform:capitalize; text-transform:capitalize;
@@ -1003,13 +1002,13 @@
margin:0; margin:0;
width:70px; width:70px;
background-color:$col_blue; background-color:$col_blue;
color:white; color:$col_white;
font-weight:bold; font-weight:bold;
} }
#chat #chat_chan .tab_bar span.active, #chat #chat_chan .tab_bar span.active:hover { #chat #chat_chan .tab_bar span.active, #chat #chat_chan .tab_bar span.active:hover {
border-bottom-color: #FFFFFF; border-bottom-color: $col_white;
background-color: #FFFFFF; background-color: $col_white;
color:#000000; color:$col_black;
} }
#chat #chat_chan .tab_bar span.light_up { #chat #chat_chan .tab_bar span.light_up {
@@ -1070,7 +1069,7 @@
#options .options_box input[type=text], #options .options_box input[type=password], #options .options_box select { #options .options_box input[type=text], #options .options_box input[type=password], #options .options_box select {
font-size:14px; font-size:14px;
background:white; background:$col_white;
border-width:1px; border-width:1px;
font-size:14px; font-size:14px;
padding:5px; padding:5px;
@@ -1097,7 +1096,7 @@
/* Procedure */ /* Procedure */
#procedure #procedure_steps .button { #procedure #procedure_steps .button {
background-color:white; background-color:$col_white;
} }
#procedure #procedure_steps .button:hover { #procedure #procedure_steps .button:hover {
@@ -1156,7 +1155,7 @@
margin:0 10px; margin:0 10px;
max-width:250px; max-width:250px;
border:1px solid $col_blue; border:1px solid $col_blue;
background:white; background:$col_white;
} }
#procedure #bottom_menu { #procedure #bottom_menu {
@@ -1179,7 +1178,7 @@
} }
#procedure .thumbnail_image { #procedure .thumbnail_image {
background:white; background:$col_white;
border:1px solid $col_blue; border:1px solid $col_blue;
width:100px; width:100px;
height:100px; height:100px;
@@ -1308,7 +1307,7 @@
} }
#footer p, #footer a { #footer p, #footer a {
color:white; color:$col_white;
margin:0; margin:0;
font-size:9px; font-size:9px;
} }

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -32,9 +32,9 @@
left:0; left:0;
padding:10px 10px 10px 35px; padding:10px 10px 10px 35px;
margin:0; margin:0;
border-bottom:3px solid white; border-bottom:3px solid $col_white;
font-weight:bold; font-weight:bold;
color:white; color:$col_white;
font-size:35px; font-size:35px;
line-height:35px; line-height:35px;
text-decoration: none; text-decoration: none;
@@ -49,7 +49,7 @@
margin-top:-64px; /* -(10*2+20*4+20*2+20+2*2+1*2)/2 */ margin-top:-64px; /* -(10*2+20*4+20*2+20+2*2+1*2)/2 */
} }
.box { .box {
background:white; background:$col_white;
overflow:hidden; overflow:hidden;
position:relative; position:relative;
@@ -125,10 +125,10 @@
.logon_msg { .logon_msg {
margin-top:10px; margin-top:10px;
padding:5px; padding:5px;
color:white; color:$col_white;
text-align:center; text-align:center;
font-size: 0.75em; font-size: 0.75em;
border:1px solid white; border:1px solid $col_white;
span { span {
display:block; display:block;