From aa4de2260a6c3707a7b0c12aefec8256a8c9882f Mon Sep 17 00:00:00 2001
From: andreas kainz <kainz.a@gmail.com>
Date: Sun, 6 Mar 2022 23:20:10 +0100
Subject: [PATCH] Mobile Sidebar Commands use var colors for popup sidebar

Signed-off-by: andreas kainz <kainz.a@gmail.com>
Change-Id: Ia2322cbac5650b9ed36b6966b0d0037340e44032
---
 browser/css/device-mobile.css | 14 +++++++-------
 browser/css/mobilewizard.css  | 14 +++++++-------
 2 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/browser/css/device-mobile.css b/browser/css/device-mobile.css
index c0c94b9d9..4d55bae52 100644
--- a/browser/css/device-mobile.css
+++ b/browser/css/device-mobile.css
@@ -481,22 +481,22 @@ nav:not(.spreadsheet-color-indicator) ~ #toolbar-wrapper #toolbar-up.w2ui-toolba
 	margin: -1px 0px auto 3px !important;
 }
 #toolbar-up .checked{
-	border-color: #fff !important;
+	border-color: transparent !important;
 	background: none !important;
 	box-shadow: none;
 }
 #toolbar-up .checked .w2ui-tb-image, #toolbar-up .w2ui-tb-image:hover, #toolbar-up .w2ui-tb-image:focus, #toolbar-up .w2ui-tb-image:active, #toolbar-hamburger.menuwizard-closed:active{
-	-webkit-filter: drop-shadow(0px 0px 4px #0b87e7);
-	filter: drop-shadow(0px 0px 4px #0b87e7);
+	-webkit-filter: drop-shadow(0px 0px 4px var(--color-primary-darker));
+	filter: drop-shadow(0px 0px 4px var(--color-primary-darker));
 }
 #toolbar-up .over{
-	border-color: #fff !important;
+	border-color: transparent !important;
 	box-shadow: none !important;
 }
 #toolbar-up .over:hover .w2ui-tb-image, #toolbar-up .over:active .w2ui-tb-image{
-	-webkit-filter: drop-shadow(0px 0px 4px #0b87e7);
-	filter: drop-shadow(0px 0px 4px #0b87e7);
-	border-color: #fff transparent;
+	-webkit-filter: drop-shadow(0px 0px 4px var(--color-primary-darker));
+	filter: drop-shadow(0px 0px 4px var(--color-primary-darker));
+	border-color: transparent;
 }
 #toolbar-down table.w2ui-button .w2ui-tb-image {
 	margin: 5px 9px !important;
diff --git a/browser/css/mobilewizard.css b/browser/css/mobilewizard.css
index 11dc62f98..bb9409d9a 100644
--- a/browser/css/mobilewizard.css
+++ b/browser/css/mobilewizard.css
@@ -294,7 +294,7 @@ p.mobile-wizard.ui-combobox-text.selected {
 }
 
 .ui-content.mobile-wizard:not(.unotoolbutton) {
-	background-color: white !important;
+	background-color: var(--color-main-background) !important;
 	border: none !important;
 	padding: 0px 0px 16px;
 }
@@ -344,11 +344,11 @@ p.mobile-wizard.ui-combobox-text.selected {
 	font-size: var(--default-font-size) !important;
 	margin: 0px;
 	padding: 0px;
-	border: solid 1px #fff;
+	border: solid 1px transparent;
 	display: flex;
 	flex-direction: row;
 	align-items: center;
-	background-color: #fff;
+	background-color: var(--color-main-background);
 }
 
 #mobile-wizard .ui-content .unobutton {
@@ -474,7 +474,7 @@ p.mobile-wizard.ui-combobox-text.selected {
 	position: sticky;
 	top: 0;
 	z-index: 2;
-	background-color: white;
+	background-color: var(--color-background-lighter);
 }
 
 #mobile-wizard-header {
@@ -493,14 +493,14 @@ p.mobile-wizard.ui-combobox-text.selected {
 	margin: 0px 1%;
 	border-radius: 10px;
 	border: none;
-	color: #777;
+	color: var(--color-text-lighter);
 }
 
 .ui-tab.selected.mobile-wizard {
 	border: none;
-	color: #0b87e7;
+	color: var(--color-primary);
 	border-radius: 0px;
-	border-bottom: solid 1px #0b87e7;
+	border-bottom: solid 1px var(--color-primary-dark);
 }
 
 [id|='tb_colorselector'] .w2ui-tb-caption > div {