Introduced variables for background

25 files changed, 97 insertions, 62 deletions

diff --git a/plugins/CoreAdminHome/stylesheets/generalSettings.less b/plugins/CoreAdminHome/stylesheets/generalSettings.less
index f4af53c901..4e7dbec7cb 100644
--- a/plugins/CoreAdminHome/stylesheets/generalSettings.less
+++ b/plugins/CoreAdminHome/stylesheets/generalSettings.less
@@ -20,13 +20,13 @@
 
 table.admin {
     font-size: 0.9em;
-    background-color: #fff;
+    background-color: @theme-color-background-base;
     border-collapse: collapse;
 }
 
 table.admin thead th {
-    border-right: 1px solid #fff;
-    color: #fff;
+    border-right: 1px solid @theme-color-background-base;
+    color: @theme-color-background-base;
     text-align: center;
     padding: 5px;
     text-transform: uppercase;
diff --git a/plugins/CoreHome/angularjs/dialogtoggler/ngdialog.less b/plugins/CoreHome/angularjs/dialogtoggler/ngdialog.less
index fb0f666f80..264dbda703 100644
--- a/plugins/CoreHome/angularjs/dialogtoggler/ngdialog.less
+++ b/plugins/CoreHome/angularjs/dialogtoggler/ngdialog.less
@@ -15,7 +15,7 @@
   border-radius: 4px;
   margin: 0 auto;
   max-width: 100%;
-  background-color: #fff;
+  background-color: @theme-color-background-base;
   padding: 1em 18px;
   position: relative;
   top: 100px;
@@ -67,4 +67,4 @@
   &:hover:before {
     background-image: url(libs/jquery/themes/base/images/ui-icons_454545_256x240.png);
   }
-}
\ No newline at end of file
+}
diff --git a/plugins/CoreHome/angularjs/siteselector/siteselector.directive.less b/plugins/CoreHome/angularjs/siteselector/siteselector.directive.less
index d49c557eb2..5787d058a7 100644
--- a/plugins/CoreHome/angularjs/siteselector/siteselector.directive.less
+++ b/plugins/CoreHome/angularjs/siteselector/siteselector.directive.less
@@ -35,7 +35,7 @@
   float: left;
   position: relative;
   z-index: 19;
-  background: #fff url(plugins/Morpheus/images/sites_selection.png) repeat-x 0 0;
+  background: @theme-color-background-base url(plugins/Morpheus/images/sites_selection.png) repeat-x 0 0;
   border: 1px solid #d4d4d4;
   color: #255792;
   border-radius: 4px;
@@ -176,4 +176,4 @@
 .siteSelect a {
   white-space: normal;
   text-align: left;
-}
\ No newline at end of file
+}
diff --git a/plugins/CoreHome/stylesheets/dataTable/_dataTable.less b/plugins/CoreHome/stylesheets/dataTable/_dataTable.less
index dfc76620d9..b4b6950854 100644
--- a/plugins/CoreHome/stylesheets/dataTable/_dataTable.less
+++ b/plugins/CoreHome/stylesheets/dataTable/_dataTable.less
@@ -79,7 +79,7 @@ table.dataTable th.columnSorted {
 
 table.dataTable td {
   padding: 5px 5px 5px 12px;
-  background: #fff;
+  background: @theme-color-background-base;
   border-left: 1px solid #e7e7e7;
 }
 
@@ -102,11 +102,11 @@ table.dataTable tr.subDataTable:hover > td .dataTableRowActions {
 
 table.dataTable tr:hover > td.cellSubDataTable
 table.dataTable tr:hover > td.cellSubDataTable .dataTableRowActions {
-  background-color: #fff;
+  background-color: @theme-color-background-base;
 }
 
 td.clean {
-  background-color: #fff;
+  background-color: @theme-color-background-base;
 }
 
 table.dataTable td.column {
diff --git a/plugins/CoreHome/stylesheets/dataTable/_limitSelection.less b/plugins/CoreHome/stylesheets/dataTable/_limitSelection.less
index 327d74b243..1e77d030d7 100644
--- a/plugins/CoreHome/stylesheets/dataTable/_limitSelection.less
+++ b/plugins/CoreHome/stylesheets/dataTable/_limitSelection.less
@@ -35,7 +35,7 @@
 .limitSelection > ul {
   margin-top: 1px;
   overflow: visible;
-  background-color: #fff;
+  background-color: @theme-color-background-base;
 }
 
 .limitSelection > ul > li {
@@ -46,7 +46,7 @@
   font-weight: bold;
   height: 20px;
   margin-top: -40px;
-  background-color: #fff;
+  background-color: @theme-color-background-base;
   border-left: 1px solid #DFDFDF;
   border-right: 1px solid #DFDFDF;
   vertical-align: middle;
@@ -65,4 +65,4 @@
 .limitSelection span {
   padding-top: 3px;
   display: inline-block;
-}
\ No newline at end of file
+}
diff --git a/plugins/CoreHome/stylesheets/dataTable/_tableConfiguration.less b/plugins/CoreHome/stylesheets/dataTable/_tableConfiguration.less
index 5f675894d3..a6200d6e8e 100644
--- a/plugins/CoreHome/stylesheets/dataTable/_tableConfiguration.less
+++ b/plugins/CoreHome/stylesheets/dataTable/_tableConfiguration.less
@@ -43,7 +43,7 @@ a.tableConfigurationIcon.highlighted {
   font-size: 1.1em;
   height: 40px;
   margin-top: -80px;
-  background-color: #fff;
+  background-color: @theme-color-background-base;
   border: 1px solid #DFDFDF;
   border-width: 0 1px;
   vertical-align: middle;
@@ -79,4 +79,4 @@ a.tableConfigurationIcon.highlighted {
 
 .tableConfiguration div.configItem span.action {
   color: @dataTable-link-color;
-}
\ No newline at end of file
+}
diff --git a/plugins/CoreHome/stylesheets/menu.less b/plugins/CoreHome/stylesheets/menu.less
index 3a6717a494..2fbd97d056 100644
--- a/plugins/CoreHome/stylesheets/menu.less
+++ b/plugins/CoreHome/stylesheets/menu.less
@@ -45,7 +45,7 @@
 }
 
 .Menu--dashboard > .Menu-tabList ul {
-    background: #fff; /*IE6 needs this*/
+    background: @theme-color-background-base; /*IE6 needs this*/
     float: left;
     position: relative;
 }
@@ -76,7 +76,7 @@
 /* LEVEL1 HOVER */
 .Menu--dashboard > .Menu-tabList > li:hover,
 .Menu--dashboard > .Menu-tabList > li.sfHover {
-    background: #fff;
+    background: @theme-color-background-base;
 }
 
 .Menu--dashboard > .Menu-tabList > li:hover > a,
diff --git a/plugins/CoreHome/stylesheets/promo.less b/plugins/CoreHome/stylesheets/promo.less
index bb3a6722c1..6b3641d185 100644
--- a/plugins/CoreHome/stylesheets/promo.less
+++ b/plugins/CoreHome/stylesheets/promo.less
@@ -1,5 +1,5 @@
 #piwik-promo-thumbnail {
-    background: #fff url(plugins/CoreHome/images/promo_splash.png) no-repeat 0 0;
+    background: @theme-color-background-base url(plugins/CoreHome/images/promo_splash.png) no-repeat 0 0;
     background-position: center;
     width: 321px;
     margin: 0 auto 0 auto;
@@ -69,4 +69,4 @@
 
 #piwik-promo-videos-link:hover {
     text-decoration: none;
-}
\ No newline at end of file
+}
diff --git a/plugins/CorePluginsAdmin/stylesheets/plugins_admin.less b/plugins/CorePluginsAdmin/stylesheets/plugins_admin.less
index edcc91200b..dc3a4965d7 100644
--- a/plugins/CorePluginsAdmin/stylesheets/plugins_admin.less
+++ b/plugins/CorePluginsAdmin/stylesheets/plugins_admin.less
@@ -1,9 +1,9 @@
 table.dataTable tr.active-plugin > td {
-    background-color:#fff !important;
+    background-color:@theme-color-background-base !important;
 }
 
 table.dataTable tr.active-plugin:hover > td {
-    background-color:#fff !important;
+    background-color:@theme-color-background-base !important;
 }
 
 table.dataTable tr.inactive-plugin > td {
@@ -51,4 +51,4 @@ table.entityTable tr td a.uninstall {
     font-size:80%;
     font-style:italic;
     color:#777;
-}
\ No newline at end of file
+}
diff --git a/plugins/Darkness/stylesheets/_colors.less b/plugins/Darkness/stylesheets/_colors.less
new file mode 100644
index 0000000000..a5d76d1b57
--- /dev/null
+++ b/plugins/Darkness/stylesheets/_colors.less
@@ -0,0 +1,32 @@
+@theme-color-brand:                    #181818;
+@theme-color-brand-contrast:           #181818;
+
+@theme-color-widget-title-text:        #f00;
+@theme-color-widget-title-background:  #181818;
+
+@theme-color-menu-contrast-text:       #f00;
+@theme-color-menu-contrast-textActive: #f00;
+@theme-color-menu-contrast-background: #181818;
+
+@theme-color-text:                     #f00;
+@theme-color-text-light:               #f00;
+@theme-color-text-lighter:             #f00;
+@theme-color-link:                     #f00;
+
+@theme-color-background-base:          #000;
+@theme-color-background-tinyContrast:  #000;
+@theme-color-background-lowContrast:   #181818;
+@theme-color-background-contrast:      #000;
+@theme-color-background-highContrast:  #000;
+@theme-color-base-series:              #000;
+
+@graph-colors-data-series1: #d4291f;
+@graph-colors-data-series2: #1f78b4;
+@graph-colors-data-series3: #ff7f00;
+@graph-colors-data-series4: #33a02c;
+@graph-colors-data-series5: #6a3d9a;
+@graph-colors-data-series6: #b15928;
+@graph-colors-data-series7: #fdbf6f;
+@graph-colors-data-series8: #cab2d6;
+
+@color-silver-l95: #181818;
diff --git a/plugins/Darkness/stylesheets/_variables.less b/plugins/Darkness/stylesheets/_variables.less
new file mode 100644
index 0000000000..bae0d96a12
--- /dev/null
+++ b/plugins/Darkness/stylesheets/_variables.less
@@ -0,0 +1 @@
+@theme-fontFamily-base: Verdana, sans-serif;
diff --git a/plugins/Darkness/stylesheets/theme.less b/plugins/Darkness/stylesheets/theme.less
new file mode 100644
index 0000000000..a580c1c127
--- /dev/null
+++ b/plugins/Darkness/stylesheets/theme.less
@@ -0,0 +1,2 @@
+@import "_colors.less";
+@import "_variables.less";
diff --git a/plugins/Dashboard/stylesheets/dashboard.less b/plugins/Dashboard/stylesheets/dashboard.less
index 24579f985e..87e0375e41 100644
--- a/plugins/Dashboard/stylesheets/dashboard.less
+++ b/plugins/Dashboard/stylesheets/dashboard.less
@@ -72,7 +72,7 @@
 }
 
 .widget {
-  background: #fff;
+  background: @theme-color-background-base;
   border: 1px solid #bbb6ad;
   margin: 10px 7px;
   border-radius: 4px;
@@ -147,7 +147,7 @@
 .ui-confirm {
   display: none;
   width: 630px;
-  background: #fff;
+  background: @theme-color-background-base;
   color: @theme-color-text-light;
   cursor: default;
   font-size: 12px !important;
diff --git a/plugins/Live/stylesheets/live.less b/plugins/Live/stylesheets/live.less
index cb76a1078a..9e0f628904 100644
--- a/plugins/Live/stylesheets/live.less
+++ b/plugins/Live/stylesheets/live.less
@@ -18,7 +18,7 @@
 }
 
 #visitsLive .country {
-    background: #FFF url(plugins/CoreHome/images/bullet1.gif) no-repeat scroll 0 0;
+    background: @theme-color-background-base url(plugins/CoreHome/images/bullet1.gif) no-repeat scroll 0 0;
 }
 
 #visitsLive .referrer {
@@ -35,7 +35,7 @@
 }
 
 #visitsLive .settings {
-    background: #FFF none repeat scroll 0 0;
+    background: @theme-color-background-base none repeat scroll 0 0;
 }
 
 #visitsLive .settings a {
diff --git a/plugins/Morpheus/stylesheets/general/_default.less b/plugins/Morpheus/stylesheets/general/_default.less
index 002551ecd1..5bcf504e2d 100644
--- a/plugins/Morpheus/stylesheets/general/_default.less
+++ b/plugins/Morpheus/stylesheets/general/_default.less
@@ -32,7 +32,7 @@ blockquote, q {
 }
 
 code {
-  background-color:#F6F9F9;
+  background-color:@theme-color-background-base;
   border: 1px dashed;
   border-left: 5px solid  #4B4BD5;
   direction:ltr;
@@ -75,7 +75,7 @@ textarea {
 input, select, textarea {
   border-radius: 4px;
   border: 1px solid #d4d4d4;
-  background: #fff url(plugins/Morpheus/images/inp_bg.png) repeat-x 0 0;
+  background: @theme-color-background-base url(plugins/Morpheus/images/inp_bg.png) repeat-x 0 0;
   padding: 3px 10px;
   color: #255792;
   margin-bottom: 3px;
@@ -112,4 +112,4 @@ a {
 /* Make sure the scroll bar is always displayed so the content does not shift when reloading menu with/without scrollbar */
 html {
   overflow-y: scroll;
-}
\ No newline at end of file
+}
diff --git a/plugins/Morpheus/stylesheets/general/_form.less b/plugins/Morpheus/stylesheets/general/_form.less
index b06018c0eb..81238a747f 100644
--- a/plugins/Morpheus/stylesheets/general/_form.less
+++ b/plugins/Morpheus/stylesheets/general/_form.less
@@ -102,7 +102,7 @@ table.entityTable tr td a {
 }
 
 .entityList ul li {
-  background: #fff url(plugins/Morpheus/images/li_dbl_gray.gif) no-repeat 6px 10px;
+  background: @theme-color-background-base url(plugins/Morpheus/images/li_dbl_gray.gif) no-repeat 6px 10px;
   padding: 0 0 0 21px;
   line-height: 22px;
 }
@@ -119,4 +119,4 @@ table.entityTable tr td a {
 
 .entityList ul.listCircle li a {
   color: #000;
-}
\ No newline at end of file
+}
diff --git a/plugins/Morpheus/stylesheets/general/_forms.less b/plugins/Morpheus/stylesheets/general/_forms.less
index 475c72d9f7..7baf2a6c30 100644
--- a/plugins/Morpheus/stylesheets/general/_forms.less
+++ b/plugins/Morpheus/stylesheets/general/_forms.less
@@ -5,7 +5,7 @@ input:not([type="checkbox"]), select, textarea {
     padding: 8px 10px;
     min-height: 30px;
     .box-sizing(border-box);
-    background: #fff;
+    background: @theme-color-background-base;
 }
 button,
 .add-trusted-host,
@@ -109,7 +109,7 @@ button[type="button"],
     }
     > div {
         .border-radius(2px);
-        background-color: #fff;
+        background-color: @theme-color-background-base;
         .font-default(10px, 12px);
         background: none;
         padding: 2px 14px 2px 1px;
diff --git a/plugins/Morpheus/stylesheets/general/_jqueryUI.less b/plugins/Morpheus/stylesheets/general/_jqueryUI.less
index d0036d6b60..e6aca7ff74 100644
--- a/plugins/Morpheus/stylesheets/general/_jqueryUI.less
+++ b/plugins/Morpheus/stylesheets/general/_jqueryUI.less
@@ -152,7 +152,7 @@ div.ui-state-highlight {
 .ui-state-default {
   border: 1px solid #f2f6f9 !important;
   border-right: 0 !important;
-  background: #fff !important;
+  background: @theme-color-background-base !important;
   color: #000 !important;
   text-align: center !important;
 }
@@ -259,4 +259,4 @@ body .ui-tooltip.small {
 
 .ui-dialog ~ .ui-dialog {
   border: 1px solid #aaa;
-}
\ No newline at end of file
+}
diff --git a/plugins/Morpheus/stylesheets/theme.less b/plugins/Morpheus/stylesheets/theme.less
index 4b0b3d0020..fa2259e413 100644
--- a/plugins/Morpheus/stylesheets/theme.less
+++ b/plugins/Morpheus/stylesheets/theme.less
@@ -229,14 +229,14 @@ table.entityTable tr td a:hover {
     position: relative;
   }
   .dropdown-body {
-    background:#fff;
+    background:@theme-color-background-base;
     padding:0 10px;
     .border-radius(0px);
     border: 1px solid @color-silver-l80;
     border-top-width: 0px;
   }
   &:hover .dropdown-body {
-    background:#fff;
+    background:@theme-color-background-base;
     border-color: @color-silver-l80;
   }
   .segmentationContainer {
@@ -272,7 +272,7 @@ table.entityTable tr td a:hover {
           color: @theme-color-text-light;
           &:hover {
               border-color: @color-silver-l80 !important;
-              background: #fff !important;
+              background:@theme-color-background-base !important;
               .border-radius(0px);
           }
           }
@@ -298,7 +298,7 @@ table.entityTable tr td a:hover {
   #Dashboard {
     ul {
 
-      background: #fff;
+      background: @theme-color-background-base;
       border: 1px solid @color-silver-l80;
       padding: 8px 10px 8px 10px;
       color: @theme-color-text-light;
@@ -347,7 +347,7 @@ table.dataTable {
     thead {
         tr {
             th {
-                background: #fff;
+                background: @theme-color-background-base;
                 text-transform: uppercase;
                 color: @theme-color-text;
                 .font-default(10px, 12px);
@@ -437,13 +437,13 @@ table.dataTable {
         &.subDataTable:hover > td.labeleven,
         &.subDataTable:hover > td.columneven,
         td.cellSubDataTable {
-          background-color: #fff !important;
+          background-color: @theme-color-background-base !important;
         }
     }
 
     &.entityTable tr {
         td  {
-            background-color: #fff !important;
+            background-color: @theme-color-background-base !important;
         }
         &.inactive-plugin td,
         &:hover td {
@@ -685,10 +685,10 @@ div.sparkline {
             }
 
             ol {
-                background: #fff !important;
+                background: @theme-color-background-base !important;
                 border-top: 0 !important;
                 li {
-                    background: #fff !important;
+                    background: @theme-color-background-base !important;
                     .font-default(11px, 19px);
                     font-weight: normal;
                     color: @theme-color-text-lighter;
diff --git a/plugins/Morpheus/stylesheets/ui/_components.less b/plugins/Morpheus/stylesheets/ui/_components.less
index 76db939f73..7e93cf057b 100644
--- a/plugins/Morpheus/stylesheets/ui/_components.less
+++ b/plugins/Morpheus/stylesheets/ui/_components.less
@@ -1,5 +1,5 @@
 //colors calendar
-@calendarHeaderBackground: #fff;
+@calendarHeaderBackground: @theme-color-background-base;
 @calendarHeaderColor: #999;
 @calendarCurrentStateHover: #f5f5f5;
 @calendarBorder: #ccc;
@@ -222,7 +222,7 @@
     border: 1px solid @color-silver-l80;
     padding: 8px 10px 8px 10px;
     height: auto;
-    background: #fff;
+    background: @theme-color-background-base;
     .border-radius(0px);
     .header_short {
         .font-default(10px, 12px);
@@ -287,7 +287,7 @@
         margin: 27px 0 0 319px;
         width: 258px;
         height: 390px;
-        background: #fff;
+        background: @theme-color-background-base;
         h2 {
             color: #1e93d1;
             border-bottom: 1px solid @color-gray;
@@ -348,7 +348,7 @@ table.dataTable tr td .dataTableRowActions {
 
 table.dataTable tr td.labeleven .dataTableRowActions {
   a.rightmost, a {
-    background-color: #fff !important;
+    background-color: @theme-color-background-base !important;
   }
 }
 
diff --git a/plugins/MultiSites/angularjs/dashboard/dashboard.directive.less b/plugins/MultiSites/angularjs/dashboard/dashboard.directive.less
index 24cd976b4c..6502f4244c 100644
--- a/plugins/MultiSites/angularjs/dashboard/dashboard.directive.less
+++ b/plugins/MultiSites/angularjs/dashboard/dashboard.directive.less
@@ -99,7 +99,7 @@
   }
 
   tr:hover td {
-    background: #FFF !important;
+    background: @theme-color-background-base !important;
   }
 
   tr.group {
@@ -232,4 +232,4 @@
 
 #mt thead *:last-child {
   border-top-right-radius: 7px;
-}
\ No newline at end of file
+}
diff --git a/plugins/SegmentEditor/stylesheets/segmentation.less b/plugins/SegmentEditor/stylesheets/segmentation.less
index 3bd2b3b0cd..fdf4a1d579 100644
--- a/plugins/SegmentEditor/stylesheets/segmentation.less
+++ b/plugins/SegmentEditor/stylesheets/segmentation.less
@@ -204,7 +204,7 @@ div.scrollable {
 .segment-element .segment-content .segment-rows {
   padding: 4px;
   margin: 0 3px 0 0;
-  background: #fff;
+  background: @theme-color-background-base;
   border: 1px solid #a9a399;
   border-radius: 3px 3px 3px 3px;
   position: relative;
@@ -214,7 +214,7 @@ div.scrollable {
 .segment-element .segment-content .segment-add-row,
 .segment-element .segment-content .segment-add-or {
   font: bold 14px Arial;
-  background: #fff;
+  background: @theme-color-background-base;
   color: #b9b9b9;
   text-align: center;
   position: relative;
@@ -303,7 +303,7 @@ div.scrollable {
 .segment-element .segment-content .segment-or:after {
   content: '';
   position: absolute;
-  background: #fff;
+  background: @theme-color-background-base;
   border: 1px solid #efefeb;
   width: 10px;
   top: -1px;
@@ -327,7 +327,7 @@ div.scrollable {
   margin: -1px 0 -1px 6%;
   z-index: 1;
   position: relative;
-  background: #fff;
+  background: @theme-color-background-base;
   padding: 5px 35px;
   color: #4f4f4f;
   font: bold 14px Arial;
diff --git a/plugins/UserCountryMap/stylesheets/realtime-map.less b/plugins/UserCountryMap/stylesheets/realtime-map.less
index 9f7ee78b0f..c6c98ffda5 100644
--- a/plugins/UserCountryMap/stylesheets/realtime-map.less
+++ b/plugins/UserCountryMap/stylesheets/realtime-map.less
@@ -150,4 +150,4 @@
 
 .realtime-map[data-name=symbol-animate-fill] {
     color: #fdb;
-}
\ No newline at end of file
+}
diff --git a/plugins/UserCountryMap/stylesheets/visitor-map.less b/plugins/UserCountryMap/stylesheets/visitor-map.less
index 37c0fd9ae6..c279fd3733 100644
--- a/plugins/UserCountryMap/stylesheets/visitor-map.less
+++ b/plugins/UserCountryMap/stylesheets/visitor-map.less
@@ -151,7 +151,7 @@
 }
 
 .visitor-map[data-name=unknown-region-fill-color] {
-    color: #fff;
+    color: @theme-color-background-base;
 }
 
 .visitor-map[data-name=unknown-region-stroke-color] {
@@ -171,15 +171,15 @@
 }
 
 .visitor-map[data-name=invisible-region-background] {
-    color: #fff;
+    color: @theme-color-background-base;
 }
 
 .visitor-map[data-name=city-label-color] {
-    color: #fff;
+    color: @theme-color-background-base;
 }
 
 .visitor-map[data-name=city-stroke-color] {
-    color: #fff;
+    color: @theme-color-background-base;
 }
 
 .visitor-map[data-name=city-highlight-stroke-color] {
@@ -195,7 +195,7 @@
 }
 
 .visitor-map[data-name=city-label-fill-color] {
-    color: #fff;
+    color: @theme-color-background-base;
 }
 
 .visitor-map[data-name=city-selected-color] {
@@ -224,4 +224,4 @@
 
 .visitor-map[data-name=special-metrics-color-scale-4] {
     color: #E87500;
-}
\ No newline at end of file
+}
diff --git a/plugins/ZenMode/angularjs/zen-mode/zen-mode.less b/plugins/ZenMode/angularjs/zen-mode/zen-mode.less
index fd13a06f48..7ed7a2ce7f 100644
--- a/plugins/ZenMode/angularjs/zen-mode/zen-mode.less
+++ b/plugins/ZenMode/angularjs/zen-mode/zen-mode.less
@@ -72,7 +72,7 @@
   .Menu--dashboard > .Menu-tabList > li:hover ul {
     display: none;
     z-index: 150;
-    background-color: #FFF;
+    background-color: @theme-color-background-base;
     width: auto;
     border: 1px solid #D9D9D9;
     padding-top: 0px;