right: add styles for integration with Google maps

vednoc · Aug 6, 2020 · b38c3e0 · b38c3e0
1 parent 30dc4b9
commit b38c3e0
Showing 1 changed file with 47 additions and 6 deletions.
diff --git a/wa.user.styl b/wa.user.styl
@@ -570,12 +570,12 @@ ac5 = var(--ac-5)
         --labels-icon-rgb: var(--fg-3-rgb) //241,241,242;
         --link: var(--ac-0) //#68bbe4;
         --link-rgb: var(--ac-0-rgb) //104,187,228;
-        --live-location-footer-background: var(--bg-1) //#101d24e6;
-        --live-location-footer-background-rgb: var(--bg-1-rgb) //16,29,36;
-        --live-location-glow: #25d3664d;
-        --live-location-glow-rgb: 37,211,102;
-        --live-location-glow-stale: #ff001f4d;
-        --live-location-glow-stale-rgb: 255,0,31;
+        --live-location-footer-background: to_rgba('bg-2', 0.5) //#101d24e6;
+        --live-location-footer-background-rgb: var(--bg-2-rgb) //16,29,36;
+        --live-location-glow: to_rgba('ac-1', 0.5) //#25d3664d;
+        --live-location-glow-rgb: var(--ac-1-rgb) //37,211,102;
+        --live-location-glow-stale: to_rgba('red', 0.5) //#ff001f4d;
+        --live-location-glow-stale-rgb: var(--red-rgb) //255,0,31;
         --location-cluster-background: var(--bg-1) //#101d24;
         --location-cluster-background-rgb: var(--bg-1-rgb) //16,29,36;
         --media-editor-control: #1c313f;
@@ -1984,4 +1984,45 @@ ac5 = var(--ac-5)
             }
         }
     }
+
+    /// Right -> Maps.
+    .gm-style {
+        img {
+            /// 1: Logo; 2: Full map; 3: Map tiles.
+            &[src *= 'images/google']
+            &[src *= 'maps.googleapis.com'],
+            &[style *= 'width: 256px'][style *= 'height: 256px'] {
+                filter: invert(0.8) hue-rotate(180deg) i
+            }
+
+            /// Reset avatars.
+            &[src *= 'com/pp?'],
+            ../ [style *= 'height: 40px; width: 40px'] {
+                rad: 50% i
+            }
+        }
+
+        /// Map loading background.
+        /// NOTE: Made it transparent so it stops flashing.
+        /._3UG7w:not(#z) > div[style] { c: 0 0 t }
+
+        /// Map controls.
+        [controlwidth = '40'] * {
+            filter: invert(0.9) i
+            [style *= 'd-color: rgb(255\, 255\, 255)'] { c: 0 0 black }
+        }
+
+        /// Map copyright/ToS.
+        [style *= 'd-color: rgb(245\, 245\, 245)'] { c: 0 0 bg4 }
+        [style *= ' color: rgb(68\, 68\, 68)'] { c: fg3 }
+
+        /// Popout arrow.
+        .BPkae { border-top-color: var(--modal-background) i }
+
+        /// Location pin.
+        ._2T2Fj { c: 0 0 ac1 }
+
+        /// Footer border.
+        /.VK7yK { box-shadow: 0 -1px bg5 i }
+    }
 }