changed color variables for result-page related stylesheets

resources/less/metager/pages/resultpage/quicktips.less

@@ -17,7 +17,7 @@
         padding: 10px 10px 10px 10px;
         width: 100%;
         border: 1px solid #ccc;
-        background-color: white;
+        background-color: @quicktip-background-color;
         details:not([open=""]) {
             .quicktip-summary p {
                 .overflow-ellipsis;

resources/less/metager/pages/resultpage/result-page.less

@@ -18,7 +18,7 @@
 // The point upon which the sidebar opener switches place
 @sidebar-opener-breakpoint: (@results-width-max + @padding-small-default * 2 + 60px);
 // Quicktip background color
-@quicktip-background-color: @color-white;
+@quicktip-background-color: @resultpage-background-color;
 // Color of the Spruch author
 @spruch-author-color: @color-strong-grey;
 /* Styles */
@@ -266,7 +266,7 @@ a {
         border-radius: 10px;
         padding: 5px;
         margin-left: 10px;
-        background-color: white;
+        background-color: @resultpage-background-color;
         box-shadow: 0px 1px 1.5px 0px rgba(0, 0, 0, 0.12), 1px 0px 1px 0px rgba(0, 0, 0, 0.24);
         &:first-child {
             margin-left: 0px;
@@ -354,7 +354,7 @@ a {
     #research-bar-container {
         grid-area: searchbar;
         padding-top: @padding-small-default;
-        background-color: white;
+        background-color: @resultpage-background-color;
         box-shadow: 0px 1px 3px 2px white, 1px 0px 1px 2px white;
         position: sticky;
     }
@@ -428,7 +428,7 @@ a {
     background-color: @resultpage-background-color;
     max-width: @results-width-max;
     #research-bar {
-        background-color: white;
+        background-color: @resultpage-background-color;
         border: 1px solid #ccc;
         border-bottom: 1px solid @metager-orange;
         box-shadow: 0px 1px 1.5px 0px rgba(0, 0, 0, 0.12), 1px 0px 1px 0px rgba(0, 0, 0, 0.24);
@@ -468,7 +468,7 @@ a {
         display: flex;
         width: 100%;
         max-width: @results-width-max;
-        background-color: white;
+        background-color: @resultpage-background-color;
         overflow-x: auto;
         padding: 8px;
         border-bottom: 1px solid #ccc;
@@ -479,11 +479,11 @@ a {
         &>div {
             padding-right: 16px;
             &>a {
-                color: black;
+                color: @text-color;
             }
             &.active>a {
-                border-bottom: 1px solid black;
-                color: black;
+                border-bottom: 1px solid @text-color;
+                color: @text-color;
             }
             &:last-child {
                 padding-right: 20px
@@ -504,7 +504,7 @@ a {
 
 #options {
     grid-area: options;
-    background-color: white;
+    background-color: @resultpage-background-color;
     max-width: @results-width-max;
     padding: 0 8px;
     @media(max-width: @screen-mobile){
@@ -603,7 +603,7 @@ a {
     #settings {
         text-align: center;
         a {
-            color: #333;
+            color: @text-color;
             &:hover {
                 color: red;
                 span.badge {

resources/less/metager/pages/resultpage/result.less

@@ -2,7 +2,7 @@
 @result-font-medium: 16px;
 @result-font-url: 14px;
 @result-font-small: 12px;
-@result-description-color: @color-black;
+@result-description-color: @text-color;
 @result-image-border-color: @color-almost-white;
 .result {
 
@@ -44,7 +44,7 @@
                     &:hover,
                     &:focus,
                     &:visited {
-                        color: black;
+                        color: @text-color;
                         text-decoration: none;
                     }
                 }
@@ -183,7 +183,7 @@
             &:hover,
             &:focus,
             &:visited {
-                color: black;
+                color: @text-color;
                 font-size: .7em;
                 text-decoration: none;
             }
@@ -199,7 +199,7 @@
             &:hover,
             &:focus,
             &:visited {
-                color: black;
+                color: @text-color;
                 font-size: .7em;
                 text-decoration: none;
             }

resources/views/layouts/resultPage.blade.php

@@ -25,7 +25,8 @@
 		<link href="/fonts/liberationsans/stylesheet.css" rel="stylesheet">
 		<link type="text/css" rel="stylesheet" href="{{ mix('css/fontawesome.css') }}" />
 		<link type="text/css" rel="stylesheet" href="{{ mix('css/fontawesome-solid.css') }}" />
-		<link type="text/css" rel="stylesheet" href="{{ mix('css/themes/metager.css') }}" />
+		<link type="text/css" rel="stylesheet alternate" href="{{ mix('css/themes/metager-dark.css') }}" title="MetaGer Dark"/>
+		<link type="text/css" rel="stylesheet" href="{{ mix('css/themes/metager.css') }}" title="MetaGer"/>
 		<meta name="referrer" content="origin">
 		<meta name="age-meta-label" content="age=18"/>
 		@include('parts.utility')