From 702dadfd5edb230aabc27550c98811ba1500465b Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 4 Jun 2019 23:36:10 +0200 Subject: [PATCH 001/295] chore: add styl files to editorconfig --- .editorconfig | 3 +++ 1 file changed, 3 insertions(+) diff --git a/.editorconfig b/.editorconfig index 9f4feed8..dbcae8b0 100644 --- a/.editorconfig +++ b/.editorconfig @@ -9,5 +9,8 @@ indent_style = space insert_final_newline = true trim_trailing_whitespace = true +[*.styl] +indent_size = 4 + [*.md] trim_trailing_whitespace = false From e7486ec7b4fe0df8ebe7109c2c446e1a0d7fe20f Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 4 Jun 2019 23:39:09 +0200 Subject: [PATCH 002/295] add new template --- wa.user.styl | 70 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 70 insertions(+) create mode 100644 wa.user.styl diff --git a/wa.user.styl b/wa.user.styl new file mode 100644 index 00000000..8fddc676 --- /dev/null +++ b/wa.user.styl @@ -0,0 +1,70 @@ +/* ==UserStyle== +@name WhatsApp by Mew [Alpha] +@description A customizable theme for WhatsApp. +@namespace github.com/vednoc/onyx +@homepageURL https://github.com/vednoc/onyx +@supportURL https://github.com/vednoc/onyx/issues +@version 1.5.0 +@author vednoc +@license MIT +@preprocessor stylus + +@var color dark "Dark" #272c35 +@var color darker "Darker" #1f232a +@var color light "Light" #d1d1d1 +@var color lighter "Lighter" #e9e9e9 +@var color accent "Accent" #7289da +@var color icon "Icons" #e1e1e1 +@var color shadow "Shadow" #00000010 +@var color red "Red" #a3525b +@var color green "Green" #70a352 +@var color blue "Blue" #527aa3 +==/UserStyle== */ + +@-moz-document domain('web.whatsapp.com') { + + :root { + --dark: dark; + --darker: darker; + --light: light; + --lighter: lighter; + --accent: accent; + --icon: icon; + --shadow: shadow; + --red: red; + --green: green; + --blue: blue; + --white: white; + --radius: 6px; + --t: transparent; + } + + // * Use stylus-lang variables with CSS variables. + $dark = var(--dark); + $darker = var(--darker); + $light = var(--light); + $lighter = var(--lighter); + $accent = var(--accent); + $icon = var(--icon); + $shadow = var(--shadow); + $yellow = var(--yellow); + $orange = var(--orange); + $red = var(--red); + $magenta = var(--magenta); + $violet = var(--violet); + $blue = var(--blue); + $cyan = var(--cyan); + $green = var(--green); + $white = var(--white); + $t = var(--t); + $r = var(--radius); + + c(x, y = 0, z = 0, xi = 1, yi = 1, zi = 1) { + if x is a 'call' { color: xi is 0 ? x : x !important } + if y is a 'call' { border-color: yi is 0 ? y : y !important } + if z is a 'call' { background-color: zi is 0 ? z : z !important } + } + + radius() { border-radius: arguments } + +} From 153f7c02bc31c4e28ec223739df8b4fdb298ac25 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 28 Aug 2019 21:09:30 +0200 Subject: [PATCH 003/295] chore: update UserCSS metadata and variables --- wa.user.styl | 101 +++++++++++++++++++++++++++++---------------------- 1 file changed, 58 insertions(+), 43 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 8fddc676..1cea21d1 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1,63 +1,78 @@ /* ==UserStyle== @name WhatsApp by Mew [Alpha] -@description A customizable theme for WhatsApp. +@description Dark and light, very customizable theme for WhatsApp. @namespace github.com/vednoc/onyx @homepageURL https://github.com/vednoc/onyx @supportURL https://github.com/vednoc/onyx/issues @version 1.5.0 -@author vednoc +@author vednoc (https://gitlab.com/vednoc) @license MIT @preprocessor stylus -@var color dark "Dark" #272c35 -@var color darker "Darker" #1f232a -@var color light "Light" #d1d1d1 -@var color lighter "Lighter" #e9e9e9 -@var color accent "Accent" #7289da -@var color icon "Icons" #e1e1e1 -@var color shadow "Shadow" #00000010 -@var color red "Red" #a3525b -@var color green "Green" #70a352 -@var color blue "Blue" #527aa3 +@var color dark "Color: Primary bg " #272c35 +@var color darken "Color: Highlight bg " #222730 +@var color darker "Color: Secondary bg " #1f232a +@var color light "Color: Primary fg " #d1d1d1 +@var color lighter "Color: Secondary fg " #e9e9e9 +@var color accent "Color: Accent " #7289da +@var color yellow "Color: Yellow " #f0c674 +@var color orange "Color: Orange " #d98245 +@var color red "Color: Red " #a54242 +@var color magenta "Color: Magenta " #b294bb +@var color violet "Color: Violet " #85678f +@var color blue "Color: Blue " #54738c +@var color cyan "Color: Cyan " #5e8d87 +@var color green "Color: Green " #7b823a +@var color white "Color: White " #ffffff +@var color shadow "Color: Shadow " #00000010 ==/UserStyle== */ @-moz-document domain('web.whatsapp.com') { :root { - --dark: dark; - --darker: darker; - --light: light; - --lighter: lighter; - --accent: accent; - --icon: icon; - --shadow: shadow; - --red: red; - --green: green; - --blue: blue; - --white: white; - --radius: 6px; - --t: transparent; + --dark : dark; + --darken : darken; + --darker : darker; + --light : light; + --lighter : lighter; + --accent : accent; + --shadow : shadow; + --yellow : yellow; + --orange : orange; + --red : red; + --magenta : magenta; + --violet : violet; + --blue : blue; + --cyan : cyan; + --green : green; + --white : white; + --radius : 6px; + --t : transparent; + --bshadow : 0 2px 4px var(--shadow); } // * Use stylus-lang variables with CSS variables. - $dark = var(--dark); - $darker = var(--darker); - $light = var(--light); - $lighter = var(--lighter); - $accent = var(--accent); - $icon = var(--icon); - $shadow = var(--shadow); - $yellow = var(--yellow); - $orange = var(--orange); - $red = var(--red); - $magenta = var(--magenta); - $violet = var(--violet); - $blue = var(--blue); - $cyan = var(--cyan); - $green = var(--green); - $white = var(--white); - $t = var(--t); - $r = var(--radius); + bg = var(--dark); + hl = var(--darken); + bd = var(--darker); + fg = var(--light); + cm = var(--lighter); + ac = var(--accent); + sh = var(--shadow); + bsh = var(--bshadow); + yellow = var(--yellow); + orange = var(--orange); + red = var(--red); + magenta = var(--magenta); + violet = var(--violet); + blue = var(--blue); + cyan = var(--cyan); + green = var(--green); + white = var(--white); + t = var(--t); + r = var(--radius); + outer = 0 0 0 1px bd; + inner = inset outer; c(x, y = 0, z = 0, xi = 1, yi = 1, zi = 1) { if x is a 'call' { color: xi is 0 ? x : x !important } From fa955511217e8f3ab3269bb80fd482182f04b315 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 28 Aug 2019 21:11:54 +0200 Subject: [PATCH 004/295] chore: update mixins --- wa.user.styl | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 1cea21d1..67b60b0b 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -74,12 +74,20 @@ outer = 0 0 0 1px bd; inner = inset outer; + // Color mixin; use the new one. + // All colors: `c: fg bd bg;` + // Only border-color: `c: 0 bd;` c(x, y = 0, z = 0, xi = 1, yi = 1, zi = 1) { - if x is a 'call' { color: xi is 0 ? x : x !important } - if y is a 'call' { border-color: yi is 0 ? y : y !important } - if z is a 'call' { background-color: zi is 0 ? z : z !important } + if x is a 'call' or x is a 'rgba' { color: xi is 0 ? x : x !important } + if y is a 'call' or y is a 'rgba' { border-color: yi is 0 ? y : y !important } + if z is a 'call' or z is a 'rgba' { background-color: zi is 0 ? z : z !important } } - - radius() { border-radius: arguments } - + // SVG colors. + // Only fill -> `v: ac 0;` + v(x, y = 0, xi = 1, yi = 1) { + if x is a 'call' or x is a 'rgba' { fill: xi is 0 ? x : x !important } + if y is a 'call' or y is a 'rgba' { stroke: yi is 0 ? y : y !important } + } + // Rounded corners. + rad() { border-radius: arguments } } From 5fd6bc07f658c175a2b5d83223b39ee43a4ff5c9 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 29 Aug 2019 15:35:23 +0200 Subject: [PATCH 005/295] global: add main app and background reset --- wa.user.styl | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 67b60b0b..51be2c9d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -90,4 +90,26 @@ } // Rounded corners. rad() { border-radius: arguments } + + body { + c: fg 0 bg; + background-image: none; + scrollbar-color: ac #5552; + } + + #app > div { + &::after { + c: 0 0 hl; + } + + .app { + rad: r; + c: 0 0 bg; + background-image: none; + @media (min-width: 1441px) { + border: 1px solid bd; + box-shadow: bsh; + } + } + } } From 5ae343b5d0a1d4cbd92c6d009092f1f77b0492c0 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 29 Aug 2019 15:38:09 +0200 Subject: [PATCH 006/295] left: add styles for header/search/contacts --- wa.user.styl | 50 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 50 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 51be2c9d..5888577f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -112,4 +112,54 @@ } } } + + // App -> Left. + #side { + > header { + border-bottom: 1px solid bd; + c: 0 0 t; + /// Avatar background. + [style *= 'height: 40px'] { c: 0 0 t } + /// Search. + ._2HS9r { + border-bottom: 1px solid bd; + c: 0 0 t; + /// Active. + > div { + &._19OGD { c: 0 0 hl } + &::after { content: none } + > div { c: cm } + > div + label { + c: 0 0 t; + input { c: fg 0 t } + } + } + } + /// Contacts. + #pane-side { + c: 0 0 t; + /// Items. + [style *= 'z-index'] > div > div[class] { + border-top: 1px solid bd; + c: 0 0 t; + /// Active. + &:hover, &._3mMX1 { c: 0 0 hl } + &._3mMX1 { border-bottom: 1px solid bd } + /// Remove borders. + &::after, > div:last-child { border: none } + /// Avatar background. + [style *= 'height: 49px'] { c: 0 0 bd } + /// Text. + > div:last-child { + /// Title/timestamp. + > div:first-child { + > div:first-child { c: fg } + > div:last-child { c: cm } + } + /// Body. + > div:last-child { c: cm } + } + } + } + } } From fe5c6c2c66d8e1be3d1b8c6e63b81474e7bd2e87 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 29 Aug 2019 15:41:38 +0200 Subject: [PATCH 007/295] global: add styles for context menus --- wa.user.styl | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 5888577f..a7508ade 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -113,6 +113,20 @@ } } + // Global -> Context menu. + div:not(#z) { + &[style ^= 'transform-origin:'] { + border: 1px solid bd; + rad: r; + c: 0 0 bg; + box-shadow: bsh; + li > div { + c: cm; + &:hover { c: fg 0 hl } + } + } + } + // App -> Left. #side { > header { From b142ffbac10a7ed6d138a21083ea4ec3615c0db4 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 29 Aug 2019 23:50:18 +0200 Subject: [PATCH 008/295] left: add styles for profile/settings panes --- wa.user.styl | 46 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index a7508ade..f476df34 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -176,4 +176,50 @@ } } } + + // App -> Left -> Profile/Settings. + .app span > div[style *= 'height: 100%'] { + > div[class], > span > div[class], > div > div[class] { + c: 0 0 bg; + > header { + // &, > div { height: unset } + border-bottom: 1px solid bd; + height: unset; + c: 0 0 hl; + /// NOTE: Reset text position. + ._1pYs5 { + margin: 0; + padding-top: 6px; + } + } + /// Highlighted sections. + ._2LSbZ { + c: 0 0 t; + box-shadow: none; + ._3he1q { c: ac } + ._3K9Sw { c: 0 bd } + ._5UNoc ._3hnO5 { c: 0 ac } + } + /// Settings -> User info section. + ._2UaNq { + border-bottom: 1px solid bd; + c: 0 0 t; + &::after { content: none } + [style *= 'height: 82px'] { c: 0 0 t } + /// Nick/info. + ._3H4MS { c: fg } + .xD91K { c: cm } + } + /// Settings -> Options. + ._26JG5 { + border-bottom: 1px solid bd; + c: 0 0 t; + &:hover { c: 0 0 hl } + &::before { content: none } + > div:last-child { c: 0 t } + ._6xQdq { c: fg } + } + ._1qWhd { c: cm } + } + } } From d10771468f886f302c8739f20bcb50b62b9732b0 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 29 Aug 2019 23:51:55 +0200 Subject: [PATCH 009/295] left: add reset for alerts --- wa.user.styl | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index f476df34..46adcff8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -134,6 +134,20 @@ c: 0 0 t; /// Avatar background. [style *= 'height: 40px'] { c: 0 0 t } + } + /// Alerts. + > header + span[class] { + ._1puWZ, ._2xikZ { + border-bottom: 1px solid bd; + c: 0 0 hl; + ._3K1Z_ * { c: yellow } + [data-icon ^= 'chevron-'] path { v: yellow } + [data-icon ^= 'alert-'] path { + &[fill ^= '#FFF'] { fill: bd } + &[fill ^= '#FFB'] { fill: yellow } + } + } + } /// Search. ._2HS9r { border-bottom: 1px solid bd; From 664850415b3124316b3b1cec18db879de17f6e27 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 30 Aug 2019 00:34:32 +0200 Subject: [PATCH 010/295] global: add styles for startup selectors --- wa.user.styl | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 46adcff8..0ff312bb 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -95,6 +95,14 @@ c: fg 0 bg; background-image: none; scrollbar-color: ac #5552; + + /// App -> Startup. + #initial_startup, #startup { + c: 0 0 bg; + progress { c: ac 0 bd } + ::-moz-progress-bar { c: 0 0 ac } + circle { stroke: fg } + } } #app > div { From d11ea6e8e671dce6582911b66ea09d31119df5cd Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 30 Aug 2019 00:37:45 +0200 Subject: [PATCH 011/295] global: add styles for intro section --- wa.user.styl | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 0ff312bb..6d5f399d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -103,6 +103,23 @@ ::-moz-progress-bar { c: 0 0 ac } circle { stroke: fg } } + + /// App -> Intro. + .iFKgT { + c: 0 bd bg; + [style] { + h1 { c: fg } + div { c: cm } + } + /// Reset default image. + [data-asset-intro-image] { + rad: 50%; + max-width: 200px; + max-height: 200px; + filter: opacity(0.75); + transition: opacity 0.6s ease; + } + } } #app > div { From 88db40856aa3eba4c6fa026878dcf1f8f9752922 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 30 Aug 2019 16:56:37 +0200 Subject: [PATCH 012/295] global: add reset for emojis --- wa.user.styl | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 6d5f399d..d15a1e2a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -138,6 +138,14 @@ } } + /// Global -> Emojis. + /// TODO: Implement options for roundness and opacity. + .emojik { + clip-path: circle(49%); + &:focus, &.selected { box-shadow: 0 0 0 2px ac !important } + &:not(:hover):not(:focus):not(.selected) { filter: opacity(0.6) } + } + // Global -> Context menu. div:not(#z) { &[style ^= 'transform-origin:'] { From a606d42a31468022211e727ec5964221e9678c44 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 30 Aug 2019 16:58:49 +0200 Subject: [PATCH 013/295] global: add initial styles for various modals --- wa.user.styl | 46 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index d15a1e2a..babff44e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -146,6 +146,52 @@ &:not(:hover):not(:focus):not(.selected) { filter: opacity(0.6) } } + /// Global -> Modals. + .overlay { + c: 0 0 t; + /// Backdrop. + &::before { + content: ''; + z-index: -1; + opacity: 0.96; + position: absolute; + top: 0; right: 0; bottom: 0; left: 0; + c: 0 0 bg; + } + /// Header. + > .cGLoy { + c: 0 0 bg; + box-shadow: 0 1px bd; + div { c: 0 0 t } + .xD91K { c: cm } + ._3H4MS { c: fg } + } + /// Previous/next buttons. + ._3yth3:not(#z) { + c: 0 0 bg; + box-shadow: inner, bsh; + &:hover { c: 0 0 hl } + } + /// Text. + .X5OiD { c: 0 0 bd } + .JmH7x { c: cm } + ._2yVvV { c: fg } + /// Primary buttons. + [role = 'button']._3PQ7V { + c: white 0 ac; + box-shadow: bsh; + transition: 0.15s ease; + &:hover { opacity: 0.8 } + } + /// Popup message. + [data-animate-modal-popup]:not(#z) { + rad: r; + c: 0 0 bg; + box-shadow: inner, 0 4px 8px 2px sh; + ._13HPh { c: fg } + } + } + // Global -> Context menu. div:not(#z) { &[style ^= 'transform-origin:'] { From b0bc44116ff39b99fad384f918c08a53af854afd Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 30 Aug 2019 16:59:47 +0200 Subject: [PATCH 014/295] global: add media selection in media viewer area --- wa.user.styl | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index babff44e..04e9c6d2 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -192,6 +192,20 @@ } } + // Global -> Media selection. + ._2AP3i { + c: 0 bd bg; + /// Item reset. + ._1LdNS { + &.cJP5q { + border: none !important; + transform: scale(1) !important; + outline: 4px solid ac; + } + &:hover:not(.cJP5q):not(#spec) { outline: 4px solid ac !important } + } + } + // Global -> Context menu. div:not(#z) { &[style ^= 'transform-origin:'] { From 5ec294326c3c621cbee4e33543e709bf601cd19c Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 30 Aug 2019 18:59:08 +0200 Subject: [PATCH 015/295] landing: add styles for the login page --- wa.user.styl | 43 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 43 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 04e9c6d2..26ab9252 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -49,6 +49,8 @@ --radius : 6px; --t : transparent; --bshadow : 0 2px 4px var(--shadow); + + --userstyle: 'Dark-WhatsApp [Alpha]'; } // * Use stylus-lang variables with CSS variables. @@ -96,6 +98,47 @@ background-image: none; scrollbar-color: ac #5552; + /// App -> Landing page. + .landing { + &-wrapper::before { c: 0 0 hl } + &-header { + position: relative; + &::after { + right: 0; + position: absolute; + content: var(--userstyle); + } + path[fill ^= '#FFF'] { fill: ac } + path[fill ^= '#00E'] { fill: bd } + div { c: fg } + } + &-window:not(#z) { + rad: r; + c: 0 0 bg; + box-shadow: inner, bsh; + } + &-main { + a[href] { c: ac } + ._2yUXW { c: cm } + .landing-title { c: fg } + rect[fill ^= '#f2f'], rect[fill ^= '#F2F'] { fill: bd } + path[fill ^= '#818'] { fill: ac } + /// QR code. + div[data-ref] { + rad: 0; + filter: contrast(150%); + outline: 4px solid white; + box-shadow: 0 0 0 4px white; + [role='button'] { c: white 0 ac } + } + /// Video showcase. + + ._310T_ { + c: 0 0 t; + img { opacity: 0.3 } + } + } + } + /// App -> Startup. #initial_startup, #startup { c: 0 0 bg; From bf235a30bc6b25fe420e240f3681c32bd040604e Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 30 Aug 2019 23:23:01 +0200 Subject: [PATCH 016/295] global: add styles for status area modal --- wa.user.styl | 41 ++++++++++++++++++++++++++++++++++++++++- 1 file changed, 40 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 26ab9252..c286181f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -171,10 +171,10 @@ } .app { - rad: r; c: 0 0 bg; background-image: none; @media (min-width: 1441px) { + rad: r; border: 1px solid bd; box-shadow: bsh; } @@ -235,6 +235,45 @@ } } + // * Global -> Status. + [data-animate-status-v3-modal-background='true'] { + c: 0 0 t; + /// Backdrop. + &::before { + content: ''; + z-index: -1; + opacity: 0.91; + position: absolute; + top: 0; right: 0; bottom: 0; left: 0; + c: 0 0 bg; + } + /// Content. + > div { + c: 0 0 bg; + @media (min-width: 1441px) { + rad: r; + box-shadow: outer; + } + /// Contacts. + > div[class]:nth-child(1) { + c: 0 0 hl; + box-shadow: 1px 0 bd; + @media (min-width: 1441px) { rad: r 0 0 r } + /// Text. + .OEFaY { c: cm } + ._26-u- { c: fg } + } + > div[class]:nth-child(2) { + .ojaNO { c: cm } + /// Reset the circle icon. + svg[width][height] path { + fill: none; + stroke: fg + } + } + } + } + // Global -> Media selection. ._2AP3i { c: 0 bd bg; From f64bd9904d0505eb5341c4ddabfba2948ff5ec6d Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 30 Aug 2019 23:30:35 +0200 Subject: [PATCH 017/295] feat: add an option to toggle fullscreen mode --- wa.user.styl | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index c286181f..0a3c53c1 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -9,6 +9,8 @@ @license MIT @preprocessor stylus +@var checkbox fullscreen "Enable fullscreen mode" 0 + @var color dark "Color: Primary bg " #272c35 @var color darken "Color: Highlight bg " #222730 @var color darker "Color: Secondary bg " #1f232a @@ -168,15 +170,24 @@ #app > div { &::after { c: 0 0 hl; + /// Remove image in fullscreen mode. + if ( fullscreen == 1 ) { content: none } } .app { c: 0 0 bg; background-image: none; @media (min-width: 1441px) { - rad: r; border: 1px solid bd; + rad: r; box-shadow: bsh; + /// Feat -> Fullscreen mode. + if ( fullscreen == 1 ) { + rad: 0; + top: unset; + width: 100%; + height: 100%; + } } } } @@ -271,6 +282,13 @@ stroke: fg } } + /// Feat -> Fullscreen mode. + if ( fullscreen == 1 ) { + rad: 0; + top: unset; + width: 100%; + height: 100%; + } } } From 3800a1e11cb95c74190c953af077c08f9566a0cf Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 30 Aug 2019 23:51:21 +0200 Subject: [PATCH 018/295] global: add styles for tooltips --- wa.user.styl | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 0a3c53c1..0f7fe7ef 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -149,6 +149,13 @@ circle { stroke: fg } } + // App -> Tooltips. + ._3pkG4 { + c: fg 0 hl; + box-shadow: inner, bsh; + button { c: ac } + } + /// App -> Intro. .iFKgT { c: 0 bd bg; From 3906b58c4b4ea07061c72505640ceee4f9ccbf6e Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 31 Aug 2019 11:45:34 +0200 Subject: [PATCH 019/295] left: improve alerts and add new states --- wa.user.styl | 25 ++++++++++++++++++++----- 1 file changed, 20 insertions(+), 5 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 0f7fe7ef..bc6e6d46 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -337,16 +337,31 @@ } /// Alerts. > header + span[class] { - ._1puWZ, ._2xikZ { + ._1puWZ, ._2xikZ, ._1sFYw, ._2t3oV { border-bottom: 1px solid bd; c: 0 0 hl; - ._3K1Z_ * { c: yellow } - [data-icon ^= 'chevron-'] path { v: yellow } + } + /// Disconnected/connecting. + ._1puWZ, ._2xikZ { + * { c: yellow } + [data-icon ^= 'chevron-'] path { fill: yellow } [data-icon ^= 'alert-'] path { - &[fill ^= '#FFF'] { fill: bd } - &[fill ^= '#FFB'] { fill: yellow } + &[fill ^= '#FFF'] { fill: yellow } + &[fill ^= '#FFB'] { fill: hl } } } + /// Enable notifications. + ._1sFYw { + * { c: blue } + [data-icon ^= 'chevron-'] path { v: blue } + [data-icon ^= 'alert-'] path[fill ^= '#FFF'] { fill: blue } + } + /// Phone battery low. + ._2t3oV { + * { c: red } + [data-icon ^= 'chevron-'] path { v: red } + [data-icon ^= 'alert-'] path[fill ^= '#FFF'] { fill: red } + } } /// Search. ._2HS9r { From e0e94cbebc73ae78f6fe23d6cdb9c38b1f770531 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 3 Sep 2019 00:59:30 +0200 Subject: [PATCH 020/295] left: update styles for contacts area --- wa.user.styl | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index bc6e6d46..6a3910a8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -383,11 +383,13 @@ c: 0 0 t; /// Items. [style *= 'z-index'] > div > div[class] { - border-top: 1px solid bd; c: 0 0 t; + box-shadow: 0 1px bd; /// Active. - &:hover, &._3mMX1 { c: 0 0 hl } - &._3mMX1 { border-bottom: 1px solid bd } + &:hover, &._3mMX1 { + c: 0 0 hl; + box-shadow: inset 0 1px bd, 0 1px bd; + } /// Remove borders. &::after, > div:last-child { border: none } /// Avatar background. @@ -402,6 +404,8 @@ /// Body. > div:last-child { c: cm } } + /// Unread indicators. + .P6z4j { c: white 0 ac } } } } From 908eb36eabda5539e115cef9e7b740554401b01b Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 3 Sep 2019 01:12:51 +0200 Subject: [PATCH 021/295] left: adjust heights for pane header --- wa.user.styl | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 6a3910a8..b2a08b55 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -415,6 +415,7 @@ > div[class], > span > div[class], > div > div[class] { c: 0 0 bg; > header { + min-height: unset !important; // &, > div { height: unset } border-bottom: 1px solid bd; height: unset; @@ -422,7 +423,11 @@ /// NOTE: Reset text position. ._1pYs5 { margin: 0; - padding-top: 6px; + padding-top: 4px; + } + .kyJvR { + height: 58px; + c: fg; } } /// Highlighted sections. From d41c336415011e827541cac5fa112031099b0772 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 3 Sep 2019 01:17:45 +0200 Subject: [PATCH 022/295] chat: add styles for chat header/messages area --- wa.user.styl | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index b2a08b55..02787b83 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -460,4 +460,32 @@ ._1qWhd { c: cm } } } + + // Main -> Chat. + #main { + c: 0 0 bg; + /// Chat doodle image. + /// TODO: Implement an option to remove the image. + [data-asset-chat-background] { + filter: invert(1); + } + /// Chat header. + > header { + border-right: none; + border-bottom: 1px solid bd; + c: 0 bd bg; + &::after { content: none } + [style *= 'height: 40px'] { c: 0 0 t } + [title] { c: fg } + } + /// Messages area. + .copyable-area > div[tabindex] { + c: 0 bd; + /// X unread messages. + ._3Xx0y { + c: fg bd hl; + > span { c: 0 0 bd } + } + } + } } From 62b7c5ba8767024cd45fe64bbbede779f64afe07 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Sep 2019 00:54:22 +0200 Subject: [PATCH 023/295] feat: add an option to set custom sans-serif font --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 02787b83..9004a7c1 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -9,6 +9,7 @@ @license MIT @preprocessor stylus +@var text ui_font "Custom UI font " 'font_name' @var checkbox fullscreen "Enable fullscreen mode" 0 @var color dark "Color: Primary bg " #272c35 @@ -100,6 +101,10 @@ background-image: none; scrollbar-color: ac #5552; + /// Feat -> Custom font. + font-family: ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica,\ + 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; + /// App -> Landing page. .landing { &-wrapper::before { c: 0 0 hl } From 3cca1b10282be90787d71e823d1a4d0bc5f436e1 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Sep 2019 00:56:08 +0200 Subject: [PATCH 024/295] icons: add global reset for all SVG icons --- wa.user.styl | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 9004a7c1..a2de3da9 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -318,6 +318,21 @@ } } + // Global -> Icons. + span[class] { + &[data-icon] { + path { + fill: fg; + transition: 0.15s ease; + } + /// Animate-ish. + &:hover path { + opacity: 1; + fill-opacity: 0.9 !important; + } + } + } + // Global -> Context menu. div:not(#z) { &[style ^= 'transform-origin:'] { From b12812a233e1b11ae95546981db0da64d58e872d Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Sep 2019 00:56:46 +0200 Subject: [PATCH 025/295] chat: add styles for loader/system notes/buttons --- wa.user.styl | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index a2de3da9..47b14c12 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -498,6 +498,27 @@ [style *= 'height: 40px'] { c: 0 0 t } [title] { c: fg } } + /// Chat -> Loader. + [title *= 'loading'] { + c: 0 0 hl; + box-shadow: inner, bsh; + svg circle { stroke: green } + } + /// Chat -> System notes. + .a7otO { + opacity: 0.95; + letter-spacing: 0; + text-shadow: none; + c: white 0 ac; + box-shadow: inset 0 -3px sh; + } + /// Chat -> Jump to new messages. + ._3KRbU { + c: 0 0 hl; + box-shadow: inner; + // &:hover { c: 0 0 bd } + .P6z4j { c: white 0 ac } + } /// Messages area. .copyable-area > div[tabindex] { c: 0 bd; From dfcdd73c48f7799e09c936bbb7cd0ea7b0ef0764 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Sep 2019 00:59:26 +0200 Subject: [PATCH 026/295] chat: add styles for chat input area --- wa.user.styl | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 47b14c12..d50f4cdb 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -529,4 +529,24 @@ } } } + + // Main -> Chat input. + #main > footer { + c: 0 0 t; + /// Input area. + > div:first-child { + border-top: 1px solid bd; + c: 0 bd bg; + div[style] + div[tabindex] { + rad: r; + c: 0 bd hl; + [style *= 'visibility'] { + // padding-top: 2px; + c: cm; + /// Hide input placeholder. + ../ .focused > div[style] { c: t } + } + } + } + } } From b76b668af6e37835060b093e9e712acef8450b48 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 00:55:46 +0200 Subject: [PATCH 027/295] chat: add styles for 'select messages' mode --- wa.user.styl | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index d50f4cdb..27956e7f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -522,6 +522,22 @@ /// Messages area. .copyable-area > div[tabindex] { c: 0 bd; + /// Chat -> Select messages. + &._2AqZl { + c: 0 0 hl; + /// Selected messages. + .qTFAl { + &:hover, &._3Z2tD { + opacity: 0.9 !important; + c: 0 0 bd; + } + } + /// Checkboxes. + ._15wNI { + c: 0 ac ac; + div { c: 0 white } + } + } /// X unread messages. ._3Xx0y { c: fg bd hl; @@ -548,5 +564,11 @@ } } } + /// Chat -> Select messages. + + span:not([class]) > div { + border-left: 1px solid bd; + border-top: 1px solid bd; + c: 0 0 bg; + } } } From b485e59283674633af1d5a2a5a70d0b069600aea Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 00:57:14 +0200 Subject: [PATCH 028/295] chat: add styles for emoji popout --- wa.user.styl | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 27956e7f..16a66477 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -549,6 +549,17 @@ // Main -> Chat input. #main > footer { c: 0 0 t; + /// Active emojis. + .-XQxp._1oNFt path { + fill-opacity: 1; + fill: ac; + } + /// Emoji picker. + ._2mlOb { + c: 0 bd hl; + box-shadow: inset 0 1px bd; + &::before { content: none } + } /// Input area. > div:first-child { border-top: 1px solid bd; From cb8cdc1d2c21c14dc8865bda29f9c1a4318290be Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 00:59:35 +0200 Subject: [PATCH 029/295] chat: add styles for emoji/gif/sticker menu --- wa.user.styl | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 16a66477..6b8e06b2 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -575,6 +575,37 @@ } } } + /// Emoji/gif/sticker menu. + ._30sf0 { + c: 0 bd; + /// Header. + ._2avTY { + c: 0 0 hl; + box-shadow: inset 0 1px bd, inset 0 -1px bd; + div[style *= 'background'] { c: 0 0 ac } + > :not(._2wn58) { c: cm } + ._2wn58 { c: fg } + /// Stickers -> Active nav. + .Orl3a { c: 0 0 ac } + } + /// Body. + .QChXd, ._20KNO, .RxbUw { + c: 0 0 bg; + /// Search. + [data-tab] { + c: 0 bd bg; + label { + c: fg bd hl; + box-shadow: inner; + input { c: fg } + } + } + /// Gif -> Preloader. + ._2x9yi { c: 0 0 hl } + /// Stickers -> Retry button. + [data-id = 'retry'] { c: ac } + } + } /// Chat -> Select messages. + span:not([class]) > div { border-left: 1px solid bd; From 13d45d0b09e4a35214cdd8ebd37a39ab5bcada35 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 01:14:56 +0200 Subject: [PATCH 030/295] icons: add more of the differently colored buttons --- wa.user.styl | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 6b8e06b2..9e1f1b13 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -331,6 +331,34 @@ fill-opacity: 0.9 !important; } } + /// Left -> Status icon. + &[data-icon ^= 'status-v3'] path { + &:first-child { + fill: fg; + fill-opacity: 0.55; + } + } + &[data-icon = 'status-v3-unread'] path { + &:last-child { fill: ac } + } + /// Search -> Back button. + &[data-icon = 'back-blue'] path { fill: blue } + /// Default user/group/broadcasts icons. + &[data-icon ^= 'default-'] path { + &:first-child { fill: bd } + &:last-child { fill: cm } + } + /// Seen message. + &[data-icon $= '-dblcheck-ack'] path { fill: blue } + /// Report contact. + &[data-icon = 'thumbs-down'] { + path { fill: orange } + } + /// Delete chat/missed call. + &[data-icon = 'delete-danger'], + &[data-icon = 'miss'] { + path { fill: red } + } } // Global -> Context menu. From 37b4983f352c9984cb377f0274402fa9e6e59f38 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 01:50:47 +0200 Subject: [PATCH 031/295] feat: add initial custom app background options --- wa.user.styl | 21 ++++++++++++++++++++- 1 file changed, 20 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 9e1f1b13..290e4cbd 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -11,6 +11,11 @@ @var text ui_font "Custom UI font " 'font_name' @var checkbox fullscreen "Enable fullscreen mode" 0 +@var select app_image 'Custom app background ' { + 'Custom *': 'custom ', + 'Default ': 'default ', + 'None ': 'none ', +} @var color dark "Color: Primary bg " #272c35 @var color darken "Color: Highlight bg " #222730 @@ -54,6 +59,7 @@ --bshadow : 0 2px 4px var(--shadow); --userstyle: 'Dark-WhatsApp [Alpha]'; + --background: url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80'); } // * Use stylus-lang variables with CSS variables. @@ -181,7 +187,20 @@ #app > div { &::after { - c: 0 0 hl; + /// TODO: Implement URL/opacity/filter options. + if ( app_image == custom ) { + s = -4px; + opacity: 0.50; + top: s; right: s; bottom: s; left: s; + height: unset; width: unset; + filter: blur((-1 * s)) invert(0); + background-image: var(--background); + c: 0 0 hl; + } else if ( app_image == default ) { + c: 0 0 hl; + } else { + display: none; + } /// Remove image in fullscreen mode. if ( fullscreen == 1 ) { content: none } } From bdf648fd5ac8ddc20651015aed0c0c8ce1ef564e Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 23:49:35 +0200 Subject: [PATCH 032/295] meta: update name/version blocks --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 290e4cbd..e5bebbb9 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1,10 +1,10 @@ /* ==UserStyle== -@name WhatsApp by Mew [Alpha] +@name Dark-WhatsApp @description Dark and light, very customizable theme for WhatsApp. @namespace github.com/vednoc/onyx @homepageURL https://github.com/vednoc/onyx @supportURL https://github.com/vednoc/onyx/issues -@version 1.5.0 +@version 1.9.9 @author vednoc (https://gitlab.com/vednoc) @license MIT @preprocessor stylus From 9ea9a45c41207f8f79a5006de338469e1721a3f6 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 23:50:12 +0200 Subject: [PATCH 033/295] meta: switch to single quotes for custom options --- wa.user.styl | 36 ++++++++++++++++++------------------ 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index e5bebbb9..d66f2a97 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -9,30 +9,30 @@ @license MIT @preprocessor stylus -@var text ui_font "Custom UI font " 'font_name' -@var checkbox fullscreen "Enable fullscreen mode" 0 +@var text ui_font 'Custom UI font ' ''font_name'' +@var checkbox fullscreen 'Enable fullscreen mode' 0 @var select app_image 'Custom app background ' { 'Custom *': 'custom ', 'Default ': 'default ', 'None ': 'none ', } -@var color dark "Color: Primary bg " #272c35 -@var color darken "Color: Highlight bg " #222730 -@var color darker "Color: Secondary bg " #1f232a -@var color light "Color: Primary fg " #d1d1d1 -@var color lighter "Color: Secondary fg " #e9e9e9 -@var color accent "Color: Accent " #7289da -@var color yellow "Color: Yellow " #f0c674 -@var color orange "Color: Orange " #d98245 -@var color red "Color: Red " #a54242 -@var color magenta "Color: Magenta " #b294bb -@var color violet "Color: Violet " #85678f -@var color blue "Color: Blue " #54738c -@var color cyan "Color: Cyan " #5e8d87 -@var color green "Color: Green " #7b823a -@var color white "Color: White " #ffffff -@var color shadow "Color: Shadow " #00000010 +@var color dark 'Color: Primary bg ' #272c35 +@var color darken 'Color: Highlight bg ' #222730 +@var color darker 'Color: Secondary bg ' #1f232a +@var color light 'Color: Primary fg ' #d1d1d1 +@var color lighter 'Color: Secondary fg ' #e9e9e9 +@var color accent 'Color: Accent ' #7289da +@var color yellow 'Color: Yellow ' #f0c674 +@var color orange 'Color: Orange ' #d98245 +@var color red 'Color: Red ' #a54242 +@var color magenta 'Color: Magenta ' #b294bb +@var color violet 'Color: Violet ' #85678f +@var color blue 'Color: Blue ' #54738c +@var color cyan 'Color: Cyan ' #5e8d87 +@var color green 'Color: Green ' #7b823a +@var color white 'Color: White ' #ffffff +@var color shadow 'Color: Shadow ' #00000010 ==/UserStyle== */ @-moz-document domain('web.whatsapp.com') { From dc7abac78b39fcd412db09350532f67efdd016e3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 23:54:24 +0200 Subject: [PATCH 034/295] feat: add an option to customize bg image link --- wa.user.styl | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index d66f2a97..a3a98a52 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -16,6 +16,7 @@ 'Default ': 'default ', 'None ': 'none ', } +@var text image_url 'Custom background link' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') @var color dark 'Color: Primary bg ' #272c35 @var color darken 'Color: Highlight bg ' #222730 @@ -59,7 +60,7 @@ --bshadow : 0 2px 4px var(--shadow); --userstyle: 'Dark-WhatsApp [Alpha]'; - --background: url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80'); + --bg-image : image_url; } // * Use stylus-lang variables with CSS variables. @@ -194,7 +195,7 @@ top: s; right: s; bottom: s; left: s; height: unset; width: unset; filter: blur((-1 * s)) invert(0); - background-image: var(--background); + background-image: var(--bg-image); c: 0 0 hl; } else if ( app_image == default ) { c: 0 0 hl; From ac4f0b14be65927c044ba1d6c78bbefd830a76a2 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 23:57:30 +0200 Subject: [PATCH 035/295] chore: update mixins and make them more compact --- wa.user.styl | 17 +++++++++-------- 1 file changed, 9 insertions(+), 8 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index a3a98a52..c26d81bb 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -86,19 +86,20 @@ outer = 0 0 0 1px bd; inner = inset outer; - // Color mixin; use the new one. + // Color mixin. // All colors: `c: fg bd bg;` // Only border-color: `c: 0 bd;` c(x, y = 0, z = 0, xi = 1, yi = 1, zi = 1) { - if x is a 'call' or x is a 'rgba' { color: xi is 0 ? x : x !important } - if y is a 'call' or y is a 'rgba' { border-color: yi is 0 ? y : y !important } - if z is a 'call' or z is a 'rgba' { background-color: zi is 0 ? z : z !important } + i = !important; + if x is a 'call' or x is a 'rgba' { color: xi is 0? x : x i } + if y is a 'call' or y is a 'rgba' { border-color: yi is 0? y : y i } + if z is a 'call' or z is a 'rgba' { background-color: zi is 0? z : z i } } - // SVG colors. - // Only fill -> `v: ac 0;` + // SVG mixin. v(x, y = 0, xi = 1, yi = 1) { - if x is a 'call' or x is a 'rgba' { fill: xi is 0 ? x : x !important } - if y is a 'call' or y is a 'rgba' { stroke: yi is 0 ? y : y !important } + i = !important; + if x is a 'call' or x is a 'rgba' { fill: xi is 0? x : x i } + if y is a 'call' or y is a 'rgba' { stroke: yi is 0? y : y i } } // Rounded corners. rad() { border-radius: arguments } From 4613050088ea76f22605a95403295c80608a69fc Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 7 Sep 2019 23:59:14 +0200 Subject: [PATCH 036/295] feat: add an option to set custom rounded corners --- wa.user.styl | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index c26d81bb..a80a5bb7 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -10,6 +10,7 @@ @preprocessor stylus @var text ui_font 'Custom UI font ' ''font_name'' +@var text radius 'Custom rounded corners' 4px @var checkbox fullscreen 'Enable fullscreen mode' 0 @var select app_image 'Custom app background ' { 'Custom *': 'custom ', @@ -55,7 +56,7 @@ --cyan : cyan; --green : green; --white : white; - --radius : 6px; + --radius : radius; --t : transparent; --bshadow : 0 2px 4px var(--shadow); From 1f6d780e63ed5324a6903e742b7112dddc8c31f0 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Sep 2019 23:37:08 +0200 Subject: [PATCH 037/295] chat: add styles for attach dropdown --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index a80a5bb7..34a7b357 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -394,6 +394,12 @@ c: cm; &:hover { c: fg 0 hl } } + /// Chat -> Attach dropdown. + &._1fRWV { + top: -10px; + padding: 10px; + .Ijb1Q::after { box-shadow: 0 4px 8px sh } + } } } From 8cb31f868edbd4b1993bc01ee51b064cf12d9dcd Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Sep 2019 23:39:25 +0200 Subject: [PATCH 038/295] icons: fix the conflict with attach dropdown icons --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 34a7b357..c49ae112 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -343,12 +343,12 @@ // Global -> Icons. span[class] { &[data-icon] { - path { + > svg > path { fill: fg; transition: 0.15s ease; } /// Animate-ish. - &:hover path { + &:hover > svg > path { opacity: 1; fill-opacity: 0.9 !important; } From 71b3d834e430274a128444cb9257a10b5a34e8cc Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Sep 2019 23:43:41 +0200 Subject: [PATCH 039/295] chat: add styles for message bubbles --- wa.user.styl | 41 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 41 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index c49ae112..972416eb 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -602,6 +602,47 @@ } } + // Main -> Chat message bubbles. + .message { + left = bd; + right = hl; + &-in, &-out { + /// Tails. + &.tail > .tail-container { + width: unset; + height: unset; + border: 6px solid t; + background: none !important; + } + /// Date. + [data-pre-plain-text] + div * { c: cm } + } + /// Left. + &-in { + &:not(.a81-s) { + c: fg 0 left; + box-shadow: 0 1px sh !important; + } + &.tail > .tail-container { + rad: 4px 0 0 0; + border-top-color: left; + border-right-color: left; + } + } + /// Right. + &-out { + &:not(.a81-s) { + c: fg 0 right; + box-shadow: 0 1px sh !important; + } + &.tail > .tail-container { + rad: 0 4px 0 0; + border-top-color: right; + border-left-color: right; + } + } + } + // Main -> Chat input. #main > footer { c: 0 0 t; From 3a49773455040c02cba6de4695302f90091ec314 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Sep 2019 23:47:23 +0200 Subject: [PATCH 040/295] chat: add styles for stickers --- wa.user.styl | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 972416eb..356f02db 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -616,6 +616,17 @@ } /// Date. [data-pre-plain-text] + div * { c: cm } + /// Stickers. + &.a81-s { + /// Header. + ._3Mf7Z { c: 0 0 bg } + /// Date. + ._3qAvH { + c: cm 0 hl; + // box-shadow: inner !important; + div { color: inherit } + } + } } /// Left. &-in { From 38707f97cfbaf6bac9c8df4ed2ed8fc405c82627 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Sep 2019 23:48:13 +0200 Subject: [PATCH 041/295] feat: add an option to disable message tails --- wa.user.styl | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 356f02db..5b5f9e61 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -11,6 +11,7 @@ @var text ui_font 'Custom UI font ' ''font_name'' @var text radius 'Custom rounded corners' 4px +@var checkbox msg_tails 'Enable message tails ' 1 @var checkbox fullscreen 'Enable fullscreen mode' 0 @var select app_image 'Custom app background ' { 'Custom *': 'custom ', @@ -614,6 +615,11 @@ border: 6px solid t; background: none !important; } + /// Feat -> Message tails. + if ( msg_tails != 1 ) { + rad: 7.5px !important; + &.tail > .tail-container { display: none } + } /// Date. [data-pre-plain-text] + div * { c: cm } /// Stickers. @@ -626,6 +632,10 @@ // box-shadow: inner !important; div { color: inherit } } + /// Fix bubble radius. + if ( msg_tails != 1 ) { + ._2Hp95._1X6iJ ._3Mf7Z { rad: 7.5px } + } } } /// Left. From 9089d5a563cd5d1c4954833cfde0183ad1c4ceeb Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Sep 2019 23:50:15 +0200 Subject: [PATCH 042/295] misc: add styles to many small elements --- wa.user.styl | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 5b5f9e61..96f69bbd 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -174,6 +174,7 @@ /// App -> Intro. .iFKgT { c: 0 bd bg; + &::after { c: 0 ac } [style] { h1 { c: fg } div { c: cm } @@ -187,6 +188,12 @@ transition: opacity 0.6s ease; } } + + /// Global -> Typing alert. + span[title *= 'typing']:not(#z) { c: ac } + + /// Contacts -> Loader. + svg[width = '18'][height = '18'] circle { stroke: green } } #app > div { @@ -298,7 +305,7 @@ c: 0 0 bg; @media (min-width: 1441px) { rad: r; - box-shadow: outer; + border: 1px solid bd; } /// Contacts. > div[class]:nth-child(1) { @@ -314,7 +321,7 @@ /// Reset the circle icon. svg[width][height] path { fill: none; - stroke: fg + stroke: fg; } } /// Feat -> Fullscreen mode. @@ -441,7 +448,7 @@ } } /// Search. - ._2HS9r { + > div[tabindex = '-1'] { border-bottom: 1px solid bd; c: 0 0 t; /// Active. @@ -556,7 +563,7 @@ [title] { c: fg } } /// Chat -> Loader. - [title *= 'loading'] { + [title *= 'load'] { c: 0 0 hl; box-shadow: inner, bsh; svg circle { stroke: green } From 7488d44cd32522b457a65d4123867d7efbdcca69 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 9 Sep 2019 00:34:36 +0200 Subject: [PATCH 043/295] global: add styles for emoji picker popout --- wa.user.styl | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 96f69bbd..4f2acb81 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -242,6 +242,36 @@ &:not(:hover):not(:focus):not(.selected) { filter: opacity(0.6) } } + /// Global -> Emoji picker popout. + ._342qq { + rad: r !important; + box-shadow: bsh; + /// Header. + ._2avTY { + c: 0 0 hl; + box-shadow: inset 0 -1px bd; + [style] { c: 0 0 ac } + } + /// Content. + .QChXd { + c: 0 0 bg; + [data-tab] { + c: 0 0 bg; + /// Input. + label { + c: fg 0 hl; + box-shadow: inner; + } + } + /// Sections. + ._2lKjK { c: cm } + } + + [data-animate-dropdown-nib] { + c: 0 0 bd; + box-shadow: none; + } + } + /// Global -> Modals. .overlay { c: 0 0 t; From e751f9510e6a4b8d50c92fc369aef1d916dcaf31 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 9 Sep 2019 00:37:01 +0200 Subject: [PATCH 044/295] left: add styles for starred/archived/new group --- wa.user.styl | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 4f2acb81..7a0dfbd9 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -572,6 +572,32 @@ ._6xQdq { c: fg } } ._1qWhd { c: cm } + /// New group. + ._1w-mX { + c: 0 0 t; + input { c: fg } + ._39cGk { c: 0 bd } + /// Resets for contacts. + + ._1c8mz { + c: 0 0 t; + .r7sRK { c: ac 0 hl } + ._8-yzK { c: 0 0 t } + ._2DxRd, ._2WP9Q { c: 0 t } + [style *= 'height: 49px'] { c: 0 0 bd } + } + } + /// Starred/Archived. + ._1WMT2 { + &::before { + margin-top: -1px; + left: 0; + c: 0 0 bd; + } + &::after { content: none } + &._1lakC, &._2nA3s { c: 0 0 hl } + ._2V2qB, .jLybP::before { c: cm } + } + } } } From e2b16ef8f0ec55213235c772483a5a77c3105b07 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 9 Sep 2019 00:38:59 +0200 Subject: [PATCH 045/295] feat: rewrite styles for custom UI font option --- wa.user.styl | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 7a0dfbd9..cd4cf8cc 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -63,6 +63,8 @@ --userstyle: 'Dark-WhatsApp [Alpha]'; --bg-image : image_url; + --ui-font : ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica, + 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; } // * Use stylus-lang variables with CSS variables. @@ -112,8 +114,7 @@ scrollbar-color: ac #5552; /// Feat -> Custom font. - font-family: ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica,\ - 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; + &, button, input { font-family: var(--ui-font) } /// App -> Landing page. .landing { From 16b87e30df9c482fcd6402404ee0a3885d76fd7d Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 9 Sep 2019 00:50:06 +0200 Subject: [PATCH 046/295] left: fix parts in search messages/contacts --- wa.user.styl | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index cd4cf8cc..236ba85a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -523,6 +523,11 @@ .P6z4j { c: white 0 ac } } } + /// Search contacts/messages. + .r7sRK { + c: ac 0 t; + box-shadow: 0 1px bd; + } } // App -> Left -> Profile/Settings. @@ -587,6 +592,14 @@ [style *= 'height: 49px'] { c: 0 0 bd } } } + /// New chat. + ._1c8mz { + /// New chat. + ._11p3Q, ._8-yzK { c: 0 0 t } + .r7sRK { c: ac 0 t } + /// Remove borders. + ._2DxRd, ._2WP9Q { border: none } + } /// Starred/Archived. ._1WMT2 { &::before { @@ -599,7 +612,6 @@ ._2V2qB, .jLybP::before { c: cm } } } - } } // Main -> Chat. From 8d35da09b7ac0b769d0244140bdd6b5ff8925969 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 9 Sep 2019 00:59:57 +0200 Subject: [PATCH 047/295] icons: replace fill with SVG mixin Has to be done because the selectors used lack necessary specificity. --- wa.user.styl | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 236ba85a..93cfb7fb 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -395,30 +395,30 @@ /// Left -> Status icon. &[data-icon ^= 'status-v3'] path { &:first-child { - fill: fg; + v: fg; fill-opacity: 0.55; } } &[data-icon = 'status-v3-unread'] path { - &:last-child { fill: ac } + &:last-child { v: ac } } /// Search -> Back button. - &[data-icon = 'back-blue'] path { fill: blue } + &[data-icon = 'back-blue'] path { v: blue } /// Default user/group/broadcasts icons. &[data-icon ^= 'default-'] path { &:first-child { fill: bd } &:last-child { fill: cm } } /// Seen message. - &[data-icon $= '-dblcheck-ack'] path { fill: blue } + &[data-icon $= '-dblcheck-ack'] path { v: blue } /// Report contact. &[data-icon = 'thumbs-down'] { - path { fill: orange } + path { v: orange } } /// Delete chat/missed call. &[data-icon = 'delete-danger'], &[data-icon = 'miss'] { - path { fill: red } + path { v: red } } } From f0c38e7da58effc63f686db2fab7c0f2ac72f363 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 27 Sep 2019 23:27:23 +0200 Subject: [PATCH 048/295] chat: fix colors for bubbles and add `i` variable --- wa.user.styl | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 93cfb7fb..06861b42 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -107,6 +107,8 @@ } // Rounded corners. rad() { border-radius: arguments } + // Shorter important. + i = !important; body { c: fg 0 bg; @@ -701,7 +703,7 @@ /// Stickers. &.a81-s { /// Header. - ._3Mf7Z { c: 0 0 bg } + ._3Mf7Z { c: 0 0 left } /// Date. ._3qAvH { c: cm 0 hl; @@ -716,6 +718,8 @@ } /// Left. &-in { + border-top-left-radius: 0 i; + > div { c: 0 0 t } &:not(.a81-s) { c: fg 0 left; box-shadow: 0 1px sh !important; @@ -728,6 +732,8 @@ } /// Right. &-out { + border-top-right-radius: 0 i; + > div { c: 0 0 t } &:not(.a81-s) { c: fg 0 right; box-shadow: 0 1px sh !important; From d39087047dbcd01f533e53a9ba9b6550ed5b172d Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 27 Sep 2019 23:37:20 +0200 Subject: [PATCH 049/295] chat: fix message context menus --- wa.user.styl | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 06861b42..474620ab 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -729,6 +729,10 @@ border-top-color: left; border-right-color: left; } + /// Context menu. + > span:last-child > div[style] { + background: linear-gradient(90deg, t, left) i; + } } /// Right. &-out { @@ -743,6 +747,10 @@ border-top-color: right; border-left-color: right; } + /// Context menu. + > span:last-child > div[style] { + background: linear-gradient(90deg, t, right) i; + } } } From eed07bf0500e4666bfc3913e983f817c0b8c0852 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 27 Sep 2019 23:51:59 +0200 Subject: [PATCH 050/295] right: add initial styles for 'contact info' area --- wa.user.styl | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 474620ab..f38c1653 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -616,6 +616,25 @@ } } + // App -> Right. + ._1C9rS .copyable-area { + border-left: 1px solid bd; + /// Avatar. + [style *= 'height: 200px'] { c: 0 0 bd } + ._1drsQ { c: fg } + ._2IwIk { c: cm } + /// Buttons. + ._3_-Si { + padding: 0 15px; + > div { c: 0 bd } + span { c: fg } + } + /// Reset padding. + ._1ur1f { padding: 28px 15px 19px } + ._2ZVEo { padding: 14px 15px 10px } + ._2k1Z5 { padding: 14px 15px 4px } + } + // Main -> Chat. #main { c: 0 0 bg; From 0222d317233fba766bf39d1682cb5eded764349b Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 27 Sep 2019 23:58:28 +0200 Subject: [PATCH 051/295] feat: add an option to set custom bg image opacity --- wa.user.styl | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index f38c1653..d2b5d0fd 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -19,6 +19,7 @@ 'None ': 'none ', } @var text image_url 'Custom background link' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') +@var range bg_opacity 'Custom image opacity ' [0.5, 0.0, 1, 0.01] @var color dark 'Color: Primary bg ' #272c35 @var color darken 'Color: Highlight bg ' #222730 @@ -63,6 +64,7 @@ --userstyle: 'Dark-WhatsApp [Alpha]'; --bg-image : image_url; + --bg-opacity: bg_opacity; --ui-font : ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica, 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; } @@ -201,10 +203,10 @@ #app > div { &::after { - /// TODO: Implement URL/opacity/filter options. + /// TODO: Implement filter option. if ( app_image == custom ) { s = -4px; - opacity: 0.50; + opacity: var(--bg-opacity); top: s; right: s; bottom: s; left: s; height: unset; width: unset; filter: blur((-1 * s)) invert(0); From 7aeec18450e356c92c9967ae8f8bf89efe51a2ff Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 28 Sep 2019 00:42:48 +0200 Subject: [PATCH 052/295] feat: add an option to set custom bg image blur --- wa.user.styl | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index d2b5d0fd..55d70dc0 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -20,6 +20,7 @@ } @var text image_url 'Custom background link' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') @var range bg_opacity 'Custom image opacity ' [0.5, 0.0, 1, 0.01] +@var range bg_blur 'Custom image opacity ' [8, 0, 50, 1, 'px'] @var color dark 'Color: Primary bg ' #272c35 @var color darken 'Color: Highlight bg ' #222730 @@ -65,6 +66,8 @@ --userstyle: 'Dark-WhatsApp [Alpha]'; --bg-image : image_url; --bg-opacity: bg_opacity; + --bg-blur : bg_blur; + --ui-font : ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica, 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; } @@ -205,11 +208,11 @@ &::after { /// TODO: Implement filter option. if ( app_image == custom ) { - s = -4px; + s = calc(-1 * var(--bg-blur)); opacity: var(--bg-opacity); top: s; right: s; bottom: s; left: s; height: unset; width: unset; - filter: blur((-1 * s)) invert(0); + filter: blur(var(--bg-blur)) invert(0); background-image: var(--bg-image); c: 0 0 hl; } else if ( app_image == default ) { From 5bc4813b7a57bc3c998a41d3949061ce42de1612 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 1 Oct 2019 23:48:32 +0200 Subject: [PATCH 053/295] feat: add a toggle for old and new/custom colors --- wa.user.styl | 35 +++++++++++++++++++++++------------ 1 file changed, 23 insertions(+), 12 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 55d70dc0..2e371f63 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -9,6 +9,7 @@ @license MIT @preprocessor stylus +@var checkbox theme 'Old/new[custom] colors' 0 @var text ui_font 'Custom UI font ' ''font_name'' @var text radius 'Custom rounded corners' 4px @var checkbox msg_tails 'Enable message tails ' 1 @@ -22,11 +23,11 @@ @var range bg_opacity 'Custom image opacity ' [0.5, 0.0, 1, 0.01] @var range bg_blur 'Custom image opacity ' [8, 0, 50, 1, 'px'] -@var color dark 'Color: Primary bg ' #272c35 -@var color darken 'Color: Highlight bg ' #222730 -@var color darker 'Color: Secondary bg ' #1f232a -@var color light 'Color: Primary fg ' #d1d1d1 -@var color lighter 'Color: Secondary fg ' #e9e9e9 +@var color dark 'Color: Primary bg ' #292929 +@var color darken 'Color: Highlight bg ' #333333 +@var color darker 'Color: Secondary bg ' #424242 +@var color light 'Color: Primary fg ' #e6e6e6 +@var color lighter 'Color: Secondary fg ' #bababa @var color accent 'Color: Accent ' #7289da @var color yellow 'Color: Yellow ' #f0c674 @var color orange 'Color: Orange ' #d98245 @@ -43,13 +44,23 @@ @-moz-document domain('web.whatsapp.com') { :root { - --dark : dark; - --darken : darken; - --darker : darker; - --light : light; - --lighter : lighter; - --accent : accent; - --shadow : shadow; + if ( theme == 1 ) { + --dark : dark; + --darken : darken; + --darker : darker; + --light : light; + --lighter : lighter; + --accent : accent; + --shadow : shadow; + } else { + --dark : #272c35; + --darken : #222730; + --darker : #1f232a; + --light : #e9e9e9; + --lighter : #c1c1c1; + --accent : accent; + --shadow : shadow; + } --yellow : yellow; --orange : orange; --red : red; From 9d8b3339aefd0361b05e7a7e5c1a6462802b1b9f Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 1 Oct 2019 23:55:44 +0200 Subject: [PATCH 054/295] chat: add styles for alert in unknown contacts --- wa.user.styl | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 2e371f63..7c4a3b00 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -855,5 +855,16 @@ border-top: 1px solid bd; c: 0 0 bg; } + /// Alerts -> Not in your contacts. + ._2Pown { + c: fg bd hl; + [role = 'button'] { + c: cm 0 bd; + &:hover { + c: fg; + box-shadow: 0 4px 8px sh; + } + } + } } } From 795773257b62ff8b41ccfc171a04d57ac5f1a07b Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 1 Oct 2019 23:58:57 +0200 Subject: [PATCH 055/295] global: fix modal buttons --- wa.user.styl | 22 ++++++++++++++++------ 1 file changed, 16 insertions(+), 6 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 7c4a3b00..e3e9b38a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -321,12 +321,22 @@ .X5OiD { c: 0 0 bd } .JmH7x { c: cm } ._2yVvV { c: fg } - /// Primary buttons. - [role = 'button']._3PQ7V { - c: white 0 ac; - box-shadow: bsh; - transition: 0.15s ease; - &:hover { opacity: 0.8 } + /// Buttons. + [role = 'button'] { + &._23_1v { + c: cm; + &:hover { + c: fg 0 hl; + box-shadow: none; + } + } + /// Primary. + &._3PQ7V { + c: white 0 ac; + box-shadow: bsh; + transition: 0.15s ease; + &:hover { opacity: 0.8 } + } } /// Popup message. [data-animate-modal-popup]:not(#z) { From ac42bfeb41dc3d395dcb9d5bac55204cc3e7088f Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 1 Oct 2019 23:57:46 +0200 Subject: [PATCH 056/295] global: add styles for misc text and checkboxes --- wa.user.styl | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index e3e9b38a..ace644b1 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -131,6 +131,11 @@ background-image: none; scrollbar-color: ac #5552; + /// Text. + ::placeholder { c: cm } + a { color: ac } + strong { c: fg } + /// Feat -> Custom font. &, button, input { font-family: var(--ui-font) } @@ -211,6 +216,10 @@ /// Global -> Typing alert. span[title *= 'typing']:not(#z) { c: ac } + /// Global -> Checkboxes. + ._1Zo-R { c: 0 bd hl } + ._15wNI { c: 0 ac ac } + /// Contacts -> Loader. svg[width = '18'][height = '18'] circle { stroke: green } } From 3b90550e286ade6fbb9d4cd48df5aa81e80d32fa Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 1 Oct 2019 23:58:29 +0200 Subject: [PATCH 057/295] chat: tweak broadcast messages --- wa.user.styl | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index ace644b1..6a66bbfa 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -698,8 +698,9 @@ opacity: 0.95; letter-spacing: 0; text-shadow: none; - c: white 0 ac; - box-shadow: inset 0 -3px sh; + c: white 0 blue; + box-shadow: inset 0 0 0 1rem #00000000, inset 0 -3px sh; + &.S-bQb { c: 0 0 orange } } /// Chat -> Jump to new messages. ._3KRbU { From b05bebd3daed4a87770092d42f248a9b3f306e1b Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 1 Oct 2019 23:59:40 +0200 Subject: [PATCH 058/295] chat: tweak colors for system messages --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 6a66bbfa..6969a7d7 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -699,7 +699,7 @@ letter-spacing: 0; text-shadow: none; c: white 0 blue; - box-shadow: inset 0 0 0 1rem #00000000, inset 0 -3px sh; + box-shadow: inset 0 -3px sh; &.S-bQb { c: 0 0 orange } } /// Chat -> Jump to new messages. From e6ab8daee239c5cc23b0cf98d0fad062028729dd Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 2 Oct 2019 23:46:19 +0200 Subject: [PATCH 059/295] chat: add styles for audio messages and icons --- wa.user.styl | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 6969a7d7..7793a175 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -446,6 +446,15 @@ &:first-child { fill: bd } &:last-child { fill: cm } } + /// Audio files. + &[data-icon = 'audio-file'] path { + &:first-child { fill: orange } + &:last-child { fill: hl } + } + &[data-icon ^= 'ptt-'] path { + &:first-child { fill: bd } + &:last-child { fill: ac } + } /// Seen message. &[data-icon $= '-dblcheck-ack'] path { v: blue } /// Report contact. @@ -770,6 +779,14 @@ ._2Hp95._1X6iJ ._3Mf7Z { rad: 7.5px } } } + /// Audio messages. + ._1lxsr, ._3MYI2 { c: cm } + /// Avatars. + [style *= 'height: 55px'] { + c: 0 0 bg; + box-shadow: bsh; + svg path[fill = '#DFE5E7'] { v: t } + } } /// Left. &-in { @@ -785,7 +802,7 @@ border-right-color: left; } /// Context menu. - > span:last-child > div[style] { + ._2Nkc4:not(#z), > span:last-child > div[style] { background: linear-gradient(90deg, t, left) i; } } From 6fdce4201f8c81391dc7fa6d91b99649ae555c6f Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 2 Oct 2019 23:47:42 +0200 Subject: [PATCH 060/295] global: add reset for Firefox specific properties --- wa.user.styl | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 7793a175..7ae8a947 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -136,6 +136,15 @@ a { color: ac } strong { c: fg } + /// Browser-specific resets. + ::-moz-range { + &-progress { c: 0 0 blue } + &-thumb { c: 0 0 ac } + &-track { c: 0 0 bg } + /// Progress completed. + ../ ._1N8Pv { c: 0 0 ac } + } + /// Feat -> Custom font. &, button, input { font-family: var(--ui-font) } From a978aaa5ee5e4190a674ebf5c2f0b7161f6f91e0 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 2 Oct 2019 23:53:36 +0200 Subject: [PATCH 061/295] global: add base styles for 'forward msg to' popup --- wa.user.styl | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 7ae8a947..c8bd25fd 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -358,10 +358,27 @@ } /// Popup message. [data-animate-modal-popup]:not(#z) { + border: 1px solid bd; rad: r; c: 0 0 bg; - box-shadow: inner, 0 4px 8px 2px sh; + box-shadow: 0 4px 8px 2px sh; ._13HPh { c: fg } + /// Forward message to... + ._1KDYa { + c: 0 0 t; + header { c: fg 0 hl } + /// TODO: See if search/contacts can be re-used. + .r7sRK { c: ac 0 t } + ._2UaNq { c: fg 0 t } + /// Footer. + > span > div[style] { + c: fg 0 hl; + [role = 'button'] { + c: 0 0 ac; + box-shadow: bsh; + } + } + } } } From f9d00df374f4c99f216e6f256f5fcda3e1e445af Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 2 Oct 2019 23:54:52 +0200 Subject: [PATCH 062/295] icons: add business and msg sent status icons --- wa.user.styl | 3 +++ 1 file changed, 3 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index c8bd25fd..27c358a8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -472,6 +472,8 @@ &:first-child { fill: bd } &:last-child { fill: cm } } + /// Business accounts. + &[data-icon ^= 'business-'] path { fill: cm } /// Audio files. &[data-icon = 'audio-file'] path { &:first-child { fill: orange } @@ -482,6 +484,7 @@ &:last-child { fill: ac } } /// Seen message. + &[data-icon $= '-dblcheck'] path { v: cm } &[data-icon $= '-dblcheck-ack'] path { v: blue } /// Report contact. &[data-icon = 'thumbs-down'] { From 3cc71cc8ee88afd9df585014ef31535133ea3f75 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 2 Oct 2019 23:55:45 +0200 Subject: [PATCH 063/295] feat: add an option to hide chat background image --- wa.user.styl | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 27c358a8..54fea1e7 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -22,6 +22,7 @@ @var text image_url 'Custom background link' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') @var range bg_opacity 'Custom image opacity ' [0.5, 0.0, 1, 0.01] @var range bg_blur 'Custom image opacity ' [8, 0, 50, 1, 'px'] +@var checkbox chat_bg 'Chat: Show bg image ' 1 @var color dark 'Color: Primary bg ' #292929 @var color darken 'Color: Highlight bg ' #333333 @@ -712,9 +713,10 @@ #main { c: 0 0 bg; /// Chat doodle image. - /// TODO: Implement an option to remove the image. [data-asset-chat-background] { filter: invert(1); + /// Feat -> Show chat image. + if ( chat_bg != 1 ) { display: none } } /// Chat header. > header { From ae5c93e3fb5d432bfc5fdb8ba5e2be0ca7275a0f Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 2 Oct 2019 23:59:24 +0200 Subject: [PATCH 064/295] feat: add a way to set chat image opacity/invert --- wa.user.styl | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 54fea1e7..e77d00c0 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -22,7 +22,10 @@ @var text image_url 'Custom background link' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') @var range bg_opacity 'Custom image opacity ' [0.5, 0.0, 1, 0.01] @var range bg_blur 'Custom image opacity ' [8, 0, 50, 1, 'px'] + @var checkbox chat_bg 'Chat: Show bg image ' 1 +@var range chat_bg_o 'Chat: Bg image opacity' [0.5, 0.0, 1, 0.01] +@var range chat_bg_i 'Chat: Bg image invert ' [1, 0.0, 1, 0.1] @var color dark 'Color: Primary bg ' #292929 @var color darken 'Color: Highlight bg ' #333333 @@ -80,6 +83,9 @@ --bg-opacity: bg_opacity; --bg-blur : bg_blur; + --chat-bg-o : chat_bg_o; + --chat-bg-i : chat_bg_i; + --ui-font : ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica, 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; } @@ -714,7 +720,7 @@ c: 0 0 bg; /// Chat doodle image. [data-asset-chat-background] { - filter: invert(1); + filter: invert(var(--chat-bg-i)) opacity(var(--chat-bg-o)); /// Feat -> Show chat image. if ( chat_bg != 1 ) { display: none } } From e7f4d3bdcd4ccec7fc3ae01efa1cf6820975eba9 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 3 Oct 2019 00:27:55 +0200 Subject: [PATCH 065/295] feat: add an option to set custom chat image Closes #27. --- wa.user.styl | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index e77d00c0..25e9fba1 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -24,8 +24,9 @@ @var range bg_blur 'Custom image opacity ' [8, 0, 50, 1, 'px'] @var checkbox chat_bg 'Chat: Show bg image ' 1 -@var range chat_bg_o 'Chat: Bg image opacity' [0.5, 0.0, 1, 0.01] -@var range chat_bg_i 'Chat: Bg image invert ' [1, 0.0, 1, 0.1] +@var text chat_image 'Chat: Custom image URL' url('/img/bg-chat-tile_8a055527b27b887521a9f084497d8879.png') +@var range chat_bg_o 'Chat: Bg image opacity' [0.1, 0.0, 1, 0.01] +@var range chat_bg_i 'Chat: Bg image invert ' [0.6, 0.0, 1, 0.1] @var color dark 'Color: Primary bg ' #292929 @var color darken 'Color: Highlight bg ' #333333 @@ -83,6 +84,7 @@ --bg-opacity: bg_opacity; --bg-blur : bg_blur; + --chat-image: chat_image; --chat-bg-o : chat_bg_o; --chat-bg-i : chat_bg_i; @@ -720,7 +722,9 @@ c: 0 0 bg; /// Chat doodle image. [data-asset-chat-background] { + opacity: 1; filter: invert(var(--chat-bg-i)) opacity(var(--chat-bg-o)); + background: var(--chat-image); /// Feat -> Show chat image. if ( chat_bg != 1 ) { display: none } } From c785ed271c2d09002752dac0c9a2d7adb3755f93 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 3 Oct 2019 23:48:27 +0200 Subject: [PATCH 066/295] global: add info about userstyle in intro section --- wa.user.styl | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 25e9fba1..78853994 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -90,6 +90,10 @@ --ui-font : ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica, 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; + + --version: 'Dark-WhatsApp v1.9.9'; + --message: 'WIP v2. '; + --changes: 'See the PR at: https://github.com/vednoc/onyx/pull/38'; } // * Use stylus-lang variables with CSS variables. @@ -229,6 +233,24 @@ filter: opacity(0.75); transition: opacity 0.6s ease; } + /// Userstyle info. + h1 + div[class] { + font-size: 0; + &::before { + display: block; + font-size: 16px; + margin-bottom: -16px; + content: var(--message) var(--changes); + } + &::after { + display: block; + font-size: 16px; + margin-top: 10px; + padding-top: 10px; + content: var(--version); + border-top: 1px solid bd; + } + } } /// Global -> Typing alert. From 74321be831b3bffb8cee41a4fb6146be567e5276 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 3 Oct 2019 23:53:34 +0200 Subject: [PATCH 067/295] chore: code cosmetics for bg-image filters --- wa.user.styl | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 78853994..9ebb6279 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -269,10 +269,11 @@ /// TODO: Implement filter option. if ( app_image == custom ) { s = calc(-1 * var(--bg-blur)); - opacity: var(--bg-opacity); + b = blur(var(--bg-blur)); + o = opacity(var(--bg-opacity)); top: s; right: s; bottom: s; left: s; height: unset; width: unset; - filter: blur(var(--bg-blur)) invert(0); + filter: b o; background-image: var(--bg-image); c: 0 0 hl; } else if ( app_image == default ) { From ffec9d647a6200593f2aadcd35667b354f6d2948 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 3 Oct 2019 23:58:50 +0200 Subject: [PATCH 068/295] feat: implement filters for app background image --- wa.user.styl | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 9ebb6279..6a54e015 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -20,8 +20,9 @@ 'None ': 'none ', } @var text image_url 'Custom background link' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') -@var range bg_opacity 'Custom image opacity ' [0.5, 0.0, 1, 0.01] -@var range bg_blur 'Custom image opacity ' [8, 0, 50, 1, 'px'] +@var range bg_opacity 'App: Image opacity ' [0.5, 0.0, 1, 0.01] +@var range bg_blur 'App: Image blur size ' [8, 0, 50, 1, 'px'] +@var range bg_invert 'App: Image inversion ' [0, 0.0, 1, 0.1] @var checkbox chat_bg 'Chat: Show bg image ' 1 @var text chat_image 'Chat: Custom image URL' url('/img/bg-chat-tile_8a055527b27b887521a9f084497d8879.png') @@ -83,6 +84,7 @@ --bg-image : image_url; --bg-opacity: bg_opacity; --bg-blur : bg_blur; + --bg-invert : bg_invert; --chat-image: chat_image; --chat-bg-o : chat_bg_o; @@ -266,14 +268,14 @@ #app > div { &::after { - /// TODO: Implement filter option. if ( app_image == custom ) { s = calc(-1 * var(--bg-blur)); b = blur(var(--bg-blur)); o = opacity(var(--bg-opacity)); + i = invert(var(--bg-invert)); top: s; right: s; bottom: s; left: s; height: unset; width: unset; - filter: b o; + filter: b o i; background-image: var(--bg-image); c: 0 0 hl; } else if ( app_image == default ) { From 7f584db07b7155473de444214e23678ffe21f557 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 3 Oct 2019 23:59:12 +0200 Subject: [PATCH 069/295] feat: add an option to set custom emoji opacity --- wa.user.styl | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 6a54e015..6e30af08 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -14,6 +14,9 @@ @var text radius 'Custom rounded corners' 4px @var checkbox msg_tails 'Enable message tails ' 1 @var checkbox fullscreen 'Enable fullscreen mode' 0 + +@var range emoji_o 'Emoji: Default opacity' [0.8, 0.0, 1, 0.01] + @var select app_image 'Custom app background ' { 'Custom *': 'custom ', 'Default ': 'default ', @@ -81,6 +84,9 @@ --bshadow : 0 2px 4px var(--shadow); --userstyle: 'Dark-WhatsApp [Alpha]'; + + --emoji-o : emoji_o; + --bg-image : image_url; --bg-opacity: bg_opacity; --bg-blur : bg_blur; @@ -310,7 +316,9 @@ .emojik { clip-path: circle(49%); &:focus, &.selected { box-shadow: 0 0 0 2px ac !important } - &:not(:hover):not(:focus):not(.selected) { filter: opacity(0.6) } + &:not(:hover):not(:focus):not(.selected) { + filter: opacity(var(--emoji-o)); + } } /// Global -> Emoji picker popout. From e3e8b42b990dfa3327817a414c841d6911197378 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 00:19:01 +0200 Subject: [PATCH 070/295] feat: add an option to set custom emoji clip size --- wa.user.styl | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 6e30af08..37d3600e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -16,6 +16,7 @@ @var checkbox fullscreen 'Enable fullscreen mode' 0 @var range emoji_o 'Emoji: Default opacity' [0.8, 0.0, 1, 0.01] +@var range emoji_r 'Emoji: Clip size ' [49, 48, 70, 1, '%'] @var select app_image 'Custom app background ' { 'Custom *': 'custom ', @@ -86,6 +87,7 @@ --userstyle: 'Dark-WhatsApp [Alpha]'; --emoji-o : emoji_o; + --emoji-r : emoji_r; --bg-image : image_url; --bg-opacity: bg_opacity; @@ -312,9 +314,8 @@ } /// Global -> Emojis. - /// TODO: Implement options for roundness and opacity. .emojik { - clip-path: circle(49%); + clip-path: circle(var(--emoji-r)); &:focus, &.selected { box-shadow: 0 0 0 2px ac !important } &:not(:hover):not(:focus):not(.selected) { filter: opacity(var(--emoji-o)); From 71a3a7170b458aad9db2aece50f4bd46b7576453 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 00:29:18 +0200 Subject: [PATCH 071/295] emojis: add a little tweak for active emojis --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 37d3600e..d0e4ea7b 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -320,6 +320,12 @@ &:not(:hover):not(:focus):not(.selected) { filter: opacity(var(--emoji-o)); } + /// Making sure active emoji is different from the rest. + if ( emoji_o >= 0.7 ) { + &:hover, &:focus, &.selected { + filter: opacity(calc(var(--emoji-o) - 0.3)); + } + } } /// Global -> Emoji picker popout. From 3f7cd97f9185d26c98c385f676b7347485595078 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 00:33:26 +0200 Subject: [PATCH 072/295] global: update userstyle info meta --- wa.user.styl | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index d0e4ea7b..d45775d6 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -84,8 +84,6 @@ --t : transparent; --bshadow : 0 2px 4px var(--shadow); - --userstyle: 'Dark-WhatsApp [Alpha]'; - --emoji-o : emoji_o; --emoji-r : emoji_r; @@ -101,9 +99,9 @@ --ui-font : ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica, 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; - --version: 'Dark-WhatsApp v1.9.9'; - --message: 'WIP v2. '; - --changes: 'See the PR at: https://github.com/vednoc/onyx/pull/38'; + --version : 'Dark-WhatsApp [Alpha] v1.9.9'; + --message : 'WIP v2. '; + --changes : 'See the PR at: https://github.com/vednoc/onyx/pull/38'; } // * Use stylus-lang variables with CSS variables. @@ -179,7 +177,7 @@ &::after { right: 0; position: absolute; - content: var(--userstyle); + content: var(--version); } path[fill ^= '#FFF'] { fill: ac } path[fill ^= '#00E'] { fill: bd } From c7b3e29c042511d3779e6c56be2d45f10fae9056 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 00:40:03 +0200 Subject: [PATCH 073/295] global: fix colors for status icon placeholder --- wa.user.styl | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index d45775d6..11c4ad8a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -460,10 +460,7 @@ > div[class]:nth-child(2) { .ojaNO { c: cm } /// Reset the circle icon. - svg[width][height] path { - fill: none; - stroke: fg; - } + svg[width][height] path { v: t fg } } /// Feat -> Fullscreen mode. if ( fullscreen == 1 ) { From 760f6b06defeb6d20bbd82098ef98323750e878a Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 00:45:03 +0200 Subject: [PATCH 074/295] misc: tweak a couple of colors --- wa.user.styl | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 11c4ad8a..44538e52 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -619,7 +619,8 @@ [style *= 'z-index'] > div > div[class] { c: 0 0 t; box-shadow: 0 1px bd; - /// Active. + .matched-text { c: ac } + /// Active states. &:hover, &._3mMX1 { c: 0 0 hl; box-shadow: inset 0 1px bd, 0 1px bd; @@ -803,7 +804,7 @@ /// Selected messages. .qTFAl { &:hover, &._3Z2tD { - opacity: 0.9 !important; + opacity: 0.5 !important; c: 0 0 bd; } } From 907cdda5f0b5215012d983798d95b0c3f8eba6bb Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 00:51:40 +0200 Subject: [PATCH 075/295] icons: add colors to icons in 'select msgs' mode --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 44538e52..652ad7e6 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -539,6 +539,10 @@ &[data-icon = 'miss'] { path { v: red } } + /// Icons in 'select messages' mode. + &[data-icon = 'delete'] path { v: red } + &[data-icon = 'forward'] path { v: green } + &[data-icon = 'star-btn'] path { v: yellow } } // Global -> Context menu. From cac1fe98619adbfa827d51439dcf52510a86b6e8 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 23:57:53 +0200 Subject: [PATCH 076/295] chat: fix reset for message tails --- wa.user.styl | 26 ++++++++++++++++---------- 1 file changed, 16 insertions(+), 10 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 652ad7e6..0b8d49f1 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -871,16 +871,19 @@ } /// Left. &-in { - border-top-left-radius: 0 i; > div { c: 0 0 t } &:not(.a81-s) { c: fg 0 left; box-shadow: 0 1px sh !important; } - &.tail > .tail-container { - rad: 4px 0 0 0; - border-top-color: left; - border-right-color: left; + /// Reset tails. + &.tail { + border-top-left-radius: 0 i; + > .tail-container { + rad: 4px 0 0 0; + border-top-color: left; + border-right-color: left; + } } /// Context menu. ._2Nkc4:not(#z), > span:last-child > div[style] { @@ -889,16 +892,19 @@ } /// Right. &-out { - border-top-right-radius: 0 i; > div { c: 0 0 t } &:not(.a81-s) { c: fg 0 right; box-shadow: 0 1px sh !important; } - &.tail > .tail-container { - rad: 0 4px 0 0; - border-top-color: right; - border-left-color: right; + /// Reset tails. + &.tail { + border-top-right-radius: 0 i; + > .tail-container { + rad: 0 4px 0 0; + border-top-color: right; + border-left-color: right; + } } /// Context menu. > span:last-child > div[style] { From 64c894a8af3b508b2887c46b7b0b9a3edbc37236 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 23:58:25 +0200 Subject: [PATCH 077/295] chat: tweak header text colors --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 0b8d49f1..38394aef 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -776,6 +776,8 @@ &::after { content: none } [style *= 'height: 40px'] { c: 0 0 t } [title] { c: fg } + /// Muted color for group members. + > div:nth-child(2) > div:nth-child(2) span[title] { c: cm } } /// Chat -> Loader. [title *= 'load'] { From 34fd7eb5d64b045fee090479753d1991f252bcc0 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 23:58:57 +0200 Subject: [PATCH 078/295] global: fix 'change avatar' hover background --- wa.user.styl | 3 +++ 1 file changed, 3 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 38394aef..502595fb 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -270,6 +270,9 @@ /// Contacts -> Loader. svg[width = '18'][height = '18'] circle { stroke: green } + + /// Panes -> Change avatars. + ._1JS2G { c: fg 0 #66666666 } } #app > div { From 682bf1ff4a1d2071224e832688ef4a42723adf43 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 4 Oct 2019 23:59:26 +0200 Subject: [PATCH 079/295] chat: tweak colors for system messages --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index 502595fb..2b22cf21 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -796,6 +796,7 @@ c: white 0 blue; box-shadow: inset 0 -3px sh; &.S-bQb { c: 0 0 orange } + &:not(.tail) { c: 0 0 green } } /// Chat -> Jump to new messages. ._3KRbU { From 3598c22f10efcb251aeb7e466acda57d568f398b Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 5 Oct 2019 23:43:32 +0200 Subject: [PATCH 080/295] global: fix 'failed to connect' modal body section --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 2b22cf21..0b526932 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -429,6 +429,12 @@ } } } + /// Failed to connect. + span[role = 'button'] { c: ac } + hr { + c: 0 bd; + + div { c: fg } + } } } From 27f97cb1b6d1a33d183db447a9ea35e4aee3059d Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 5 Oct 2019 23:44:43 +0200 Subject: [PATCH 081/295] chat: fix reply feature background color --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 0b526932..b2315cdc 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -901,6 +901,8 @@ ._2Nkc4:not(#z), > span:last-child > div[style] { background: linear-gradient(90deg, t, left) i; } + /// Replies. + ._2HTIU { c: 0 0 right } } /// Right. &-out { @@ -922,6 +924,8 @@ > span:last-child > div[style] { background: linear-gradient(90deg, t, right) i; } + /// Replies. + ._2HTIU { c: 0 0 left } } } From a083c8f0fac5d0e0cbbfc4b3dbf659a81af741ec Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 5 Oct 2019 23:46:38 +0200 Subject: [PATCH 082/295] chat: tweak colors for various msg context menus --- wa.user.styl | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index b2315cdc..40a032e9 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -922,7 +922,12 @@ } /// Context menu. > span:last-child > div[style] { - background: linear-gradient(90deg, t, right) i; + /// Non-stickers. + &:not(._2PpWQ) { + background: linear-gradient(90deg, t, right) i; + } + /// Stickers. + &._2PpWQ div[style *= 'opacity'] { c: 0 0 right } } /// Replies. ._2HTIU { c: 0 0 left } From b15e5c733a646a67cf5dd7983f0f10339361b5a5 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 5 Oct 2019 23:53:39 +0200 Subject: [PATCH 083/295] chat: fix colors for attached files Fixes one part of #48. --- wa.user.styl | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 40a032e9..ff5d85c8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -789,7 +789,7 @@ > div:nth-child(2) > div:nth-child(2) span[title] { c: cm } } /// Chat -> Loader. - [title *= 'load'] { + [title *= 'load']:not(a) { c: 0 0 hl; box-shadow: inner, bsh; svg circle { stroke: green } @@ -835,6 +835,11 @@ c: fg bd hl; > span { c: 0 0 bd } } + /// Attached files. + a[title] { + > ._1mrMQ { c: fg 0 sh } + + div { &, > span::before { c: cm }} + } } } From 9d6c3fcdd3f1a6cb5730c1f0f81a650eaa493c6a Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 5 Oct 2019 23:59:14 +0200 Subject: [PATCH 084/295] chat: fix styles for rich msg embeds --- wa.user.styl | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index ff5d85c8..58c1a4c1 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -840,6 +840,13 @@ > ._1mrMQ { c: fg 0 sh } + div { &, > span::before { c: cm }} } + /// Rich embeds. + ._1SsXF { + c: 0 0 sh; + div > div:nth-child(1) span { c: fg } + div > div:nth-child(2) span { c: cm } + div > div:nth-child(3) span { c: fg } + } } } From 5b6c02bbe158d5d81f77d9e5bd1bd0bbfb1f86e2 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 6 Oct 2019 00:22:56 +0200 Subject: [PATCH 085/295] right: add whitespace reset to remaining elements --- wa.user.styl | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 58c1a4c1..2abb72fa 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -764,6 +764,13 @@ ._1ur1f { padding: 28px 15px 19px } ._2ZVEo { padding: 14px 15px 10px } ._2k1Z5 { padding: 14px 15px 4px } + ._3EN0l { padding: 14px 15px } + ._2nQ7u, ._1goQ0 { padding: 0 } + ._2LSbZ._2j5ir { margin-bottom: unset } + ._1tyVr { + padding: 0 15px; + width: auto; + } } // Main -> Chat. From 782d904c5e7f0b5e1313f6a2e80db885135ed668 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 6 Oct 2019 00:24:07 +0200 Subject: [PATCH 086/295] right: fix missing styles in the msg info section --- wa.user.styl | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 2abb72fa..9047041d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -771,13 +771,20 @@ padding: 0 15px; width: auto; } + /// Message info. + ._2rGVQ { + border-bottom: 1px solid bd; + c: 0 0 t; + } + /// Read/Delivered section. + ._2WP9Q { border: none } } // Main -> Chat. #main { c: 0 0 bg; /// Chat doodle image. - [data-asset-chat-background] { + /[data-asset-chat-background] { opacity: 1; filter: invert(var(--chat-bg-i)) opacity(var(--chat-bg-o)); background: var(--chat-image); From 67da147d6b658003b74e4fe21f5da79ac9d23a30 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 6 Oct 2019 00:27:18 +0200 Subject: [PATCH 087/295] chat: refactor reset for bubble colors --- wa.user.styl | 19 +++++++++---------- 1 file changed, 9 insertions(+), 10 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 9047041d..e37a80be 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -869,6 +869,11 @@ left = bd; right = hl; &-in, &-out { + /// Reset bubble colors. + > div { + c: 0 0 t; + box-shadow: 0 1px sh i; + } /// Tails. &.tail > .tail-container { width: unset; @@ -909,11 +914,8 @@ } /// Left. &-in { - > div { c: 0 0 t } - &:not(.a81-s) { - c: fg 0 left; - box-shadow: 0 1px sh !important; - } + /// Not stickers. + &:not(.a81-s) { c: fg 0 left } /// Reset tails. &.tail { border-top-left-radius: 0 i; @@ -932,11 +934,8 @@ } /// Right. &-out { - > div { c: 0 0 t } - &:not(.a81-s) { - c: fg 0 right; - box-shadow: 0 1px sh !important; - } + /// Not stickers. + &:not(.a81-s) { c: fg 0 right } /// Reset tails. &.tail { border-top-right-radius: 0 i; From 12355c5c2397190db92b31266ee95ca844ab117c Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 6 Oct 2019 00:49:17 +0200 Subject: [PATCH 088/295] chat: fix msg highlight when selected from search --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index e37a80be..25dc6439 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -911,6 +911,8 @@ box-shadow: bsh; svg path[fill = '#DFE5E7'] { v: t } } + /// Search -> Selected message. + > .velocity-animating * { c: ac } } /// Left. &-in { From aec302b43401f5be93f907a8abfdcb97dbfe0221 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 6 Oct 2019 00:50:14 +0200 Subject: [PATCH 089/295] right: fix missing colors for search items section --- wa.user.styl | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 25dc6439..24ab0905 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -778,6 +778,14 @@ } /// Read/Delivered section. ._2WP9Q { border: none } + /// Search -> Items. + [style] > div > ._2UaNq:hover { + c: 0 0 hl; + box-shadow: inset 0 1px bd; + } + /// Search -> Msg content/date. + span[title] > span[dir] { c: fg } + ._0LqQ { c: cm } } // Main -> Chat. From bb9cbc9611c4ec3938db63f802db5a01027c2355 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 6 Oct 2019 01:58:58 +0200 Subject: [PATCH 090/295] global: re-use searchbox styles in other sections --- wa.user.styl | 19 ++++++++----------- 1 file changed, 8 insertions(+), 11 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 24ab0905..af30d588 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -611,18 +611,15 @@ } } /// Search. - > div[tabindex = '-1'] { + /div[class *= 'ZP8RM'] { border-bottom: 1px solid bd; - c: 0 0 t; - /// Active. - > div { - &._19OGD { c: 0 0 hl } - &::after { content: none } - > div { c: cm } - > div + label { - c: 0 0 t; - input { c: fg 0 t } - } + c: 0 0 bg; + &._19OGD { c: 0 0 hl } + &::after { content: none } + > div { c: cm } + > div + label { + c: 0 0 t; + input { c: fg 0 t } } } /// Contacts. From e8ed4bc8d7a7425fe4038d7a6bc39a4952b53438 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 7 Oct 2019 23:55:26 +0200 Subject: [PATCH 091/295] chat: remove background from image context menu --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index af30d588..8eaf97b8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -893,6 +893,8 @@ } /// Date. [data-pre-plain-text] + div * { c: cm } + /// Reset image context menu. + &._26GKj ._2Nkc4:not(#z) { background: none i } /// Stickers. &.a81-s { /// Header. From 109660b73c5a9ffa5881aedb1d684a6ae7447c37 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 7 Oct 2019 23:58:03 +0200 Subject: [PATCH 092/295] chat: fix user's nickname in group chats Fixes #23, once again. --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 8eaf97b8..395cd6e9 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -934,6 +934,8 @@ border-right-color: left; } } + /// Groups -> Nickname. + [role] > span[role = 'button'] + span { c: fg } /// Context menu. ._2Nkc4:not(#z), > span:last-child > div[style] { background: linear-gradient(90deg, t, left) i; From 0cd504239fc012057f572f1cf49ee3ce92d95d84 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 7 Oct 2019 23:58:45 +0200 Subject: [PATCH 093/295] right: fix media/links/docs tabbed navigation --- wa.user.styl | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 395cd6e9..bbb12f7f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -783,6 +783,22 @@ /// Search -> Msg content/date. span[title] > span[dir] { c: fg } ._0LqQ { c: cm } + /// Media/Links/Docs. + [data-active-tab] { + border-bottom: 1px solid bd; + c: 0 0 t; + button { + c: cm; + &:hover { c: 0 0 hl } + &._3caqI { c: fg } + } + /// Selected. + &::before { + margin-bottom: -1px; + height: 1px; + c: 0 0 ac; + } + } } // Main -> Chat. From 8de87364eca09c11fad20635558ac8f6bb81248c Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 9 Oct 2019 23:59:41 +0200 Subject: [PATCH 094/295] chat: fix bubble colors and remove reset --- wa.user.styl | 26 ++++++++++++++------------ 1 file changed, 14 insertions(+), 12 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index bbb12f7f..2dbe2087 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -890,13 +890,8 @@ left = bd; right = hl; &-in, &-out { - /// Reset bubble colors. - > div { - c: 0 0 t; - box-shadow: 0 1px sh i; - } /// Tails. - &.tail > .tail-container { + .tail > .tail-container { width: unset; height: unset; border: 6px solid t; @@ -940,9 +935,9 @@ /// Left. &-in { /// Not stickers. - &:not(.a81-s) { c: fg 0 left } + > div:not(.a81-s) > div { c: fg 0 left } /// Reset tails. - &.tail { + .tail { border-top-left-radius: 0 i; > .tail-container { rad: 4px 0 0 0; @@ -953,7 +948,14 @@ /// Groups -> Nickname. [role] > span[role = 'button'] + span { c: fg } /// Context menu. - ._2Nkc4:not(#z), > span:last-child > div[style] { + > div > span:last-child > div[style] { + /// Non-stickers. + &:not(._2PpWQ) { + background: linear-gradient(90deg, t, left) i; + } + /// Stickers. + &._2PpWQ > div[style *= 'opacity'] { c: 0 0 left } + } background: linear-gradient(90deg, t, left) i; } /// Replies. @@ -962,9 +964,9 @@ /// Right. &-out { /// Not stickers. - &:not(.a81-s) { c: fg 0 right } + > div:not(.a81-s) > div { c: fg 0 right } /// Reset tails. - &.tail { + .tail { border-top-right-radius: 0 i; > .tail-container { rad: 0 4px 0 0; @@ -973,7 +975,7 @@ } } /// Context menu. - > span:last-child > div[style] { + > div > span:last-child > div[style] { /// Non-stickers. &:not(._2PpWQ) { background: linear-gradient(90deg, t, right) i; From 6120e02882b24ad21e9cf0238b345434cc55bcec Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 10 Oct 2019 23:43:52 +0200 Subject: [PATCH 095/295] chat: fix message status icons for image embeds --- wa.user.styl | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 2dbe2087..794bcc4c 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -536,9 +536,9 @@ &:first-child { fill: bd } &:last-child { fill: ac } } - /// Seen message. - &[data-icon $= '-dblcheck'] path { v: cm } - &[data-icon $= '-dblcheck-ack'] path { v: blue } + /// Message status. + &[data-icon *= '-dblcheck'] path { v: cm } + &[data-icon *= '-dblcheck-ack'] path { v: blue } /// Report contact. &[data-icon = 'thumbs-down'] { path { v: orange } From 2422529ce948f570e68f06a14a5117f4b1ba29b5 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 10 Oct 2019 23:45:32 +0200 Subject: [PATCH 096/295] chat: fix message bubble shadow --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 794bcc4c..93d8cd43 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -890,6 +890,11 @@ left = bd; right = hl; &-in, &-out { + /// Fix shadows. + > div:not(.a81-s) { + box-shadow: 0 1px sh i; + > div { box-shadow: none i } + } /// Tails. .tail > .tail-container { width: unset; From 8b5215b917ee1054a26edf3d6edca6b95ec7d5b8 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 10 Oct 2019 23:46:29 +0200 Subject: [PATCH 097/295] right: fix missing styles in message info section --- wa.user.styl | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 93d8cd43..dfe3406f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -768,11 +768,16 @@ padding: 0 15px; width: auto; } - /// Message info. + /// Message info -> Image. ._2rGVQ { border-bottom: 1px solid bd; c: 0 0 t; } + /// Message info -> Read by. + ._2AJf5 { + c: 0 0 t; + span { c: ac } + } /// Read/Delivered section. ._2WP9Q { border: none } /// Search -> Items. From 9dee66d031d42a723ec80dee8f8a3e0ca5144148 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 10 Oct 2019 23:48:44 +0200 Subject: [PATCH 098/295] chat: fix header/footer for stickers --- wa.user.styl | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index dfe3406f..a30e64a6 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -917,9 +917,12 @@ /// Reset image context menu. &._26GKj ._2Nkc4:not(#z) { background: none i } /// Stickers. - &.a81-s { + .a81-s { /// Header. - ._3Mf7Z { c: 0 0 left } + ._3Mf7Z { + c: 0 0 left; + box-shadow: 0 1px sh i; + } /// Date. ._3qAvH { c: cm 0 hl; From d2e4406affc0de2db7ad5e2c02c76c37c1802e36 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 10 Oct 2019 23:50:36 +0200 Subject: [PATCH 099/295] chat: tweak context menu for images/forwarded msgs --- wa.user.styl | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index a30e64a6..94c263ca 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -934,6 +934,10 @@ ._2Hp95._1X6iJ ._3Mf7Z { rad: 7.5px } } } + /// Context menu -> Images and forwarded messages. + > div > span:nth-last-child(2) > div[style] { + background: linear-gradient(30deg, t 65%, bg 120%) i; + } /// Audio messages. ._1lxsr, ._3MYI2 { c: cm } /// Avatars. @@ -968,8 +972,6 @@ } /// Stickers. &._2PpWQ > div[style *= 'opacity'] { c: 0 0 left } - } - background: linear-gradient(90deg, t, left) i; } /// Replies. ._2HTIU { c: 0 0 right } From 9574eceb6ddecf19b7c0624dd3c361b3e0c11774 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 10 Oct 2019 23:53:14 +0200 Subject: [PATCH 100/295] chat: add background to image's timestamp --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 94c263ca..80d6ac42 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -948,6 +948,12 @@ } /// Search -> Selected message. > .velocity-animating * { c: ac } + /// Images. + div[style *= 'width'][style *= 'height'] + div[class] { + padding: 3px 7px; + rad: 7.5px; + c: 0 0 hl; + } } /// Left. &-in { From c59a665b775d27d033e1397c7dd1866dbbef842d Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 11 Oct 2019 00:06:59 +0200 Subject: [PATCH 101/295] feat: add options to re-align msg bubble positions Closes #58. --- wa.user.styl | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 80d6ac42..fdffd303 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -33,6 +33,9 @@ @var range chat_bg_o 'Chat: Bg image opacity' [0.1, 0.0, 1, 0.01] @var range chat_bg_i 'Chat: Bg image invert ' [0.6, 0.0, 1, 0.1] +@var checkbox chat_left 'Chat: Align left msg ' 0 +@var checkbox chat_right 'Chat: Align right msg ' 0 + @var color dark 'Color: Primary bg ' #292929 @var color darken 'Color: Highlight bg ' #333333 @var color darker 'Color: Secondary bg ' #424242 @@ -981,6 +984,8 @@ } /// Replies. ._2HTIU { c: 0 0 right } + /// Feat -> Align left bubble. + if ( chat_left == 1 ) { justify-content: flex-end } } /// Right. &-out { @@ -1006,6 +1011,8 @@ } /// Replies. ._2HTIU { c: 0 0 left } + /// Feat -> Align right bubble. + if ( chat_right == 1 ) { justify-content: flex-start } } } From ad9bd2c84650c37356374e49615c0042c17dbf25 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 13 Oct 2019 23:53:22 +0200 Subject: [PATCH 102/295] global: fix background for active buttons --- wa.user.styl | 3 +++ 1 file changed, 3 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index fdffd303..8d1492be 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -271,6 +271,9 @@ ._1Zo-R { c: 0 bd hl } ._15wNI { c: 0 ac ac } + /// Global -> Active buttons. + ._3j8Pd { &.GPmgF, &.GPmgf { c: 0 0 hl }} + /// Contacts -> Loader. svg[width = '18'][height = '18'] circle { stroke: green } From d3d98efc672f249e0b6e859ed127a22662863f97 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 13 Oct 2019 23:55:13 +0200 Subject: [PATCH 103/295] feat: add an option to blur chat images/videos --- wa.user.styl | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 8d1492be..f8756b38 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -28,6 +28,8 @@ @var range bg_blur 'App: Image blur size ' [8, 0, 50, 1, 'px'] @var range bg_invert 'App: Image inversion ' [0, 0.0, 1, 0.1] +@var checkbox chat_b_img 'Chat: Blur img/videos ' 0 + @var checkbox chat_bg 'Chat: Show bg image ' 1 @var text chat_image 'Chat: Custom image URL' url('/img/bg-chat-tile_8a055527b27b887521a9f084497d8879.png') @var range chat_bg_o 'Chat: Bg image opacity' [0.1, 0.0, 1, 0.01] @@ -894,6 +896,29 @@ div > div:nth-child(3) span { c: fg } } } + /// Feat -> Blur img/videos. + if ( chat_b_img == 1 ) { + [style *= 'height'] { + > img, > div[style], video { + transition: 500ms ease; + transition-delay: 0ms; + filter: blur(16px) grayscale(100%); + &:hover { + transition-delay: 500ms; + filter: none i; + } + } + /// HACK: Reset blur for videos. + &[style *= 'width'] > div:first-child:hover ~ div { + > video { + transition-delay: 500ms; + filter: none i; + } + } + /// HACK: Reset img timestamp wrapper. + img[src] + div { pointer-events: none } + } + } } // Main -> Chat message bubbles. From 84153918c8364c8459f9ceeccfd8edbcff5926f5 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 14 Oct 2019 23:56:23 +0200 Subject: [PATCH 104/295] feat: add an option to blur contacts --- wa.user.styl | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index f8756b38..e38f5c78 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -28,6 +28,7 @@ @var range bg_blur 'App: Image blur size ' [8, 0, 50, 1, 'px'] @var range bg_invert 'App: Image inversion ' [0, 0.0, 1, 0.1] +@var checkbox chat_b_c 'Chat: Blur contacts ' 0 @var checkbox chat_b_img 'Chat: Blur img/videos ' 0 @var checkbox chat_bg 'Chat: Show bg image ' 1 @@ -666,6 +667,14 @@ c: ac 0 t; box-shadow: 0 1px bd; } + /// Feat -> Blur contacts. + if ( chat_b_c == 1 ) { + [style *= 'height'] > div > div[class] { + filter: blur(6px); + transition: filter 300ms ease; + &._3mMX1, &:hover { filter: blur(0px) } + } + } } // App -> Left -> Profile/Settings. From e5c2b2551f7d2fb5b618e9c7f78c8581b5e44a64 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 14 Oct 2019 23:57:28 +0200 Subject: [PATCH 105/295] feat: fix selectors for 'hide msg tails' option --- wa.user.styl | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index e38f5c78..a32e894e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -12,7 +12,6 @@ @var checkbox theme 'Old/new[custom] colors' 0 @var text ui_font 'Custom UI font ' ''font_name'' @var text radius 'Custom rounded corners' 4px -@var checkbox msg_tails 'Enable message tails ' 1 @var checkbox fullscreen 'Enable fullscreen mode' 0 @var range emoji_o 'Emoji: Default opacity' [0.8, 0.0, 1, 0.01] @@ -28,6 +27,8 @@ @var range bg_blur 'App: Image blur size ' [8, 0, 50, 1, 'px'] @var range bg_invert 'App: Image inversion ' [0, 0.0, 1, 0.1] +@var checkbox chat_msg_t 'Chat: Hide msg tails ' 0 + @var checkbox chat_b_c 'Chat: Blur contacts ' 0 @var checkbox chat_b_img 'Chat: Blur img/videos ' 0 @@ -948,9 +949,11 @@ background: none !important; } /// Feat -> Message tails. - if ( msg_tails != 1 ) { - rad: 7.5px !important; - &.tail > .tail-container { display: none } + if ( chat_msg_t == 1 ) { + .tail { + > div { rad: 7.5px !important; } + > .tail-container { display: none } + } } /// Date. [data-pre-plain-text] + div * { c: cm } From 7b888d1dca7c9da2f46a370525a4df0c4fa9c91c Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 17 Oct 2019 18:09:56 +0200 Subject: [PATCH 106/295] global: add class selector for typing indicator --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index a32e894e..7a518b9b 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -268,8 +268,8 @@ } } - /// Global -> Typing alert. - span[title *= 'typing']:not(#z) { c: ac } + /// Global -> Typing indicator. + span[title *= 'typing'], ._315-i { &:not(#z) { c: ac }} /// Global -> Checkboxes. ._1Zo-R { c: 0 bd hl } From 9f8d0f47e940536c42337022ebe1561a7310bdd7 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 17 Oct 2019 18:13:44 +0200 Subject: [PATCH 107/295] meta: update text for custom options --- wa.user.styl | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 7a518b9b..54a31aa8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -10,19 +10,19 @@ @preprocessor stylus @var checkbox theme 'Old/new[custom] colors' 0 -@var text ui_font 'Custom UI font ' ''font_name'' -@var text radius 'Custom rounded corners' 4px -@var checkbox fullscreen 'Enable fullscreen mode' 0 +@var text ui_font 'App: Custom UI font ' ''font_name'' +@var text radius 'App: Custom border rad' 4px +@var checkbox fullscreen 'App: Enable fullscreen' 0 @var range emoji_o 'Emoji: Default opacity' [0.8, 0.0, 1, 0.01] @var range emoji_r 'Emoji: Clip size ' [49, 48, 70, 1, '%'] -@var select app_image 'Custom app background ' { +@var select app_image 'App: Custom background' { 'Custom *': 'custom ', 'Default ': 'default ', 'None ': 'none ', } -@var text image_url 'Custom background link' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') +@var text image_url 'App: Custom bg link ' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') @var range bg_opacity 'App: Image opacity ' [0.5, 0.0, 1, 0.01] @var range bg_blur 'App: Image blur size ' [8, 0, 50, 1, 'px'] @var range bg_invert 'App: Image inversion ' [0, 0.0, 1, 0.1] From b1f358e87e75d213f7a04480e6100898fde10b95 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 17 Oct 2019 18:14:26 +0200 Subject: [PATCH 108/295] meta: code cosmetics for custom color options --- wa.user.styl | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 54a31aa8..2e33b18c 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -40,22 +40,22 @@ @var checkbox chat_left 'Chat: Align left msg ' 0 @var checkbox chat_right 'Chat: Align right msg ' 0 -@var color dark 'Color: Primary bg ' #292929 -@var color darken 'Color: Highlight bg ' #333333 -@var color darker 'Color: Secondary bg ' #424242 -@var color light 'Color: Primary fg ' #e6e6e6 -@var color lighter 'Color: Secondary fg ' #bababa -@var color accent 'Color: Accent ' #7289da -@var color yellow 'Color: Yellow ' #f0c674 -@var color orange 'Color: Orange ' #d98245 -@var color red 'Color: Red ' #a54242 -@var color magenta 'Color: Magenta ' #b294bb -@var color violet 'Color: Violet ' #85678f -@var color blue 'Color: Blue ' #54738c -@var color cyan 'Color: Cyan ' #5e8d87 -@var color green 'Color: Green ' #7b823a -@var color white 'Color: White ' #ffffff -@var color shadow 'Color: Shadow ' #00000010 +@var color dark 'Color: Primary background ' #292929 +@var color darken 'Color: Highlight background ' #333333 +@var color darker 'Color: Secondary background ' #424242 +@var color light 'Color: Primary foreground ' #e6e6e6 +@var color lighter 'Color: Secondary foreground ' #bababa +@var color accent 'Color: Accent ' #7289da +@var color yellow 'Color: Yellow ' #f0c674 +@var color orange 'Color: Orange ' #d98245 +@var color red 'Color: Red ' #a54242 +@var color magenta 'Color: Magenta ' #b294bb +@var color violet 'Color: Violet ' #85678f +@var color blue 'Color: Blue ' #54738c +@var color cyan 'Color: Cyan ' #5e8d87 +@var color green 'Color: Green ' #7b823a +@var color white 'Color: White ' #ffffff +@var color shadow 'Color: Shadow ' #00000010 ==/UserStyle== */ @-moz-document domain('web.whatsapp.com') { From 01b31edd0a2a2ec5270ec89b990d15e4a13ba7e7 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 19 Oct 2019 23:32:17 +0200 Subject: [PATCH 109/295] chat: fix for messages that have overriden tails --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 2e33b18c..7417b03e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -951,8 +951,8 @@ /// Feat -> Message tails. if ( chat_msg_t == 1 ) { .tail { - > div { rad: 7.5px !important; } - > .tail-container { display: none } + > div { rad: 7.5px i } + .tail-container { display: none } } } /// Date. From 1b2ad9e370a314bbc468aa85509f4e6ccd15f1f9 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 19 Oct 2019 23:53:39 +0200 Subject: [PATCH 110/295] chat: fix alert from groups you're not a part of --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 7417b03e..e82e9979 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1133,5 +1133,7 @@ } } } + /// Alerts -> Not a group participant. + ._26pkE { c: cm } } } From 5241ba3bd6f63fd4c0d4219b91a28405582169c6 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 19 Oct 2019 23:55:01 +0200 Subject: [PATCH 111/295] chat: fix media that supports rich-embeds --- wa.user.styl | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index e82e9979..f7e9711e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -929,6 +929,23 @@ img[src] + div { pointer-events: none } } } + /// Chat -> Documents. + /._1mrMQ { + c: 0 0 bg; + /// Stats. + /._1o0MN { c: cm } + } + /// Embeds -> Background. + /.HNuTV, /._3qblR, /._1SsXF { + c: 0 0 bg; + } + /// Embeds -> Thumbnail. + /._3_nIn { c: 0 0 #55555510 } + /// Embeds -> Text. + /a[href][target = '_blank'], /._2Lp2x { + > * { c: cm } + > :first, > :last { &-child { c: fg }} + } } // Main -> Chat message bubbles. From 9051493532b14b10070024f5827dd99d2c7dff00 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 19 Oct 2019 23:59:12 +0200 Subject: [PATCH 112/295] right: fix the selected media/links/docs header --- wa.user.styl | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index f7e9711e..938db6f7 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -806,7 +806,13 @@ /// Search -> Msg content/date. span[title] > span[dir] { c: fg } ._0LqQ { c: cm } - /// Media/Links/Docs. + /// Media/Links/Docs -> Selected header. + .yrOIH { + c: 0 0 bg; + box-shadow: 0 1px bd; + span { c: fg } + } + /// Media/Links/Docs -> Content. [data-active-tab] { border-bottom: 1px solid bd; c: 0 0 t; From fc500cbd498792d37bb96cdb8026821e90c36ae3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 19 Oct 2019 23:59:33 +0200 Subject: [PATCH 113/295] right: fix text color for broadcast info header --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 938db6f7..af9e76a7 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -696,6 +696,8 @@ .kyJvR { height: 58px; c: fg; + /// Broadcast list info. + ._6xQdq { c: fg } } } /// Highlighted sections. From 4d4c93dd9efaf173fc57bf720556c3506d1a79a9 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 21 Oct 2019 23:54:17 +0200 Subject: [PATCH 114/295] chore: update text for old/custom colors toggle --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index af9e76a7..aaee0b30 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -9,7 +9,7 @@ @license MIT @preprocessor stylus -@var checkbox theme 'Old/new[custom] colors' 0 +@var checkbox theme 'Old/custom colorscheme' 0 @var text ui_font 'App: Custom UI font ' ''font_name'' @var text radius 'App: Custom border rad' 4px @var checkbox fullscreen 'App: Enable fullscreen' 0 From ec7a0bbea1c41871c2e3d5d305ae99908ba5a03f Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 21 Oct 2019 23:59:16 +0200 Subject: [PATCH 115/295] chat: fix styles for reply section --- wa.user.styl | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index aaee0b30..bd25f52e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -547,6 +547,7 @@ &:last-child { fill: ac } } /// Message status. + &[data-icon *= '-check'] path { v: cm } &[data-icon *= '-dblcheck'] path { v: cm } &[data-icon *= '-dblcheck-ack'] path { v: blue } /// Report contact. @@ -1160,5 +1161,26 @@ } /// Alerts -> Not a group participant. ._26pkE { c: cm } + /// Reply. + ._1ebw2 { + c: 0 0 bg; + box-shadow: bsh, inset 0 1px bd i; + /// Content. + > div:first-child { + margin: 0 0 5px 10px !important; + c: 0 0 t; + > div { c: 0 0 hl } + } + /// Close button. + div:last-child { + position: relative; + margin: 0 8px 5px 8px !important; + c: 0 0 t; + svg { + padding: 18px; + border-radius: 6px; + } + } + } } } From 12227e47dc213fe6c78ed750cb8ce01ecc2b9aca Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 24 Oct 2019 00:12:57 +0200 Subject: [PATCH 116/295] chat: fix conflicts with blur img/videos option --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index bd25f52e..7a72b386 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -917,7 +917,7 @@ } /// Feat -> Blur img/videos. if ( chat_b_img == 1 ) { - [style *= 'height'] { + [class *= 'message-'] [style *= 'height'] { > img, > div[style], video { transition: 500ms ease; transition-delay: 0ms; From a0ca82adf1021805002bff6f0b3b593cff539aaa Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 24 Oct 2019 00:14:38 +0200 Subject: [PATCH 117/295] modals: tweak colors and fix media selection area --- wa.user.styl | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 7a72b386..4c592271 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -376,7 +376,7 @@ &::before { content: ''; z-index: -1; - opacity: 0.96; + opacity: 0.81; position: absolute; top: 0; right: 0; bottom: 0; left: 0; c: 0 0 bg; @@ -397,7 +397,7 @@ } /// Text. .X5OiD { c: 0 0 bd } - .JmH7x { c: cm } + ._3qb2N, .JmH7x { c: cm } ._2yVvV { c: fg } /// Buttons. [role = 'button'] { @@ -492,7 +492,7 @@ } // Global -> Media selection. - ._2AP3i { + ._2n0jo { c: 0 bd bg; /// Item reset. ._1LdNS { From fb076bacecc6de3637c4cf7c5ed40991515ebb0a Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 27 Oct 2019 23:59:32 +0100 Subject: [PATCH 118/295] icons: add one-tick message status icon --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index 4c592271..ed0ebc3d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -550,6 +550,7 @@ &[data-icon *= '-check'] path { v: cm } &[data-icon *= '-dblcheck'] path { v: cm } &[data-icon *= '-dblcheck-ack'] path { v: blue } + &[data-icon *= 'check'] path { fill-opacity: 1 i } /// Report contact. &[data-icon = 'thumbs-down'] { path { v: orange } From f6b6771f7e734f04db467b09a044fb552489018b Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 27 Oct 2019 23:59:57 +0100 Subject: [PATCH 119/295] main: add styles for upload preview --- wa.user.styl | 35 +++++++++++++++++++++++++++++++++++ 1 file changed, 35 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index ed0ebc3d..cfbc2ebd 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1083,6 +1083,41 @@ } } + // Main -> Upload preview. + ._1BdTk, ._1cJw0, .kqC9O { + border-left: 1px solid bd; + c: 0 0 bg; + header { + border-bottom: 1px solid bd; + c: fg 0 hl; + } + /// Input. + .Am8s6 { c: cm } + ._3ogpF { c: 0 ac } + /// Footer. + > div[tabindex] > span:nth-child(2) { + border-top: 1px solid bd; + c: 0 0 hl; + } + /// Buttons. + [role = 'button'] { + + ._2sn3C { c: 0 0 hl } + /// Send. + &._1g8sv { + c: 0 0 ac; + box-shadow: bsh; + transition: 0.15s ease; + &:hover { opacity: 0.75 } + } + /// Add file. + &[style *= 'opacity'] { + c: ac 0 bg; + box-shadow: inner; + &::after { c: 0 0 ac } + } + } + } + // Main -> Chat input. #main > footer { c: 0 0 t; From 494d84dd018c3820d647eafa73d8ed5d44724221 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 27 Oct 2019 23:59:58 +0100 Subject: [PATCH 120/295] global: fix emoji menu popout --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index cfbc2ebd..cac169cd 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -340,6 +340,7 @@ } /// Global -> Emoji picker popout. + // ._342qq._1mTBR { ._342qq { rad: r !important; box-shadow: bsh; From b120b9e98f168d006d20d4a777a0df8290c63248 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 28 Oct 2019 23:53:40 +0100 Subject: [PATCH 121/295] chat: add group mention popout --- wa.user.styl | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index cac169cd..67019a68 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1219,5 +1219,16 @@ } } } + /// Mention popout. + ._2j-wI { + c: 0 bd bg; + box-shadow: 0 -1px bd i; + &::before { content: none } + .XSeqj { + c: fg bd bg; + &._1Yz8K, &:hover { c: 0 0 hl } + } + ._3SW-z { c: cm } + } } } From edfa9c3d10d10b40912f164fa96920b70d4855bb Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 28 Oct 2019 23:55:40 +0100 Subject: [PATCH 122/295] icons: remove icon colors from 'select msg' mode --- wa.user.styl | 4 ---- 1 file changed, 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 67019a68..d21c3a40 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -561,10 +561,6 @@ &[data-icon = 'miss'] { path { v: red } } - /// Icons in 'select messages' mode. - &[data-icon = 'delete'] path { v: red } - &[data-icon = 'forward'] path { v: green } - &[data-icon = 'star-btn'] path { v: yellow } } // Global -> Context menu. From 8020fbeb7fafaf0bee69dd8998d9faaed6d86ef1 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 28 Oct 2019 23:58:48 +0100 Subject: [PATCH 123/295] chat: tweak colors for 'select msg' mode --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index d21c3a40..e6816094 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -881,12 +881,12 @@ c: 0 bd; /// Chat -> Select messages. &._2AqZl { - c: 0 0 hl; + c: 0 0 t; /// Selected messages. .qTFAl { &:hover, &._3Z2tD { opacity: 0.5 !important; - c: 0 0 bd; + c: 0 0 hl; } } /// Checkboxes. From 7e304219cfd4c5274a6c0b18d05af7929ae90a72 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 28 Oct 2019 23:59:12 +0100 Subject: [PATCH 124/295] chore: minor refactor for !important rules --- wa.user.styl | 24 +++++++++++------------- 1 file changed, 11 insertions(+), 13 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index e6816094..c32bec5a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -327,7 +327,7 @@ /// Global -> Emojis. .emojik { clip-path: circle(var(--emoji-r)); - &:focus, &.selected { box-shadow: 0 0 0 2px ac !important } + &:focus, &.selected { box-shadow: 0 0 0 2px ac i } &:not(:hover):not(:focus):not(.selected) { filter: opacity(var(--emoji-o)); } @@ -342,7 +342,7 @@ /// Global -> Emoji picker popout. // ._342qq._1mTBR { ._342qq { - rad: r !important; + rad: r i; box-shadow: bsh; /// Header. ._2avTY { @@ -498,11 +498,11 @@ /// Item reset. ._1LdNS { &.cJP5q { - border: none !important; - transform: scale(1) !important; + border: none i; + transform: scale(1) i; outline: 4px solid ac; } - &:hover:not(.cJP5q):not(#spec) { outline: 4px solid ac !important } + &:hover:not(.cJP5q):not(#spec) { outline: 4px solid ac i } } } @@ -516,7 +516,7 @@ /// Animate-ish. &:hover > svg > path { opacity: 1; - fill-opacity: 0.9 !important; + fill-opacity: 0.9 i; } } /// Left -> Status icon. @@ -682,10 +682,9 @@ > div[class], > span > div[class], > div > div[class] { c: 0 0 bg; > header { - min-height: unset !important; - // &, > div { height: unset } - border-bottom: 1px solid bd; height: unset; + min-height: unset i; + border-bottom: 1px solid bd; c: 0 0 hl; /// NOTE: Reset text position. ._1pYs5 { @@ -885,7 +884,7 @@ /// Selected messages. .qTFAl { &:hover, &._3Z2tD { - opacity: 0.5 !important; + opacity: 0.5 i; c: 0 0 hl; } } @@ -1137,7 +1136,6 @@ rad: r; c: 0 bd hl; [style *= 'visibility'] { - // padding-top: 2px; c: cm; /// Hide input placeholder. ../ .focused > div[style] { c: t } @@ -1192,7 +1190,7 @@ } } } - /// Alerts -> Not a group participant. + /// Alerts -> Not a group participant. ._26pkE { c: cm } /// Reply. ._1ebw2 { @@ -1207,7 +1205,7 @@ /// Close button. div:last-child { position: relative; - margin: 0 8px 5px 8px !important; + margin: 0 8px 5px 8px i; c: 0 0 t; svg { padding: 18px; From 9bbac7c7eb40eafd7997db4f97dd6b2d9b27fb64 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 29 Oct 2019 23:45:19 +0100 Subject: [PATCH 125/295] global: apply avatar bg tweaks globally --- wa.user.styl | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index c32bec5a..8a7f7be9 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -647,7 +647,7 @@ /// Remove borders. &::after, > div:last-child { border: none } /// Avatar background. - [style *= 'height: 49px'] { c: 0 0 bd } + /[style *= 'height: 49px'] { c: 0 0 bd } /// Text. > div:last-child { /// Title/timestamp. @@ -737,7 +737,6 @@ .r7sRK { c: ac 0 hl } ._8-yzK { c: 0 0 t } ._2DxRd, ._2WP9Q { c: 0 t } - [style *= 'height: 49px'] { c: 0 0 bd } } } /// New chat. From 94ad330b128791a78b19eb7422cab7f2c2aedd91 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 29 Oct 2019 23:51:32 +0100 Subject: [PATCH 126/295] left: tweak borders for new group/chat sections --- wa.user.styl | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 8a7f7be9..2a7fd582 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -708,7 +708,6 @@ } /// Settings -> User info section. ._2UaNq { - border-bottom: 1px solid bd; c: 0 0 t; &::after { content: none } [style *= 'height: 82px'] { c: 0 0 t } @@ -734,7 +733,10 @@ /// Resets for contacts. + ._1c8mz { c: 0 0 t; - .r7sRK { c: ac 0 hl } + .r7sRK { + c: ac 0 t; + /.r7sRK:not(#z) { box-shadow: inset 0 1px bd i } + } ._8-yzK { c: 0 0 t } ._2DxRd, ._2WP9Q { c: 0 t } } From 57ce990e97a37696e266b7a67534028283c8b0c2 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 29 Oct 2019 23:57:50 +0100 Subject: [PATCH 127/295] right: add styles for default avatar bg/loader --- wa.user.styl | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 2a7fd582..678f9b10 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -561,6 +561,8 @@ &[data-icon = 'miss'] { path { v: red } } + /// Default avatar loader. + /svg[width = '50'][height = '50'] > circle[fill] { stroke: cm } } // Global -> Context menu. @@ -767,7 +769,11 @@ ._1C9rS .copyable-area { border-left: 1px solid bd; /// Avatar. - [style *= 'height: 200px'] { c: 0 0 bd } + [style *= 'height: 200px'] { + c: 0 0 bd; + /// Default avatar. + ._2EaHs { c: 0 0 hl } + } ._1drsQ { c: fg } ._2IwIk { c: cm } /// Buttons. From 4d32c9872a957a956da41b84bfc15999df053d62 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 29 Oct 2019 23:59:50 +0100 Subject: [PATCH 128/295] modals: fix header bg when viewing user avatars --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 678f9b10..f412547e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -383,7 +383,7 @@ c: 0 0 bg; } /// Header. - > .cGLoy { + > .cGLoy, .s4BtI { c: 0 0 bg; box-shadow: 0 1px bd; div { c: 0 0 t } From a052a3a9285e286898b33001d71c2f23b8e748a7 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 30 Oct 2019 23:46:10 +0100 Subject: [PATCH 129/295] right: fix padding for group description --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index f412547e..9282ccef 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -787,6 +787,7 @@ ._2ZVEo { padding: 14px 15px 10px } ._2k1Z5 { padding: 14px 15px 4px } ._3EN0l { padding: 14px 15px } + .ujWpH { padding: 14px 15px } ._2nQ7u, ._1goQ0 { padding: 0 } ._2LSbZ._2j5ir { margin-bottom: unset } ._1tyVr { From 8841c6a944161be9c3d7685bbbb678c2c47cb99d Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 30 Oct 2019 23:46:48 +0100 Subject: [PATCH 130/295] global: let matched-text apply everywhere --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 9282ccef..4a17c739 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -640,7 +640,7 @@ [style *= 'z-index'] > div > div[class] { c: 0 0 t; box-shadow: 0 1px bd; - .matched-text { c: ac } + /.matched-text:not(#z) { c: ac } /// Active states. &:hover, &._3mMX1 { c: 0 0 hl; From 0e9c3fcfcbef872d2cf678cbbb3e95160c814992 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 30 Oct 2019 23:50:03 +0100 Subject: [PATCH 131/295] chore: small code cleanup --- wa.user.styl | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 4a17c739..aa43386e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -111,7 +111,7 @@ --changes : 'See the PR at: https://github.com/vednoc/onyx/pull/38'; } - // * Use stylus-lang variables with CSS variables. + // Use stylus-lang variables with CSS variables. bg = var(--dark); hl = var(--darken); bd = var(--darker); @@ -386,7 +386,9 @@ > .cGLoy, .s4BtI { c: 0 0 bg; box-shadow: 0 1px bd; + /// Remove unnecessary background. div { c: 0 0 t } + /// Text. .xD91K { c: cm } ._3H4MS { c: fg } } @@ -424,7 +426,7 @@ c: 0 0 bg; box-shadow: 0 4px 8px 2px sh; ._13HPh { c: fg } - /// Forward message to... + /// 'Forward message' popout. ._1KDYa { c: 0 0 t; header { c: fg 0 hl } @@ -449,7 +451,7 @@ } } - // * Global -> Status. + // Global -> Status. [data-animate-status-v3-modal-background='true'] { c: 0 0 t; /// Backdrop. @@ -561,7 +563,7 @@ &[data-icon = 'miss'] { path { v: red } } - /// Default avatar loader. + /// Right -> Default avatar loader. /svg[width = '50'][height = '50'] > circle[fill] { stroke: cm } } @@ -705,7 +707,7 @@ c: 0 0 t; box-shadow: none; ._3he1q { c: ac } - ._3K9Sw { c: 0 bd } + ._3K9Sw { c: 0 t } ._5UNoc ._3hnO5 { c: 0 ac } } /// Settings -> User info section. @@ -775,7 +777,7 @@ ._2EaHs { c: 0 0 hl } } ._1drsQ { c: fg } - ._2IwIk { c: cm } + ._2IwIk, ._1goQ0 { c: cm } /// Buttons. ._3_-Si { padding: 0 15px; From 938a1e4babefbcb9bc5965b9113ed343e48edbd8 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 30 Oct 2019 23:55:41 +0100 Subject: [PATCH 132/295] global: re-use code for 'forward messaage' modal --- wa.user.styl | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index aa43386e..436316d8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -430,7 +430,6 @@ ._1KDYa { c: 0 0 t; header { c: fg 0 hl } - /// TODO: See if search/contacts can be re-used. .r7sRK { c: ac 0 t } ._2UaNq { c: fg 0 t } /// Footer. @@ -711,10 +710,12 @@ ._5UNoc ._3hnO5 { c: 0 ac } } /// Settings -> User info section. - ._2UaNq { + /._2UaNq { c: 0 0 t; - &::after { content: none } + &::after { content: none i } + &:hover:not(#z):not(#x) { c: 0 0 hl } [style *= 'height: 82px'] { c: 0 0 t } + ._2WP9Q { border-top: none i } /// Nick/info. ._3H4MS { c: fg } .xD91K { c: cm } From 9675a9546812591dee2175de9726e7e78a52ebeb Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 31 Oct 2019 23:52:14 +0100 Subject: [PATCH 133/295] chat: resolve conflicts for messages loader --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 436316d8..cef2aab4 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -864,7 +864,7 @@ > div:nth-child(2) > div:nth-child(2) span[title] { c: cm } } /// Chat -> Loader. - [title *= 'load']:not(a) { + ._2sOZc { c: 0 0 hl; box-shadow: inner, bsh; svg circle { stroke: green } From c702a9fb888eaa0e650785d310d1c69a398b6ff5 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 2 Nov 2019 23:55:46 +0100 Subject: [PATCH 134/295] chat: fix msg tails for stickers in specific cases --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index cef2aab4..2dbd9088 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1008,7 +1008,7 @@ } /// Fix bubble radius. if ( msg_tails != 1 ) { - ._2Hp95._1X6iJ ._3Mf7Z { rad: 7.5px } + :not(.tail) > div > ._2Hp95._1X6iJ ._3Mf7Z { rad: 7.5px } } } /// Context menu -> Images and forwarded messages. From 423a3c02e37a1f8e09a8e8bb56df59cac6e5c640 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 2 Nov 2019 23:58:32 +0100 Subject: [PATCH 135/295] right: fix styles for starred messages header --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 2dbd9088..4e0509b3 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -817,6 +817,12 @@ /// Search -> Msg content/date. span[title] > span[dir] { c: fg } ._0LqQ { c: cm } + /// Starred messages header. + header._3jHKU { + height: 59px; + c: 0 0 hl; + box-shadow: inset 0 -1px bd; + } /// Media/Links/Docs -> Selected header. .yrOIH { c: 0 0 bg; From 10fd7b9484133de5de22c75a8643b13618f1d036 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 2 Nov 2019 23:59:05 +0100 Subject: [PATCH 136/295] chat: tweak things for msg replies --- wa.user.styl | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 4e0509b3..b2e5594c 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1214,15 +1214,15 @@ c: 0 0 bg; box-shadow: bsh, inset 0 1px bd i; /// Content. - > div:first-child { - margin: 0 0 5px 10px !important; + > div:first-child:not(#z) { + margin-bottom: 5px i; c: 0 0 t; - > div { c: 0 0 hl } + div[role] { c: 0 0 hl } + /.quoted-mention { c: cm } } /// Close button. div:last-child { position: relative; - margin: 0 8px 5px 8px i; c: 0 0 t; svg { padding: 18px; From 87ce54c14243b5c1e3d99bf1b78141b133574d01 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 8 Nov 2019 17:55:14 +0100 Subject: [PATCH 137/295] feat: add transparent emoji images Part of #59. Finally. --- wa.user.styl | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index b2e5594c..d13fdf2b 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -14,6 +14,7 @@ @var text radius 'App: Custom border rad' 4px @var checkbox fullscreen 'App: Enable fullscreen' 0 +@var checkbox emoji_t 'Emoji: Transparent img' 1 @var range emoji_o 'Emoji: Default opacity' [0.8, 0.0, 1, 0.01] @var range emoji_r 'Emoji: Clip size ' [49, 48, 70, 1, '%'] @@ -326,7 +327,6 @@ /// Global -> Emojis. .emojik { - clip-path: circle(var(--emoji-r)); &:focus, &.selected { box-shadow: 0 0 0 2px ac i } &:not(:hover):not(:focus):not(.selected) { filter: opacity(var(--emoji-o)); @@ -337,6 +337,17 @@ filter: opacity(calc(var(--emoji-o) - 0.3)); } } + /// Feat -> Transparent emoji images. + if ( emoji_t == 1 ) { + images = 'https://raw.githubusercontent.com/vednoc/wae/master/i' + for i in 0..101 { + &.wa.b{i} { + background-image: url(s('%s/%s.webp', unquote(images), i)) + } + } + } else { + clip-path: circle(var(--emoji-r)); + } } /// Global -> Emoji picker popout. From 058ed064111db1b31f4b879c5d0c41f190778dd9 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 10 Nov 2019 11:16:40 +0100 Subject: [PATCH 138/295] feat: add iOS emoji images Work for #61. --- wa.user.styl | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index d13fdf2b..08e60bd5 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -339,10 +339,17 @@ } /// Feat -> Transparent emoji images. if ( emoji_t == 1 ) { - images = 'https://raw.githubusercontent.com/vednoc/wae/master/i' + images = 'https://raw.githubusercontent.com/vednoc/wae/dev' + /// Android emojis. for i in 0..101 { &.wa.b{i} { - background-image: url(s('%s/%s.webp', unquote(images), i)) + background-image: url(s('%s/a/%s.webp', unquote(images), i)) + } + } + /// iOS emojis. + for i in 0..100 { + &.apple.b{i} { + background-image: url(s('%s/i/%s.webp', unquote(images), i)) } } } else { From d3b631bfdb58d5245ffff1175b2ebcf441476374 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 10 Nov 2019 23:52:26 +0100 Subject: [PATCH 139/295] chat: add styles for a shared contact embed --- wa.user.styl | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 08e60bd5..68d6d78f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -987,6 +987,17 @@ > * { c: cm } > :first, > :last { &-child { c: fg }} } + /// Embeds -> Shared contact. + ._1ikYm { + div[style *= 'base64'] { filter: none i } + ._2LRBk { c: fg } + ._3fnHB { c: cm } + ._1PENu { c: 0 bg } + [role = 'button'] { + c: ac; + &:hover { opacity: 0.8 } + } + } } // Main -> Chat message bubbles. From 12f82e7da0ae4e3964a7697571fa98d034aa0abc Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 10 Nov 2019 23:53:58 +0100 Subject: [PATCH 140/295] left: fix highlight for starred/archived message --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 68d6d78f..10f4f208 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -780,7 +780,7 @@ c: 0 0 bd; } &::after { content: none } - &._1lakC, &._2nA3s { c: 0 0 hl } + &._1lakC, &._2nA3s, &._2V_Wj { c: 0 0 hl } ._2V2qB, .jLybP::before { c: cm } } } From 4ab8fb68b0073cc7ac64f96a5723896e3baf88dd Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 10 Nov 2019 23:58:45 +0100 Subject: [PATCH 141/295] left: reset tails and bubbles --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 10f4f208..79eccc88 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -782,6 +782,11 @@ &::after { content: none } &._1lakC, &._2nA3s, &._2V_Wj { c: 0 0 hl } ._2V2qB, .jLybP::before { c: cm } + /// Reset tails. + .tail { + &, > div[class] { rad: 7.5px i } + &-container { display: none i } + } } } } From 6fbe6aad55f63d6feadea933a06149f9b547257e Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 11 Nov 2019 23:49:03 +0100 Subject: [PATCH 142/295] left: fix selectors for typing indicator --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 79eccc88..9b4a77b8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -269,8 +269,8 @@ } } - /// Global -> Typing indicator. - span[title *= 'typing'], ._315-i { &:not(#z) { c: ac }} + /// Left -> Typing indicator. + span[title *= 'typing...'], ._2ZAIy { c: ac } /// Global -> Checkboxes. ._1Zo-R { c: 0 bd hl } From 01a4ebac4f961592233a57c8018667a6199277d5 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 11 Nov 2019 23:49:41 +0100 Subject: [PATCH 143/295] chat: tweak context menu for msg with images --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 9b4a77b8..53ad8b6e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1095,6 +1095,8 @@ } /// Stickers. &._2PpWQ > div[style *= 'opacity'] { c: 0 0 left } + /// Images. + &._20WGU { background: linear-gradient(30deg, t 65%, #44444455 120%) i } } /// Replies. ._2HTIU { c: 0 0 right } @@ -1122,6 +1124,8 @@ } /// Stickers. &._2PpWQ div[style *= 'opacity'] { c: 0 0 right } + /// Images. + &._20WGU { background: linear-gradient(30deg, t 65%, #44444455 120%) i } } /// Replies. ._2HTIU { c: 0 0 left } From cd03030ec0c4501853065a49450fea439fcb1d4a Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 11 Nov 2019 23:57:01 +0100 Subject: [PATCH 144/295] chat: fix styles for deleted message --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 53ad8b6e..ef6683f0 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -951,6 +951,11 @@ div > div:nth-child(2) span { c: cm } div > div:nth-child(3) span { c: fg } } + /// Deleted message. + ._3uHCS { + c: cm; + [data-icon] path { fill: cm } + } } /// Feat -> Blur img/videos. if ( chat_b_img == 1 ) { From 5bf6032868276cd3a755ef2f8a0fb148926b9476 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 11 Nov 2019 23:59:23 +0100 Subject: [PATCH 145/295] chat: fix link embed background in reply section --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index ef6683f0..11e5d1e6 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1259,7 +1259,7 @@ /// Content. > div:first-child:not(#z) { margin-bottom: 5px i; - c: 0 0 t; + c: 0 0 hl; div[role] { c: 0 0 hl } /.quoted-mention { c: cm } } From 8e076eabbbfc9edb8a8510b857b4df28fafbc6a4 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 12 Nov 2019 23:40:34 +0100 Subject: [PATCH 146/295] chat: be more specific about reply's close button --- wa.user.styl | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 11e5d1e6..02527f24 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1267,8 +1267,9 @@ div:last-child { position: relative; c: 0 0 t; - svg { - padding: 18px; + /// Add clickable whitespace. + [role = 'button'] > span > svg { + padding: 16px; border-radius: 6px; } } From 20eaeccff49f6b2b3b93c0d7aa9346991274ac3d Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 12 Nov 2019 23:46:21 +0100 Subject: [PATCH 147/295] feat: add options to choose custom bubble colors Closes #60. --- wa.user.styl | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 02527f24..b44671be 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -30,6 +30,17 @@ @var checkbox chat_msg_t 'Chat: Hide msg tails ' 0 +@var select chat_b_l 'Chat: Left bubble bg ' { + 'Default *': 'default ', + 'Custom ': 'custom ', +} +@var color b_l_bg 'Chat: Left bubble custom bg ' #222730 +@var select chat_b_r 'Chat: Right bubble bg ' { + 'Default *': 'default ', + 'Custom ': 'custom ', +} +@var color b_r_bg 'Chat: Right bubble custom bg' #1f232a + @var checkbox chat_b_c 'Chat: Blur contacts ' 0 @var checkbox chat_b_img 'Chat: Blur img/videos ' 0 @@ -1012,8 +1023,10 @@ // Main -> Chat message bubbles. .message { - left = bd; - right = hl; + /// Feat -> Custom bubble colors. + ( chat_b_l == 'default' ) ? left = bd : left = b_l_bg; + ( chat_b_r == 'default' ) ? right = hl : right = b_r_bg; + /// Global bubble styles. &-in, &-out { /// Fix shadows. > div:not(.a81-s) { From 47b7a171aede9c5b6196bbbbc8bfd5d49d5300cb Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 12 Nov 2019 23:58:00 +0100 Subject: [PATCH 148/295] feat: add an option to set custom app max-width --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index b44671be..879d20db 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -13,6 +13,7 @@ @var text ui_font 'App: Custom UI font ' ''font_name'' @var text radius 'App: Custom border rad' 4px @var checkbox fullscreen 'App: Enable fullscreen' 0 +@var text app_width 'App: Custom max-width ' 1396px @var checkbox emoji_t 'Emoji: Transparent img' 1 @var range emoji_o 'Emoji: Default opacity' [0.8, 0.0, 1, 0.01] @@ -103,6 +104,8 @@ --t : transparent; --bshadow : 0 2px 4px var(--shadow); + --app-width : app_width; + --emoji-o : emoji_o; --emoji-r : emoji_r; @@ -325,6 +328,8 @@ border: 1px solid bd; rad: r; box-shadow: bsh; + /// Feat -> Custom max-width. + width: var(--app-width); /// Feat -> Fullscreen mode. if ( fullscreen == 1 ) { rad: 0; From 1ff007ada900a1eac12e8e584c63127608796a85 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 12 Nov 2019 23:58:19 +0100 Subject: [PATCH 149/295] right: fix header text color for starred messages --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index 879d20db..08e2b04d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -861,6 +861,7 @@ height: 59px; c: 0 0 hl; box-shadow: inset 0 -1px bd; + div { c: fg } } /// Media/Links/Docs -> Selected header. .yrOIH { From 64425e519e1a7227bfcdce3b05662ee461c50df3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 13 Nov 2019 00:17:46 +0100 Subject: [PATCH 150/295] chat: use left/right helper for sticker timestamps --- wa.user.styl | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 08e2b04d..da242ed5 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1066,8 +1066,8 @@ } /// Date. ._3qAvH { - c: cm 0 hl; - // box-shadow: inner !important; + c: cm; + box-shadow: 0 1px sh i; div { color: inherit } } /// Fix bubble radius. @@ -1100,6 +1100,8 @@ &-in { /// Not stickers. > div:not(.a81-s) > div { c: fg 0 left } + /// Stickers -> Timestamp. + > div.a81-s ._3qAvH { c: 0 0 left } /// Reset tails. .tail { border-top-left-radius: 0 i; @@ -1131,6 +1133,8 @@ &-out { /// Not stickers. > div:not(.a81-s) > div { c: fg 0 right } + /// Stickers -> Timestamp. + > div.a81-s ._3qAvH { c: 0 0 right } /// Reset tails. .tail { border-top-right-radius: 0 i; From 53cd00a263482654005ff3b0bf46143a55cca028 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 13 Nov 2019 00:19:03 +0100 Subject: [PATCH 151/295] icons: add styles for sticker-placeholder element --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index da242ed5..df2bdee4 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -598,6 +598,11 @@ } /// Right -> Default avatar loader. /svg[width = '50'][height = '50'] > circle[fill] { stroke: cm } + /// Chat -> Sticker bg. + &[data-icon = 'sticker-placeholder'] > svg > path { + fill: bd; + fill-opacity: 0.6; + } } // Global -> Context menu. From 735d4fd411aa6966fbddf2539b6bebf0171cccd2 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 13 Nov 2019 00:42:34 +0100 Subject: [PATCH 152/295] chat: add timestamp background tweak for videos --- wa.user.styl | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index df2bdee4..75cc1f53 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1094,12 +1094,25 @@ } /// Search -> Selected message. > .velocity-animating * { c: ac } - /// Images. + /// Images -> Timestamp. div[style *= 'width'][style *= 'height'] + div[class] { - padding: 3px 7px; + padding: 2px 5px; rad: 7.5px; c: 0 0 hl; } + /// Videos -> Timestamp. + .video-thumb { + ._3_IKd { + padding: 2px 5px; + rad: 7.5px; + c: fg 0 bg; + } + + div > ._3MYI2 { + padding: 2px 5px; + rad: 7.5px; + c: fg 0 bg; + } + } } /// Left. &-in { From 69db15c275c2be34e7eef2efbcfe98f72e76f4d4 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 13 Nov 2019 00:44:10 +0100 Subject: [PATCH 153/295] chat: reset image blur for audio msg avatars --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 75cc1f53..cdb16e2c 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -998,6 +998,8 @@ filter: none i; } } + /// HACK: Reset blur for audio msg avatars. + &[style *= 'width'] > img.jZhyM { filter: none i } /// HACK: Reset img timestamp wrapper. img[src] + div { pointer-events: none } } From d9c44569a224e37a0980c726ff9a5e218071e95f Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 13 Nov 2019 00:45:27 +0100 Subject: [PATCH 154/295] chat: tweak background colors for embedded links --- wa.user.styl | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index cdb16e2c..dd177a7a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -968,7 +968,6 @@ } /// Rich embeds. ._1SsXF { - c: 0 0 sh; div > div:nth-child(1) span { c: fg } div > div:nth-child(2) span { c: cm } div > div:nth-child(3) span { c: fg } @@ -1145,7 +1144,7 @@ &._20WGU { background: linear-gradient(30deg, t 65%, #44444455 120%) i } } /// Replies. - ._2HTIU { c: 0 0 right } + ._2HTIU { c: 0 0 bg } /// Feat -> Align left bubble. if ( chat_left == 1 ) { justify-content: flex-end } } @@ -1176,7 +1175,7 @@ &._20WGU { background: linear-gradient(30deg, t 65%, #44444455 120%) i } } /// Replies. - ._2HTIU { c: 0 0 left } + ._2HTIU { c: 0 0 bg } /// Feat -> Align right bubble. if ( chat_right == 1 ) { justify-content: flex-start } } From 55affddc090903e28d784461af71477b16a6103e Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 19 Nov 2019 23:54:09 +0100 Subject: [PATCH 155/295] meta: change author tag to use GitHub URL --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index dd177a7a..4e395b66 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -5,7 +5,7 @@ @homepageURL https://github.com/vednoc/onyx @supportURL https://github.com/vednoc/onyx/issues @version 1.9.9 -@author vednoc (https://gitlab.com/vednoc) +@author vednoc (https://github.com/vednoc) @license MIT @preprocessor stylus From 8e694befcd1035be5e9219dbbf270907bba7565f Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 19 Nov 2019 23:57:25 +0100 Subject: [PATCH 156/295] global: add styles for native select element --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 4e395b66..5bbe8b53 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -178,6 +178,10 @@ ::placeholder { c: cm } a { color: ac } strong { c: fg } + select { + c: fg bd; + /.Fzl83 { margin-right: 24px } + } /// Browser-specific resets. ::-moz-range { From bef9ac6bef7adcb558d121e56ab41828e5813209 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 19 Nov 2019 23:58:51 +0100 Subject: [PATCH 157/295] settings: fix text color for app version --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 5bbe8b53..1d7a766d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -813,6 +813,8 @@ &-container { display: none i } } } + /// Version info. + ._357v7 { c: fg } } } From 8b5dc847a4e427ca079a3a2b29103f8be3b3922e Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 19 Nov 2019 23:59:10 +0100 Subject: [PATCH 158/295] right: fix pane width and add reset for msg info --- wa.user.styl | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 1d7a766d..8d27f576 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -342,6 +342,8 @@ height: 100%; } } + /// Right -> Fix the width with three open panes. + &.three > ._37f_5 { width: calc(100% + 1px) } } } @@ -847,6 +849,12 @@ padding: 0 15px; width: auto; } + /// Right -> Message info reset. + &._1KDYa { + ._2UaNq:not(#z):not(#x) { + &:hover { c: 0 0 t } + } + } /// Message info -> Image. ._2rGVQ { border-bottom: 1px solid bd; From 4e16834e5d7139ab5121daa286fd583d87d74940 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 20 Nov 2019 19:55:03 +0100 Subject: [PATCH 159/295] chat: fix text color for forwarded msg indicator --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 8d27f576..571c093d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -970,6 +970,8 @@ div { c: 0 white } } } + /// Forwarded message. + /._8fE-g { c: cm } /// X unread messages. ._3Xx0y { c: fg bd hl; From de1839e3e874267d0b3a487f0d3d4b127b224764 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 20 Nov 2019 19:57:12 +0100 Subject: [PATCH 160/295] chat: make styles for shared contact embed global --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 571c093d..7287aabb 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1037,7 +1037,7 @@ > :first, > :last { &-child { c: fg }} } /// Embeds -> Shared contact. - ._1ikYm { + /._1ikYm { div[style *= 'base64'] { filter: none i } ._2LRBk { c: fg } ._3fnHB { c: cm } From 97ede266d0ccf5f73cb4352ad7cccf24fe79171a Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 20 Nov 2019 20:00:13 +0100 Subject: [PATCH 161/295] left: reset background for avatars in starred msg --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 7287aabb..70dc687d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -814,6 +814,10 @@ &, > div[class] { rad: 7.5px i } &-container { display: none i } } + /// Reset avatars. + [style *= 'height: 26px; width: 26px'] { + c: 0 0 t; + } } /// Version info. ._357v7 { c: fg } From 1464b9fce8c88873408d71225aa888a8ede3650c Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 21 Nov 2019 23:51:51 +0100 Subject: [PATCH 162/295] right: fix colors missing in search msg pane Fixes things reported in #60. --- wa.user.styl | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 70dc687d..0edd8701 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -871,10 +871,14 @@ } /// Read/Delivered section. ._2WP9Q { border: none } - /// Search -> Items. - [style] > div > ._2UaNq:hover { - c: 0 0 hl; - box-shadow: inset 0 1px bd; + /// Search -> Default message. + ._3dwyT { c: cm } + /// Search -> Items on hover. + [style]:not(#z):not(#x) > div > ._2UaNq { + &._3sA1g:hover, &._3mMX1 { + c: 0 0 hl; + box-shadow: 0 0 0 1px bd; + } } /// Search -> Msg content/date. span[title] > span[dir] { c: fg } From 5199674182bf93be5e56f69a9c0a1d3a382f35bc Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 21 Nov 2019 23:58:15 +0100 Subject: [PATCH 163/295] global: fix colors for loader in search msg pane --- wa.user.styl | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 0edd8701..7cdd9165 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -297,8 +297,11 @@ /// Global -> Active buttons. ._3j8Pd { &.GPmgF, &.GPmgf { c: 0 0 hl }} - /// Contacts -> Loader. - svg[width = '18'][height = '18'] circle { stroke: green } + /// Contacts/Search -> Loader. + svg[width = '18'][height = '18'], + svg[width = '20'][height = '20'] { + circle { stroke: green } + } /// Panes -> Change avatars. ._1JS2G { c: fg 0 #66666666 } From 4fa505c4e70f3f9cf8f6a6ac2d01b48898f36ca1 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 21 Nov 2019 23:59:33 +0100 Subject: [PATCH 164/295] global: add styles for 'archived chat' badges --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 7cdd9165..a8b1439c 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -413,6 +413,11 @@ } } + // Global -> Badges. + ._2WwbV { + c: cm bd bg; + } + /// Global -> Modals. .overlay { c: 0 0 t; From b440005279ded0378581bebf40092437f61e5685 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 21 Nov 2019 23:59:41 +0100 Subject: [PATCH 165/295] left: fix missing borders from some panes --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index a8b1439c..75a2f702 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -830,6 +830,8 @@ /// Version info. ._357v7 { c: fg } } + /// Left -> Add missing borders to some panes. + &._2t4Ic { border-right: 1px solid bd } } // App -> Right. From 8f9decfbeb75a44bc3cbee5109dbd91ed3c12925 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 00:12:22 +0100 Subject: [PATCH 166/295] global: fix selector conflict with emoji picker --- wa.user.styl | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 75a2f702..6709ddc7 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -383,8 +383,7 @@ } /// Global -> Emoji picker popout. - // ._342qq._1mTBR { - ._342qq { + ._342qq._1mTBR { rad: r i; box-shadow: bsh; /// Header. From 8daed72726c4c7e2fa416e48ac5b8e8c90bbffa8 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 00:18:02 +0100 Subject: [PATCH 167/295] left: fix missing border when three panes are open --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 6709ddc7..ed0a3d68 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -347,6 +347,8 @@ } /// Right -> Fix the width with three open panes. &.three > ._37f_5 { width: calc(100% + 1px) } + /// Left -> Add missing borders to some panes. + &.three ._2t4Ic { border-right: 1px solid bd } } } @@ -829,8 +831,6 @@ /// Version info. ._357v7 { c: fg } } - /// Left -> Add missing borders to some panes. - &._2t4Ic { border-right: 1px solid bd } } // App -> Right. From cf11714334576172a01a24b91ba37e051086d024 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 00:23:19 +0100 Subject: [PATCH 168/295] landing: fix 'keep me signed in' alert Work for #59. --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index ed0a3d68..db5fe820 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -233,6 +233,12 @@ c: 0 0 t; img { opacity: 0.3 } } + /// 'Keep me signed in' reported in #59. + ._152b1 { + c: white 0 ac; + box-shadow: bsh; + &::before { border-bottom-color: ac } + } } } From 26d25ee88218cb5eae156b03cbfc32f2d05c9da1 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 00:32:19 +0100 Subject: [PATCH 169/295] chat: fix styles in emoji race selection menu --- wa.user.styl | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index db5fe820..35b56ce5 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -643,6 +643,16 @@ padding: 10px; .Ijb1Q::after { box-shadow: 0 4px 8px sh } } + /// Emojis -> Race selection. + > ul._3z3lc { + > li:first-child { c: 0 bd } + + [data-animate-dropdown-nib] { + border-bottom: 1px solid bd; + border-right: 1px solid bd; + bottom: -8px; + c: 0 0 bg; + } + } } } From 3effa76520034c0535af4e8074867403c70560a1 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 00:39:01 +0100 Subject: [PATCH 170/295] chat: tweak opacity of icons in input area --- wa.user.styl | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 35b56ce5..78a02508 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1268,10 +1268,15 @@ // Main -> Chat input. #main > footer { c: 0 0 t; - /// Active emojis. - .-XQxp._1oNFt path { - fill-opacity: 1; - fill: ac; + /// Emoji/gif/sticker icons. + .-XQxp { + /// Overwrite defaults. @upstream + path { fill-opacity: 0.55 } + /// Active. + &._1oNFt path { + fill-opacity: 1; + fill: ac; + } } /// Emoji picker. ._2mlOb { From 0b7ec9591d57417a572e57aa54caa20fa08d8783 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 00:46:20 +0100 Subject: [PATCH 171/295] left: make the rule for msg content/date global --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 78a02508..94484e31 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -907,7 +907,7 @@ } /// Search -> Msg content/date. span[title] > span[dir] { c: fg } - ._0LqQ { c: cm } + /._0LqQ { c: cm } /// Starred messages header. header._3jHKU { height: 59px; From 7f631ade5e2d31ec53989c8f093868f8a90eb01f Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 00:50:05 +0100 Subject: [PATCH 172/295] chat: tweak the colors of system messages --- wa.user.styl | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 94484e31..e3cbe519 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -967,15 +967,16 @@ box-shadow: inner, bsh; svg circle { stroke: green } } - /// Chat -> System notes. + /// Chat -> System messages. .a7otO { opacity: 0.95; letter-spacing: 0; + font-weight: 600; text-shadow: none; - c: white 0 blue; + c: fg 0 hl; box-shadow: inset 0 -3px sh; - &.S-bQb { c: 0 0 orange } - &:not(.tail) { c: 0 0 green } + &.S-bQb { c: orange } + &:not(.tail) { c: green } } /// Chat -> Jump to new messages. ._3KRbU { From c796c59f4bf5582cb76ba87f67e9bee2d2a534b3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 18:56:07 +0100 Subject: [PATCH 173/295] chat: separate radius into el and input options --- wa.user.styl | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index e3cbe519..4f58bdb4 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -11,7 +11,8 @@ @var checkbox theme 'Old/custom colorscheme' 0 @var text ui_font 'App: Custom UI font ' ''font_name'' -@var text radius 'App: Custom border rad' 4px +@var text radius-g 'App: Global el radius ' 4px +@var text radius-i 'App: Inputfield radius' 4px @var checkbox fullscreen 'App: Enable fullscreen' 0 @var text app_width 'App: Custom max-width ' 1396px @@ -100,7 +101,7 @@ --cyan : cyan; --green : green; --white : white; - --radius : radius; + --radius : radius-g; --t : transparent; --bshadow : 0 2px 4px var(--shadow); @@ -1290,7 +1291,7 @@ border-top: 1px solid bd; c: 0 bd bg; div[style] + div[tabindex] { - rad: r; + rad: radius-i; c: 0 bd hl; [style *= 'visibility'] { c: cm; From dce6480b2ac01548861dea2c21dbb170444c5bbf Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 18:58:48 +0100 Subject: [PATCH 174/295] global: add reset for text in pane headers --- wa.user.styl | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 4f58bdb4..5c28a203 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -760,10 +760,12 @@ min-height: unset i; border-bottom: 1px solid bd; c: 0 0 hl; - /// NOTE: Reset text position. - ._1pYs5 { + /// Global -> Reset header text. + /._1pYs5:not(#z) { margin: 0; padding-top: 4px; + font-size: 18px; + font-weight: 500; } .kyJvR { height: 58px; From 039b0a6229e9aefade622719ce57851d31b3b8b3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 19:06:18 +0100 Subject: [PATCH 175/295] modals: fix styles when uploading a new avatar --- wa.user.styl | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 5c28a203..98d3f879 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -504,6 +504,22 @@ + div { c: fg } } } + /// Settings -> Upload a new avatar. + [data-animate-modal-body] { + ._1BdTk { border-left: none } + /// Canvas background. + ._3979j { c: 0 0 t } + /// Buttons. + ._1DKwn { + c: 0 0 hl; + box-shadow: bsh; + } + /// Footer. + ._22aOT { + c: 0 0 hl; + box-shadow: inset 0 1px bd; + } + } } // Global -> Status. From 70e86685c94cf4c56f069d3e3d47542a582ea353 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 19:28:01 +0100 Subject: [PATCH 176/295] modals: resolve a conflict with header background --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 98d3f879..a060286d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -447,6 +447,12 @@ /// Text. .xD91K { c: cm } ._3H4MS { c: fg } + /// Media -> Fix header background hover conflict. + ._2UaNq { + &._3Ff9z, &._1k-OW { + &:not(#z):not(#x):hover { c: 0 0 t } + } + } } /// Previous/next buttons. ._3yth3:not(#z) { From f8d990859c1a2e22f4a4a637a5c72a9df5f05dc4 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 19:30:08 +0100 Subject: [PATCH 177/295] misc: tweak a couple of selectors for minor colors --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index a060286d..3d66542a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -824,7 +824,7 @@ > div:last-child { c: 0 t } ._6xQdq { c: fg } } - ._1qWhd { c: cm } + /.wjdTm, ._1qWhd { c: cm } /// New group. ._1w-mX { c: 0 0 t; @@ -934,7 +934,7 @@ span[title] > span[dir] { c: fg } /._0LqQ { c: cm } /// Starred messages header. - header._3jHKU { + .BfrqJ > header._3jHKU { height: 59px; c: 0 0 hl; box-shadow: inset 0 -1px bd; From fd177b8eef49c8aa1dd844ac4da6a460738d51a3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 22 Nov 2019 19:35:36 +0100 Subject: [PATCH 178/295] global: fix scrollbar colors in Chromium browsers --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 3d66542a..719472a5 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -192,6 +192,10 @@ /// Progress completed. ../ ._1N8Pv { c: 0 0 ac } } + ::-webkit-scrollbar { + &-track { background-color: #5552 } + &-thumb { background-color: ac } + } /// Feat -> Custom font. &, button, input { font-family: var(--ui-font) } From df654e04fbb55b1f3601617a4ec5cfb30b31260c Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 23 Nov 2019 23:41:22 +0100 Subject: [PATCH 179/295] global: add styles for audio sliders in Chromium --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 719472a5..e449000c 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -192,6 +192,10 @@ /// Progress completed. ../ ._1N8Pv { c: 0 0 ac } } + ::-webkit-slider { + &-runnable-track { c: 0 0 bg } + &-thumb { c: 0 0 ac } + } ::-webkit-scrollbar { &-track { background-color: #5552 } &-thumb { background-color: ac } From b93462bddb26f0d57803f04d96841d4e66b22078 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 23 Nov 2019 23:42:09 +0100 Subject: [PATCH 180/295] icons: use matching to select all missed events --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index e449000c..0d046dcc 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -645,7 +645,7 @@ } /// Delete chat/missed call. &[data-icon = 'delete-danger'], - &[data-icon = 'miss'] { + &[data-icon ^= 'miss'] { path { v: red } } /// Right -> Default avatar loader. From 99e4f2282431a5ddab54c6a9758180a0972ddf15 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 23 Nov 2019 23:56:59 +0100 Subject: [PATCH 181/295] global: add styles for progress bars in Chromium --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 0d046dcc..488d0b31 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -192,6 +192,10 @@ /// Progress completed. ../ ._1N8Pv { c: 0 0 ac } } + ::-webkit-progress { + &-bar { c: 0 0 bd } + &-value { c: 0 0 ac } + } ::-webkit-slider { &-runnable-track { c: 0 0 bg } &-thumb { c: 0 0 ac } From 6bb33c16dddffc174a8f97c4c9a1a24888ca54cb Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 23 Nov 2019 23:58:27 +0100 Subject: [PATCH 182/295] global: refactor webkit-specific styles --- wa.user.styl | 24 +++++++++++++----------- 1 file changed, 13 insertions(+), 11 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 488d0b31..006eba69 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -192,17 +192,19 @@ /// Progress completed. ../ ._1N8Pv { c: 0 0 ac } } - ::-webkit-progress { - &-bar { c: 0 0 bd } - &-value { c: 0 0 ac } - } - ::-webkit-slider { - &-runnable-track { c: 0 0 bg } - &-thumb { c: 0 0 ac } - } - ::-webkit-scrollbar { - &-track { background-color: #5552 } - &-thumb { background-color: ac } + ::-webkit- { + &progress { + &-bar { c: 0 0 bd } + &-value { c: 0 0 ac } + } + &slider { + &-runnable-track { c: 0 0 bg } + &-thumb { c: 0 0 ac } + } + &scrollbar { + &-track { background-color: #5552 } + &-thumb { background-color: ac } + } } /// Feat -> Custom font. From 56a126e244e14cf0be34c57631c5a1715b01a588 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 23 Nov 2019 23:59:15 +0100 Subject: [PATCH 183/295] chat: tweak background color of attached files --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 006eba69..ac65df50 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1052,7 +1052,7 @@ } /// Attached files. a[title] { - > ._1mrMQ { c: fg 0 sh } + > ._1mrMQ { c: fg 0 bg } + div { &, > span::before { c: cm }} } /// Rich embeds. From 29be1c864b6760d1b81c4be007b716af36bb87ab Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 24 Nov 2019 23:26:36 +0100 Subject: [PATCH 184/295] chat: rewrite highlights for select messages mode --- wa.user.styl | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index ac65df50..86407d22 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1030,11 +1030,20 @@ /// Chat -> Select messages. &._2AqZl { c: 0 0 t; + [class *= 'message-'] { position: relative } /// Selected messages. .qTFAl { + /// Pseudo-background. + &::before { + content: ''; + opacity: 0.6; + position: absolute; + top: 0; left: 0; bottom: 0; right: 0; + } + /// States. &:hover, &._3Z2tD { - opacity: 0.5 i; - c: 0 0 hl; + c: 0 0 t; + &::before { c: 0 0 hl } } } /// Checkboxes. From 65fbd70d180b9c20ef52871c722ef83951f9c1d8 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 24 Nov 2019 23:27:28 +0100 Subject: [PATCH 185/295] modals: fix skeleton colors when using drag'n'drop --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 86407d22..a687eb93 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1312,6 +1312,12 @@ &::after { c: 0 0 ac } } } + /// Upload skeleton. + /.lC2xi { + c: 0 0 bg; + ._8C3uJ { c: fg bd } + ~ .NeQRT { c: 0 0 bg } + } } // Main -> Chat input. From cbc53b495382abc5c364f0900aeea577edc54d4b Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 24 Nov 2019 23:31:54 +0100 Subject: [PATCH 186/295] icons: tweak colors for exit/report icons --- wa.user.styl | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index a687eb93..e831cf72 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -645,10 +645,9 @@ &[data-icon *= '-dblcheck'] path { v: cm } &[data-icon *= '-dblcheck-ack'] path { v: blue } &[data-icon *= 'check'] path { fill-opacity: 1 i } - /// Report contact. - &[data-icon = 'thumbs-down'] { - path { v: orange } - } + /// Exit/Report. + &[data-icon = 'exit'], + &[data-icon = 'thumbs-down'], /// Delete chat/missed call. &[data-icon = 'delete-danger'], &[data-icon ^= 'miss'] { From 4fe4e76388f9cadc44d16ea38fbbe140c95241a6 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 24 Nov 2019 23:44:32 +0100 Subject: [PATCH 187/295] modals: fix styles for help and send/view contacts --- wa.user.styl | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index e831cf72..20501c4f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -468,6 +468,8 @@ } } } + /// Footer. + ._21bWq { c: 0 0 hl } /// Previous/next buttons. ._3yth3:not(#z) { c: 0 0 bg; @@ -540,6 +542,22 @@ box-shadow: inset 0 1px bd; } } + /// View contact. + ._1VwzF { + c: 0 0 t; + ._1VI-m { c: fg } + [role = 'button'] { c: 0 0 ac } + } + /// Send/view contacts. + .WOXAS, ._1v8mQ { + c: 0 0 t; + box-shadow: 0 1px bd i ; + .fwByR { c: ac } + } + /// Settings -> Help. + ._1wt6r { c: cm } + ._3hnO5 { c: 0 ac } + ._1T8rb { c: ac 0 t } } // Global -> Status. @@ -1295,7 +1313,7 @@ c: 0 0 hl; } /// Buttons. - [role = 'button'] { + /[role = 'button'] { + ._2sn3C { c: 0 0 hl } /// Send. &._1g8sv { From 3d57f78715d22e958c513919c56a96f828ae88bf Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 24 Nov 2019 23:47:49 +0100 Subject: [PATCH 188/295] global: fix colors for the native option element --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index 20501c4f..34c4141e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -183,6 +183,7 @@ c: fg bd; /.Fzl83 { margin-right: 24px } } + option { c: fg 0 bd } /// Browser-specific resets. ::-moz-range { From c1c309c77528364b942d0621b7affb5858b7b559 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 24 Nov 2019 23:48:18 +0100 Subject: [PATCH 189/295] left: disable border fix when three panes are active --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 34c4141e..b69871c2 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -370,7 +370,7 @@ /// Right -> Fix the width with three open panes. &.three > ._37f_5 { width: calc(100% + 1px) } /// Left -> Add missing borders to some panes. - &.three ._2t4Ic { border-right: 1px solid bd } + // &.three ._2t4Ic { border-right: 1px solid bd } } } From 1376c5f5f181d46d671c16ad5cd81858c6b5906c Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 24 Nov 2019 23:49:19 +0100 Subject: [PATCH 190/295] global: fix msg whitespace for NL and VN languages --- wa.user.styl | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index b69871c2..8b540fdd 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1455,4 +1455,12 @@ ._3SW-z { c: cm } } } + + // Fix whitespace for message content/timestamp. @upstream + html { + &[lang = 'vn'], &[lang = 'nl'] { + .EopGb { width: 56px } + ._2COY9 { width: 92px } + } + } } From 9a53302f36ed7d5f1c7297ef88501b56adea4e7b Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 00:25:53 +0100 Subject: [PATCH 191/295] chat: fix glitchy spacing between messages Fixes #43 for v2. --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 8b540fdd..05a2dbdd 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1045,6 +1045,11 @@ /// Messages area. .copyable-area > div[tabindex] { c: 0 bd; + /// Chat -> Fix message spacing reported in #43. + ._1ays2 { + display: flex i; + flex-direction: column i; + } /// Chat -> Select messages. &._2AqZl { c: 0 0 t; From 98d5e7cb7850346e1a8b9ed329f43f750068c463 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 21:55:11 +0100 Subject: [PATCH 192/295] left: fix background color for new group button --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 05a2dbdd..5cfc0503 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -878,6 +878,8 @@ /// New chat. ._11p3Q, ._8-yzK { c: 0 0 t } .r7sRK { c: ac 0 t } + /// New group button. + /._3p0T6 { c: 0 0 ac } /// Remove borders. ._2DxRd, ._2WP9Q { border: none } } From aeabff62f5fd7257d2b297b39468c718f7684dc1 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 21:57:54 +0100 Subject: [PATCH 193/295] modals: add margins to 'allow notifications' modal --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 5cfc0503..b916c41a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -559,6 +559,8 @@ ._1wt6r { c: cm } ._3hnO5 { c: 0 ac } ._1T8rb { c: ac 0 t } + /// Left -> Turn on desktop notifications. + .NWyjc.AZ3xD { margin: 16px } } // Global -> Status. From 1e9f828f34143f056f3a37bd99a77d1d7a56c1fb Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 22:08:48 +0100 Subject: [PATCH 194/295] icons: fix search and select msg footer icons --- wa.user.styl | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index b916c41a..54854174 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -681,6 +681,10 @@ fill: bd; fill-opacity: 0.6; } + /// Right -> Group search. + &[data-icon = 'search'] { + path[fill-opacity = '.3'] { fill-opacity: 0.55 } + } } // Global -> Context menu. @@ -1078,6 +1082,12 @@ c: 0 ac ac; div { c: 0 white } } + /// Reset icon opacity. + /._1wRbe { + [data-icon = 'x'] { opacity: 0.55 i } + &:disabled path { opacity: 0.55 i } + path { opacity: 1 i } + } } /// Forwarded message. /._8fE-g { c: cm } From e443176c10adf16b8a102dc1f159c8589385ee16 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 22:10:26 +0100 Subject: [PATCH 195/295] left: fix colors for blocked contacts area --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 54854174..44e8578d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -909,6 +909,10 @@ c: 0 0 t; } } + /// Blocked contacts. + ._2TLLH { c: 0 t } + ._13U-5, ._3dwyT { c: cm } + ._1i7uJ { c: 0 0 bd } /// Version info. ._357v7 { c: fg } } From 1049f586e5457ac02a712172b20ec3e6f28e09ba Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 22:10:39 +0100 Subject: [PATCH 196/295] global: tweak colors for group admin badge --- wa.user.styl | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 44e8578d..f5c6782e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -437,9 +437,8 @@ } // Global -> Badges. - ._2WwbV { - c: cm bd bg; - } + ._2WwbV { c: cm bd bg } + .FPZFa { c: green green bg } /// Global -> Modals. .overlay { From 45d077bd160de4e8483037374578d6b08e184912 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 22:17:08 +0100 Subject: [PATCH 197/295] chat: fix default bg flash for selected messages --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index f5c6782e..3428c905 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1066,7 +1066,7 @@ c: 0 0 t; [class *= 'message-'] { position: relative } /// Selected messages. - .qTFAl { + /.qTFAl { /// Pseudo-background. &::before { content: ''; From d19f1e368df88d13f214ff1b7077977ea11b02e3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 22:25:22 +0100 Subject: [PATCH 198/295] modals: fix colors for group invite modal --- wa.user.styl | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 3428c905..1650b120 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -548,6 +548,14 @@ ._1VI-m { c: fg } [role = 'button'] { c: 0 0 ac } } + /// View group invite. + ._2Vo52 { + /// Header. + .XOIaT { c: 0 0 hl } + /// Text. + ._1WSDe { c: fg } + ._3WFBR, .vJCph, ._2oG62 { c: cm } + } /// Send/view contacts. .WOXAS, ._1v8mQ { c: 0 0 t; From 763f793fa26ae8e577647e190f33fecda9d99745 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 22:32:44 +0100 Subject: [PATCH 199/295] chat: fix colors for read more/join group buttons --- wa.user.styl | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 1650b120..58d98c13 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1123,6 +1123,13 @@ c: cm; [data-icon] path { fill: cm } } + /// 'Read more' button. + ._1Jc9f { c: ac } + /// 'Join group' button. + ._1PENu { + c: 0 bg; + [role = 'button'] { c: ac } + } } /// Feat -> Blur img/videos. if ( chat_b_img == 1 ) { From d663bad23199b91e250b0005af688a66eb31c8c8 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 25 Nov 2019 22:34:42 +0100 Subject: [PATCH 200/295] chat: fix nickname text color in reply section --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 58d98c13..1c93085c 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1462,6 +1462,8 @@ ._1ebw2 { c: 0 0 bg; box-shadow: bsh, inset 0 1px bd i; + /// Nickname. + /._1F9Ap:not(#z) { c: cm } /// Content. > div:first-child:not(#z) { margin-bottom: 5px i; From ec381f3e6b4a14ce12fe5356482f5a551403bbdf Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 26 Nov 2019 23:53:50 +0100 Subject: [PATCH 201/295] chat: tweak background color for system messages --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 1c93085c..f3af4949 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1049,7 +1049,7 @@ letter-spacing: 0; font-weight: 600; text-shadow: none; - c: fg 0 hl; + c: fg 0 bd; box-shadow: inset 0 -3px sh; &.S-bQb { c: orange } &:not(.tail) { c: green } From 13405609479bd2f0bc05e0885dd82767cd52ae1e Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 26 Nov 2019 23:54:39 +0100 Subject: [PATCH 202/295] modals: fix color of 'tel' field in user details --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index f3af4949..2fb7da4e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -560,7 +560,7 @@ .WOXAS, ._1v8mQ { c: 0 0 t; box-shadow: 0 1px bd i ; - .fwByR { c: ac } + /.fwByR { c: ac } } /// Settings -> Help. ._1wt6r { c: cm } From f92b814956340513e7cb07035b1f26355f84b924 Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 26 Nov 2019 23:59:22 +0100 Subject: [PATCH 203/295] chat: fix styles for multiple sent/received contacts --- wa.user.styl | 3 +++ 1 file changed, 3 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 2fb7da4e..abb88112 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1184,6 +1184,9 @@ &:hover { opacity: 0.8 } } } + /// Multiple contacts. + .L4M2f, ._1d0W1 { c: 0 bg t } + ._3ZVco { c: fg } } // Main -> Chat message bubbles. From 85e2ecd5eceb54f8fbcaa3f1abe7541d92e0f28e Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 27 Nov 2019 23:47:59 +0100 Subject: [PATCH 204/295] landing: tweak QR's border in idle state --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index abb88112..b81e22b8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -243,6 +243,11 @@ outline: 4px solid white; box-shadow: 0 0 0 4px white; [role='button'] { c: white 0 ac } + /// Change QR's white border. + &._2VkjG { + outline: 4px solid ac; + box-shadow: 0 0 0 4px ac; + } } /// Video showcase. + ._310T_ { From 07bad517a6b8b6e4110e7cc3fc4eda4c92d1b730 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 27 Nov 2019 23:48:19 +0100 Subject: [PATCH 205/295] global: tweak missing things for the intro pane --- wa.user.styl | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index b81e22b8..df377229 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -281,6 +281,7 @@ /// App -> Intro. .iFKgT { c: 0 bd bg; + a { color: ac } &::after { c: 0 ac } [style] { h1 { c: fg } @@ -306,12 +307,14 @@ &::after { display: block; font-size: 16px; - margin-top: 10px; - padding-top: 10px; + margin-top: 16px; + padding-top: 16px; content: var(--version); border-top: 1px solid bd; } } + /// Platform-specific section border.. + ._3ZVgT { c: 0 0 bd } } /// Left -> Typing indicator. From 408789eec8fab22bd5757c9fe6a20fa7692c96e4 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 27 Nov 2019 23:50:56 +0100 Subject: [PATCH 206/295] buttons: tweak colors for remove/send buttons --- wa.user.styl | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index df377229..917eae7e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1364,12 +1364,10 @@ /// Buttons. /[role = 'button'] { + ._2sn3C { c: 0 0 hl } - /// Send. - &._1g8sv { + /// Left -> Remove group participant. + &._1Dfrr:hover { c: 0 0 ac; box-shadow: bsh; - transition: 0.15s ease; - &:hover { opacity: 0.75 } } /// Add file. &[style *= 'opacity'] { @@ -1377,6 +1375,13 @@ box-shadow: inner; &::after { c: 0 0 ac } } + /// Send. + &._1g8sv { + c: 0 0 ac; + box-shadow: bsh; + transition: 0.15s ease; + &:hover { opacity: 0.75 } + } } /// Upload skeleton. /.lC2xi { From 83eb5a1bfb45f80ce809bdfa24c59875536be9e8 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 27 Nov 2019 23:51:30 +0100 Subject: [PATCH 207/295] global: fix lang value for Vietnamese language --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 917eae7e..bf8e368d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1513,7 +1513,7 @@ // Fix whitespace for message content/timestamp. @upstream html { - &[lang = 'vn'], &[lang = 'nl'] { + &[lang = 'vi'], &[lang = 'nl'] { .EopGb { width: 56px } ._2COY9 { width: 92px } } From 7598c1d7f1d9654b78b0c2faa4bd6529c3646f9c Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 27 Nov 2019 23:57:28 +0100 Subject: [PATCH 208/295] misc: fix minor text colors --- wa.user.styl | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index bf8e368d..ae8096ac 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -894,6 +894,8 @@ ._2DxRd, ._2WP9Q { c: 0 t } } } + /// New group creation. + /._1wt6r { c: cm } /// New chat. ._1c8mz { /// New chat. @@ -1449,6 +1451,8 @@ input { c: fg } } } + /// Header colors. + ._2lKjK { c: cm } /// Gif -> Preloader. ._2x9yi { c: 0 0 hl } /// Stickers -> Retry button. From f9b2de8709361b44c6a57b2e008acee955f26ace Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 27 Nov 2019 23:59:25 +0100 Subject: [PATCH 209/295] right: reset right padding for mute/starred msg --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index ae8096ac..5a0d9f94 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -949,6 +949,7 @@ /// Buttons. ._3_-Si { padding: 0 15px; + > ._2x2XP { padding-right: 0 } > div { c: 0 bd } span { c: fg } } From 511aff231281fff621f6ff43ea4300ca0c8fcbd5 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 28 Nov 2019 00:46:34 +0100 Subject: [PATCH 210/295] chat: tweak box-shadow for system messages --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 5a0d9f94..f6162d86 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1060,8 +1060,8 @@ letter-spacing: 0; font-weight: 600; text-shadow: none; - c: fg 0 bd; - box-shadow: inset 0 -3px sh; + c: fg 0 hl; + box-shadow: inner, inset 0 -3px bd; &.S-bQb { c: orange } &:not(.tail) { c: green } } From 52c0341e6fc0f145f8f34b36fcc457edcb308112 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 28 Nov 2019 23:44:40 +0100 Subject: [PATCH 211/295] chat: fix border-radius for attach dropdown menu --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index f6162d86..9e495a9e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -717,6 +717,7 @@ &._1fRWV { top: -10px; padding: 10px; + rad: 0 0 r r; .Ijb1Q::after { box-shadow: 0 4px 8px sh } } /// Emojis -> Race selection. From fc69ed0649c2fa5769ebbefad83e9c4a4c86452c Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 28 Nov 2019 23:46:40 +0100 Subject: [PATCH 212/295] global: fix border color of input elements --- wa.user.styl | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 9e495a9e..7142e700 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -856,7 +856,8 @@ box-shadow: none; ._3he1q { c: ac } ._3K9Sw { c: 0 t } - ._5UNoc ._3hnO5 { c: 0 ac } + /// Input area border. + /._5UNoc ._3hnO5 { c: 0 ac } } /// Settings -> User info section. /._2UaNq { From 65a55b51d90939565e9d1f574c6f4d0315915dfe Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 28 Nov 2019 23:52:52 +0100 Subject: [PATCH 213/295] global: tweak minor things for media selection --- wa.user.styl | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 7142e700..1aff7933 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -623,12 +623,11 @@ // Global -> Media selection. ._2n0jo { - c: 0 bd bg; + c: 0 bd hl; /// Item reset. ._1LdNS { &.cJP5q { border: none i; - transform: scale(1) i; outline: 4px solid ac; } &:hover:not(.cJP5q):not(#spec) { outline: 4px solid ac i } From cde2a0e67d244fe1d9d7cff05e0224419ea33d59 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 28 Nov 2019 23:55:43 +0100 Subject: [PATCH 214/295] global: fix unread indicators in archived pane --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 1aff7933..0b543606 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -808,7 +808,7 @@ > div:last-child { c: cm } } /// Unread indicators. - .P6z4j { c: white 0 ac } + /.P6z4j { c: white 0 ac } } } /// Search contacts/messages. From b67c8d34b60097d97a5014d00ee2c3f2fe2e3c6a Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 28 Nov 2019 23:59:13 +0100 Subject: [PATCH 215/295] global: fix loading color of audio message icons --- wa.user.styl | 3 +++ 1 file changed, 3 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 0b543606..a50085ef 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -332,6 +332,9 @@ svg[width = '20'][height = '20'] { circle { stroke: green } } + svg[width = '34'][height = '34'] { + circle { stroke: cm } + } /// Panes -> Change avatars. ._1JS2G { c: fg 0 #66666666 } From 27e1fb055b33391f120f7e7833ec2f9ad8b385ea Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 28 Nov 2019 23:59:37 +0100 Subject: [PATCH 216/295] global: reduce repeating of various bits of code --- wa.user.styl | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index a50085ef..4dbfcaea 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -932,7 +932,7 @@ } /// Blocked contacts. ._2TLLH { c: 0 t } - ._13U-5, ._3dwyT { c: cm } + ._13U-5, /._3dwyT { c: cm } ._1i7uJ { c: 0 0 bd } /// Version info. ._357v7 { c: fg } @@ -1139,9 +1139,9 @@ [data-icon] path { fill: cm } } /// 'Read more' button. - ._1Jc9f { c: ac } + /._1Jc9f { c: ac } /// 'Join group' button. - ._1PENu { + /._1PENu { c: 0 bg; [role = 'button'] { c: ac } } From e958542f768d33e5e5ebbdf694d3216cb16cfb36 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 29 Nov 2019 00:23:47 +0100 Subject: [PATCH 217/295] modals: fix 'add screenshots' field background --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index 4dbfcaea..be89fcd3 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -515,6 +515,7 @@ c: 0 0 bg; box-shadow: 0 4px 8px 2px sh; ._13HPh { c: fg } + ._2VDPW { c: 0 0 hl } /// 'Forward message' popout. ._1KDYa { c: 0 0 t; From 292416f348f085e4e3209b6ab1c84cd30e994e02 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 29 Nov 2019 23:38:54 +0100 Subject: [PATCH 218/295] chat: add border around reply content area --- wa.user.styl | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index be89fcd3..b4abe95f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1496,6 +1496,11 @@ c: 0 0 hl; div[role] { c: 0 0 hl } /.quoted-mention { c: cm } + /// Add border around wrapper. + > div > div { + rad: 7.5px; + box-shadow: inset 0 0 0 1px bd; + } } /// Close button. div:last-child { From 257639d583beba111a3d86efa7ad231f687f6833 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 29 Nov 2019 23:41:51 +0100 Subject: [PATCH 219/295] global: add top border for items within panes --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index b4abe95f..53121a23 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -877,6 +877,7 @@ ._26JG5 { border-bottom: 1px solid bd; c: 0 0 t; + box-shadow: 0 -1px bd; &:hover { c: 0 0 hl } &::before { content: none } > div:last-child { c: 0 t } From 3c4e7dc35b0f95781eeb27590678951f22a53591 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 29 Nov 2019 23:43:27 +0100 Subject: [PATCH 220/295] chat: increase whitespace around reply content --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 53121a23..a88c84f3 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1493,7 +1493,7 @@ /._1F9Ap:not(#z) { c: cm } /// Content. > div:first-child:not(#z) { - margin-bottom: 5px i; + margin: 4px 0 8px 66px; c: 0 0 hl; div[role] { c: 0 0 hl } /.quoted-mention { c: cm } From e57dd16b35b849977022348168c4cebe64ba84ad Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 29 Nov 2019 23:47:00 +0100 Subject: [PATCH 221/295] chat: make styles for multiple contacts global --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index a88c84f3..c2541fc8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1202,8 +1202,8 @@ } } /// Multiple contacts. - .L4M2f, ._1d0W1 { c: 0 bg t } - ._3ZVco { c: fg } + /.L4M2f, /._1d0W1 { c: 0 bg t } + /._3ZVco { c: fg } } // Main -> Chat message bubbles. From 3e8c7ab1467fa77638236fa1aa854be340752219 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 29 Nov 2019 23:51:40 +0100 Subject: [PATCH 222/295] feat: improve custom max-width option The chat window will now have gaps on the left/right side, the same way it does by default on top/bottom until the resolution is low enough to jump into full-screen, or if the full-screen option is enabled. --- wa.user.styl | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index c2541fc8..80dbe6b8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -369,12 +369,14 @@ rad: r; box-shadow: bsh; /// Feat -> Custom max-width. - width: var(--app-width); + width: calc(100% - 38px); + max-width: var(--app-width); /// Feat -> Fullscreen mode. if ( fullscreen == 1 ) { rad: 0; top: unset; width: 100%; + max-width: 100%; height: 100%; } } From 401b95122923e651469c251ac19342fd8fb9a195 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:45:02 +0100 Subject: [PATCH 223/295] left: re-enable missing border on the left pane --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 80dbe6b8..393a8fa5 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -383,7 +383,7 @@ /// Right -> Fix the width with three open panes. &.three > ._37f_5 { width: calc(100% + 1px) } /// Left -> Add missing borders to some panes. - // &.three ._2t4Ic { border-right: 1px solid bd } + &.three ._2t4Ic { border-right: 1px solid bd } } } From 50df1c2106caa4f63a2f0d9acfd6058c0e9037cf Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:47:10 +0100 Subject: [PATCH 224/295] right: fix another section in message info --- wa.user.styl | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 393a8fa5..063877b5 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -988,7 +988,12 @@ ._2AJf5 { c: 0 0 t; span { c: ac } - } + } + /// Message info -> X remaining. + ._19xqi { + c: 0 0 t; + box-shadow: 0 1px bd; + } /// Read/Delivered section. ._2WP9Q { border: none } /// Search -> Default message. From 804de4b5da7dbaf576d4e5115aa188fe34d6bb8a Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:50:59 +0100 Subject: [PATCH 225/295] chat: fix conflict between links and replies --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 063877b5..4b4adefd 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1505,7 +1505,7 @@ div[role] { c: 0 0 hl } /.quoted-mention { c: cm } /// Add border around wrapper. - > div > div { + /._1SsXF, ._3LVMN { rad: 7.5px; box-shadow: inset 0 0 0 1px bd; } From dc59934744b4d2610f35ac3d9dd231f7a6f28824 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:52:25 +0100 Subject: [PATCH 226/295] right: fix 'read more' in group descriptions --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 4b4adefd..5f2007c4 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1148,7 +1148,7 @@ [data-icon] path { fill: cm } } /// 'Read more' button. - /._1Jc9f { c: ac } + /._1Jc9f, /._3THW4 { c: ac } /// 'Join group' button. /._1PENu { c: 0 bg; From 31807a535a2a4d9924ba7744b6bda6c0b04f5d90 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:52:55 +0100 Subject: [PATCH 227/295] global: fix group invite link color --- wa.user.styl | 3 +++ 1 file changed, 3 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 5f2007c4..780670f8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -338,6 +338,9 @@ /// Panes -> Change avatars. ._1JS2G { c: fg 0 #66666666 } + + /// Group invite link. + #group-invite-link-anchor { c: ac } } #app > div { From 6d1ed8d4bd05f874eaecc0f35130ef8c2b7a7b48 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:53:20 +0100 Subject: [PATCH 228/295] global: tweak colors of archived chat badge --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 780670f8..57299cba 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -453,7 +453,7 @@ } // Global -> Badges. - ._2WwbV { c: cm bd bg } + ._2WwbV { c: blue blue bg } .FPZFa { c: green green bg } /// Global -> Modals. From 2b54ddc5011581be41c53f2298c179fc6e09285d Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:54:46 +0100 Subject: [PATCH 229/295] global: use different colors between panes --- wa.user.styl | 32 +++++++++++++------------------- 1 file changed, 13 insertions(+), 19 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 57299cba..6f208543 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -670,7 +670,7 @@ &[data-icon = 'back-blue'] path { v: blue } /// Default user/group/broadcasts icons. &[data-icon ^= 'default-'] path { - &:first-child { fill: bd } + &:first-child { fill: bg } &:last-child { fill: cm } } /// Business accounts. @@ -745,7 +745,7 @@ #side { > header { border-bottom: 1px solid bd; - c: 0 0 t; + c: 0 0 hl; /// Avatar background. [style *= 'height: 40px'] { c: 0 0 t } } @@ -780,7 +780,7 @@ /// Search. /div[class *= 'ZP8RM'] { border-bottom: 1px solid bd; - c: 0 0 bg; + c: 0 0 hl; &._19OGD { c: 0 0 hl } &::after { content: none } > div { c: cm } @@ -791,7 +791,7 @@ } /// Contacts. #pane-side { - c: 0 0 t; + c: 0 0 hl; /// Items. [style *= 'z-index'] > div > div[class] { c: 0 0 t; @@ -799,7 +799,7 @@ /.matched-text:not(#z) { c: ac } /// Active states. &:hover, &._3mMX1 { - c: 0 0 hl; + c: 0 0 bd; box-shadow: inset 0 1px bd, 0 1px bd; } /// Remove borders. @@ -838,7 +838,7 @@ // App -> Left -> Profile/Settings. .app span > div[style *= 'height: 100%'] { > div[class], > span > div[class], > div > div[class] { - c: 0 0 bg; + c: 0 0 hl; > header { height: unset; min-height: unset i; @@ -871,7 +871,7 @@ /._2UaNq { c: 0 0 t; &::after { content: none i } - &:hover:not(#z):not(#x) { c: 0 0 hl } + &:hover:not(#z):not(#x) { c: 0 0 bd } [style *= 'height: 82px'] { c: 0 0 t } ._2WP9Q { border-top: none i } /// Nick/info. @@ -883,7 +883,7 @@ border-bottom: 1px solid bd; c: 0 0 t; box-shadow: 0 -1px bd; - &:hover { c: 0 0 hl } + &:hover { c: 0 0 bd } &::before { content: none } > div:last-child { c: 0 t } ._6xQdq { c: fg } @@ -976,12 +976,6 @@ padding: 0 15px; width: auto; } - /// Right -> Message info reset. - &._1KDYa { - ._2UaNq:not(#z):not(#x) { - &:hover { c: 0 0 t } - } - } /// Message info -> Image. ._2rGVQ { border-bottom: 1px solid bd; @@ -1003,8 +997,8 @@ ._3dwyT { c: cm } /// Search -> Items on hover. [style]:not(#z):not(#x) > div > ._2UaNq { - &._3sA1g:hover, &._3mMX1 { - c: 0 0 hl; + &._3sA1g:hover, &._3mMX1, &.hover { + c: 0 0 bd; box-shadow: 0 0 0 1px bd; } } @@ -1057,7 +1051,7 @@ > header { border-right: none; border-bottom: 1px solid bd; - c: 0 bd bg; + c: 0 bd hl; &::after { content: none } [style *= 'height: 40px'] { c: 0 0 t } [title] { c: fg } @@ -1432,10 +1426,10 @@ /// Input area. > div:first-child { border-top: 1px solid bd; - c: 0 bd bg; + c: 0 bd hl; div[style] + div[tabindex] { rad: radius-i; - c: 0 bd hl; + c: 0 bd bg; [style *= 'visibility'] { c: cm; /// Hide input placeholder. From 5dde511d999c8bebeb453a99887b49bf1c9bd71e Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:55:51 +0100 Subject: [PATCH 230/295] right: use borders instead of shadows for sections --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 6f208543..d9b56ab4 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -944,6 +944,8 @@ /// Version info. ._357v7 { c: fg } } + /// Right -> Replace shadow with borders. + ._2LSbZ { box-shadow: 0 -1px bd i } } // App -> Right. From f6bcbd454c0e4654d5c0c461c00ab212bae25294 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:56:38 +0100 Subject: [PATCH 231/295] feat: swap dark/darker colors in old color-scheme --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index d9b56ab4..e701bea9 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -84,9 +84,9 @@ --accent : accent; --shadow : shadow; } else { - --dark : #272c35; + --dark : #1f232a; --darken : #222730; - --darker : #1f232a; + --darker : #272c35; --light : #e9e9e9; --lighter : #c1c1c1; --accent : accent; From 81f8146f08cd0d2565986fcabeba19290f94a5b2 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 30 Nov 2019 23:59:47 +0100 Subject: [PATCH 232/295] feat: add WIP screenshot mode Only useful for, well, as the name implies -- it hides sensitive things. --- wa.user.styl | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index e701bea9..51313302 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -54,6 +54,8 @@ @var checkbox chat_left 'Chat: Align left msg ' 0 @var checkbox chat_right 'Chat: Align right msg ' 0 +@var checkbox ss-mode 'App: Screenshot mode ' 0 + @var color dark 'Color: Primary background ' #292929 @var color darken 'Color: Highlight background ' #333333 @var color darker 'Color: Secondary background ' #424242 @@ -1540,4 +1542,20 @@ ._2COY9 { width: 92px } } } + + // Feat -> WIP Screenshot mode. + if ( ss-mode == 1 ) { + /:not(#x):not(#y):not(#z) { + /// Chat -> content / nickname / mention / timestamp / nick (right pane) + [class *= '-text'], + ._1QjgA > span, + .quoted-mention, + ._3fnHB, + ._3VvbK { + c: t; + } + [title] { c: t } + img, .emoji { visibility: hidden i } + } + } } From 9dc30b064ef658797ddd0460c5e81dbaa7a7940a Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 1 Dec 2019 23:47:59 +0100 Subject: [PATCH 233/295] icons: use accent color for seen msg checkmarks --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 51313302..74e94354 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -689,7 +689,7 @@ /// Message status. &[data-icon *= '-check'] path { v: cm } &[data-icon *= '-dblcheck'] path { v: cm } - &[data-icon *= '-dblcheck-ack'] path { v: blue } + &[data-icon *= '-dblcheck-ack'] path { v: ac } &[data-icon *= 'check'] path { fill-opacity: 1 i } /// Exit/Report. &[data-icon = 'exit'], From ec2f280a7f7e49420f1754917665ab44e18fe1e3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 1 Dec 2019 23:53:23 +0100 Subject: [PATCH 234/295] global: resolve glitches around panes --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 74e94354..7e6632d3 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -387,8 +387,8 @@ } /// Right -> Fix the width with three open panes. &.three > ._37f_5 { width: calc(100% + 1px) } - /// Left -> Add missing borders to some panes. - &.three ._2t4Ic { border-right: 1px solid bd } + /// HACK: Resolve pane gap/border glitches. + ._2rI9W { margin-right: -1px } } } From a4aa7cbe64f6ec5ea01b515456d23fd67f17c770 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 1 Dec 2019 23:57:45 +0100 Subject: [PATCH 235/295] left: fix hover bg for starred messages --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 7e6632d3..b232aadb 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -927,7 +927,7 @@ c: 0 0 bd; } &::after { content: none } - &._1lakC, &._2nA3s, &._2V_Wj { c: 0 0 hl } + &._1lakC, &._2nA3s, &._2V_Wj { c: 0 0 #55555510 } ._2V2qB, .jLybP::before { c: cm } /// Reset tails. .tail { From 53cf4f5643199f4fe1bdec94f85aad2dbc18c4b3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Dec 2019 23:23:39 +0100 Subject: [PATCH 236/295] modals: fix separator/circle colors in status area --- wa.user.styl | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index b232aadb..c6fc8656 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -608,6 +608,11 @@ rad: r; border: 1px solid bd; } + hr { + opacity: 1; + border: none; + border-top: 1px solid bd; + } /// Contacts. > div[class]:nth-child(1) { c: 0 0 hl; @@ -616,6 +621,8 @@ /// Text. .OEFaY { c: cm } ._26-u- { c: fg } + /// Circle. + circle[r = '50'] { stroke: ac i } } > div[class]:nth-child(2) { .ojaNO { c: cm } From 4823084b2a3b45f72e2ab621b218c3b6530e59c5 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Dec 2019 23:24:19 +0100 Subject: [PATCH 237/295] global: add borders to dropdown nib --- wa.user.styl | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index c6fc8656..692f3da3 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -449,7 +449,9 @@ ._2lKjK { c: cm } } + [data-animate-dropdown-nib] { - c: 0 0 bd; + border-bottom: 1px solid bd; + border-right: 1px solid bd; + c: 0 0 bg; box-shadow: none; } } From 4b0cefce79114cfd2dbb19e1647dba50092a4faf Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Dec 2019 23:25:31 +0100 Subject: [PATCH 238/295] modals: fix bubble when replying to user's status --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 692f3da3..dd4dda7e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -631,6 +631,8 @@ /// Reset the circle icon. svg[width][height] path { v: t fg } } + /// Reply to the status. + /.QRsOy { c: 0 0 bg } /// Feat -> Fullscreen mode. if ( fullscreen == 1 ) { rad: 0; From 49a0f58e7c48d291d1d5a9e468a7fad715c6f35e Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Dec 2019 23:27:01 +0100 Subject: [PATCH 239/295] chat: update the styles for system messages --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index dd4dda7e..b4fd2d9f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1086,9 +1086,9 @@ font-weight: 600; text-shadow: none; c: fg 0 hl; - box-shadow: inner, inset 0 -3px bd; + box-shadow: bsh, inner, inset 0 -3px bd; &.S-bQb { c: orange } - &:not(.tail) { c: green } + &:not(.tail) { c: fg } } /// Chat -> Jump to new messages. ._3KRbU { From 045eb7442a690508ce4b9a6954c6628223d94aea Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Dec 2019 23:34:41 +0100 Subject: [PATCH 240/295] chat: fix animation for selected search msg --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index b4fd2d9f..0751759b 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1286,7 +1286,7 @@ svg path[fill = '#DFE5E7'] { v: t } } /// Search -> Selected message. - > .velocity-animating * { c: ac } + &.velocity-animating { opacity: 0.4 } /// Images -> Timestamp. div[style *= 'width'][style *= 'height'] + div[class] { padding: 2px 5px; From f718d3e44a753c4abf8597252a3bd82c6d7233ae Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 5 Dec 2019 23:41:08 +0100 Subject: [PATCH 241/295] right: fix msg info hover bg in direct messages --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 0751759b..30831f9f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1006,6 +1006,8 @@ c: 0 0 t; box-shadow: 0 1px bd; } + /// HACK: Reset msg info hover in DMs but not in groups. + .rK2ei:not(._1c8mz):not(#z):not(#x) ._2UaNq:hover { c: 0 0 t } /// Read/Delivered section. ._2WP9Q { border: none } /// Search -> Default message. From cda39a3f7054f000bbef191929d26601bf1507ef Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 6 Dec 2019 23:46:54 +0100 Subject: [PATCH 242/295] global: fix bg and icon opacity for active buttons --- wa.user.styl | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 30831f9f..ce12947e 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -327,7 +327,12 @@ ._15wNI { c: 0 ac ac } /// Global -> Active buttons. - ._3j8Pd { &.GPmgF, &.GPmgf { c: 0 0 hl }} + ._3j8Pd { + &.GPmgF, &.GPmgf { + c: 0 0 bd; + [data-icon] path { fill-opacity: 1 i } + } + } /// Contacts/Search -> Loader. svg[width = '18'][height = '18'], From 3fdfd441ed9ea735bee26e4adb7c302dc3c7ef18 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 6 Dec 2019 23:47:32 +0100 Subject: [PATCH 243/295] modals: fix footer when taking a photo --- wa.user.styl | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index ce12947e..4c962a49 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -563,7 +563,8 @@ box-shadow: bsh; } /// Footer. - ._22aOT { + ._2HyTU, ._22aOT { + min-height: 91px; /// NOTE: Border is hidden on default 90px. c: 0 0 hl; box-shadow: inset 0 1px bd; } From 17eb410f22faf5d22591ef9dbd503e715c0ae151 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 6 Dec 2019 23:48:57 +0100 Subject: [PATCH 244/295] chat: fix background for attach dropdown menu --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index 4c962a49..8cacb11a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -745,6 +745,7 @@ top: -10px; padding: 10px; rad: 0 0 r r; + c: 0 0 hl; .Ijb1Q::after { box-shadow: 0 4px 8px sh } } /// Emojis -> Race selection. From 792d8e9a4f54b44d78a1056becfb6123abc1eb37 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Dec 2019 21:44:23 +0100 Subject: [PATCH 245/295] chat: fix deleted message color in groups --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 8cacb11a..0bbdbbbc 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1164,7 +1164,7 @@ div > div:nth-child(3) span { c: fg } } /// Deleted message. - ._3uHCS { + ._2v02G, ._3uHCS { c: cm; [data-icon] path { fill: cm } } From 215563d4011ff10b68f7cb97e0aaaa112614a876 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Dec 2019 21:44:52 +0100 Subject: [PATCH 246/295] chat: fix 'align left/right bubble' options --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 0bbdbbbc..4155b3dc 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1347,7 +1347,7 @@ /// Replies. ._2HTIU { c: 0 0 bg } /// Feat -> Align left bubble. - if ( chat_left == 1 ) { justify-content: flex-end } + if ( chat_left == 1 ) { align-items: flex-end } } /// Right. &-out { @@ -1378,7 +1378,7 @@ /// Replies. ._2HTIU { c: 0 0 bg } /// Feat -> Align right bubble. - if ( chat_right == 1 ) { justify-content: flex-start } + if ( chat_right == 1 ) { align-items: flex-start } } } From de33f13a0615c17104479ff0b76a9120d11a4711 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Dec 2019 21:52:00 +0100 Subject: [PATCH 247/295] chat: fix border radius for reply content section --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 4155b3dc..8ad1443c 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1527,7 +1527,7 @@ /.quoted-mention { c: cm } /// Add border around wrapper. /._1SsXF, ._3LVMN { - rad: 7.5px; + rad: 0 7.5px 7.5px 0; box-shadow: inset 0 0 0 1px bd; } } From f3d92bebc98f39c2cd8a8fc278138ff640f5bcd9 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 8 Dec 2019 23:56:19 +0100 Subject: [PATCH 248/295] global: improve various states for emojis Basically, a reimplementation of what is already in the v1. --- wa.user.styl | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 8ad1443c..00a9f5c8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -399,15 +399,16 @@ /// Global -> Emojis. .emojik { - &:focus, &.selected { box-shadow: 0 0 0 2px ac i } + transition: transform 0.15s ease; + /// Default opacity. &:not(:hover):not(:focus):not(.selected) { filter: opacity(var(--emoji-o)); } - /// Making sure active emoji is different from the rest. - if ( emoji_o >= 0.7 ) { - &:hover, &:focus, &.selected { - filter: opacity(calc(var(--emoji-o) - 0.3)); - } + /// Active state. + &:hover, &:focus, &.selected { + opacity: 1; + transform: scale(1.2); + box-shadow: none i; } /// Feat -> Transparent emoji images. if ( emoji_t == 1 ) { From e7d2b13ab8965cf37d24a7a31ef5988e0c58f8f2 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 9 Dec 2019 23:56:29 +0100 Subject: [PATCH 249/295] global: fix placeholder text color --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 00a9f5c8..1d0bf37b 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -178,7 +178,7 @@ scrollbar-color: ac #5552; /// Text. - ::placeholder { c: cm } + ::placeholder, ._2kE6F { c: cm } a { color: ac } strong { c: fg } select { From 697a12decba8ee40806cef1a96eb9820ef5a72ee Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 9 Dec 2019 23:58:40 +0100 Subject: [PATCH 250/295] meta: update default shadow intensity --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 1d0bf37b..24c6982b 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -71,7 +71,7 @@ @var color cyan 'Color: Cyan ' #5e8d87 @var color green 'Color: Green ' #7b823a @var color white 'Color: White ' #ffffff -@var color shadow 'Color: Shadow ' #00000010 +@var color shadow 'Color: Shadow ' #00000030 ==/UserStyle== */ @-moz-document domain('web.whatsapp.com') { From 5f14f887ccaa5bfc5c66ce08ee371f1010e57033 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 9 Dec 2019 23:59:22 +0100 Subject: [PATCH 251/295] feat: update main colors for old color-scheme --- wa.user.styl | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 24c6982b..a3547f35 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -71,7 +71,7 @@ @var color cyan 'Color: Cyan ' #5e8d87 @var color green 'Color: Green ' #7b823a @var color white 'Color: White ' #ffffff -@var color shadow 'Color: Shadow ' #00000030 +@var color shadow 'Color: Shadow ' #00000025 ==/UserStyle== */ @-moz-document domain('web.whatsapp.com') { @@ -87,10 +87,10 @@ --shadow : shadow; } else { --dark : #1f232a; - --darken : #222730; - --darker : #272c35; + --darken : #252A33; + --darker : #2c313a; --light : #e9e9e9; - --lighter : #c1c1c1; + --lighter : #a1a1a1; --accent : accent; --shadow : shadow; } From 7671a9835115ab1be179f609357374a57c433516 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 13 Dec 2019 23:26:40 +0100 Subject: [PATCH 252/295] chat: fix sender name bubble in groups Closes #69. --- wa.user.styl | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index a3547f35..b6115dc0 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1244,7 +1244,7 @@ &-in, &-out { /// Fix shadows. > div:not(.a81-s) { - box-shadow: 0 1px sh i; + box-shadow: 0 1px 0.5px sh i; > div { box-shadow: none i } } /// Tails. @@ -1323,6 +1323,11 @@ > div:not(.a81-s) > div { c: fg 0 left } /// Stickers -> Timestamp. > div.a81-s ._3qAvH { c: 0 0 left } + /// Stickers -> Sender name bubble. #69 + ._3tMyP { + c: 0 0 left; + box-shadow: 0 1px 0.5px sh i; + } /// Reset tails. .tail { border-top-left-radius: 0 i; From 49c736549a09b1024a11194bc286e438663545ab Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 13 Dec 2019 23:51:19 +0100 Subject: [PATCH 253/295] meta: update all fields using old repo name --- wa.user.styl | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index b6115dc0..c3de5d2b 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1,9 +1,9 @@ /* ==UserStyle== @name Dark-WhatsApp @description Dark and light, very customizable theme for WhatsApp. -@namespace github.com/vednoc/onyx -@homepageURL https://github.com/vednoc/onyx -@supportURL https://github.com/vednoc/onyx/issues +@namespace github.com/vednoc/dark-whatsapp +@homepageURL https://github.com/vednoc/dark-whatsapp +@supportURL https://github.com/vednoc/dark-whatsapp/issues @version 1.9.9 @author vednoc (https://github.com/vednoc) @license MIT @@ -126,7 +126,7 @@ --version : 'Dark-WhatsApp [Alpha] v1.9.9'; --message : 'WIP v2. '; - --changes : 'See the PR at: https://github.com/vednoc/onyx/pull/38'; + --changes : 'See the PR at: https://github.com/vednoc/dark-whatsapp/pull/38'; } // Use stylus-lang variables with CSS variables. From 9b80024939d0222e528716d978d50171ee95a6af Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 14 Dec 2019 23:42:10 +0100 Subject: [PATCH 254/295] feat: add an option to customize hue for bg image --- wa.user.styl | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index c3de5d2b..e89d21ca 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -28,6 +28,7 @@ @var text image_url 'App: Custom bg link ' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') @var range bg_opacity 'App: Image opacity ' [0.5, 0.0, 1, 0.01] @var range bg_blur 'App: Image blur size ' [8, 0, 50, 1, 'px'] +@var range bg_hue 'App: Image hue ' [0, 0, 360, 1, 'deg'] @var range bg_invert 'App: Image inversion ' [0, 0.0, 1, 0.1] @var checkbox chat_msg_t 'Chat: Hide msg tails ' 0 @@ -115,6 +116,7 @@ --bg-image : image_url; --bg-opacity: bg_opacity; --bg-blur : bg_blur; + --bg-hue : bg_hue; --bg-invert : bg_invert; --chat-image: chat_image; @@ -357,9 +359,10 @@ b = blur(var(--bg-blur)); o = opacity(var(--bg-opacity)); i = invert(var(--bg-invert)); + h = hue-rotate(var(--bg-hue)); top: s; right: s; bottom: s; left: s; height: unset; width: unset; - filter: b o i; + filter: b o i h; background-image: var(--bg-image); c: 0 0 hl; } else if ( app_image == default ) { From 5004c14d5168c5aabc9898398fcf5993279871fa Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 14 Dec 2019 23:44:19 +0100 Subject: [PATCH 255/295] feat: add a 'shadow heavy' color option --- wa.user.styl | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index e89d21ca..2119b6f2 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -72,7 +72,8 @@ @var color cyan 'Color: Cyan ' #5e8d87 @var color green 'Color: Green ' #7b823a @var color white 'Color: White ' #ffffff -@var color shadow 'Color: Shadow ' #00000025 +@var color sh 'Color: Shadow light ' #00000025 +@var color sh-h 'Color: Shadow heavy ' #00000050 ==/UserStyle== */ @-moz-document domain('web.whatsapp.com') { @@ -86,6 +87,7 @@ --lighter : lighter; --accent : accent; --shadow : shadow; + --sh-h : sh-h; } else { --dark : #1f232a; --darken : #252A33; @@ -94,6 +96,7 @@ --lighter : #a1a1a1; --accent : accent; --shadow : shadow; + --sh-h : sh-h; } --yellow : yellow; --orange : orange; @@ -139,6 +142,7 @@ cm = var(--lighter); ac = var(--accent); sh = var(--shadow); + sh-h = var(--sh-h); bsh = var(--bshadow); yellow = var(--yellow); orange = var(--orange); From ca148579377e73050221badaed4e39d3df47a97c Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 14 Dec 2019 23:50:18 +0100 Subject: [PATCH 256/295] global: improve styles for context meuns --- wa.user.styl | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 2119b6f2..fc169769 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -742,8 +742,8 @@ &[style ^= 'transform-origin:'] { border: 1px solid bd; rad: r; - c: 0 0 bg; - box-shadow: bsh; + c: 0 0 hl; + box-shadow: 0 4px 12px sh-h; li > div { c: cm; &:hover { c: fg 0 hl } @@ -763,7 +763,7 @@ border-bottom: 1px solid bd; border-right: 1px solid bd; bottom: -8px; - c: 0 0 bg; + c: 0 0 hl; } } } From b95e8827f85850231fd5e672480359087775c632 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 14 Dec 2019 23:51:21 +0100 Subject: [PATCH 257/295] chore: fix name of the renamed shadow variable --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index fc169769..d57c52a8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -86,7 +86,7 @@ --light : light; --lighter : lighter; --accent : accent; - --shadow : shadow; + --shadow : sh; --sh-h : sh-h; } else { --dark : #1f232a; @@ -95,7 +95,7 @@ --light : #e9e9e9; --lighter : #a1a1a1; --accent : accent; - --shadow : shadow; + --shadow : sh; --sh-h : sh-h; } --yellow : yellow; From 70cb1aaadb11baf05ab9561e96c37c298f64cd1e Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 14 Dec 2019 23:52:19 +0100 Subject: [PATCH 258/295] chat: rewrite styles for attach dropdown menu --- wa.user.styl | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index d57c52a8..9e4ec207 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -750,11 +750,10 @@ } /// Chat -> Attach dropdown. &._1fRWV { - top: -10px; - padding: 10px; - rad: 0 0 r r; - c: 0 0 hl; - .Ijb1Q::after { box-shadow: 0 4px 8px sh } + c: 0 0 t; + border: none i; + box-shadow: none i; + .Ijb1Q::after { box-shadow: bsh } } /// Emojis -> Race selection. > ul._3z3lc { From 24ae325204bac587c6d5f59f5b66d590dc13edd9 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 14 Dec 2019 23:59:29 +0100 Subject: [PATCH 259/295] right: fix styles for selected media items --- wa.user.styl | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 9e4ec207..01f61dde 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -735,6 +735,11 @@ &[data-icon = 'search'] { path[fill-opacity = '.3'] { fill-opacity: 0.55 } } + /// Right -> Selected media. + &[data-icon = 'checkbox-round-checked'] { + [fill = '#00BFA5'] { v: ac } + [fill = '#FFF'] { v: white } + } } // Global -> Context menu. @@ -1064,6 +1069,8 @@ height: 1px; c: 0 0 ac; } + /// Selected media. + /._2Ji5m { c: 0 hl } } } From a69bf580789b644b9a3a0a3c1c9ce5091911a968 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 02:34:25 +0100 Subject: [PATCH 260/295] global: tweak border color for checkboxes --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 01f61dde..450b0de1 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -329,7 +329,7 @@ span[title *= 'typing...'], ._2ZAIy { c: ac } /// Global -> Checkboxes. - ._1Zo-R { c: 0 bd hl } + ._1Zo-R { c: 0 cm hl } ._15wNI { c: 0 ac ac } /// Global -> Active buttons. From 5c645d0eaf8831faf7713207194e262e8b60470b Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 02:35:02 +0100 Subject: [PATCH 261/295] chat: make shared contact's context menu shorter --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 450b0de1..3b1117d4 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1329,6 +1329,8 @@ c: fg 0 bg; } } + /// Fix context menu height for shared contacts. + ._2rg5w._3EQsG { height: 50px } } /// Left. &-in { From b6e485badee23dab9534bcc16d4feec9bdcd16d9 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 02:36:14 +0100 Subject: [PATCH 262/295] chat: fix context menu for msg with RTL content --- wa.user.styl | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 3b1117d4..18fb751b 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1364,6 +1364,13 @@ &._2PpWQ > div[style *= 'opacity'] { c: 0 0 left } /// Images. &._20WGU { background: linear-gradient(30deg, t 65%, #44444455 120%) i } + /// Fix context menu for local RTL layouts. + /._38wik { + .3EQsG:not(#z):not(#x):not(#y) { + opacity: 1; + background: linear-gradient(90deg, right 25%, t) i; + } + } } /// Replies. ._2HTIU { c: 0 0 bg } @@ -1395,6 +1402,12 @@ &._2PpWQ div[style *= 'opacity'] { c: 0 0 right } /// Images. &._20WGU { background: linear-gradient(30deg, t 65%, #44444455 120%) i } + /// Fix context menu for local RTL layouts. + /._38wik { + .3EQsG:not(#z):not(#x):not(#y) { + background: linear-gradient(90deg, left 25%, t) i; + } + } } /// Replies. ._2HTIU { c: 0 0 bg } From 11dbeceb120548fc06628e8aba4fa5a281201ff2 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 02:42:57 +0100 Subject: [PATCH 263/295] right: fix bg for checkbox button area in links --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 18fb751b..ce2349b2 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1146,6 +1146,8 @@ c: 0 0 t; &::before { c: 0 0 hl } } + /// Right -> Fix bg for checkbox button. + &._21W00::before { c: 0 0 t } } /// Checkboxes. ._15wNI { From dfdaea0e16f71913fd695c6c0bffc16a6e230fbe Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 02:45:40 +0100 Subject: [PATCH 264/295] right: fix header bg/border in selected mode --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index ce2349b2..13718b33 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1050,8 +1050,8 @@ } /// Media/Links/Docs -> Selected header. .yrOIH { - c: 0 0 bg; - box-shadow: 0 1px bd; + c: 0 0 hl; + box-shadow: inset 0 -1px bd; span { c: fg } } /// Media/Links/Docs -> Content. From 5dd1d2104673100a4d17f1d63a1bea47f9f870a3 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 23:33:38 +0100 Subject: [PATCH 265/295] chat: fix context menu for msg with RTL content Note to self: Refresh the page before pushing changes. --- wa.user.styl | 13 ++----------- 1 file changed, 2 insertions(+), 11 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 13718b33..d3657b3d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1367,12 +1367,7 @@ /// Images. &._20WGU { background: linear-gradient(30deg, t 65%, #44444455 120%) i } /// Fix context menu for local RTL layouts. - /._38wik { - .3EQsG:not(#z):not(#x):not(#y) { - opacity: 1; - background: linear-gradient(90deg, right 25%, t) i; - } - } + &._38wik._2Nkc4 { background: linear-gradient(270deg, t, left 80%) i } } /// Replies. ._2HTIU { c: 0 0 bg } @@ -1405,11 +1400,7 @@ /// Images. &._20WGU { background: linear-gradient(30deg, t 65%, #44444455 120%) i } /// Fix context menu for local RTL layouts. - /._38wik { - .3EQsG:not(#z):not(#x):not(#y) { - background: linear-gradient(90deg, left 25%, t) i; - } - } + &._38wik._3EQsG { background: linear-gradient(270deg, t, right 80%) i } } /// Replies. ._2HTIU { c: 0 0 bg } From 49e02c5fc3739f630f6e8348313869cb0054da48 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 23:36:04 +0100 Subject: [PATCH 266/295] chat: tweak gradients for normal messages --- wa.user.styl | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index d3657b3d..78f19c9c 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1359,9 +1359,7 @@ /// Context menu. > div > span:last-child > div[style] { /// Non-stickers. - &:not(._2PpWQ) { - background: linear-gradient(90deg, t, left) i; - } + &:not(._2PpWQ) { background: linear-gradient(90deg, t, left 80%) i } /// Stickers. &._2PpWQ > div[style *= 'opacity'] { c: 0 0 left } /// Images. @@ -1392,9 +1390,7 @@ /// Context menu. > div > span:last-child > div[style] { /// Non-stickers. - &:not(._2PpWQ) { - background: linear-gradient(90deg, t, right) i; - } + &:not(._2PpWQ) { background: linear-gradient(90deg, t, right 80%) i } /// Stickers. &._2PpWQ div[style *= 'opacity'] { c: 0 0 right } /// Images. From 9dd1f3a84139e9e703c089ded448e35d895a1cf7 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 23:44:41 +0100 Subject: [PATCH 267/295] global: tweak hover background for many list items --- wa.user.styl | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 78f19c9c..85a38d97 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -830,7 +830,11 @@ box-shadow: 0 1px bd; /.matched-text:not(#z) { c: ac } /// Active states. - &:hover, &._3mMX1 { + &:hover { + c: 0 0 #55555515; + box-shadow: inset 0 1px bd, 0 1px bd; + } + &._3mMX1 { c: 0 0 bd; box-shadow: inset 0 1px bd, 0 1px bd; } @@ -903,7 +907,10 @@ /._2UaNq { c: 0 0 t; &::after { content: none i } - &:hover:not(#z):not(#x) { c: 0 0 bd } + &:hover:not(#z):not(#x) { + c: 0 0 #55555510; + box-shadow: 0 -1px bd, inset 0 -1px bd; + } [style *= 'height: 82px'] { c: 0 0 t } ._2WP9Q { border-top: none i } /// Nick/info. @@ -915,7 +922,7 @@ border-bottom: 1px solid bd; c: 0 0 t; box-shadow: 0 -1px bd; - &:hover { c: 0 0 bd } + &:hover { c: 0 0 #55555510 } &::before { content: none } > div:last-child { c: 0 t } ._6xQdq { c: fg } @@ -1034,7 +1041,7 @@ /// Search -> Items on hover. [style]:not(#z):not(#x) > div > ._2UaNq { &._3sA1g:hover, &._3mMX1, &.hover { - c: 0 0 bd; + c: 0 0 #55555510; box-shadow: 0 0 0 1px bd; } } From f909df48c89c89633f05431f4f97ba2bcab98dad Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 23:48:04 +0100 Subject: [PATCH 268/295] meta: decrease default intensity for heavy shadows --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 85a38d97..cac558a6 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -73,7 +73,7 @@ @var color green 'Color: Green ' #7b823a @var color white 'Color: White ' #ffffff @var color sh 'Color: Shadow light ' #00000025 -@var color sh-h 'Color: Shadow heavy ' #00000050 +@var color sh-h 'Color: Shadow heavy ' #00000035 ==/UserStyle== */ @-moz-document domain('web.whatsapp.com') { From e63bc3dd3946ee1bd1be7b8b2bc7768967ea8b6f Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 23:53:11 +0100 Subject: [PATCH 269/295] global: fix active items in some context menus --- wa.user.styl | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index cac558a6..1a7a18aa 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -749,9 +749,12 @@ rad: r; c: 0 0 hl; box-shadow: 0 4px 12px sh-h; - li > div { - c: cm; - &:hover { c: fg 0 hl } + li { + &._3VXiW { c: 0 0 bd } + > div { + c: cm; + &:hover { c: fg 0 bd } + } } /// Chat -> Attach dropdown. &._1fRWV { From bb4937cd955cbe632f46f4e62f49d458c21514c5 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sun, 15 Dec 2019 23:56:14 +0100 Subject: [PATCH 270/295] landing: fix a conflict with video being hidden --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 1a7a18aa..3c50bb84 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -261,6 +261,8 @@ + ._310T_ { c: 0 0 t; img { opacity: 0.3 } + /// Reset background on button container. + [style *= 'opacity: 1'] { c: 0 0 t } } /// 'Keep me signed in' reported in #59. ._152b1 { From 416975a3e9b7142f8fafceac8d496a2f9df055a2 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 16 Dec 2019 00:09:59 +0100 Subject: [PATCH 271/295] right: fix missing top border for 1st group member --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index 3c50bb84..68630617 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1017,6 +1017,7 @@ ._3EN0l { padding: 14px 15px } .ujWpH { padding: 14px 15px } ._2nQ7u, ._1goQ0 { padding: 0 } + ._2nQ7u + div[class] > div { padding-top: 1px } ._2LSbZ._2j5ir { margin-bottom: unset } ._1tyVr { padding: 0 15px; From c2e1dae509085e643d0ddb2703c11982e471ecb6 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 16 Dec 2019 00:12:51 +0100 Subject: [PATCH 272/295] right: add box-shadow to msg info reset in DMs --- wa.user.styl | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 68630617..ecc55cc1 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1038,8 +1038,11 @@ c: 0 0 t; box-shadow: 0 1px bd; } - /// HACK: Reset msg info hover in DMs but not in groups. - .rK2ei:not(._1c8mz):not(#z):not(#x) ._2UaNq:hover { c: 0 0 t } + /// HACK: Reset msg info in DMs but not in groups. + .rK2ei:not(._1c8mz):not(#z):not(#x) ._2UaNq:hover { + c: 0 0 t; + box-shadow: none i; + } /// Read/Delivered section. ._2WP9Q { border: none } /// Search -> Default message. From feecafbcdb9f8f3511a137ded9e5b4382eaebe92 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 16 Dec 2019 00:15:44 +0100 Subject: [PATCH 273/295] global: tweak archived/admin badge colors --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index ecc55cc1..5a9ce2a8 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -472,8 +472,8 @@ } // Global -> Badges. - ._2WwbV { c: blue blue bg } - .FPZFa { c: green green bg } + ._2WwbV { c: blue blue hl } + .FPZFa { c: ac ac hl } /// Global -> Modals. .overlay { From c83167d2c7f70c1d05c877b3f3b39f3e9ba0e832 Mon Sep 17 00:00:00 2001 From: vednoc Date: Mon, 16 Dec 2019 00:20:23 +0100 Subject: [PATCH 274/295] global: fix conflict with attach dropdown items --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 5a9ce2a8..6b66ed00 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -752,7 +752,7 @@ c: 0 0 hl; box-shadow: 0 4px 12px sh-h; li { - &._3VXiW { c: 0 0 bd } + &._3VXiW > div { c: 0 0 bd } > div { c: cm; &:hover { c: fg 0 bd } From 83cb4372cf497efbfdbc7c55c9f31e3a86109e6b Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 17 Dec 2019 23:56:42 +0100 Subject: [PATCH 275/295] modals: add width/fullscren options to status area --- wa.user.styl | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 6b66ed00..2d8f19a6 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -388,15 +388,19 @@ rad: r; box-shadow: bsh; /// Feat -> Custom max-width. - width: calc(100% - 38px); - max-width: var(--app-width); + &, /._11ARv { + width: calc(100% - 38px); + max-width: var(--app-width); + } /// Feat -> Fullscreen mode. if ( fullscreen == 1 ) { - rad: 0; - top: unset; - width: 100%; - max-width: 100%; - height: 100%; + &, /._11ARv { + rad: 0; + top: unset; + width: 100%; + max-width: 100%; + height: 100%; + } } } /// Right -> Fix the width with three open panes. From ef91f1d0f9332821d49547ac9edacdddcbcabb2e Mon Sep 17 00:00:00 2001 From: vednoc Date: Tue, 17 Dec 2019 23:56:41 +0100 Subject: [PATCH 276/295] left: fix text color in blocked contacts area --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 2d8f19a6..35e6b16f 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -604,7 +604,7 @@ /.fwByR { c: ac } } /// Settings -> Help. - ._1wt6r { c: cm } + ._1wt6r, /.bHCVK { c: cm } ._3hnO5 { c: 0 ac } ._1T8rb { c: ac 0 t } /// Left -> Turn on desktop notifications. From a9ff2eb235967a5da127c430f78f93c06c7d1972 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 18 Dec 2019 23:42:13 +0100 Subject: [PATCH 277/295] global: bring back default borders for list items --- wa.user.styl | 24 ++++++------------------ 1 file changed, 6 insertions(+), 18 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 35e6b16f..6d035b1a 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -836,17 +836,10 @@ /// Items. [style *= 'z-index'] > div > div[class] { c: 0 0 t; - box-shadow: 0 1px bd; /.matched-text:not(#z) { c: ac } /// Active states. - &:hover { - c: 0 0 #55555515; - box-shadow: inset 0 1px bd, 0 1px bd; - } - &._3mMX1 { - c: 0 0 bd; - box-shadow: inset 0 1px bd, 0 1px bd; - } + &:hover { c: 0 0 #55555515 } + &._3mMX1 { c: 0 0 bd } /// Remove borders. &::after, > div:last-child { border: none } /// Avatar background. @@ -912,14 +905,12 @@ /// Input area border. /._5UNoc ._3hnO5 { c: 0 ac } } - /// Settings -> User info section. + /// Global -> List items. /._2UaNq { + border-top: 1px solid bd; c: 0 0 t; &::after { content: none i } - &:hover:not(#z):not(#x) { - c: 0 0 #55555510; - box-shadow: 0 -1px bd, inset 0 -1px bd; - } + &:hover:not(#z):not(#x) { c: 0 0 #55555510 } [style *= 'height: 82px'] { c: 0 0 t } ._2WP9Q { border-top: none i } /// Nick/info. @@ -1053,10 +1044,7 @@ ._3dwyT { c: cm } /// Search -> Items on hover. [style]:not(#z):not(#x) > div > ._2UaNq { - &._3sA1g:hover, &._3mMX1, &.hover { - c: 0 0 #55555510; - box-shadow: 0 0 0 1px bd; - } + &._3sA1g:hover, &._3mMX1, &.hover { c: 0 0 #55555510 } } /// Search -> Msg content/date. span[title] > span[dir] { c: fg } From 5ee4f1e6089245b544710fa7dea22def190333a6 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 18 Dec 2019 23:56:11 +0100 Subject: [PATCH 278/295] left: fix colors for already blocked contact --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 6d035b1a..77549c0d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -916,6 +916,8 @@ /// Nick/info. ._3H4MS { c: fg } .xD91K { c: cm } + /// Already blocked. + &._30Q1W { .3H4MS:not(#z) { c: cm }} } /// Settings -> Options. ._26JG5 { From 2460d732146757940f18ee80ee52f62c8ded6a90 Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 18 Dec 2019 23:56:29 +0100 Subject: [PATCH 279/295] chat: fix colors for audio length while recording --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 77549c0d..219367f6 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1586,6 +1586,8 @@ } ._3SW-z { c: cm } } + /// Audio msg length. + /._2NdXo { c: cm } } // Fix whitespace for message content/timestamp. @upstream From 5e3ab06bc4d93158e87c0c129341708fd9c7f3fe Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 18 Dec 2019 23:56:51 +0100 Subject: [PATCH 280/295] left: remove border from first item in settings --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 219367f6..cc08dbb6 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -918,6 +918,8 @@ .xD91K { c: cm } /// Already blocked. &._30Q1W { .3H4MS:not(#z) { c: cm }} + /// Settings -> Reset first list item. + &._3fAgu { border-top: none i } } /// Settings -> Options. ._26JG5 { From df762d344ba657420a67a7a1bd945f10c525cabb Mon Sep 17 00:00:00 2001 From: vednoc Date: Wed, 18 Dec 2019 23:57:37 +0100 Subject: [PATCH 281/295] chat: fix colors for played audio msg in info area --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index cc08dbb6..bf6ca9a4 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -717,6 +717,8 @@ &:first-child { fill: bd } &:last-child { fill: ac } } + /// Message info -> Played audio message. + &[data-icon = 'status-ptt-blue'] path { fill: ac i } /// Message status. &[data-icon *= '-check'] path { v: cm } &[data-icon *= '-dblcheck'] path { v: cm } From d39452fd6c68592239fef0741d7cfb4feb764730 Mon Sep 17 00:00:00 2001 From: vednoc Date: Thu, 19 Dec 2019 00:20:40 +0100 Subject: [PATCH 282/295] left: fix colors for disabled notifications --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index bf6ca9a4..263d0502 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -609,6 +609,8 @@ ._1T8rb { c: ac 0 t } /// Left -> Turn on desktop notifications. .NWyjc.AZ3xD { margin: 16px } + /// Left -> Show previews for notifications. + /._2vOyW._26EsD .lz4Mo { c: fg } } // Global -> Status. From 8c2c538aed414eeea203325d26e903070c5ff95e Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 20 Dec 2019 23:47:45 +0100 Subject: [PATCH 283/295] modals: remove borders from items in status area --- wa.user.styl | 2 ++ 1 file changed, 2 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index 263d0502..d19e7939 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -653,6 +653,8 @@ /// Reset the circle icon. svg[width][height] path { v: t fg } } + /// Remove borders from list items. + ._2UaNq { border-top: none } /// Reply to the status. /.QRsOy { c: 0 0 bg } /// Feat -> Fullscreen mode. From 0d7edde7350b73017a2c5c19a2fb676a5ab66952 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 20 Dec 2019 23:52:35 +0100 Subject: [PATCH 284/295] left: fix colors when adding group participants --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index d19e7939..c18b5654 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -926,6 +926,12 @@ &._30Q1W { .3H4MS:not(#z) { c: cm }} /// Settings -> Reset first list item. &._3fAgu { border-top: none i } + /// Left -> Add group participants. + &._27Ppf { + c: 0 0 bd; + /// Default avatar background. + [style *= 'height: 26px'] { c: 0 0 bd } + } } /// Settings -> Options. ._26JG5 { From 7b85efad6a59f9b40b0edf7182e82cfd7c480df1 Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 20 Dec 2019 23:55:04 +0100 Subject: [PATCH 285/295] left: fix char limit and badge hover state --- wa.user.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index c18b5654..5dc40392 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -604,7 +604,7 @@ /.fwByR { c: ac } } /// Settings -> Help. - ._1wt6r, /.bHCVK { c: cm } + ._1wt6r, /._3Yulp, /.bHCVK { c: cm } ._3hnO5 { c: 0 ac } ._1T8rb { c: ac 0 t } /// Left -> Turn on desktop notifications. @@ -916,7 +916,7 @@ border-top: 1px solid bd; c: 0 0 t; &::after { content: none i } - &:hover:not(#z):not(#x) { c: 0 0 #55555510 } + &:hover:not(#z):not(._27Ppf) { c: 0 0 #55555510 } [style *= 'height: 82px'] { c: 0 0 t } ._2WP9Q { border-top: none i } /// Nick/info. From 4a1ceae2033df5bda8ce8a8d218ffddb7a9b19ef Mon Sep 17 00:00:00 2001 From: vednoc Date: Fri, 20 Dec 2019 23:55:35 +0100 Subject: [PATCH 286/295] chat: be more specific about image timestamp It was visible when using custom colors for message bubbles. --- wa.user.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wa.user.styl b/wa.user.styl index 5dc40392..f327cd9d 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -1337,7 +1337,7 @@ /// Search -> Selected message. &.velocity-animating { opacity: 0.4 } /// Images -> Timestamp. - div[style *= 'width'][style *= 'height'] + div[class] { + div[style *= 'width'][style *= 'height'] + .iVt71 { padding: 2px 5px; rad: 7.5px; c: 0 0 hl; From c9310d936e8cab30aa7f27e1e2a2b5602e0eab80 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 21 Dec 2019 21:18:26 +0100 Subject: [PATCH 287/295] feat: add option to set thin scrollbars in Firefox Enabled by default in order to be the the same as in Chromium. --- wa.user.styl | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index f327cd9d..fdf681a4 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -56,6 +56,7 @@ @var checkbox chat_right 'Chat: Align right msg ' 0 @var checkbox ss-mode 'App: Screenshot mode ' 0 +@var checkbox ff_scroll 'Thin scrollbars in Firefox' 1 @var color dark 'Color: Primary background ' #292929 @var color darken 'Color: Highlight background ' #333333 @@ -79,6 +80,11 @@ @-moz-document domain('web.whatsapp.com') { :root { + /// Feat -> Thin scrollbar in Firefox. + if ( ff_scroll == 1 ) { + * { scrollbar-width: thin } + } + /// Feat -> Toggle between themes. if ( theme == 1 ) { --dark : dark; --darken : darken; From 4a2f8c146df84cf3a8646a119a16c78a23f74a68 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 21 Dec 2019 22:14:13 +0100 Subject: [PATCH 288/295] global: fix sliders for built-in media player --- wa.user.styl | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index fdf681a4..a25b37c6 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -362,6 +362,17 @@ /// Group invite link. #group-invite-link-anchor { c: ac } + + /// Global -> Media player. + /.OZVc4 { + /// Reset sliders. + ._3N5w5 { + &::-webkit-slider-runnable-track { c: 0 0 t } + &::-moz-range { &-progress, &-track { c: 0 0 t }} + } + /// Progress bar. + ._2bTRm ._2ZXtj { c: 0 0 ac } + } } #app > div { From 6ddd1f94d2e74e0f2841fa36406ca16616292652 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 21 Dec 2019 23:05:16 +0100 Subject: [PATCH 289/295] feat: re-implement and improve old compact mode --- wa.user.styl | 123 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 123 insertions(+) diff --git a/wa.user.styl b/wa.user.styl index a25b37c6..64a538d7 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -13,6 +13,7 @@ @var text ui_font 'App: Custom UI font ' ''font_name'' @var text radius-g 'App: Global el radius ' 4px @var text radius-i 'App: Inputfield radius' 4px +@var checkbox app_c_m 'Enable compact mode ' 1 @var checkbox fullscreen 'App: Enable fullscreen' 0 @var text app_width 'App: Custom max-width ' 1396px @@ -1644,4 +1645,126 @@ img, .emoji { visibility: hidden i } } } + + /// Feat -> Compact mode. + if ( app_c_m == 1 ) { + /// Reset height/width if there's an overflow. + #app > div > .app { + @media screen and (max-height: 500px) { min-height: auto } + @media screen and (max-width: 648px) { min-width: auto } + // > div *:hover { box-shadow: inset 0 0 0 1px crimson i } + } + /// Compact mode. + @media screen and (max-width: 9999px) { + .two, .three { + /// Left -> Settings/Contacts. + > div:nth-child(3) { + flex: 0 0 80px i; + transition: 0.2s ease; + &:hover, &:focus-within { flex: 0 0 30% i } + } + } + .two { + /// Reset upload preview. + > div:nth-child(2) > div._2rI9W { + flex: 0 0 calc(100% - 80px) i; + margin-left: calc(-25% + 80px); + } + /// Expand contacts. + > div:nth-child(3) { + min-width: 1px i; + transition: 0.3s ease i; + transition-delay: 1.2s i; + &:hover { + min-width: 400px i; + transition-delay: var(--hover-delay) i; + flex: 0 0 30% i; + } + } + /// Settings. + ._3kF8H { flex: 0 0 25% } + } + .three { + /// Reset upload preview. + > div:nth-child(2) > div._2rI9W { + flex: 0 0 calc(100% - 30% - 80px) i; + margin-left: calc(-25% + 80px); + } + /// Reset chat when info is open. + > div:nth-child(4) { + flex: 0 0 calc(100% - 30% - 80px) i; + } + /// Don't expand left pane. + > div:nth-child(3):hover { flex: 0 0 80px i } + /// Right -> Info pane. + ._1C9rS { + flex: 0 0 30% i; + c: 0 t; + } + } + /// Fix search bar width. + .ZP8RM:not(._19OGD) label { padding: 0px } + /// Contacts. + #side { + // Fix header width. + > header { + min-width: 240px; + /// Hide notifications. + + span { display: none } + } + /// HACK: Unread message indicator. + ._2UaNq .xD91K { + z-index: 199 i; + display: flex i; + flex-direction: row-reverse i; + } + /// Items. + ._2UaNq { + /// Remove unnecessary icons. + ._1ZMSM > span:not(.P6z4j) { display: none i } + /// Reset text position. + .xD91K span[dir] { margin-left: 10px } + /// Unread messages. + ._1ZMSM .P6z4j { + z-index: 999 i; + line-height: 22px i; + margin: 7px 0px 0px -60px i; + box-shadow: 0 0 0 3px hl i; + } + /// Message status. + ._3VIru { + padding: 0.5px; + z-index: 101; + position: absolute; + margin: 5px 0 0 -55px; + border-radius: 50%; + c: 0 0 bg; + box-shadow: 0 0 0 3px hl; + /// Make SVG smaller. + > span > svg { + padding: 2px; + height: 14px i; + width: 14px i; + } + } + /// Active states. + &._3mMX1 .xD91K { + .P6z4j, ._3VIru { box-shadow: 0 0 0 3px bd i } + } + &:hover:not(._3mMX1) .xD91K { + .P6z4j, ._3VIru { + box-shadow: 0 0 0 3px #ffffff05, 0 0 0 3px hl i; + } + } + } + /// Unset overflow to be able to see indicators. + ._0LqQ { + margin-left: -10px i; + overflow: unset i; + /// Prevents indicators jumping all over the place. + > span:last-child:not(._17TaE) { display: none i } + } + } + } + } } From c8c94ea4a3c5fa5c7e5f004866d800461a958f6d Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 21 Dec 2019 23:06:32 +0100 Subject: [PATCH 290/295] feat: re-implement options for compact mode --- wa.user.styl | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 64a538d7..e7493de0 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -13,7 +13,9 @@ @var text ui_font 'App: Custom UI font ' ''font_name'' @var text radius-g 'App: Global el radius ' 4px @var text radius-i 'App: Inputfield radius' 4px -@var checkbox app_c_m 'Enable compact mode ' 1 +@var checkbox app_c_m 'Enable compact mode' 1 +@var text app_c_m_w 'Compact mode width' 720px +@var text app_c_m_h 'Compact mode hover delay' 1s @var checkbox fullscreen 'App: Enable fullscreen' 0 @var text app_width 'App: Custom max-width ' 1396px @@ -133,6 +135,8 @@ --chat-bg-o : chat_bg_o; --chat-bg-i : chat_bg_i; + --c-m-hover : app_c_m_h; + --ui-font : ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica, 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; @@ -1655,7 +1659,7 @@ // > div *:hover { box-shadow: inset 0 0 0 1px crimson i } } /// Compact mode. - @media screen and (max-width: 9999px) { + @media screen and (max-width: app_c_m_w) { .two, .three { /// Left -> Settings/Contacts. > div:nth-child(3) { @@ -1677,7 +1681,7 @@ transition-delay: 1.2s i; &:hover { min-width: 400px i; - transition-delay: var(--hover-delay) i; + transition-delay: var(--c-m-hover) i; flex: 0 0 30% i; } } From 726e3b738681e58d807134c1a9619a70ebc72e8e Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 21 Dec 2019 23:13:34 +0100 Subject: [PATCH 291/295] feat: swap the colors for old/new colors option --- wa.user.styl | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index e7493de0..40192064 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -9,7 +9,7 @@ @license MIT @preprocessor stylus -@var checkbox theme 'Old/custom colorscheme' 0 +@var checkbox theme 'Old/custom or new color-scheme' 0 @var text ui_font 'App: Custom UI font ' ''font_name'' @var text radius-g 'App: Global el radius ' 4px @var text radius-i 'App: Inputfield radius' 4px @@ -61,11 +61,11 @@ @var checkbox ss-mode 'App: Screenshot mode ' 0 @var checkbox ff_scroll 'Thin scrollbars in Firefox' 1 -@var color dark 'Color: Primary background ' #292929 -@var color darken 'Color: Highlight background ' #333333 -@var color darker 'Color: Secondary background ' #424242 -@var color light 'Color: Primary foreground ' #e6e6e6 -@var color lighter 'Color: Secondary foreground ' #bababa +@var color dark 'Color: Primary background ' #1f232a +@var color darken 'Color: Highlight background ' #252A33 +@var color darker 'Color: Secondary background ' #2c313a +@var color light 'Color: Primary foreground ' #e9e9e9 +@var color lighter 'Color: Secondary foreground ' #a1a1a1 @var color accent 'Color: Accent ' #7289da @var color yellow 'Color: Yellow ' #f0c674 @var color orange 'Color: Orange ' #d98245 @@ -88,7 +88,7 @@ * { scrollbar-width: thin } } /// Feat -> Toggle between themes. - if ( theme == 1 ) { + if ( theme == 0 ) { --dark : dark; --darken : darken; --darker : darker; @@ -98,11 +98,11 @@ --shadow : sh; --sh-h : sh-h; } else { - --dark : #1f232a; - --darken : #252A33; - --darker : #2c313a; - --light : #e9e9e9; - --lighter : #a1a1a1; + --dark : #292929; + --darken : #333333; + --darker : #424242; + --light : #e6e6e6; + --lighter : #bababa; --accent : accent; --shadow : sh; --sh-h : sh-h; From a85b8e44feea27ae06368956665a8fd6c97561e6 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 21 Dec 2019 23:33:54 +0100 Subject: [PATCH 292/295] meta: rewrite options and their descriptions --- wa.user.styl | 69 +++++++++++++++++++++++++--------------------------- 1 file changed, 33 insertions(+), 36 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 40192064..b3263934 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -10,55 +10,53 @@ @preprocessor stylus @var checkbox theme 'Old/custom or new color-scheme' 0 -@var text ui_font 'App: Custom UI font ' ''font_name'' -@var text radius-g 'App: Global el radius ' 4px -@var text radius-i 'App: Inputfield radius' 4px +@var text ui_font 'Custom UI font' ''font_name'' +@var text radius-g 'Custom rounded corners for menus' 4px +@var text radius-i 'Custom rounded corners for input area' 4px +@var text app_width 'Custom width for chat app' 1396px +@var checkbox fullscreen 'Enable fullscreen mode' 0 @var checkbox app_c_m 'Enable compact mode' 1 -@var text app_c_m_w 'Compact mode width' 720px -@var text app_c_m_h 'Compact mode hover delay' 1s -@var checkbox fullscreen 'App: Enable fullscreen' 0 -@var text app_width 'App: Custom max-width ' 1396px +@var text app_c_m_w 'Compact mode breakpoint' 720px +@var text app_c_m_h 'Compact mode on-hover delay' 1s -@var checkbox emoji_t 'Emoji: Transparent img' 1 -@var range emoji_o 'Emoji: Default opacity' [0.8, 0.0, 1, 0.01] -@var range emoji_r 'Emoji: Clip size ' [49, 48, 70, 1, '%'] +@var checkbox chat_b_c 'Enable blurred contacts' 0 +@var checkbox chat_b_img 'Enable blurred images/videos' 0 -@var select app_image 'App: Custom background' { +@var checkbox chat_msg_t 'Hide message tails' 0 + +@var checkbox chat_left 'Left message bubble position' 0 +@var checkbox chat_right 'Right message bubble position' 0 + + +@var checkbox emoji_t 'Enable transparent emojis' 1 +@var range emoji_o 'Emoji default opacity' [0.8, 0.0, 1, 0.01] + +@var select app_image 'Custom app background' { 'Custom *': 'custom ', 'Default ': 'default ', 'None ': 'none ', } -@var text image_url 'App: Custom bg link ' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') -@var range bg_opacity 'App: Image opacity ' [0.5, 0.0, 1, 0.01] -@var range bg_blur 'App: Image blur size ' [8, 0, 50, 1, 'px'] -@var range bg_hue 'App: Image hue ' [0, 0, 360, 1, 'deg'] -@var range bg_invert 'App: Image inversion ' [0, 0.0, 1, 0.1] +@var text image_url 'Custom background image link' url('https://images.unsplash.com/photo-1434569117012-ce134ee1a088?fit=crop&w=1280&h=720&q=80') +@var range bg_opacity 'Background image opacity' [0.4, 0.0, 1, 0.01] +@var range bg_blur 'Background image blur size' [12, 0, 50, 1, 'px'] +@var range bg_hue 'Background image hue' [320, 0, 360, 1, 'deg'] +@var range bg_invert 'Background image invert colors' [0, 0.0, 1, 0.1] -@var checkbox chat_msg_t 'Chat: Hide msg tails ' 0 +@var checkbox chat_bg 'Enable chat background image' 1 +@var text chat_image 'Custom image for chat' url('/img/bg-chat-tile_8a055527b27b887521a9f084497d8879.png') +@var range chat_bg_o 'Chat background image opacity' [0.1, 0.0, 1, 0.01] +@var range chat_bg_i 'Chat background image inverted colors' [0.6, 0.0, 1, 0.1] -@var select chat_b_l 'Chat: Left bubble bg ' { +@var select chat_b_l 'Left message bubble background' { 'Default *': 'default ', 'Custom ': 'custom ', } -@var color b_l_bg 'Chat: Left bubble custom bg ' #222730 -@var select chat_b_r 'Chat: Right bubble bg ' { +@var color b_l_bg 'Left bubble color' #222730 +@var select chat_b_r 'Right message bubble background' { 'Default *': 'default ', 'Custom ': 'custom ', } -@var color b_r_bg 'Chat: Right bubble custom bg' #1f232a - -@var checkbox chat_b_c 'Chat: Blur contacts ' 0 -@var checkbox chat_b_img 'Chat: Blur img/videos ' 0 - -@var checkbox chat_bg 'Chat: Show bg image ' 1 -@var text chat_image 'Chat: Custom image URL' url('/img/bg-chat-tile_8a055527b27b887521a9f084497d8879.png') -@var range chat_bg_o 'Chat: Bg image opacity' [0.1, 0.0, 1, 0.01] -@var range chat_bg_i 'Chat: Bg image invert ' [0.6, 0.0, 1, 0.1] - -@var checkbox chat_left 'Chat: Align left msg ' 0 -@var checkbox chat_right 'Chat: Align right msg ' 0 - -@var checkbox ss-mode 'App: Screenshot mode ' 0 +@var color b_r_bg 'Right bubble color' #1f232a @var checkbox ff_scroll 'Thin scrollbars in Firefox' 1 @var color dark 'Color: Primary background ' #1f232a @@ -123,7 +121,6 @@ --app-width : app_width; --emoji-o : emoji_o; - --emoji-r : emoji_r; --bg-image : image_url; --bg-opacity: bg_opacity; @@ -461,7 +458,7 @@ } } } else { - clip-path: circle(var(--emoji-r)); + clip-path: circle(49%); } } From 595667152c4fed20413f5c0120d1ba08a743998f Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 21 Dec 2019 23:36:54 +0100 Subject: [PATCH 293/295] meta: add new updateURL link --- wa.user.styl | 1 + 1 file changed, 1 insertion(+) diff --git a/wa.user.styl b/wa.user.styl index b3263934..2df64220 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -4,6 +4,7 @@ @namespace github.com/vednoc/dark-whatsapp @homepageURL https://github.com/vednoc/dark-whatsapp @supportURL https://github.com/vednoc/dark-whatsapp/issues +@updateURL https://raw.githubusercontent.com/vednoc/dark-whatsapp/master/wa.user.styl @version 1.9.9 @author vednoc (https://github.com/vednoc) @license MIT From 7211e3da50ef99d8244f5728d804f37e6e8c5bd2 Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 21 Dec 2019 23:45:35 +0100 Subject: [PATCH 294/295] docs: add new changelog --- changelog.org | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 changelog.org diff --git a/changelog.org b/changelog.org new file mode 100644 index 00000000..3ab5ef10 --- /dev/null +++ b/changelog.org @@ -0,0 +1,3 @@ +* Changelog +** 2.0.0 [2019-12-21] +Moving forward, all the changes will be documented here. From 868000178a308a693da4921b0c87daa3db287e7e Mon Sep 17 00:00:00 2001 From: vednoc Date: Sat, 21 Dec 2019 23:48:43 +0100 Subject: [PATCH 295/295] release: 2.0.0 --- wa.user.styl | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/wa.user.styl b/wa.user.styl index 2df64220..232361f5 100644 --- a/wa.user.styl +++ b/wa.user.styl @@ -5,7 +5,7 @@ @homepageURL https://github.com/vednoc/dark-whatsapp @supportURL https://github.com/vednoc/dark-whatsapp/issues @updateURL https://raw.githubusercontent.com/vednoc/dark-whatsapp/master/wa.user.styl -@version 1.9.9 +@version 2.0.0 @author vednoc (https://github.com/vednoc) @license MIT @preprocessor stylus @@ -138,9 +138,9 @@ --ui-font : ui_font, 'Segoe UI', 'Helvetica Neue', Helvetica, 'Lucida Grande', Arial, Ubuntu, Cantarell, 'Fira Sans', sans-serif; - --version : 'Dark-WhatsApp [Alpha] v1.9.9'; - --message : 'WIP v2. '; - --changes : 'See the PR at: https://github.com/vednoc/dark-whatsapp/pull/38'; + --version : 'Dark-WhatsApp v2.0.0'; + --message : 'The v2 is finally here! 🎉 🥳 Read more: '; + --changes : 'https://vednoc.me/blog/the-new-dark-whatsapp'; } // Use stylus-lang variables with CSS variables.