v4: Core - tweak Photobrowser vars

Author: nolimits4web

src/core/components/photo-browser/photo-browser-vars.less

@@ -1,6 +1,6 @@
 :root {
   --f7-photobrowser-bg-color: #fff;
-  // --f7-photobrowser-bars-bg-color-rgb: var(--f7-bars-bg-color-rgb);
+  // --f7-photobrowser-bars-bg-color: rgba(var(--f7-bars-bg-color-rgb), 0.95);
   // --f7-photobrowser-bars-text-color: var(--f7-bars-text-color);
   // --f7-photobrowser-bars-link-color: var(--f7-bars-link-color);
   --f7-photobrowser-caption-font-size: 14px;
@@ -11,7 +11,7 @@
   --f7-photobrowser-exposed-bg-color: #000;
 
   --f7-photobrowser-dark-bg-color: #000;
-  --f7-photobrowser-dark-bars-bg-color-rgb: 27, 27, 27;
+  --f7-photobrowser-dark-bars-bg-color: rgba(27, 27, 27, 0.8);
   --f7-photobrowser-dark-bars-text-color: #fff;
   --f7-photobrowser-dark-bars-link-color: #fff;
 }

src/core/components/photo-browser/photo-browser.less

@@ -178,7 +178,7 @@
 .view.with-photo-browser-page {
   .navbar,
   .toolbar {
-    background: rgba(var(--f7-photobrowser-bars-bg-color-rgb, var(--f7-bars-bg-color-rgb)), 0.95);
+    background: var(--f7-photobrowser-bars-bg-color, rgba(var(--f7-bars-bg-color-rgb), 0.95));
     transition: 400ms;
     color: var(--f7-photobrowser-bars-text-color, var(--f7-bars-text-color));
     a {
@@ -219,7 +219,7 @@
   .toolbar {
     --f7-touch-ripple-color: var(--f7-touch-ripple-white);
     --f7-link-highlight-color: var(--f7-link-highlight-white);
-    background: rgba(var(--f7-photobrowser-dark-bars-bg-color-rgb), 0.8);
+    background: var(--f7-photobrowser-dark-bars-bg-color);
     .hairline-remove(top);
     .hairline-remove(bottom);
     color: var(--f7-photobrowser-dark-bars-text-color);