// ==UserScript== // @name Dark WhatsApp Theme by Mew // @namespace http://userstyles.org // @description Complete, dark and light, very customizable userstyle for WhatsApp. In active development, check the page to get involved. // @author Vednoc // @homepage https://userstyles.org/styles/142096 // @include http://web.whatsapp.com/* // @include https://web.whatsapp.com/* // @include http://*.web.whatsapp.com/* // @include https://*.web.whatsapp.com/* // @run-at document-start // @version 0.20191118231148 // ==/UserScript== (function() {var css = [ "/**", " * Everything you need to know is below:", " * Source: https://github.com/vednoc/onyx", " * Discord: https://discord.gg/NpT8PzA", " * License: MIT", " */", "", " :root {", " --dark: #272C35;", " --darker: #1F232A;", " --light: #D1D1D1;", " --lighter: #E9E9E9;", " --accent: #7289DA;", " --icon: #E1E1E1;", " --shadow: rgba(0,0,0,0.10);", " --mred: #A3525B;", " --mgreen: #70A352;", " --mblue: #527AA3;", " --hover-delay: 0.8s;", " --image: url(https://media.discordapp.net/attachments/310799529161129984/417408747812552715/zilesanamin.jpg);", " --emojiOpacity: 0.75;", " --ui-font: \'font_name\', \'Segoe UI\', \'Helvetica Neue\', \'Helvetica\', \'Lucida Grande\', \'Arial\', \'Ubuntu\', \'Cantarell\', \'Fira Sans\', sans-serif;", " --version: \"WhatsApp by Mew v1.6.2\";", " --message: \"Updated on 18th of November. Addressing GH issues and pull requests. \";", " --changes: \"See the changelog at: https://github.com/vednoc/onyx/releases\";", " }", "", " /* Body reset. */", " body {", " font-family: var(--ui-font);", " background: none;", " background-color: var(--dark); }", "", " /* Scrollbar track. */", " *::-webkit-scrollbar-track {", " background-color: var(--shadow); }", " /* Scrollbar thumb. */", " *::-webkit-scrollbar-thumb {", " background-color: var(--accent); }", " * {", " scrollbar-width: thin;", " scrollbar-color: var(--accent) var(--shadow); }", "", " /* Highlight selection. */", " ::selection {", " color: var(--light) !important;", " background-color: var(--accent) !important; }", " ::-moz-selection {", " color: var(--light) !important;", " background-color: var(--accent) !important; }", " /* Input placeholders. */", " ::placeholder { color: var(--lighter) !important; }", " ::-moz-placeholder { color: var(--lighter) !important; }", " ::-webkit-input-placeholder { color: var(--lighter) !important; }", "", " /* Progress. */", " progress[value]::-webkit-progress-bar {", " background: var(--darker); }", " /* Value. */", " progress[value]::-webkit-progress-value {", " background: var(--accent); }", " progress {", " background: var(--darker); }", " ::-moz-progress-bar {", " background: var(--accent) !important; }", "", " /* App wrapper. */", " #app .app {", " background: none;", " background-color: var(--dark); }", "", " /* Log-in page. */", " .landing-wrapper::before {", " opacity: 0.6;", " background-color: var(--accent) !important; }", " .landing-window {", " border-radius: 4px !important;", " border: 1px solid var(--shadow);", " box-shadow: 0 8px 32px 0 var(--shadow) !important;", " background-color: var(--darker) !important; }", " .landing-main + div {", " background-color: var(--darker) !important; }", " .landing-main + div img:not(:hover) {", " opacity: 0.3; }", " /* Text color. */", " .landing-main * {", " color: var(--light); }", " /* Reload QR code. */", " ._1MOym {", " background-color: var(--darker) !important; }", " ._3PxOr rect {", " fill: var(--dark) !important; }", " /* Fix QR code. */", " .landing-wrapper div[data-ref] {", " border-radius: 0;", " filter: contrast(150%) !important;", " outline: 4px solid white !important; }", " /* Loader. */", " #startup svg > circle {", " stroke: var(--lighter) !important; }", " /* Logo colors. */", " span._3PxOr svg path:nth-child(1) {", " fill: var(--dark) !important; }", "", "", " /* Landing page. */", " .app .iFKgT {", " border: none;", " background-color: var(--dark) !important; }", " /* Image. */", " .app .iFKgT [data-asset-intro-image] {", " max-width: 200px;", " max-height: 200px;", " border-radius: 50%;", " filter: opacity(0.75);", " transition: opacity 1s ease !important; }", " /* Text color. */", " .app .iFKgT * {", " color: var(--light); }", " /* Accent bar. */", " .app .iFKgT::after {", " border-top-color: var(--accent) !important; }", " /* Hide the text. */", " .iFKgT ._3mkas { font-size: 0px; }", " /** Theme note. */", " .app .iFKgT ._3mkas::before {", " display: block;", " margin-bottom: -20px;", " font-size: 16px;", " content: var(--message) var(--changes) !important;", " }", " /** Theme info. */", " .app .iFKgT ._3mkas::after {", " display: block;", " margin-top: 10px;", " padding-top: 10px;", " font-size: 16px;", " content: var(--version) !important;", " border-top: 1px solid var(--darker);", " }", "", " /* Left drawer. */", " #app .app #side {", " background-color: var(--darker); }", "", " /* Chat list. */", " #side > header {", " background-color: var(--darker) !important; }", "", " /* Enable notifications. */", " #side ._2GB6m {", " background-color: var(--accent) !important; }", " /* Low battery. */", " #side ._2t3oV {", " background-color: var(--mred) !important; }", " /* Phone not connected. */", " #side ._1puWZ {", " background-color: var(--mred) !important; }", " /* Text color. */", " #side ._2GB6m *,", " #side ._1puWZ * {", " color: var(--lighter); }", "", " /* Global -> Search. */", " ._2HS9r {", " border-bottom: 0px solid var(--dark);", " background-color: var(--darker) !important;", " background-color: transparent !important; }", " /* Label background. */", " .ZP8RM label, .ZP8RM._19OGD {", " border: 0px solid var(--dark);", " background-color: var(--dark) !important; }", " /* Input element. */", " .ZP8RM ._183ES,", " .ZP8RM label input {", " color: var(--light);", " background-color: transparent; }", " .ZP8RM::after,", " .ZP8RM > div::after {", " border-color: var(--darker) !important;", " background-color: var(--dark) !important; }", "", " /* New group and group info buttons. */", " ._1w-mX, ._70TS5, ._11p3Q, .r7sRK, ._8-yzK {", " /* box-shadow: 0 0 8px -1px var(--shadow) !important; */", " color: var(--accent) !important;", " background-color: transparent !important; }", " /* Hide borders. */", " ._2DxRd, ._39cGk {", " border-color: var(--shadow) !important; }", " /* Input text color. */", " ._44uDJ {", " color: var(--light) !important; }", "", " /* Search results. */", " #side ._1AKfk {", " color: var(--accent);", " background-color: var(--dark); }", " /* Matching results. */", " #side .matched-text {", " color: var(--accent) !important; }", "", " /* Contacts wrapper. */", " #pane-side, ._11GZy ._2UaNq {", " background-color: transparent !important; }", " /* Contacts. */", " ._2UaNq, ._11GZy ._26JG5 {", " transition: 200ms ease-in-out;", " background-color: transparent !important; }", " /* On event. */", " ._2UaNq._3mMX1, ._2UaNq:hover {", " background-color: var(--dark) !important; }", " /* Text color. */", " ._2UaNq *:not(#z) {", " color: var(--light) !important; }", " /* Borders. */", " ._2UaNq::after, ._2WP9Q {", " border-color: transparent !important; }", " /* Avatar wrapper background. */", " ._3RWII {", " box-shadow: 0 0 8px -1px var(--shadow) !important;", " background-color: transparent !important; }", "", " /* New message indicator. */", " #side .P6z4j {", " color: white !important;", " background-color: var(--accent) !important; }", "", "", " /* Settings. */", " ._11GZy, ._1KDYa {", " background-color: var(--darker) !important; }", " /* Header color. */", " ._11GZy header, ._1KDYa header {", " min-height: 50px;", " height: auto;", " background-color: var(--darker) !important; }", " /* Send contacts. #42 */", " .WOXAS,", " ._1v8mQ {", " background-color: transparent !important; }", " /* Footer. */", " ._21bWq, ._22oFl {", " background-color: var(--accent) !important; }", " /* Reset header height. */", " ._11GZy header > div:first-child {", " padding: 12px 0 !important;", " height: auto; }", " /* Reset header title in left/right drawers. */", " ._11GZy ._1xGbt {", " margin-top: 2px !important;", " font-size: 16px; }", " /* Transparent sections. */", " ._11GZy ._1CRb5, ._1KDYa ._2LSbZ {", " box-shadow: none !important;", " background-color: transparent !important; }", " /* Highlighted sections. */", " ._11GZy ._3hhmj ._1CkkN {", " background-color: var(--darker) !important; }", " /* Change profile picture. */", " ._11GZy .WX_XW, ._11GZy ._2Lbqu, ._1JS2G {", " background-color: rgba(0,0,0,0.5) !important; }", " /* Text color. */", " ._11GZy * {", " color: var(--light); }", " /* Input element. */", " ._5UNoc ._3hnO5 { border-color: var(--accent) !important; }", " /* Wrapper background. */", " ._3979j { background-color: transparent !important }", " /* Take a new profile picture. */", " ._2HyTU, ._22aOT {", " background-color: var(--darker) !important; }", " /* Confirm button. */", " ._2HyTU ._1g8sv, ._22aOT ._1g8sv {", " box-shadow: 0 2px 4px 0 var(--shadow) !important;", " background-color: var(--accent) !important; }", " /* Zoom in/out. */", " ._1DKwn {", " box-shadow: 0 2px 4px 0 var(--shadow) !important;", " background-color: var(--dark) !important; }", "", " /* Option/select elements. */", " select {", " color: var(--light);", " border-color: var(--accent); }", " select option { background-color: var(--dark); }", "", " /* Archived chat image. */", " ._2fq0t ._2Lev2 {", " background-color: var(--dark) !important; }", "", " /* Body. */", " ._2fq0t ._2sNbV ._1CkkN,", " ._2fq0t ._2sNbV ._2EXPL {", " background-color: transparent; }", " /* On event. TODO: Fixed, but it might still overlap somewhere. */", " .k1feT ._2sNbV > ._1CkkN:hover,", " ._2fq0t ._2sNbV ._1CkkN:hover {", " background-color: var(--dark); }", "", " /* New group. */", " ._2fq0t ._39pS- {", " background-color: transparent !important; }", " /* Header. */", " ._2fq0t ._1AKfk {", " background-color: var(--darker) !important; }", " /* On event. */", " .k1feT ._2fq0t ._2EXPL._1f1zm,", " .k1feT ._2fq0t ._2EXPL:hover {", " background-color: var(--dark) !important; }", " /* Search element */", " ._66JgU ._3_3Rs {", " border-bottom: none !important; }", " ._66JgU ._3_3Rs input, ._66JgU ._3_3Rs ::placeholder {", " color: var(--lighter) !important; }", "", " /** Context/dropdown menu. */", " ._2hHc6 {", " background-color: var(--darker) !important;", " box-shadow: 0 4px 16px 0 var(--shadow) !important; }", " ._2hHc6 li:hover, ._2hHc6 li:hover div {", " color: var(--accent) !important;", " background-color: var(--dark) !important; }", " ._2hHc6 div, ._1ArIP div {", " color: var(--light); }", "", " /* Middle drawer. */", " #main {", " background-color: var(--dark); }", " /* Fix parent-element. #43 */", " ._1ays2 {", " display: flex !important;", " flex-direction: column !important; }", "", " /* Doodle background. TODO: Plans for the future. */", " #app [data-asset-chat-background=\"true\"] {", " filter: invert(100%) opacity(0.45) !important; }", "", " /* Main -> Group description. */", " ._3jzsh {", " background-color: var(--darker) !important; }", " /* Text colors. */", " ._3jzsh ._3GIEC, ._3jzsh ._6xQdq {", " color: var(--lighter) !important; }", "", " /* Jump to present button. */", " ._3KRbU {", " box-shadow: 0 4px 8px 2px var(--shadow) !important;", " background-color: var(--darker) !important; }", " /* Number of messages. */", " ._3KRbU > span > span {", " background-color: var(--accent) !important; }", "", " /* Header. */", " #main header {", " border: none;", " background-color: var(--dark); }", " /* Text color. */", " #main header ._1WBXd * {", " color: var(--light); }", " /* Header text color. #22 */", " #main > header > div span[title] {", " color: var(--light); }", " /* Header separator. */", " #main > header::after {", " border-bottom-color: var(--darker);", " background-color: transparent; }", "", " /* Footer. */", " #main footer {", " border-top: 1px solid var(--darker);", " background-color: var(--darker); }", " /* Input wrapper. */", " #main footer > div {", " color: var(--light);", " border: none;", " /* border-bottom: 2px solid var(--dark); */", " background-color: var(--dark); }", " /* Input element. */", " #main footer > div:nth-child(1) > div:nth-child(2) {", " border: none !important;", " color: var(--light);", " background-color: var(--darker) !important; }", "", " /* Unknown contact. */", " ._2Pown {", " color: var(--light) !important;", " border-color: var(--darker) !important;", " background-color: var(--dark) !important;", " box-shadow: 0 -1px 0 0 inset var(--darker) !important; }", " /* Buttons. */", " ._2ZZub {", " color: var(--lighter) !important;", " background-color: var(--darker) !important; }", " ._2ZZub:hover {", " color: var(--light) !important;", " box-shadow: 0 2px 4px 0 var(--shadow) !important; }", "", " /* Shared contact button colors. */", " .Ir_Ne {", " color: var(--accent) !important; }", " /* Shared contact text. */", " .AVd_p {", " color: var(--lighter) !important; }", " /* View contact. */", " ._1VwzF {", " background-color: transparent !important; }", "", " /* Hide \'Type a message\' once focused. */", " ._3FeAD.focused div[style] {", " color: transparent !important; }", " /* Placeholder text color. */", " ._3FeAD div[style] {", " transition: color 0.15s ease;", " color: var(--lighter) !important; }", "", " /* Right drawer. */", " /* .app ._3HZor ._2fq0t {", " background-color: var(--darker); } */", " /* Border-color. */", " .app ._3HZor {", " border-left-color: transparent !important; }", " /* Header. */", " .app ._3HZor header {", " background-color: var(--darker); }", " /* Fix header text vertical position. */", " .app ._3HZor ._1pYs5 {", " margin-top: 4px !important; }", " /* Text color. */", " .app ._3HZor header div {", " color: var(--light); }", " /* Mute/starred messages. */", " ._3_-Si + ._3_-Si ._2x2XP {", " border-color: var(--darker) !important; }", "", " /* Group info sections. */", " .app ._3HZor ._26JG5, .app ._3HZor ._2UaNq {", " /*box-shadow: 0 1px 3px shadow /**/", " box-shadow: none;", " background-color: transparent; }", " .app ._3HZor ._26JG5:hover {", " background-color: var(--dark) !important; }", " /* Fix borders. */", " .app ._3HZor ._27Ie2,", " .app ._3HZor ._26JG5::before {", " border-color: transparent !important; }", " /* User\'s name. */", " .app ._3HZor span {", " color: var(--light); }", " .app ._3HZor ._23Un5 {", " color: var(--mred); }", " /** Username colors in group chat. */", " .app [class*=\"color-\"] span {", " color: inherit !important; }", "", " /* Group options. */", " .app ._3HZor ._1CRb5 ._2EXPL,", " .app ._3HZor ._1CRb5 ._1CkkN {", " transition: 200ms ease-in-out;", " background-color: transparent; }", " /* On event. */", " .app ._3HZor ._1CRb5 ._2EXPL._3xj48:hover,", " .app ._3HZor ._1CRb5 ._1CkkN:hover {", " background-color: var(--dark); }", " /* Text color. */", " .app ._3HZor ._1CRb5 ._2EXPL * {", " color: var(--light); }", " /* Admin color. */", " .app ._3HZor .FPZFa {", " border-color: var(--accent); }", "", "", " /* Search messages. TODO: Apply this to all search elements. */", " .a5vst, .a5vst .ZP8RM._19OGD /*, ._3HZor ._1iMEz._3sdhb*/ {", " background-color: var(--darker) !important; }", " /* Input wrapper. */", " .a5vst label {", " border: 0px solid var(--dark) !important;", " background-color: var(--dark) !important; }", " .a5vst .ZP8RM::after {", " border: none !important;", " background-color: var(--dark) !important; }", " .a5vst label input {", " background-color: transparent !important; }", "", " /* Search messages body. */", " .YAPQk {", " background-color: var(--darker) !important; }", " /* Matching results. */", " ._3HZor .matched-text {", " color: var(--accent) !important; }", " /* On event. */", " .YAPQk ._1f1zm > ._3j7s9,", " .YAPQk ._3j7s9:hover {", " background-color: var(--dark) !important; }", "", " /* Search messages. */", " #pane-side ._2EXPL {", " background-color: transparent !important; }", "", " /* Starred messages. */", " ._1WMT2 .tail:not(.PJFFv) {", " background-color: var(--dark) !important; }", " /* Borders. */", " ._1WMT2::before, ._1WMT2::after {", " display: none !important; }", " /* Selected message. */", " ._1WMT2._2V_Wj,", " ._1WMT2._2nA3s,", " ._1WMT2:hover {", " transition: 200ms ease-in-out !important;", " background-color: var(--dark) !important; }", " /* Remove tails. */", " ._1WMT2 .tail-container {", " display: none !important; }", " /* Date text color. */", " ._1WMT2 ._2V2qB {", " color: var(--lighter) !important; }", "", "", " /* Message info. */", " #app .app > div:nth-child(2) ._2rGVQ {", " background-color: var(--dark) !important; }", " /* Doodle image. */", " #app .app > div:nth-child(2) [data-asset-chat-background=\"true\"] {", " filter: invert(100%) opacity(0.8) !important; }", " /* Read by. */", " #app .app > div:nth-child(2) ._2AJf5,", " #app .app > div:nth-child(2) ._19xqi {", " box-shadow: none !important;", " background-color: transparent !important; }", " /* Read by text color. */", " #app .app > div:nth-child(2) ._2AJf5 span {", " color: var(--accent) !important; }", " /* Forwarded message info. #44 */", " ._1NZZN, ._3XHR- {", " border-color: var(--dark) !important;", " background-color: transparent !important;", " box-shadow: none !important; }", " ._1w7vp {", " color: var(--light) !important; }", "", " /* Media/docs/links section. */", " ._27U_m, .yrOIH {", " border-bottom: 1px solid var(--dark);", " background-color: var(--darker) !important; }", " /* Active indicator. */", " ._27U_m::before {", " background-color: var(--accent) !important; }", " /* Text color. */", " ._26Nvu,", " ._27U_m .Y1iVg {", " color: var(--lighter) !important; }", " /* Selected links. */", " ._27U_m .Y1iVg._3caqI {", " color: var(--light) !important; }", " /* Selected image. */", " ._2Ji5m {", " border-color: var(--darker) !important; }", "", " /** Media viewer. */", " ._1iNsf, ._2KgjI {", " background-color: transparent !important; }", " /* Pseudo-element background. */", " ._1iNsf::before, ._2KgjI::before {", " content: \"\"; position: absolute;", " top: 0; right: 0; bottom: 0; left: 0;", " background-color: var(--dark);", " opacity: 0.8; z-index: -1; }", " /* Chevron/preloader background. */", " ._3yth3 {", " box-shadow: 0 2px 4px -1px var(--shadow) !important;", " background-color: var(--darker) !important; }", "", " /* Header. */", " ._1iNsf > div:first-child,", " ._2KgjI > div:first-child {", " box-shadow: 0 1px 0 0 var(--darker);", " background-color: var(--dark) !important; }", " /* Inner element. */", " ._1iNsf > div:first-child > div > div,", " ._2KgjI > div:first-child > div > div {", " background-color: transparent !important; }", " /* Text color. */", " ._1iNsf > div:first-child > div > div *,", " ._2KgjI > div:first-child > div > div * {", " color: var(--light); }", "", " /* Footer. */", " ._2n0jo {", " border-color: var(--darker) !important;", " background-color: var(--dark) !important; }", " /* Selected image. */", " ._2AP3i .cJP5q {", " border: none !important;", " transform: scale(1) !important;", " outline: 3px solid var(--accent) !important }", " ._2AP3i ._1LdNS:hover:not(.cJP5q):not(#spec) {", " outline: 3px solid var(--accent) !important; }", "", " /* Highlight message bubbles. #29 */", " div.message-in.velocity-animating > div > div,", " div.message-out.velocity-animating > div > div {", " background-color: var(--accent) !important }", " .velocity-animating > .tail > .tail-container {", " border-top-color: var(--accent) !important }", "", " /* Bubble colors. #49 #54 */", " .message-in > div:not(.a81-s) > div,", " .message-out > div:not(.a81-s) > div {", " background-color: var(--darker) !important; }", " ._2v02G {", " color: var(--lighter) !important; }", "", " /* Message text color. */", " .message-in .selectable-text,", " .message-out .selectable-text,", " .quoted-mention,", " ._1upWv,", " ._3ZVco {", " color: var(--light) !important; }", "", " /* Voice messages. */", " ::-moz-range-thumb { background-color: var(--accent) !important }", " ::-moz-range-track { background-color: var(--lighter) !important }", " ._7sUPO { background-color: var(--accent) !important }", " ._1FWQp { color: var(--light) !important }", "", " /* Use accent color for links. #20 */", " a[href].selectable-text {", " color: var(--accent) !important; }", "", " /* Forwarded message. */", " ._15aTv {", " color: var(--lighter) !important; }", "", " /* Show more. */", " ._1Jc9f { color: var(--accent) !important }", "", " /* Deleted message. */", " ._3uHCS { color: var(--lighter) !important }", " span[class][data-icon=\"recalled-out\"] svg path { fill: red !important }", "", " /* Phone numbers of users that aren\'t your contacts. */", " #main ._1F9Ap {", " color: var(--lighter) !important; }", "", " /* Mentions. */", " .matched-mention, .matched-mention .at-symbol {", " color: var(--accent) !important; }", "", " /* Message meta text color. */", " [class*=\"message-\"] div > div:last-child span {", " color: var(--light); }", "", " /* Image/gif/video meta wrapper. */", " .KYpDv ._1DZAH {", " bottom: 8px;", " padding: 2px 5px;", " border-radius: 4px;", " background-color: var(--shadow); }", " /* Text color. */", " .KYpDv ._1DZAH ._3EFt_ {", " margin-top: 0px;", " color: var(--lighter); }", "", " /* Message options for images. */", " ._3EQsG._1eJVc {", " background: none !important; }", " /* Smooth transition. */", " .message span:last-child div {", " transition: 50ms ease-in-out !important; }", "", " /* Typing... */", " span._2ZAIy {", " color: var(--accent) !important; }", "", " /* System messages. */", " .a7otO {", " box-shadow: 0 2px 8px 0px var(--shadow) !important;", " border-bottom: 3px solid var(--shadow) !important;", " background-color: var(--darker) !important; }", " /* Text color and shadows. */", " .a7otO * {", " text-shadow: none !important;", " color: var(--lighter) !important; }", " /* New message. */", " #main ._3Xx0y {", " border: none !important;", " background-color: var(--darker) !important; }", " /* X unread messages. */", " #main ._3Xx0y span {", " box-shadow: 0 0 8px 0 var(--shadow) !important;", " color: var(--light) !important;", " background-color: var(--dark) !important; }", "", " /* Loader. */", " ._2sOZc {", " box-shadow: 0 2px 4px -1px var(--shadow) !important;", " background-color: var(--darker) !important; }", "", " /* Document embeds. */", " ._3a29n, ._1mrMQ {", " background-color: var(--dark) !important; }", "", " /* Embeds description */", " .HNuTV {", " background-color: var(--dark) !important; }", "", " /* Link embeds. */", " ._3qblR, ._1SsXF {", " box-shadow: 0 0 0 1px var(--dark) !important;", " background-color: var(--dark) !important; }", "", " /* Thumbnail. */", " ._3_nIn {", " background-color: var(--darker) !important; }", "", "", " /* Reply section. (= */", " footer ._1ebw2 {", " box-shadow: 0 0px 8px 0 var(--darker) !important;", " background-color: var(--darker) !important; }", " /* Fix margins. */", " footer ._1ebw2 > div:first-child {", " margin: 0 0 5px 10px !important;", " background-color: transparent !important; }", " /* Reply content. */", " footer ._1ebw2 > div:first-child > div {", " background-color: var(--dark) !important; }", " /* Close button. */", " footer ._1ebw2 > div:last-child {", " position: relative;", " margin: 0 8px 5px 8px !important;", " background-color: transparent !important; }", " /* Make the button larger. */", " footer ._1ebw2 > div:last-child > div svg {", " padding: 18px;", " border-radius: 6px;", " background-color: var(--dark); }", "", " /* Mention group members. */", " ._2j-wI, .XSeqj {", " color: var(--light);", " border-left: none !important;", " background-color: var(--darker) !important; }", " /* Wrapper. */", " ._2j-wI .XSeqj {", " transition: 300ms ease-in-out !important;", " background-color: transparent !important; }", " /* Active. */", " ._2j-wI .XSeqj._1Yz8K,", " ._2j-wI .XSeqj:hover {", " background-color: var(--accent) !important; }", "", "", " /* Select messages. */", " #main ._2AqZl {", " background-color: var(--shadow); }", " /* Hover over messages. */", " #main .qTFAl {", " transition: 0.15s ease !important; }", " /* Selected message. */", " #main .qTFAl:hover, #main .qTFAl._3Z2tD {", " background-color: var(--shadow) !important; }", " /* Selected icon. */", " ._15wNI {", " border-color: var(--accent) !important;", " background-color: var(--accent) !important; }", " /* Checkmark. */", " ._15wNI ._1ygtt {", " border-bottom-color: var(--light);", " border-right-color: var(--light); }", " /* Footer/control/options. */", " #main ._1hhkM {", " background-color: var(--darker); }", "", " /*", " Fixes message content/timestamp overlapping.", " Apparently they forgot to add nl-specific styles. XD", " */", " html[lang=nl] .EopGb { width: 56px }", " html[lang=nl] ._2COY9 { width: 92px }", "", " /* Bubble tails -- experimental. */", " .tail .tail-container {", " width: 0px !important;", " height: 10px !important;", " z-index: 0 !important;", " border-top: 12px solid var(--darker);", " background: none !important; }", " .message-in > .tail > .tail-container {", " left: -10px !important; top: 0px;", " border-left: 10px solid transparent;", " border-radius: 5px 0 0 0; }", " .message-out > .tail > .tail-container {", " right: -10px !important; top: 0px;", " border-right: 10px solid transparent;", " border-radius: 0 5px 0 0; }", "", " /* Disable tails everywhere. */", " /* Tails are enabled. */", "", " /* Disable tails everywhere except in chat. */", " .starred-msg-wrapper .tail-container,", " .message-gallery .tail-container,", " .MS-DH .tail-container {", " display: none !important; }", " /* Rounded corners. */", " .message-gallery.tail-override-left,", " .MS-DH .tail-override-left {", " border-radius: 7.5px !important; }", "", " /** Stickers. */", " ._1rK-b {", " background: none !important; }", " /* Sender. */", " ._3Mf7Z {", " background-color: var(--darker) !important; }", " /* Time/status. */", " ._3qAvH {", " background-color: var(--darker) !important; }", " ._3qAvH * {", " color: var(--light) !important; }", "", " /* Message options. */", " ._15CAo {", " background: linear-gradient(90deg, transparent, var(--darker) 40%) !important;", " }", " /* Reset sticker menu background. */", " .a81-s > div + span > div { background: none !important }", " /* Context menu buttons. */", " [data-js-context-icon=\'true\'] {", " background-image: none !important;", " background: none !important; }", " [data-js-context-icon=\'true\'] + div { background: var(--darker) !important }", "", " /* Emoji/gif/stickers menu. */", " .QChXd, ._20KNO, .RxbUw, ._2PpWQ > div {", " background-color: var(--dark) !important; }", " /* Temporary fix for emoji container. */", " #main footer > div:nth-child(2) > div {", " border: 0; }", " /* Nib. */", " .iqJMX {", " background-color: var(--dark) !important; }", " /* Emoji tabs. */", " ._2avTY {", " background: var(--darker) !important; }", " /* Tab indicator. */", " ._2avTY .Orl3a,", " ._1Wbpa {", " background-color: var(--accent) !important; }", " /* Active button. */", " ._1oNFt.-XQxp path {", " fill: var(--accent) !important; }", "", " /* Search emojis. */", " ._2Qm0c, ._2Qm0c label {", " box-shadow: none !important;", " background-color: var(--dark) !important; }", " /* Text color. */", " ._2Qm0c input {", " color: var(--light) !important; }", "", " /* Gif preloader background. */", " ._2x9yi {", " /* border: 2px dashed ; */", " background-color: var(--darker) !important; }", "", " /* Preview. */", " ._1drQ- {", " background-color: var(--dark) !important; }", " /* Header. */", " ._1drQ- header {", " background-color: var(--accent) !important; }", " /* Text color. */", " ._1drQ- header *, ._1drQ- .media-body * {", " color: var(--lighter) !important; }", " /* Footer. */", " ._1drQ- .media-collection {", " background-color: var(--darker); }", " /* Button. */", " ._1drQ- .media-collection .btn-fill, ._1drQ- ._3hV1n {", " color: var(--lighter);", " background-color: var(--accent) !important; }", "", "", " /* Emoji-wanna-be-round. */", " .emojik {", " opacity: var(--emojiOpacity);", " transition: transform 200ms cubic-bezier(0.59, 0.57, 0.39, 1.04); }", " /* Selected emoji. */", " .emojik:focus, .emojik:hover, .emojik.selected {", " box-shadow: none !important;", " opacity: 1;", " transform: scale(1.15); }", "", " /* Emoji quick selection. */", " ._2mlOb {", " border: 0 !important;", " border-bottom: 1px solid var(--darker) !important;", " background-color: var(--darker) !important; }", " /* Emoji race color popup. */", " ._1gFYk {", " background-color: var(--dark) !important; }", " /* Separator. */", " ._1gFYk ul li:first-child {", " border-right: 1px solid var(--darker) !important; }", " /* Emoji menu triangle. */", " ._1gFYk .iqJMX {", " background-color: var(--dark) !important; }", " /* Quick replies. #56 */", " ._1omcu._2saG0, ._2saG0 {", " background-color: var(--darker) !important; }", "", " /* Android emojis. */", " .emojik.wa.b0 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/0.webp\")}", " .emojik.wa.b1 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/1.webp\")}", " .emojik.wa.b2 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/2.webp\")}", " .emojik.wa.b3 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/3.webp\")}", " .emojik.wa.b4 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/4.webp\")}", " .emojik.wa.b5 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/5.webp\")}", " .emojik.wa.b6 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/6.webp\")}", " .emojik.wa.b7 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/7.webp\")}", " .emojik.wa.b8 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/8.webp\")}", " .emojik.wa.b9 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/9.webp\")}", " .emojik.wa.b10 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/10.webp\")}", " .emojik.wa.b11 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/11.webp\")}", " .emojik.wa.b12 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/12.webp\")}", " .emojik.wa.b13 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/13.webp\")}", " .emojik.wa.b14 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/14.webp\")}", " .emojik.wa.b15 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/15.webp\")}", " .emojik.wa.b16 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/16.webp\")}", " .emojik.wa.b17 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/17.webp\")}", " .emojik.wa.b18 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/18.webp\")}", " .emojik.wa.b19 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/19.webp\")}", " .emojik.wa.b20 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/20.webp\")}", " .emojik.wa.b21 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/21.webp\")}", " .emojik.wa.b22 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/22.webp\")}", " .emojik.wa.b23 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/23.webp\")}", " .emojik.wa.b24 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/24.webp\")}", " .emojik.wa.b25 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/25.webp\")}", " .emojik.wa.b26 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/26.webp\")}", " .emojik.wa.b27 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/27.webp\")}", " .emojik.wa.b28 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/28.webp\")}", " .emojik.wa.b29 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/29.webp\")}", " .emojik.wa.b30 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/30.webp\")}", " .emojik.wa.b31 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/31.webp\")}", " .emojik.wa.b32 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/32.webp\")}", " .emojik.wa.b33 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/33.webp\")}", " .emojik.wa.b34 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/34.webp\")}", " .emojik.wa.b35 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/35.webp\")}", " .emojik.wa.b36 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/36.webp\")}", " .emojik.wa.b37 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/37.webp\")}", " .emojik.wa.b38 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/38.webp\")}", " .emojik.wa.b39 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/39.webp\")}", " .emojik.wa.b40 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/40.webp\")}", " .emojik.wa.b41 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/41.webp\")}", " .emojik.wa.b42 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/42.webp\")}", " .emojik.wa.b43 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/43.webp\")}", " .emojik.wa.b44 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/44.webp\")}", " .emojik.wa.b45 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/45.webp\")}", " .emojik.wa.b46 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/46.webp\")}", " .emojik.wa.b47 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/47.webp\")}", " .emojik.wa.b48 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/48.webp\")}", " .emojik.wa.b49 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/49.webp\")}", " .emojik.wa.b50 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/50.webp\")}", " .emojik.wa.b51 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/51.webp\")}", " .emojik.wa.b52 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/52.webp\")}", " .emojik.wa.b53 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/53.webp\")}", " .emojik.wa.b54 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/54.webp\")}", " .emojik.wa.b55 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/55.webp\")}", " .emojik.wa.b56 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/56.webp\")}", " .emojik.wa.b57 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/57.webp\")}", " .emojik.wa.b58 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/58.webp\")}", " .emojik.wa.b59 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/59.webp\")}", " .emojik.wa.b60 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/60.webp\")}", " .emojik.wa.b61 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/61.webp\")}", " .emojik.wa.b62 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/62.webp\")}", " .emojik.wa.b63 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/63.webp\")}", " .emojik.wa.b64 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/64.webp\")}", " .emojik.wa.b65 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/65.webp\")}", " .emojik.wa.b66 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/66.webp\")}", " .emojik.wa.b67 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/67.webp\")}", " .emojik.wa.b68 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/68.webp\")}", " .emojik.wa.b69 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/69.webp\")}", " .emojik.wa.b70 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/70.webp\")}", " .emojik.wa.b71 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/71.webp\")}", " .emojik.wa.b72 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/72.webp\")}", " .emojik.wa.b73 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/73.webp\")}", " .emojik.wa.b74 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/74.webp\")}", " .emojik.wa.b75 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/75.webp\")}", " .emojik.wa.b76 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/76.webp\")}", " .emojik.wa.b77 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/77.webp\")}", " .emojik.wa.b78 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/78.webp\")}", " .emojik.wa.b79 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/79.webp\")}", " .emojik.wa.b80 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/80.webp\")}", " .emojik.wa.b81 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/81.webp\")}", " .emojik.wa.b82 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/82.webp\")}", " .emojik.wa.b83 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/83.webp\")}", " .emojik.wa.b84 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/84.webp\")}", " .emojik.wa.b85 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/85.webp\")}", " .emojik.wa.b86 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/86.webp\")}", " .emojik.wa.b87 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/87.webp\")}", " .emojik.wa.b88 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/88.webp\")}", " .emojik.wa.b89 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/89.webp\")}", " .emojik.wa.b90 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/90.webp\")}", " .emojik.wa.b91 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/91.webp\")}", " .emojik.wa.b92 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/92.webp\")}", " .emojik.wa.b93 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/93.webp\")}", " .emojik.wa.b94 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/94.webp\")}", " .emojik.wa.b95 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/95.webp\")}", " .emojik.wa.b96 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/96.webp\")}", " .emojik.wa.b97 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/97.webp\")}", " .emojik.wa.b98 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/98.webp\")}", " .emojik.wa.b99 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/99.webp\")}", " .emojik.wa.b100 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/100.webp\")}", " .emojik.wa.b101 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/a/101.webp\")}", " /* iOS emojis. */", " .emojik.apple.b0 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/0.webp\")}", " .emojik.apple.b1 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/1.webp\")}", " .emojik.apple.b2 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/2.webp\")}", " .emojik.apple.b3 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/3.webp\")}", " .emojik.apple.b4 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/4.webp\")}", " .emojik.apple.b5 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/5.webp\")}", " .emojik.apple.b6 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/6.webp\")}", " .emojik.apple.b7 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/7.webp\")}", " .emojik.apple.b8 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/8.webp\")}", " .emojik.apple.b9 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/9.webp\")}", " .emojik.apple.b10 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/10.webp\")}", " .emojik.apple.b11 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/11.webp\")}", " .emojik.apple.b12 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/12.webp\")}", " .emojik.apple.b13 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/13.webp\")}", " .emojik.apple.b14 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/14.webp\")}", " .emojik.apple.b15 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/15.webp\")}", " .emojik.apple.b16 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/16.webp\")}", " .emojik.apple.b17 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/17.webp\")}", " .emojik.apple.b18 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/18.webp\")}", " .emojik.apple.b19 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/19.webp\")}", " .emojik.apple.b20 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/20.webp\")}", " .emojik.apple.b21 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/21.webp\")}", " .emojik.apple.b22 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/22.webp\")}", " .emojik.apple.b23 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/23.webp\")}", " .emojik.apple.b24 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/24.webp\")}", " .emojik.apple.b25 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/25.webp\")}", " .emojik.apple.b26 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/26.webp\")}", " .emojik.apple.b27 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/27.webp\")}", " .emojik.apple.b28 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/28.webp\")}", " .emojik.apple.b29 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/29.webp\")}", " .emojik.apple.b30 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/30.webp\")}", " .emojik.apple.b31 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/31.webp\")}", " .emojik.apple.b32 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/32.webp\")}", " .emojik.apple.b33 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/33.webp\")}", " .emojik.apple.b34 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/34.webp\")}", " .emojik.apple.b35 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/35.webp\")}", " .emojik.apple.b36 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/36.webp\")}", " .emojik.apple.b37 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/37.webp\")}", " .emojik.apple.b38 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/38.webp\")}", " .emojik.apple.b39 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/39.webp\")}", " .emojik.apple.b40 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/40.webp\")}", " .emojik.apple.b41 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/41.webp\")}", " .emojik.apple.b42 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/42.webp\")}", " .emojik.apple.b43 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/43.webp\")}", " .emojik.apple.b44 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/44.webp\")}", " .emojik.apple.b45 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/45.webp\")}", " .emojik.apple.b46 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/46.webp\")}", " .emojik.apple.b47 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/47.webp\")}", " .emojik.apple.b48 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/48.webp\")}", " .emojik.apple.b49 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/49.webp\")}", " .emojik.apple.b50 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/50.webp\")}", " .emojik.apple.b51 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/51.webp\")}", " .emojik.apple.b52 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/52.webp\")}", " .emojik.apple.b53 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/53.webp\")}", " .emojik.apple.b54 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/54.webp\")}", " .emojik.apple.b55 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/55.webp\")}", " .emojik.apple.b56 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/56.webp\")}", " .emojik.apple.b57 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/57.webp\")}", " .emojik.apple.b58 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/58.webp\")}", " .emojik.apple.b59 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/59.webp\")}", " .emojik.apple.b60 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/60.webp\")}", " .emojik.apple.b61 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/61.webp\")}", " .emojik.apple.b62 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/62.webp\")}", " .emojik.apple.b63 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/63.webp\")}", " .emojik.apple.b64 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/64.webp\")}", " .emojik.apple.b65 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/65.webp\")}", " .emojik.apple.b66 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/66.webp\")}", " .emojik.apple.b67 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/67.webp\")}", " .emojik.apple.b68 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/68.webp\")}", " .emojik.apple.b69 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/69.webp\")}", " .emojik.apple.b70 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/70.webp\")}", " .emojik.apple.b71 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/71.webp\")}", " .emojik.apple.b72 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/72.webp\")}", " .emojik.apple.b73 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/73.webp\")}", " .emojik.apple.b74 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/74.webp\")}", " .emojik.apple.b75 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/75.webp\")}", " .emojik.apple.b76 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/76.webp\")}", " .emojik.apple.b77 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/77.webp\")}", " .emojik.apple.b78 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/78.webp\")}", " .emojik.apple.b79 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/79.webp\")}", " .emojik.apple.b80 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/80.webp\")}", " .emojik.apple.b81 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/81.webp\")}", " .emojik.apple.b82 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/82.webp\")}", " .emojik.apple.b83 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/83.webp\")}", " .emojik.apple.b84 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/84.webp\")}", " .emojik.apple.b85 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/85.webp\")}", " .emojik.apple.b86 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/86.webp\")}", " .emojik.apple.b87 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/87.webp\")}", " .emojik.apple.b88 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/88.webp\")}", " .emojik.apple.b89 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/89.webp\")}", " .emojik.apple.b90 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/90.webp\")}", " .emojik.apple.b91 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/91.webp\")}", " .emojik.apple.b92 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/92.webp\")}", " .emojik.apple.b93 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/93.webp\")}", " .emojik.apple.b94 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/94.webp\")}", " .emojik.apple.b95 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/95.webp\")}", " .emojik.apple.b96 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/96.webp\")}", " .emojik.apple.b97 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/97.webp\")}", " .emojik.apple.b98 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/98.webp\")}", " .emojik.apple.b99 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/99.webp\")}", " .emojik.apple.b100 {background-image: url(\"https://raw.githubusercontent.com/vednoc/wae/dev/i/100.webp\")}", "", "", " /* Backdrop. */", " ._3Fq9Y, #startup, #initial_startup {", " background-color: var(--dark) !important; }", " /* Modal. */", " ._3Fq9Y ._3RiLE,", " ._3gUiM ._2dA13 ._1CnF3,", " ._2dA13 ._18wuJ, ._2dA13 .IuYNx {", " box-shadow: 0 0 0 1px var(--darker), 0 8px 16px 0px var(--shadow) !important;", " background-color: var(--darker) !important; }", " /* Selected contact. */", " ._3gUiM ._2EXPL._1f1zm,", " ._3gUiM ._2EXPL:hover,", " ._2EXPL._3ntaf:hover {", " background-color: var(--dark) !important; }", " /* Text color. */", " ._3Fq9Y ._3RiLE *,", " ._3gUiM ._1CnF3 * {", " color: var(--light); }", " /* Header/footer. */", " .XOIaT {", " background-color: var(--dark) !important; }", " /* Empty element below search bar. */", " ._2fq0t span._3fOoY {", " display: none !important; }", "", "", " /* Accent buttons. */", " ._3PQ7V {", " color: var(--lighter) !important;", " background-color: var(--accent) !important; }", " ._3PQ7V:hover {", " opacity: 0.8; }", " /* Link buttons. */", " ._23_1v:hover {", " box-shadow: none !important;", " color: var(--accent) !important;", " background-color: transparent !important; }", " /* Muted checkbox color. */", " ._1VD7W {", " border-color: var(--accent);", " background-color: var(--accent); }", " /* Buttons. */", " .PNlAR:hover, ._1WZqU:hover {", " background-color: var(--dark) !important; }", "", " /* Drop items. (-: */", " .drag-drop, ._2n-96 {", " background-color: var(--dark) !important; }", " /* Footer. */", " .NeQRT {", " background-color: var(--darker) !important; }", " /* Border. */", " ._2n-96 ._3L-be {", " border: 5px dashed var(--accent) !important;", " color: var(--light) !important; }", "", " /* Add file icon. */", " .GpvML, ._1ypOz, ._3fktq, ._1g8sv {", " background-color: var(--dark) !important;", " box-shadow: 0 2px 4px var(--shadow) !important; }", " /* Border. */", " ._1gcLL::after {", " background-color: var(--accent) !important; }", "", " /* Accent border. */", " .CzI8E, ._31WRs ._1DTd4, ._2Fvnm ._3ogpF {", " border-bottom-color: var(--accent) !important; }", " /* Text color. */", " ._7HWvs, .A_Kh_ {", " color: var(--light) !important; }", "", " /** Status area! */", " .app-wrapper-web ._2dLx9 {", " background-color: transparent !important; }", " /* Pseudo-element background. */", " .app-wrapper-web ._2dLx9::before {", " content: \"\"; position: absolute;", " top: 0; right: 0; bottom: 0; left: 0;", " background-color: var(--dark);", " opacity: 0.8; z-index: -1; }", " /* Status icon. */", " span[data-icon*=\"status-v3\"] > svg > path:first-child {", " opacity: 0.55 !important; }", " /* Left hand side. */", " ._2dLx9 .IMn_C { background-color: var(--darker) !important; }", " /* Text color. */", " .IMn_C span { color: var(--light) !important; }", " .qlhJH hr { color: var(--dark) !important; }", " /* Right hand side. */", " ._2dLx9 ._3MBzN { background-color: var(--dark) !important; }", " /* Text color. */", " ._2dLx9 ._3MBzN div { color: var(--lighter) !important; }", " /* Reply to status. */", " .QRsOy { background-color: var(--dark) !important; }", " /* Input bar. */", " ._3FeAD._2nW8k { background-color: var(--dark) !important; }", "", " /* Remove weird iframes. */", " object { display: none !important; }", "", " /* Global icon color. */", " span[data-icon^=\"business-\"] > svg path,", " span:not([data-icon=\"image\"]) > svg > path {", " transition: 200ms ease;", " fill: var(--icon) !important; }", " /* On event. */", " span:not([data-icon=\"image\"]):hover > svg > path {", " /* fill: var(--accent) !important; */", " opacity: 0.3 !important; }", "", " /* Upload files. */", " .azEEh { color:var(--light) !important; }", " ._2sn3C { background-color: var(--darker) !important; }", " .Ijb1Q::after { box-shadow: 0 4px 8px 2px var(--shadow) !important; }", "", " /* Default profile picture background. */", " span[data-icon^=\"default-\"] svg > path:first-child {", " fill: var(--dark) !important; }", "", " span[data-icon^=\"default-\"] svg path:last-child {", " opacity: 0.7;", " fill: var(--icon) !important; }", "", " /* Sent message. */", " span[data-icon=\"msg-dblcheck\"] svg path,", " span[data-icon=\"status-dblcheck\"] svg path,", " span[data-icon=\"msg-check\"] svg path,", " span[data-icon=\"status-check\"] svg path {", " fill: var(--light) !important;", " opacity: 0.5 !important; }", "", " /* Sent AND seen message. */", " span[data-icon=\"msg-dblcheck-ack\"] svg path,", " span[data-icon=\"status-dblcheck-ack\"] svg path,", " span[data-icon=\"msg-dblcheck-ack-light\"] svg path,", " span[data-icon=\"status-v3-unread\"] > svg > path:last-child {", " fill: var(--accent) !important;", " opacity: 1 !important; }", "", " /* Misc icons fix. */", " span[data-icon^=\"chevron-\"] svg path,", " span[data-icon=\"x-viewer\"] svg path,", " span[data-icon=\"download\"] svg path,", " span[data-icon=\"forward\"] svg path,", " span[data-icon=\"star-btn\"] svg path,", " span[data-icon=\"audio-file\"] svg path:last-child,", " span[data-icon=\"new-group\"] svg path,", " span[data-icon=\"add-user-light\"] svg path,", " span[data-icon=\"link\"] svg path {", " fill: var(--icon) !important; }", "", " /* Audio message icons. #55 */", " span[data-icon^=\"ptt-\"] svg path:first-child {", " fill: var(--dark) !important; }", " span[data-icon^=\"ptt-\"] svg path:last-child {", " fill: var(--accent) !important; }", "", " span[data-icon=\"ptt-out-gray\"] svg path:last-child {", " fill: var(--icon) !important; }", "", " /* Logo. */", " ._3CSsZ > svg > path:first-child {", " fill: var(--accent) !important; }", " span[data-icon=\"logo\"] svg path:nth-child(1) {", " fill: white !important; }", " span[data-icon=\"alert-phone\"] svg path:first-child,", " span[data-icon=\"logo\"] svg path:nth-child(1n+2),", " span[data-icon=\"whatsapp-logo\"] svg path:first-child {", " fill: var(--darker) !important; }", "", " /* GIF icon opacity. */", " span[data-icon=\"emoji-gifs\"] svg path {", " fill: var(--icon) !important;", " fill-opacity: 1 !important; }", "", " /* Be cautious icons. */", " span[data-icon=\"exit\"] svg path,", " span[data-icon=\"thumbs-down\"] svg path,", " span[data-icon=\"delete-danger\"] svg path {", " fill: var(--mred) !important; }", "", " /* Audio message. */", " span[data-icon=\"audio-file\"] svg path {", " fill: rgba(255, 173, 31, 0.8) !important; }", " /* Audio length bar. */", " ._22cMG.fS1bA .nDKsM {", " background-color: var(--accent) !important; }", " /* Slider thumb. */", " input[type=range]::-webkit-slider-thumb {", " cursor: pointer;", " background: var(--accent) !important; }", " /* Audio length. */", " ._3HwRC, ._1lxsr {", " color: var(--light) !important; }", "", " /* Rounded buttons. */", " span svg > path[fill=\"#00BFA5\"] {", " fill: var(--accent) !important; }", "", " /* Disable background image on small resolutions. */", " @media screen and (max-width: 1441px) {", " ._1FKgS::after {", " display: none !important;", " }", " }", "", " @media screen and (min-width: 1441px) {", " /* Animation. */", " html[dir=ltr] ._3dqpi {", " /* display: none !important; */", " animation: _104Un 0.5s cubic-bezier(0.18, 0.89, 0.32, 1.38); }", "", " /* App wrapper. */", " #app .app {", " border-radius: 8px;", " box-shadow: 0 4px 24px -2px var(--shadow); }", "", " /* Fullscreen. */", " /* Fullscreen is disabled. */", "", " /* App background. */", " #app > div::after {", " top: 0px; right: 0px;", " bottom: 0px; left: 0px;", " height: auto; width: auto;", " background-color: var(--dark) !important;", " background-image: var(--image) !important;", " background-repeat: no-repeat;", " background-size: cover;", " background-position: center; }", "", " }", "", " /* \"Privacy mode.\" */", " /* Blurred contacts are disabled. */", " /* Blurred images are disabled. */", "", " /* Compact mode. */", " /* Reset min app height/width reset. */", " @media screen and (max-height: 500px) { #app > div > .app { min-height: auto; }}", " @media screen and (max-width: 648px) { #app > div > .app { min-width: auto; }}", " /* Custom compact mode. */", " @media screen and (max-width:720px) {", " /* .app > div div:hover { box-shadow: 0 0 0 2px inset crimson !important; } /**/", " /* Fix header width hiding icons. */", " #side > header { min-width: 240px; }", " /* Hide notifications. */", " #side > header + span { display: none }", " /* Search bar width. */", " .ZP8RM:not(._19OGD) label { padding: 0px; }", " /* ? Reset panes. */", " .three > div:nth-child(3),", " .three > div:nth-child(2) > div:nth-child(1),", " .two > div:nth-child(2) > div:nth-child(1),", " .two > div:nth-child(3) {", " flex: 0 0 75px !important; }", " /* Settings/Starred/Etc. */", " .two > div:nth-child(2) > div._3kF8H {", " transition: 0.3s ease-in-out !important;", " flex: 0 0 75px !important; }", " .two > div:nth-child(2) > div._3kF8H:hover {", " flex: 0 0 30% !important; }", " /* Upload preview. */", " .two > div:nth-child(2) > div._2rI9W {", " flex: 0 0 calc(100% - 75px) !important; }", " /* Don\'t expand contacts if there are 3 panes. */", " .three > div:nth-child(3):hover {", " flex: 0 0 75px !important; }", " /* Expand contacts. */", " .two > div:nth-child(3) {", " min-width: 1px !important;", " transition: 0.3s ease-in-out !important;", " transition-delay: 0.2s !important; }", " .two > div:nth-child(3):hover {", " min-width: 400px !important;", " transition-delay: var(--hover-delay) !important;", " flex: 0 0 30% !important; }", " /* Pane -> Chat. */", " .three ._2rI9W { flex: 1 1 auto !important; }", " /* Pane -> Info. */", " .three ._1C9rS {", " max-width: 400px;", " width: calc(100% - 76px); }", " /* ? Hack for positioning unread counter. */", " ._2UaNq .xD91K {", " z-index: 199 !important;", " display: flex !important;", " flex-direction: row-reverse !important; }", " /* ? Unread counter. */", " ._2UaNq .xD91K ._1ZMSM .P6z4j {", " z-index: 999 !important;", " line-height: 23px !important;", " margin: 7px 00px 0px -60px !important;", " transition: 0.15s ease !important;", " box-shadow: 0 0 0 3px var(--darker) !important; }", " /* On event. */", " #side ._2UaNq._3mMX1 .xD91K .P6z4j, #side ._2UaNq:hover .xD91K .P6z4j {", " /* color: var(--accent) !important;", " background-color: var(--darker) !important; */", " box-shadow: 0 0 0 3px var(--dark) !important; }", " /* Reset text position. */", " ._2UaNq .xD91K span[dir] { margin-left: 10px; }", " /* Remove icons we don\'t need. */", " #side ._1ZMSM > span:not(.P6z4j) { display: none !important }", " /* Remove overflow for unread messages counter. */", " #side ._0LqQ {", " margin-left: -10px !important;", " overflow: unset !important }", " /* Message dropdown thing; fixes ticks jumping left and right. */", " #side ._0LqQ > span:last-child:not(._17TaE) { display: none !important }", " /* ? Hack for positioning message status. */", " ._3VIru {", " z-index: 101;", " position: absolute;", " margin: 5px 0 0 -20px;", " border-radius: 50%;", " transition: 0.15s ease !important;", " background-color: var(--dark);", " box-shadow: 0 0 0 3px var(--darker); }", " /* Make SVG smaller. */", " ._3VIru > span > svg {", " padding: 2px;", " height: 14px !important;", " width: 14px !important; }", " /* Background on event. */", " ._2UaNq:hover ._3VIru, ._2UaNq._3mMX1 ._3VIru {", " background-color: var(--darker);", " box-shadow: 0 0 0 3px var(--dark) !important; }", " }", "", "", " /* Custom CSS rules. */", " /**", " * Userstyles.org limitations prevent this; ", " * Install UserCSS version from GitHub to use it. ", " */" ].join("\n"); if (typeof GM_addStyle != "undefined") { GM_addStyle(css); } else if (typeof PRO_addStyle != "undefined") { PRO_addStyle(css); } else if (typeof addStyle != "undefined") { addStyle(css); } else { var node = document.createElement("style"); node.type = "text/css"; node.appendChild(document.createTextNode(css)); var heads = document.getElementsByTagName("head"); if (heads.length > 0) { heads[0].appendChild(node); } else { // no head yet, stick it whereever document.documentElement.appendChild(node); } } const regexes = [ // en /whatsapp works with.*to use whatsapp.*update/i, // pt /o whatsapp funciona com.*para utilizar o whatsapp.*atualize/i ] for (const regex of regexes) { if (document.body.innerText.replace(/\n/g, ' ').search(regex) !== -1) { navigator.serviceWorker.getRegistration().then(function (r) { r.unregister(); document.location.reload() }); return; } } })();