Added tutorial and session mechanism
diff --git a/public/scss/util.scss b/public/scss/util.scss
index 7c3f056..d81b7f9 100644
--- a/public/scss/util.scss
+++ b/public/scss/util.scss
@@ -1,9 +1,23 @@
/**
+ * Official IDS colors
+ */
+$ids-orange-1: rgb(246, 168, 0);
+$ids-orange-2: rgb(242, 148, 0);
+$ids-grey-1: rgb(135, 136, 138);
+$ids-grey-2: rgb(217, 218, 219);
+$ids-blue-1: rgb( 0, 158, 224); // Pragmatik
+$ids-blue-2: rgb(188, 228, 247); // Pragmatik
+$ids-green-1: rgb( 99, 111, 7); // Grammatik
+$ids-green-2: rgb(227, 232, 163); // Grammatik
+$ids-pink-1: rgb(193, 0, 43); // Lexik
+$ids-pink-2: rgb(250, 243, 222); // Lexik
+
+/**
* Orange Colors
*/
$light-orange: #f4eebb; // #ffe56a;
$middle-orange: #ffd080;
-$dark-orange: #ffa500;
+$dark-orange: $ids-orange-1; // #ffa500;
$darker-orange: #ff8000;
$darkest-orange: darken($dark-orange, 20%);
// $light-orange-2: #f4eebb;, #ffd080;
@@ -12,9 +26,9 @@
/**
* Green Colors
*/
-$dark-green: #496000;
-$middle-green: #688704;
-$light-green: #7ba400;
+$dark-green: $ids-green-1; // #496000;
+$middle-green: lighten($ids-green-1, 5%); // $ids-green-1; // #688704;
+$light-green: lighten($ids-green-1, 10%); // #7ba400;
/**
* Blue Colors
@@ -27,12 +41,16 @@
/*
* Grey
*/
-$light-grey: #ddd;
+$light-grey: $ids-grey-2; // #ddd;
$dark-grey: #555;
$middle-grey: #999;
// $nearly-white: #f5f5f5;
$nearly-white: #fff;
+$middle-red: #c1002b;
+$light-red: lighten($middle-red, 40%);
+$dark-red: darken($middle-red, 40%);
+
$dark-shadow: 1px 1px 1px rgba(0,0,0,0.3);
$light-shadow: 1px 1px rgba(255,255,255,0.5);
@@ -47,7 +65,7 @@
$kwic-match-color: $dark-grey;
$kwic-match-shadow: $light-shadow;
-$kwic-highlight-1: #c1002b;
+$kwic-highlight-1: $middle-red;
$kwic-highlight-2: $dark-blue; // #009ee0;
$kwic-highlight-3: $dark-orange; // #f29400;
$kwic-highlight-4: $light-green;
@@ -57,7 +75,7 @@
$choose-border: 2px solid $choose-border-color;
$choose-color: $dark-grey;
$choose-blind-color: $middle-grey;
-$choose-box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
+$choose-box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
$standard-border-radius: 6px;
/**
@@ -71,6 +89,7 @@
*/
$standard-margin: 30px;
$right-match-distance: 20px;
+$logo-left-distance: 230px;
@mixin blind {
position: absolute;
@@ -98,6 +117,13 @@
border-color: $dark-green;
}
+@mixin choose-remove {
+ color: $nearly-white;
+ text-shadow: none;
+ background-color: $middle-red;
+ border-color: $dark-red;
+}
+
@mixin color-transition {
transition: color 0.3s ease 0s;
}