skin de google chat para ser parecido a slack
Google chat skin slack by diegocostares
Details
Authordiegocostares
LicenseNo License
Categoryslack
Created
Updated
Size9.1 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
/* ==UserStyle==
@name Google chat skin slack
@namespace userstyles.world/user/diegocostar
@version 1.0.0
@description Still a WIP.
@author diegocostar
==/UserStyle== */
@-moz-document domain("chat.google.com") {
body {
color: #f8f8f8;
}
/*[data-theme="dark"] */
* {
--app-color: #4a99cc;
--background-color: #1b1d21; /* Fondo chats */
--text-color: #f8f8f8;
--morado-claro: #63346f;
--morado-oscuro: #302334;
--threaded-spaces-components-background-color: var(--background-color);
--gm3-color-surface: var(--background-color);
--pkw-background: var(--background-color);
--primary-app-color: var(--app-color);
--quote-line-color: var(--app-color);
--world-section-hover-bg-color: var(--morado-claro); /*Hover canales */
--list-item-hover-bg-color: var(--morado-oscuro); /*Hover mini canales */
--list-item-unread-text-color: var(--text-color); /*Texto sin leer*/
--gm3-color-on-surface-variant: #ccc; /*Texto chats y canales*/
--conversation-header-primary-text-color: #ccc; /*nombre usuario chat privado */
--primary-text-color: var(--text-color);
--pkw-on-surface: var(--text-color);; /*Texto crear canales*/
--gm3-color-on-surface: var(--text-color); /*#858585 titulos*/
--world-section-active-bg-color: var(--morado-claro);
--quoted-message-bg-color: #26292e; /*Hover canales */
--gm3-color-secondary-container: var(--morado-claro); /*Hover canales2 */
--gm3-button-filled-disabled-container-color: var(--morado-oscuro); /*boton iniciar chat */
--gm3-button-filled-disabled-label-text-color: var(--text-color);;/*texto boton iniciar chat */
--gm3-button-filled-container-color: var(--morado-claro); /*otro boton */
--gm3-color-on-secondary-container: var(--text-color); /*Color texto al seleccionar un elemento */
--message-background-color: #1b1d21;
--threaded-spaces-panel-button-color: #4a99cc; /*texto respuestas mensajes */
--message-author-background-color: #26292e; /*color texto usuario */
--icon-color: var(--text-color);
--postbar-button-icon-color: var(--text-color);
--button-filled-bg-color: var(--morado-claro); /*btn de ir al final */
--mute-toggle-gradient: none; /*gradiente random */
--stream-container-background-color: #26292e; /* linea divisora */
--button-filled-hover-bg-color: var(--primary-app-color);
--button-filled-focus-bg-color: var(--primary-app-color);
--button-filled-focus-hover-bg-color: var(--primary-app-color);
--button-filled-pressed-bg-color: var(--primary-app-color);
--button-text-color: var(--primary-app-color);
--button-text-hover-bg-color: rgba(221, 0, 255, .039);
--button-text-hover-color: #f4d2fc;
--button-text-focus-bg-color: rgba(212, 0, 255, .122);
--button-text-focus-color: #d2e3fc;
--button-text-focus-hover-bg-color: rgba(255, 0, 208, .102);
--button-text-focus-hover-color: #d2e3fc;
--button-text-pressed-bg-color: rgba(255, 36, 0, 0.102);
--button-text-pressed-color: var(--primary-app-color);
--gm3-data-table-header-container-color: var(--background-color);
--gm3-data-table-header-headline-color: var(--text-color);
--gm3-data-table-row-item-label-text-color: var(--text-color);
--gm3-data-table-row-item-unselected-container-color: var(--background-color);
--selected-state-color: rgba(255, 0, 238, .239);
--smart-reply-btn-bg-color: #101010;
--smart-reply-btn-active-bg-color: #202020;
--self-mention-new-bg-color: var(--primary-app-color);
--button-filled-color: #fff;
--settings-bg-color: #050505;
--settings-card-bg-color: #101010;
--card-bg-color: #101010;
--settings-footer-bg-color: #080808;
--settings-header-bg-color: #080808;
--dialog-bg-color: #202020;
--dialog-highlighted-bg-color: rgba(255, 255, 255, 0.078);
--dialog-hairline-line-color: #505050;
--dialog-hairline-style: solid 1px var(--dialog-hairline-line-color);
--topbar-bg-color: #181818;
}
.HoJbp {
color: #fff;
}
.cmEq8b .NhKrqd {
background-color: var(--primary-app-color);
filter: saturate(0.75) brightness(1.5);
}
.cmEq8b .lL7iUe .Zc1Emd {
color: #404040;
}
.list-space-panel.dark-theme {
background-color: var(--primary-app-color) !important;
}
.SncUne .MDxAdd {
background: var(--primary-app-color);
}
a {
color: var(--primary-app-color);
}
a:hover:not(.yGeRMb):not(.Pj9rof) {
filter: contrast(0.5) brightness(2);
}
.KM9vFe:focus-within, .KM9vFe:hover, .KM9vFe.VCwAb {
background-color: var(--world-section-hover-bg-color);
}
.Eb3cg.kDNwZd.IrgmCb > div > div.JwR1Pc > div > span{
--list-item-unread-text-color: #ccc;
}
body > c-wiz.BCL84c.aM97s.ZCbGl.zmXnlc.n0GTjf > div > div > div > div.RWqrJc.lRFQ6d > span > div.kSBibe.yjtwbc > div.l9H1ve > div > div.Kk7lMc-ae3xF-MVH0Ye-bN97Pc-haAclf > div > div.jO3HBb > div > c-wiz > div.Bl2pUd.krjOGe > div > div.SvOPqd > c-wiz:nth-child(33) > div.dsoUjb.McQwEc > div > div > div > div > div.F0wyae.oGsu4 > div:nth-child(3) > div > div.uHxdfc > svg{
display: none;
}
.wdoEHc, .nF6pT.yqoUIf.C8Ncfd .lL7iUe .Zc1Emd {
background-color: #26292e;
}
/*.E4Wsrd, nF6pT.yqoUIf .zwfV5c, .BaJIW, .ZTmjQb, .nF6pT.yqoUIf .zwfV5c {display:none;} tag de " send it later"*/
}
@-moz-document url-prefix("https://mail.google.com/chat") {
/* Main page */
:root {
--app-color: #4a99cc;
--background-color: #1b1d21;
--add-btn-filter: hue-rotate(8.5deg);
--primary-text-color: #fff;
--morado: #63346f;
--buscador: #705478;
--morado-claro: #63346f;
}
/* boton chat nuevo*/
.L3.bGD {
background-color: #2d0d33 !important;
color: var(--primary-text-color);
}
.list-space-panel.dark-theme {
background-color: var(--primary-app-color) !important;
}
.list-space-panel .wrapper-spaces ul.tag-space {
background-color: var(--primary-app-color) !important;
}
.list-space-panel.dark-theme ul li:hover,
.list-space-panel.dark-theme ul li.selected {
background-color: var(--morado-claro) !important;
}
/* Boton de grupo con extension */
.gg-c-tag-name, .gg-c-tag-button {
background: var(--morado-claro) !important;
}
.bGF,.bGH {
color: var(--primary-text-color);
}
/* estado activo*/
.Yb.bax.bCd {
background: var(--morado);
.Yc.bax{
color: var(--primary-text-color);
}
}
/* buscador*/
form.bCb.bCe {
background: var(--buscador);
color: var(--primary-text-color) !important;
}
.nH,
.ajp {
background-color: #201225;
}
.bAw.bcf .brC-aT5-aOt-Jw:not(.brC-aMv-bta):not(.brC-aMv-auO) {
background: #63346f; /* linea navbar derecha */
}
.aT5-aOt-I-JW .aT5-aOt-I-JX-atM, .aT5-aOt-I-Kq .aT5-aOt-I-JX-atM, .brC-aMv-bta .aT5-aOt-I-KO .aT5-aOt-I-JX-atM, .brC-aMv-bta .aT5-aOt-I-JO .aT5-aOt-I-JX-atM {
background-color: #7b5984; /*circulos navbar derecho */
}
.XU,
.akt:hover .XU {
color: #fff;
background-color: #ebde56;
}
.gb_Bc .gb_Te {
background: transparent;
}
.gb_Te.gb_Ue .gb_ef {
color: white;
}
.Yh {
filter: var(--add-btn-filter);
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAO9JREFUOE/d1D1OA0EMhuFnAPEr4ArUHCLpqKg4SSokUCokOE4aOqDJHehzAmhIAyRaZGWIBlDYRLtV3Gzh2Xf8+fM4aTlSyzy1wMrPM4nqvyKWAe7gEnu4S4ybAg/wiCN0Ey9tAjuJ1zUBZje3sVVICkejh/e5h2dmkkszp3j/dn+eyMA+zhGHIgK4idN80TM+C2DkhrhOTOKH38BbXMjJDN3ACeI7Ki6LdKh5Qm8RMOTF3JXDu48BDnP1peQo6APjP5IXjUI16+EDjrFOY1MjudWnt4sbhDlXibemTy+cjHmLmDZeX6su4Np9uCrwC79nQBWEkSNsAAAAAElFTkSuQmCC")
}
@media (min-resolution: 144dpi),
(-webkit-min-device-pixel-ratio: 1.5) {
.Yh {
filter: var(--add-btn-filter);
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAS5JREFUWEft170uBUEYh/HfkLgIpYZOoRW9EAV6CQp3oHIDboDE0fvqFQSNC3AHKolKSeLjyMkZGtbZObvFJGa6Tf7vzLPPO7s7G2Q+QuZ8CmDTDhWD2RjsMoOJCPSI28B7ToAH2IxAl1gKPOcE2MFGBLrCYgFMaU+XYjBF2I9sMdhIH4rBYnBIA5Wnmfht3cJIf4sNHLOYjKkHXOBtYFV//tPA+W/ZvwBXcRwBa6zTKLId2E0FXMFJzoBz2MFozRZPYTxaeMIdPmp47c2/HzhKNdgrHKuxwFdkD2vx4gbLeKlZ/xoq9mtrR/7yoq7ZispYMVgMDmmgPMVDivsu+1cGD7Eeb/0aC7n9F89jOgLe46zq85XS9tZanLJoSrYApthKOm41nbit+tLipiY/AXtqdimPnFKiAAAAAElFTkSuQmCC")
}
}
}