franzz/databap
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

harmonize colors palette (v2)

Browse Source
This commit is contained in:
Franzz
2014-12-01 23:37:25 +01:00
parent cfc7eb91b2
commit 4d1276adf0
10 changed files with 259 additions and 247 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
style/_common.scss
View File

@@ -1,10 +1,10 @@
/* Standard Tags */
body, html {
background:$col_white;
background:$col_none;
font-family:Verdana, Arial;
color:$col_blue;
background:$col_blue;
color:$col_main_1;
background:$col_main_1;
padding:0;
margin:0;
min-width:1024px;
@@ -30,23 +30,23 @@ input, textarea, select {
border:none;
}
input[type=text], input[type=password] {
border:2px solid $col_blue;
border:2px solid $col_main_1;
padding:5px;
width:200px;
}
input[type=button]:hover, input[type=submit]:hover, input[type=password]:hover, input[type=text]:hover, input[type=text]:focus {
background-color:$col_orange;
background-color:$col_hover_1;
}
input[disabled="disabled"], textarea[disabled="disabled"], input:disabled, textarea:disabled {
background-color:$col_bright_blue;
border-color:$col_bright_blue;
border:2px solid $col_blue;
background-color:$col_main_2;
border-color:$col_main_2;
border:2px solid $col_main_1;
}
input[disabled="disabled"]:hover, textarea[disabled="disabled"]:hover, input:disabled:hover, textarea:disabled:hover {
background-color:$col_bright_blue;
background-color:$col_main_2;
}
button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner,input[type="file"] > input[type="button"]::-moz-focus-inner {
@@ -58,10 +58,10 @@ input[type=button], .clickable {
}
select {
background:$col_white;
border:2px solid $col_blue;
background:$col_none;
border:2px solid $col_main_1;
padding:5px;
color:$col_blue;
color:$col_main_1;
margin:0;
}
@@ -70,7 +70,7 @@ textarea {
}
input, select, textarea, h1, h2, h3, h4, p, a {
color:$col_blue;
color:$col_main_1;
}
p {
@@ -183,45 +183,45 @@ img {
}
.error, .error a {
color:red;
border-color:red;
color:$col_error;
border-color:$col_error;
font-size:14px;
font-weight:bold;
}
.warning, .warning a {
color:orange;
border-color:orange;
color:$col_warning;
border-color:$col_warning;
font-size:13px;
font-style:italic;
}
.success, .success a {
color:green;
border-color:green;
color:$col_success;
border-color:$col_success;
font-size:13px;
}
.default_text {
color:$col_bright_blue !important;
color:$col_main_2 !important;
}
a.button {
padding:7px;
margin-right:5px;
background:$col_bright_blue;
background:$col_main_2;
font-size:12px;
cursor:pointer;
border:1px solid $col_blue;
border:1px solid $col_main_1;
/*position:relative;*/
display:inline-block;
}
a.button:hover {
background-color:$col_orange;
background-color:$col_hover_1;
}
a.button:active {
background-color:$col_blue;
color:$col_white;
background-color:$col_main_1;
color:$col_none;
}
a.button .fa {
@@ -234,13 +234,13 @@ a.button.strong .value {
}
a.button.inverse {
background-color:$col_blue;
color:$col_bright_blue;
background-color:$col_main_1;
color:$col_main_2;
}
a.button.inverse:hover {
background-color:$col_orange;
color:$col_blue;
background-color:$col_hover_1;
color:$col_main_1;
}
a.button.heavy {
@@ -258,7 +258,7 @@ a.button.gimmespace {
}
.addr:hover {
background-color:$col_white;
background-color:$col_none;
}
.maximized {
@@ -284,7 +284,7 @@ a.button.gimmespace {
a.internal_link {
text-decoration:underline;
font-style:normal;
background:$col_bright_blue;
background:$col_main_2;
padding:1px 8px 1px 5px;
margin:0;
}
@@ -300,19 +300,19 @@ a[href^="table"].internal_link span.item {
.author_box {
padding:5px 10px;
border:1px solid $col_blue;
color:$col_blue;
border:1px solid $col_main_1;
color:$col_main_1;
font-style:italic;
font-size:12px;
}
.author_box:nth-child(odd) {
background:$col_brighter_blue;
background:$col_main_3;
}
.author_box:nth-child(even) {
background:$col_bright_blue;
background:$col_main_2;
}
.author_box:hover {
border-color:$col_orange;
border-color:$col_hover_1;
}
.author_box a {
@@ -341,7 +341,7 @@ a[href^="table"].internal_link span.item {
margin-top:10px;
}
.standalone .author_box:hover {
color:$col_orange;
color:$col_hover_1;
}
.hide, .mobile {
@@ -354,22 +354,22 @@ a[href^="table"].internal_link span.item {
margin-top:5px;
margin-bottom:5px;
padding:10px;
background:$col_bright_blue;
color:$col_blue;
border: 2px solid $col_blue;
background:$col_main_2;
color:$col_main_1;
border: 2px solid $col_main_1;
}
.step_box:nth-child(even) {
background:$col_brighter_blue;
background:$col_main_3;
}
.step_box input, .step_box textarea, .step_box select, .step_box .read.textarea, .step_box .read.input {
margin-top:10px;
background:$col_white;
background:$col_none;
font-size:14px;
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 {
background-color:$col_white;
background-color:$col_none;
}
.step_box input[type=text], .step_box textarea, .step_box .read.textarea, .step_box .read.input {
width:100%;
@@ -377,26 +377,26 @@ a[href^="table"].internal_link span.item {
.step_box textarea, .step_box .read.textarea {
height:200px;
padding:5px;
background:$col_white;
border:1px solid $col_blue;
background:$col_none;
border:1px solid $col_main_1;
}
.step_box .read.textarea, .step_box .read.input {
border-color:$col_bright_blue;
border-color:$col_main_2;
font-weight:bold;
}
.step_box .read.textarea {
background-color:$col_brighter_blue;
background-color:$col_main_3;
}
.step_box:nth-child(even) .read.textarea {
background-color:$col_bright_blue;
background-color:$col_main_2;
}
.step_box .read.input {
background-color:$col_bright_blue;
background-color:$col_main_2;
padding-left:0;
}
.step_box .step_nb_box, .step_box .step_box_title {
border-bottom:1px solid $col_blue;
border-bottom:1px solid $col_main_1;
padding:0;
}
@@ -423,11 +423,11 @@ a[href^="table"].internal_link span.item {
}
.scrollbar .thumb, .scrollbar .thumb .end {
background-color:$col_blue;
background-color:$col_main_1;
width:13px;
}
.scrollbar .track {
background-color:$col_bright_blue;
background-color:$col_main_2;
height:100%;
width:13px;
position:relative;
@@ -462,13 +462,13 @@ a[href^="table"].internal_link span.item {
height:100%;
height:210px;
z-index:2;
border:1px solid $col_blue;
background:$col_white;
border:1px solid $col_main_1;
background:$col_none;
text-align:center;
}
.uploader_droparea-active {
background:$col_orange;
background:$col_hover_1;
}
.uploader_droparea span {
display:block;
@@ -504,13 +504,13 @@ a[href^="table"].internal_link span.item {
a.uploader_item_cancel {
text-decoration:underline;
color:$col_blue;
color:$col_main_1;
}
.uploader_box .image_description {
border-width:1px;
padding:3px 5px;
background:$col_white;
background:$col_none;
}
@@ -531,9 +531,9 @@ a.uploader_item_cancel {
}
.uploader_item_failed {
color:red;
color:$col_error;
}
.uploader_item_success .fa-c-delete:hover, .uploader_item_cancel .fa-c-delete:hover {
color:$col_orange;
color:$col_hover_1;
}

10
style/_fa-custom.scss
View File

@@ -102,7 +102,7 @@ vertical-align 0% -5% -10% -15% -20% -25% -30%
}
.fa-c-comment {
color:$col_blue;
color:$col_main_1;
}
.fa-c-comment:before {
content: "\f075";
@@ -129,7 +129,7 @@ vertical-align 0% -5% -10% -15% -20% -25% -30%
}
.fa-c-fold {
color:$col_blue;
color:$col_main_1;
}
.fa-c-fold:before {
content: "\f191";
@@ -140,21 +140,21 @@ vertical-align 0% -5% -10% -15% -20% -25% -30%
}
.fa-c-warning {
color:$col_orange;
color:$col_warning;
}
.fa-c-warning:before {
content: "\f071";
}
.fa-c-error {
color:red;
color:$col_error;
}
.fa-c-error:before {
content: "\f071";
}
.fa-c-ko {
color:red;
color:$col_error;
}
.fa-c-ko:before, .unavailable .fa:before {
content: "\f00d";

16
style/_lightbox.scss
View File

@@ -36,7 +36,7 @@
.lb-outerContainer {
position: relative;
background-color: $col_blue;
background-color: $col_main_1;
*zoom: 1;
width: 250px;
height: 250px;
@@ -74,7 +74,7 @@
height: 32px;
margin: 0 auto;
font-size:32px;
color:$col_bright_blue;
color:$col_main_2;
}
.lb-nav {
@@ -144,16 +144,16 @@
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
color:$col_blue;
color:$col_main_1;
padding: 0 20px;
}
.lb-prev .fa {
text-shadow: -1px 2px 1px $col_bright_blue;
text-shadow: -1px 2px 1px $col_main_2;
}
.lb-next .fa {
text-shadow: 1px 1px 1px $col_bright_blue;
text-shadow: 1px 1px 1px $col_main_2;
}
.lb-dataContainer {
@@ -177,7 +177,7 @@
.lb-data {
padding: 0 4px;
color:$col_blue;
color:$col_main_1;
}
.lb-data .lb-details {
@@ -198,7 +198,7 @@
clear: left;
padding-bottom: 1em;
font-size: 12px;
color:$col_blue;
color:$col_main_1;
}
.lb-data .lb-close {
@@ -207,7 +207,7 @@
width: 30px;
height: 30px;
font-size:30px;
color:$col_blue;
color:$col_main_1;
text-align: right;
outline: none;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);

28
style/_variables.scss
View File

@@ -1,10 +1,22 @@
@CHARSET "UTF-8";
$col_blue: #04357B;
$col_bright_blue: #D9E5F2;
$col_brighter_blue: #DCF2FB;
$col_new_blue: #0C8BCE;
$col_orange: #EFAB00;
$col_bright_orange: #F2E1B5;
$col_white: #FFFFFF;
$col_black: #000000;
/* All colors of the same type are sorted from the darkest to the brightest */
/* Main colors */
$col_main_1: #04357B;
$col_main_2: #D9E5F2;
$col_main_3: #DCF2FB;
/* Flashy hover colors */
$col_hover_1: #EFAB00;
$col_hover_2: #F2E1B5;
/* Traffic light colors */
$col_success: green;
$col_warning: orange;
$col_error: red;
/* Technical colors */
$col_none: #FFFFFF;
$col_black: #000000;
$col_main_4: #0C8BCE;

2
style/databap.css
View File

File diff suppressed because one or more lines are too long

2
style/databap.css.map
View File

File diff suppressed because one or more lines are too long

304
style/databap.scss
View File

@@ -9,7 +9,7 @@
/* Container */
#container {
background:$col_blue;
background:$col_main_1;
padding:10px 10px 1px;
}
@@ -35,7 +35,7 @@
#query, #search_btn_submit {
height:25px;
color:$col_blue;
color:$col_main_1;
border:none;
float:right;
padding:0 10px;
@@ -43,30 +43,30 @@
}
#query {
background:$col_white;
background:$col_none;
width:250px;
}
#search_btn_submit {
background:$col_bright_blue;
border-left:2px solid $col_blue;
background:$col_main_2;
border-left:2px solid $col_main_1;
height:20px;
padding-top:5px;
}
#search_btn_submit:hover {
background-color:$col_orange;
background-color:$col_hover_1;
}
}
/* Main */
#main_container {
background:$col_white;
background:$col_none;
margin-left:30px;
position:relative;
overflow:hidden;
border:10px solid $col_white;
border:10px solid $col_none;
}
#page_title {
@@ -77,13 +77,13 @@
margin:0 -12px 12px;
padding:12px 10px;
width:100%;
border:2px solid $col_blue;
border:2px solid $col_main_1;
font-family:Arial;
font-size:32px;
line-height:32px;
font-style:italic;
font-weight:600;
@include gradient-diag($col_bright_blue, $col_white, 25%, 75%);
@include gradient-diag($col_main_2, $col_none, 25%, 75%);
}
#page_title h1 #title_feedback {
@@ -112,26 +112,26 @@
width:20px;
padding:10px 0;
z-index:10;
border-right:0 solid $col_blue;
border-right:0 solid $col_main_1;
background: $col_bright_blue;
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%,$col_white));
background: -webkit-linear-gradient(top, $col_bright_blue 0%,$col_white 25%);
background: -o-linear-gradient(top, $col_bright_blue 0%,$col_white 25%);
background: -ms-linear-gradient(top, $col_bright_blue 0%,$col_white 25%);
background: linear-gradient(to bottom, $col_bright_blue 0%,$col_white 25%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_bright_blue', endColorstr='$col_white',GradientType=0 );
background: $col_main_2;
background: -moz-linear-gradient(top, $col_main_2 0%, $col_none 25%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,$col_main_2), color-stop(25%,$col_none));
background: -webkit-linear-gradient(top, $col_main_2 0%,$col_none 25%);
background: -o-linear-gradient(top, $col_main_2 0%,$col_none 25%);
background: -ms-linear-gradient(top, $col_main_2 0%,$col_none 25%);
background: linear-gradient(to bottom, $col_main_2 0%,$col_none 25%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_main_2', endColorstr='$col_none',GradientType=0 );
}
#menu.opened {
background: $col_white;
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%,$col_white), color-stop(100%,rgba(255,255,255,0)));
background: -webkit-linear-gradient(left, $col_white 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, $col_white 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='$col_white', endColorstr='#00ffffff',GradientType=1 );
background: $col_none;
background: -moz-linear-gradient(left, $col_none 75%, rgba(255,255,255,0) 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(75%,$col_none), color-stop(100%,rgba(255,255,255,0)));
background: -webkit-linear-gradient(left, $col_none 75%,rgba(255,255,255,0) 100%);
background: -o-linear-gradient(left, $col_none 75%,rgba(255,255,255,0) 100%);
background: -ms-linear-gradient(left, $col_none 75%,rgba(255,255,255,0) 100%);
background: linear-gradient(to right, $col_none 75%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_none', endColorstr='#00ffffff',GradientType=1 );
}
#menu #menu_title {
@@ -147,7 +147,7 @@
#menu #menu_box {
display:none;
color:$col_blue;
color:$col_main_1;
text-align:center;
}
@@ -176,24 +176,24 @@
}
#menu #menu_box ul li a {
color:$col_blue;
color:$col_main_1;
display:block;
width:100%;
}
#menu #menu_box ul li:hover a {
color:$col_orange;
color:$col_hover_1;
}
#menu #menu_box ul li#rss_ln a {
color:$col_blue;
color:$col_main_1;
}
#menu #menu_box ul li#quick_code_access_ln input {
border:2px solid $col_blue;
border:2px solid $col_main_1;
width:60px;
padding:0 5px;
font-size:16px;
color:$col_blue;
color:$col_main_1;
}
#menu #menu_box ul li .fa {
@@ -206,14 +206,14 @@
position:absolute;
bottom:5px;
left:5px;
border:5px solid $col_blue;
border:5px solid $col_main_1;
}
/* Welcome */
#welcome #welcome_container {
border:2px solid $col_blue;
background:$col_bright_blue;
border:2px solid $col_main_1;
background:$col_main_2;
padding:10px;
}
@@ -252,27 +252,27 @@
margin-left:5px;
padding:2px 5px;
font-weight:bold;
border:1px solid $col_blue;
border:1px solid $col_main_1;
cursor:pointer;
background: $col_white;
background: -moz-linear-gradient(top, $col_white 15%, $col_bright_blue 85%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,$col_white), color-stop(85%,$col_bright_blue));
background: -webkit-linear-gradient(top, $col_white 15%,$col_bright_blue 85%);
background: -o-linear-gradient(top, $col_white 15%,$col_bright_blue 85%);
background: -ms-linear-gradient(top, $col_white 15%,$col_bright_blue 85%);
background: linear-gradient(to bottom, $col_white 15%,$col_bright_blue 85%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_white', endColorstr='$col_bright_blue',GradientType=0 );
background: $col_none;
background: -moz-linear-gradient(top, $col_none 15%, $col_main_2 85%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,$col_none), color-stop(85%,$col_main_2));
background: -webkit-linear-gradient(top, $col_none 15%,$col_main_2 85%);
background: -o-linear-gradient(top, $col_none 15%,$col_main_2 85%);
background: -ms-linear-gradient(top, $col_none 15%,$col_main_2 85%);
background: linear-gradient(to bottom, $col_none 15%,$col_main_2 85%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_none', endColorstr='$col_main_2',GradientType=0 );
}
#welcome span.milestone:hover {
color:$col_orange;
border-color:$col_orange;
background: -moz-linear-gradient(top, $col_white 15%, $col_bright_orange 85%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,$col_white), color-stop(85%,$col_bright_orange));
background: -webkit-linear-gradient(top, $col_white 15%,$col_bright_orange 85%);
background: -o-linear-gradient(top, $col_white 15%,$col_bright_orange 85%);
background: -ms-linear-gradient(top, $col_white 15%,$col_bright_orange 85%);
background: linear-gradient(to bottom, $col_white 15%,$col_bright_orange 85%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_white', endColorstr='$col_bright_orange',GradientType=0 );
color:$col_hover_1;
border-color:$col_hover_1;
background: -moz-linear-gradient(top, $col_none 15%, $col_hover_2 85%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,$col_none), color-stop(85%,$col_hover_2));
background: -webkit-linear-gradient(top, $col_none 15%,$col_hover_2 85%);
background: -o-linear-gradient(top, $col_none 15%,$col_hover_2 85%);
background: -ms-linear-gradient(top, $col_none 15%,$col_hover_2 85%);
background: linear-gradient(to bottom, $col_none 15%,$col_hover_2 85%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$col_none', endColorstr='$col_hover_2',GradientType=0 );
}
#welcome span.milestone .fa {
margin-right:5px;
@@ -308,7 +308,7 @@
margin:0 -10px;
padding:10px 6px 10px 10px;
width:100%;
border:2px solid $col_blue;
border:2px solid $col_main_1;
min-height:100px;
height:300px;
font-family:courier;
@@ -321,10 +321,10 @@
}
#add_code_container input[type=text] {
border:2px solid $col_blue;
border:2px solid $col_main_1;
width:400px;
padding:5px;
color:$col_blue;
color:$col_main_1;
}
#auth_company_container {
@@ -337,7 +337,7 @@
}
#add_code_container input:hover, #add_code_container input[type=text]:focus {
background-color:$col_orange;
background-color:$col_hover_1;
}
#link_result, #available_phrase {
@@ -349,8 +349,8 @@
}
#link_result {
color:$col_blue;
border-color:$col_blue;
color:$col_main_1;
border-color:$col_main_1;
}
#available_phrase {
@@ -358,12 +358,12 @@
}
#available_phrase.available {
color:green;
border-color:green;
color:$col_success;
border-color:$col_success;
}
#available_phrase.unavailable {
color:red;
border-color:red;
color:$col_error;
border-color:$col_error;
}
/* read code */
@@ -380,10 +380,10 @@
#code_container .code_reader {
margin:10px 0 0 0;
border:2px solid $col_blue;
border:2px solid $col_main_1;
padding:0;
background:#b5b5c6;
background:$col_blue;
background:$col_main_1;
}
#reader #code_container .code_reader {
@@ -392,21 +392,21 @@
#code_container .code_reader ol li ::selection {
background:#306897;
color:$col_white;
color:$col_none;
}
#code_container .code_reader ol li ::-moz-selection {
background:#306897;
color:$col_white;
color:$col_none;
}
#code_container .code_reader .author_box {
background:$col_blue;
background:$col_main_1;
border:none;
color:$col_white;
color:$col_none;
}
#code_container .code_reader .author_box * {
color:$col_white;
color:$col_none;
}
#code_container .code_reader .tab_left {
@@ -419,7 +419,7 @@
#code_container .code_reader ol {
border-left: 1px solid #848484;
background:$col_white;
background:$col_none;
margin:0;
/*list-style-type:decimal-leading-zero;*/
}
@@ -429,7 +429,7 @@
margin:0;
padding:0;
border-left:1px dotted #398c8c;
background:$col_white;
background:$col_none;
font-family:Courier New, Courier;
font-size:12px;
line-height:12px;
@@ -447,7 +447,7 @@
}
#code_container .code_reader ol li:hover, #code_container .code_reader ol li.code_hover {
background-color:$col_bright_blue;
background-color:$col_main_2;
}
#code_container .code_reader .core {color:#0000ff; text-transform:uppercase;}
@@ -462,7 +462,7 @@
#code_container .code_reader .global {color:$col_black;}
#code_container .code_reader .expand {font-weight:bold;}
#code_container .code_reader .comment span.code_part {
color:$col_blue;
color:$col_main_1;
font-weight:bold;
text-transform:capitalize;
}
@@ -493,18 +493,18 @@
}
#code_container .code_reader ol li a.internal_link, #code_container .code_reader ol li a.external_link {
color:$col_blue;
color:$col_main_1;
border:none;
font-weight:normal;
text-indent:0;
text-decoration:underline;
}
#code_container .code_reader ol li a.internal_link span {
color:$col_blue;
color:$col_main_1;
font-weight:normal;
}
#code_container .code_reader a.internal_link:hover, #code_container .code_reader a.internal_link:hover span {
color:$col_orange;
color:$col_hover_1;
}
#code_container .code_reader ol li span.hide span {
@@ -532,7 +532,7 @@
cursor:pointer;
padding:0;
z-index:1000;
background: $col_white 0 0 no-repeat;
background: $col_none 0 0 no-repeat;
width:9px;
height:9px;
}
@@ -575,7 +575,7 @@
#search .code_reader:hover .tab_left,
#search .code_reader:hover ol,
#search .code_reader:hover li {
background-color:$col_bright_blue;
background-color:$col_main_2;
cursor:pointer;
}
@@ -597,7 +597,7 @@
width:96px;
height:96px;
background:url("images/avatar_96.png") 0 0 no-repeat;
border:2px solid $col_blue;
border:2px solid $col_main_1;
float:left;
}
@@ -612,8 +612,8 @@
margin-left:110px; /* 96 (picture) + 10 (margin) + 4 (borders) */
padding:10px 16px;
height:76px; /* 96 (picture height) - 20 (padding) */
border:2px solid $col_blue;
background:$col_bright_blue;
border:2px solid $col_main_1;
background:$col_main_2;
}
#profile .user .fa {
@@ -633,14 +633,14 @@
margin:30px 0 0 0 ;
padding:0 10px 0 25px;;
font-size:25px;
color:$col_blue;
border-bottom:2px solid $col_blue;
color:$col_main_1;
border-bottom:2px solid $col_main_1;
background:url(images/logo_25.png) 0 1px no-repeat;
}
#profile #history_subbox {
margin-top:10px;
border:2px solid $col_blue;
border:2px solid $col_main_1;
}
#profile #user_history p.history_line {
@@ -648,10 +648,10 @@
font-size:14px;
}
#profile #user_history p.history_line:nth-child(odd) {
background:$col_bright_blue;
background:$col_main_2;
}
#profile #user_history p.history_line:nth-child(even) {
background:$col_white;
background:$col_none;
}
#profile #user_history p.history_line:FIRST-CHILD {
-moz-border-radius-topleft: 10px;
@@ -692,8 +692,8 @@
#chat #chat_room {
margin-right:175px; /* 165px + 10px (margin-left) */
border:2px solid $col_blue;
background:$col_white;
border:2px solid $col_main_1;
background:$col_none;
height:100%;
}
@@ -705,13 +705,13 @@
background-size: 100% 100%;
background: -moz-linear-gradient(
top,
$col_white,
$col_none,
rgba(255,255,255,0)
);
background: -webkit-gradient(
linear,
left top, left bottom,
from($col_white),
from($col_none),
to(rgba(255,255,255,0))
);*/
}
@@ -733,7 +733,7 @@
position:relative;
height:20px;
overflow:hidden;
background:$col_white url("images/sap_gold_332.jpg") 50% 50% no-repeat;
background:$col_none url("images/sap_gold_332.jpg") 50% 50% no-repeat;
}
#chat #chat_room #chat_container #chat_messages {
@@ -750,19 +750,19 @@
}
#chat_messages p {
color:$col_blue;
color:$col_main_1;
}
#chat_messages p img.proxy {
vertical-align:middle;
border:1px solid $col_blue;
border:1px solid $col_main_1;
padding:5px;
background:$col_white;
background:$col_none;
}
#chat_messages p.U {
/*background-color:white;*/
}
#chat_messages p.A, #chat_messages p.PA, #chat_messages p.E, #chat_messages p.PE, #chat_messages p.N {
background-color:$col_bright_blue;
background-color:$col_main_2;
font-style:italic;
}
#chat_messages p.C {
@@ -771,14 +771,14 @@
font-style:normal;
}
#chat_messages p span.time {
color:$col_orange;
color:$col_hover_1;
font-size:10px;
font-style:normal;
}
#chat_messages p a.user, #chat_messages p span.console {
font-size:12px;
font-weight:bold;
color:$col_blue;
color:$col_main_1;
}
#chat_messages p a.user {
margin-left:5px;
@@ -801,7 +801,7 @@
color:grey;
}
#chat_messages p span.highlight {
color:red;
color:$col_error;
}
#chat_messages p span.chan_link {
font-weight:bold;
@@ -814,7 +814,7 @@
border:1px dashed #666666;
padding:0 0 5px 0;
margin:5px 0;
background:$col_white;
background:$col_none;
}
#chat_messages .help p {
padding:0 5px;
@@ -849,16 +849,16 @@
#chat #chat_input {
margin:5px;
padding:0 5px;
background:$col_blue;
background:$col_main_1;
}
#chat #chat_input .fa {
color:$col_bright_blue;
color:$col_main_2;
margin-right:2px;
}
#chat #chat_input input#message {
color:$col_white;
color:$col_none;
margin:0;
padding:7px 0;
border:none;
@@ -883,19 +883,19 @@
#chat #sidebar .sidebar_box {
position:relative;
border:2px solid $col_blue;
border:2px solid $col_main_1;
font-weight:bold;
padding:0;
margin-bottom:10px;
}
#chat #sidebar .sidebar_box_title {
background-color:$col_bright_blue;
background-color:$col_main_2;
text-align:center;
}
#chat #sidebar .sidebar_box_content {
border-top:2px solid $col_blue;
border-top:2px solid $col_main_1;
font-size:12px;
font-weight:normal;
}
@@ -926,19 +926,19 @@
width:calc(100% - 24px - 5px); /* logo + right margin */
font-style:italic;
font-weight:normal;
color:$col_blue;
color:$col_main_1;
text-decoration:underline;
margin-left:5px;
}
#chat #sidebar a.connected_user:hover {
color:$col_orange;
color:$col_hover_1;
}
#chat .afk {
position:absolute;
font-size:20px;
line-height:20px;
text-shadow: 1px 1px 1px $col_bright_blue;
text-shadow: 1px 1px 1px $col_main_2;
margin-left:-20px;
margin-top:2px; /* (24 - 20)/2 */
}
@@ -955,23 +955,23 @@
#chat #chat_chan .tab_bar span.chan {
display: inline-block;
background-color:$col_bright_blue;
background-color:$col_main_2;
padding:2px 8px;
border:2px solid $col_blue;
border:2px solid $col_main_1;
margin-left:5px;
color:$col_blue;
color:$col_main_1;
}
#chat #chat_chan .tab_bar span#join_chan {
padding:2px;
border-bottom:$col_blue;
border-bottom:$col_main_1;
}
#chat #chat_chan .tab_bar span#join_chan:hover #join_chan_button {
color:$col_orange;
color:$col_hover_1;
}
#chat #chat_chan .tab_bar span.chan:hover, #chat #chat_chan .tab_bar span#join_chan.active {
background-color:$col_blue;
color:$col_white;
background-color:$col_main_1;
color:$col_none;
}
#chat #chat_chan .tab_bar span.chan span.chan_title {
text-transform:capitalize;
@@ -982,17 +982,17 @@
}
#chat #chat_chan .tab_bar a.quit_chan {
margin-left:5px;
color:$col_blue;
color:$col_main_1;
}
#chat #chat_chan .tab_bar span.chan.active:hover a.quit_chan {
color:$col_blue;
color:$col_main_1;
}
#chat #chat_chan .tab_bar span.chan:hover a.quit_chan {
color:$col_bright_blue;
color:$col_main_2;
}
#chat #chat_chan .tab_bar span.chan a.quit_chan:hover,
#chat #chat_chan .tab_bar .fa:hover {
color:$col_orange;
color:$col_hover_1;
}
#chat #chat_chan .tab_bar span#join_chan input, #chat #chat_chan .tab_bar span#join_chan input:hover {
@@ -1001,18 +1001,18 @@
padding:0;
margin:0;
width:70px;
background-color:$col_blue;
color:$col_white;
background-color:$col_main_1;
color:$col_none;
font-weight:bold;
}
#chat #chat_chan .tab_bar span.active, #chat #chat_chan .tab_bar span.active:hover {
border-bottom-color: $col_white;
background-color: $col_white;
border-bottom-color: $col_none;
background-color: $col_none;
color:$col_black;
}
#chat #chat_chan .tab_bar span.light_up {
background-color:$col_orange;
background-color:$col_hover_1;
}
#chat #sidebar #news, #chat #sidebar #news p {
@@ -1022,10 +1022,10 @@
padding:6px 5px;
}
#chat #news .new:nth-child(even) {
background:$col_brighter_blue;
background:$col_main_3;
}
#chat #news .new:nth-child(odd) {
background:$col_bright_blue;
background:$col_main_2;
}
#chat #news .new:last-child {
-moz-border-radius:0 0 10px 10px;
@@ -1044,8 +1044,8 @@
/* Options */
#options .options_box {
background:$col_bright_blue;
border:2px solid $col_blue;
background:$col_main_2;
border:2px solid $col_main_1;
width:490px;
float:left;
margin:0 10px 10px 0;
@@ -1057,10 +1057,10 @@
}
#options .options_box h2 {
color:$col_blue;
color:$col_main_1;
font-size:20px;
margin:0 0 10px 0;
border-bottom:2px solid $col_blue;
border-bottom:2px solid $col_main_1;
}
#options .options_box .option_line {
@@ -1069,7 +1069,7 @@
#options .options_box input[type=text], #options .options_box input[type=password], #options .options_box select {
font-size:14px;
background:$col_white;
background:$col_none;
border-width:1px;
font-size:14px;
padding:5px;
@@ -1082,8 +1082,8 @@
}
#options .options_box select {
border:1px solid $col_blue;
color:$col_blue;
border:1px solid $col_main_1;
color:$col_main_1;
}
#options .options_box .option_line p {
@@ -1096,15 +1096,15 @@
/* Procedure */
#procedure #procedure_steps .button {
background-color:$col_white;
background-color:$col_none;
}
#procedure #procedure_steps .button:hover {
background-color:$col_orange
background-color:$col_hover_1
}
#titles_read p.read_title {
border-bottom:1px solid $col_blue;
border-bottom:1px solid $col_main_1;
font-weight:bold;
}
@@ -1154,8 +1154,8 @@
#procedure table.step_box input[type=file] {
margin:0 10px;
max-width:250px;
border:1px solid $col_blue;
background:$col_white;
border:1px solid $col_main_1;
background:$col_none;
}
#procedure #bottom_menu {
@@ -1178,14 +1178,14 @@
}
#procedure .thumbnail_image {
background:$col_white;
border:1px solid $col_blue;
background:$col_none;
border:1px solid $col_main_1;
width:100px;
height:100px;
vertical-align:middle;
}
#procedure .thumbnail_image:hover {
border-color:$col_orange;
border-color:$col_hover_1;
}
#procedure .thumbnail_desc {
@@ -1244,7 +1244,7 @@
}
#table .step_box_title a {
color:$col_blue;
color:$col_main_1;
}
#table #validation {
@@ -1274,8 +1274,8 @@
}
#table input:disabled {
color:$col_bright_blue;
background-color:$col_blue;
color:$col_main_2;
background-color:$col_main_1;
}
#table .form_success {
@@ -1296,7 +1296,7 @@
#err_404 p {
margin-top:20px;
color:$col_blue;
color:$col_main_1;
}
/* Footer */
@@ -1307,7 +1307,7 @@
}
#footer p, #footer a {
color:$col_white;
color:$col_none;
margin:0;
font-size:9px;
}
@@ -1320,7 +1320,7 @@
#logout p {
font-size:18px;
color:$col_blue;
color:$col_main_1;
margin-top:25px;
}
@@ -1333,7 +1333,7 @@
#note_frame {
width:calc(100% - 4px);
height:calc(100% - 4px);
border: 2px solid $col_blue;
border: 2px solid $col_main_1;
margin: 0;
overflow: hidden;
}
@@ -1353,7 +1353,7 @@
top:0;
height:1px;
width:100%;
border-bottom:1px solid red;
border-bottom:1px solid $col_error;
z-index: 1000;
}
.line_v {
@@ -1361,6 +1361,6 @@
left:0;
height:100%;
width:1px;
border-left:1px solid red;
border-left:1px solid $col_error;
z-index: 1000;
}

2
style/logon.css
View File

File diff suppressed because one or more lines are too long

2
style/logon.css.map
View File

File diff suppressed because one or more lines are too long

22
style/logon.scss
View File

@@ -18,7 +18,7 @@
/* Logon */
#container {
background:$col_blue;
background:$col_main_1;
padding:10px 10px 1px;
}
@@ -32,9 +32,9 @@
left:0;
padding:10px 10px 10px 35px;
margin:0;
border-bottom:3px solid $col_white;
border-bottom:3px solid $col_none;
font-weight:bold;
color:$col_white;
color:$col_none;
font-size:35px;
line-height:35px;
text-decoration: none;
@@ -49,7 +49,7 @@
margin-top:-64px; /* -(10*2+20*4+20*2+20+2*2+1*2)/2 */
}
.box {
background:$col_white;
background:$col_none;
overflow:hidden;
position:relative;
@@ -57,14 +57,14 @@
position:absolute;
height:100%;
width:68px;
background:$col_bright_blue;
background:$col_main_2;
.fa {
position:absolute;
top:50%;
left:50%;
text-align:center;
color:$col_blue;
color:$col_main_1;
line-height:50px;
font-size:50px;
width:50px;
@@ -81,7 +81,7 @@
padding:0;
text-align:left;
font-size:18px;
color:$col_blue;
color:$col_main_1;
}
td.desc {
@@ -102,8 +102,8 @@
color:red;
}
input {
border:1px solid $col_blue;
color:$col_blue;
border:1px solid $col_main_1;
color:$col_main_1;
font-size:18px;
line-height:20px;
padding:2px 5px;
@@ -125,10 +125,10 @@
.logon_msg {
margin-top:10px;
padding:5px;
color:$col_white;
color:$col_none;
text-align:center;
font-size: 0.75em;
border:1px solid $col_white;
border:1px solid $col_none;
span {
display:block;