diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e58294f --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +/.** \ No newline at end of file diff --git a/README.md b/README.md index dec8f7c..56fd7e0 100644 --- a/README.md +++ b/README.md @@ -1,12 +1,35 @@ -# discord-amoblack +# Discord AMOBlack Very dark Discord theme, ideal for AMOLED displays. +![Screenshot](screens/0.png?raw=true) + +Most plugins work without any problems. If some plugin element is not made black or there's some other problem, please create an issue [here][issues]. + +### Currently supported plugins: +1. **[MemberCount by Arashiryuu][plugin membercount]** +(background color fix) +![](screens/membercount.png?raw=true) +2. **[CharCounter by DevilBro][plugin charcounter]** +(placement and color fix) +![](screens/charcounter.png?raw=true) +3. **[BetterFormattingRedux][plugin bfredux]** +(background color fix) +![](screens/bfredux.png) + +Every other plugin I use works well, but if you use one that doesn't look good with this theme, feel free to [create an issue][issues]! + How to install --- -1. Download the file called [amoblack.theme.css](amoblack.theme.css) by right-clicking the button +1. Download the file called [amoblack.theme.css](amoblack.theme.css) (or [amoblack-dev](amoblack-dev.theme.css) for dev version) by right-clicking the button `Raw` on its page and selecting `Save link as`. Don't change its name and click `Save`. 2. In Discord with BandagedBD installed, go to `Settings`→`Themes`→`Open Theme Folder`. 3. Drag and drop (or move another way) the file you downloaded into the theme folder that Discord opened. You can close the file explorer windows. 4. Go back to Discord. In the themes settings, you should now see: `Discord AMOBlack v[???] by TheChilliPL`. To enable it, toggle the switch on its right. The theme should now be loaded. + + +[issues]: /../../issues/ +[plugin membercount]: https://github.com/Arashiryuu/crap/blob/master/ToastIntegrated/MemberCount/MemberCount.plugin.js +[plugin charcounter]: https://github.com/mwittrien/BetterDiscordAddons/tree/master/Plugins/CharCounter +[plugin bfredux]: https://github.com/rauenzi/BetterDiscordAddons/tree/master/Plugins/BetterFormattingRedux \ No newline at end of file diff --git a/amoblack-dev.theme.css b/amoblack-dev.theme.css new file mode 100644 index 0000000..7f57169 --- /dev/null +++ b/amoblack-dev.theme.css @@ -0,0 +1,12 @@ +/** + * @name Discord AMOblack + * @version Development + * @description Very dark theme, ideal for AMOLED displays. + * For bug reports, use GitHub issues. Open our GitHub by using the Website button below. + * @author TheChilliPL + * @authorId 213903338251485185 + * @website https://github.com/TheChilliPL/discord-amoblack + * @source https://github.com/TheChilliPL/discord-amoblack + */ + +@import url("https://raw.githack.com/TheChilliPL/discord-amoblack/dev/src/theme.min.css"); diff --git a/amoblack.theme.css b/amoblack.theme.css index ea1e2e0..3cea8fe 100644 --- a/amoblack.theme.css +++ b/amoblack.theme.css @@ -1,6 +1,6 @@ /** * @name Discord AMOblack - * @version 1.0 + * @version Newest stable * @description Very dark theme, ideal for AMOLED displays. * For bug reports, use GitHub issues. Open our GitHub by using the Website button below. * @author TheChilliPL @@ -9,4 +9,4 @@ * @source https://github.com/TheChilliPL/discord-amoblack */ -@import url("https://raw.githack.com/TheChilliPL/discord-amoblack/main/theme.css"); +@import url("https://raw.githack.com/TheChilliPL/discord-amoblack/main/src/theme.min.css"); diff --git a/screens/0.png b/screens/0.png new file mode 100644 index 0000000..5101b19 Binary files /dev/null and b/screens/0.png differ diff --git a/screens/bfredux.png b/screens/bfredux.png new file mode 100644 index 0000000..5397a9d Binary files /dev/null and b/screens/bfredux.png differ diff --git a/screens/charcounter.png b/screens/charcounter.png new file mode 100644 index 0000000..587b80b Binary files /dev/null and b/screens/charcounter.png differ diff --git a/screens/membercount.png b/screens/membercount.png new file mode 100644 index 0000000..0762883 Binary files /dev/null and b/screens/membercount.png differ diff --git a/src/theme.css b/src/theme.css new file mode 100644 index 0000000..838b8bc --- /dev/null +++ b/src/theme.css @@ -0,0 +1,270 @@ +/** + * @name Discord AMOblack (local) + * @version 1.1 + * @description Very dark theme, ideal for AMOLED displays. + * For bug reports, use GitHub issues. Open our GitHub by using the Website button below. + * @author TheChilliPL + * @authorId 213903338251485185 + * @website https://github.com/TheChilliPL/discord-amoblack + * @source https://github.com/TheChilliPL/discord-amoblack + */ +html.theme-dark { + --background-primary: #000; + --background-secondary: #000; + --background-secondary-alt: #000; + --background-tertiary: #000; + --background-accent: #000; + --background-floating: #000; + --channeltextarea-background: #000; + --text-normal: #888; + --text-link: #079; + --header-primary: #888; + --interactive-active: var(--text-normal); + --background-modifier-active: transparent; + --interactive-selected: var(--text-normal); + --background-modifier-selected: transparent; + --interactive-hover: var(--text-normal); + --background-modifier-hover: transparent; + --deprecated-text-input-bg: #000; + --deprecated-text-input-border: #666; + --background-mentioned-hover: transparent; + --ab--selected: #666; + --ab--hover: #444; + --ab--border: #222; +} +html.theme-dark .selected-aXhQR6 .layout-2DM8Md { + position: relative; +} +html.theme-dark .selected-aXhQR6 .layout-2DM8Md::before { + content: ""; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + border: 1px var(--ab--selected) solid; + border-radius: 5px; + pointer-events: none; +} +html.theme-dark .clickable-1JJAn8.container-2Pjhx-:hover, html.theme-dark .clickable-1JJAn8.container-2Pjhx-:hover .muted-3mU76i { + position: relative; +} +html.theme-dark .clickable-1JJAn8.container-2Pjhx-:hover::before, html.theme-dark .clickable-1JJAn8.container-2Pjhx-:hover .muted-3mU76i::before { + content: ""; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + border: 1px var(--ab--hover) solid; + border-radius: 5px; + pointer-events: none; +} +html.theme-dark .modeSelected-1zApJ_ .content-3at_AU, html.theme-dark .modeSelected-1zApJ_:hover .content-3at_AU { + position: relative; +} +html.theme-dark .modeSelected-1zApJ_ .content-3at_AU::before, html.theme-dark .modeSelected-1zApJ_:hover .content-3at_AU::before { + content: ""; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + border: 1px var(--ab--selected) solid; + border-radius: 5px; + pointer-events: none; +} +html.theme-dark .wrapper-1ucjTd:hover .content-3at_AU { + position: relative; +} +html.theme-dark .wrapper-1ucjTd:hover .content-3at_AU::before { + content: ""; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + border: 1px var(--ab--hover) solid; + border-radius: 5px; + pointer-events: none; +} +html.theme-dark .expandedFolderBackground-2sPsd- { + min-height: 48px; + pointer-events: none; +} +html.theme-dark .expandedFolderBackground-2sPsd-::before { + content: ""; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + border: 1px var(--ab--border) solid; + border-radius: 24px; + pointer-events: none; + z-index: 1000; +} +html.theme-dark .expandedFolderBackground-2sPsd-.collapsed-1GMuSb::before { + border-radius: 17px; +} +html.theme-dark .embedFull-2tM8-- { + border: 1px solid var(--ab--border); + border-left-width: 4px; +} +html.theme-dark .embedFull-2tM8-- .embedMedia-1guQoW { + margin-top: 5px; +} +html.theme-dark .mentioned-xhSam7 { + background-color: transparent; + position: relative; +} +html.theme-dark .mentioned-xhSam7::after { + content: ""; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + border: 1px #faa61a solid; + border-radius: 5px; + pointer-events: none; + border-left-width: 4px; +} +html.theme-dark .buttons-cl5qTG .wrapper-2aW0bm { + border: 1px var(--ab--border) solid; +} +html.theme-dark .menu-3sdvDG { + border: 1px var(--ab--border) solid; +} +html.theme-dark .drawerSizingWrapper-17Mss4 { + border: 1px var(--ab--border) solid; +} +html.theme-dark .modal-3c3bKg .inner-1ilYF7 { + border: 1px var(--ab--border) solid; +} +html.theme-dark .titleBar-AC4pGV { + border-bottom: 1px var(--ab--border) solid; +} +html.theme-dark .guilds-1SWlCJ { + width: 71px; + border-right: 1px var(--ab--border) solid; +} +html.theme-dark .sidebar-2K8pFh { + border-right: 1px var(--ab--border) solid; +} +html.theme-dark .title-3qD0b- { + border-bottom: 1px var(--ab--border) solid; +} +html.theme-dark .members-1998pB { + border-left: 1px var(--ab--border) solid; +} +html.theme-dark .header-2o-2hj, html.theme-dark .searchBar-6Kv8R2 { + border-bottom: 1px var(--ab--border) solid; +} +html.theme-dark .searchBar-6Kv8R2 { + height: 47px; +} +html.theme-dark .hasBanner-14PPlG .header-2o-2hj { + border-bottom: none; +} +html.theme-dark .panels-j1Uci_ { + border-top: 1px var(--ab--border) solid; +} +html.theme-dark .form-2fGMdU { + padding: 0; + border-top: 1px var(--ab--border) solid; +} +html.theme-dark .channelTextArea-rNsIhG { + margin: 4px 0 5px; +} +html.theme-dark .wrapper-39oAo3 { + margin-bottom: 1px; +} +html.theme-dark .tooltipPointer-3ZfirK { + border-top-color: var(--ab--selected); +} +html.theme-dark .tooltipContent-bqVLWK { + border: 1px var(--ab--selected) solid; +} +html.theme-dark .blobContainer-239gwq, +html.theme-dark .closedFolderIconWrapper-15K9MK, +html.theme-dark .message-2qnXI6 .imageWrapper-2p5ogY { + position: relative; +} +html.theme-dark .blobContainer-239gwq::before, +html.theme-dark .closedFolderIconWrapper-15K9MK::before, +html.theme-dark .message-2qnXI6 .imageWrapper-2p5ogY::before { + content: ""; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + background-color: rgba(0, 0, 0, 0.3); + z-index: 999; + pointer-events: none; +} +html.theme-dark .container-1D34oG { + background: var(--background-primary); +} +html.theme-dark .root-1gCeng { + background: var(--background-primary); +} +html.theme-dark .footer-2gL1pp { + background: var(--background-secondary); +} +html.theme-dark .friendSelected-1sa4bG { + background: var(--background-modifier-selected); + position: relative; +} +html.theme-dark .friendSelected-1sa4bG::before { + content: ""; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + border: 1px var(--ab--selected) solid; + border-radius: 5px; + pointer-events: none; +} +html.theme-dark .headerNormal-T_seeN { + background: var(--background-tertiary); +} +html.theme-dark .body-3iLsc4, html.theme-dark .footer-1fjuF6 { + background: var(--background-secondary); +} +html.theme-dark .uploadModal-2ifh8j { + background: var(--background-primary); +} +html.theme-dark .footer-3mqk7D { + background: var(--background-secondary); +} +html.theme-dark .typing-2GQL18 { + bottom: 100%; +} +html.theme-dark .container-3ayLPN { + background: var(--background-primary); + border: 1px var(--ab--border) solid; +} +html.theme-dark .option-96V44q.selected-rZcOL- { + background: var(--background-secondary); + border: 1px var(--ab--selected) solid; +} +html.theme-dark .option-96V44q::after, html.theme-dark .option-96V44q.selected-rZcOL-::after { + background: transparent; +} +html.theme-dark #MemberCount { + background: var(--background-secondary); +} +html.theme-dark .chatCounter-XOMPsh { + bottom: 0; + right: 120px; + color: var(--ab--hover); +} +html.theme-dark .bf-toolbar::before { + background: var(--background-accent); + border: 1px var(--ab--selected) solid; +} + +/*# sourceMappingURL=theme.css.map */ diff --git a/src/theme.css.map b/src/theme.css.map new file mode 100644 index 0000000..d9eebd7 --- /dev/null +++ b/src/theme.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["theme.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyDA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;AAIA;EA7CE;;AAvBA;EAQA;EACA;EACA;EAAQ;EAAU;EAAW;EAiB7B;EACA,eAXO;EAaP;;AAyCF;EAhDE;;AAvBA;EAQA;EACA;EACA;EAAQ;EAAU;EAAW;EAiB7B;EACA,eAXO;EAaP;;AA6CF;EApDE;;AAvBA;EAQA;EACA;EACA;EAAQ;EAAU;EAAW;EAiB7B;EACA,eAXO;EAaP;;AAgDF;EAvDE;;AAvBA;EAQA;EACA;EACA;EAAQ;EAAU;EAAW;EAiB7B;EACA,eAXO;EAaP;;AAqDF;EACE;EAEA;;AAtFA;EAQA;EACA;EACA;EAAQ;EAAU;EAAW;EAiB7B;EACA,eAyD0C;EAvD1C;EAKE,SAkDqD;;AAGvD;EACE;;AAKJ;EACE;EACA;;AAEA;EACE;;AAKJ;EACE;EAlFA;;AA3BA;EAYA;EACA;EACA;EAAQ;EAAU;EAAW;EAiB7B;EACA,eAXO;EAaP;EA6EE;;AAKJ;EACE;;AAIF;EACE;;AAIF;EACE;;AAIF;EACE;;AAKF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAEF;EACE;;AAGF;EACE;;AAGF;EACE;;AAIF;EACE;EACA;;AAEF;EACE;;AAIF;EACE;;AAIF;EACE;;AAEF;EACE;;AAKF;AAAA;AAAA;EAGE;;AApMA;AAAA;AAAA;EAQA;EACA;EACA;EAAQ;EAAU;EAAW;EA4L3B;EACA;EACA;;AAMJ;EACE;;AAIF;EACE;;AAGF;EACE;;AAIF;EACE;EAtMA;;AAvBA;EAQA;EACA;EACA;EAAQ;EAAU;EAAW;EAiB7B;EACA,eAXO;EAaP;;AAoMF;EACE;;AAEF;EACE;;AAIF;EACE;;AAGF;EACE;;AAIF;EACE;;AAIF;EACE;EACA;;AAEF;EACE;EACA;;AAGA;EACE;;AAMJ;EACE;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA","file":"theme.css"} \ No newline at end of file diff --git a/src/theme.min.css b/src/theme.min.css new file mode 100644 index 0000000..1189fbb --- /dev/null +++ b/src/theme.min.css @@ -0,0 +1 @@ +html.theme-dark{--background-primary: #000;--background-secondary: #000;--background-secondary-alt: #000;--background-tertiary: #000;--background-accent: #000;--background-floating: #000;--channeltextarea-background: #000;--text-normal: #888;--text-link: #079;--header-primary: #888;--interactive-active: var(--text-normal);--background-modifier-active: transparent;--interactive-selected: var(--text-normal);--background-modifier-selected: transparent;--interactive-hover: var(--text-normal);--background-modifier-hover: transparent;--deprecated-text-input-bg: #000;--deprecated-text-input-border: #666;--background-mentioned-hover: transparent;--ab--selected: #666;--ab--hover: #444;--ab--border: #222}html.theme-dark .clickable-1JJAn8.container-2Pjhx-:hover,html.theme-dark .clickable-1JJAn8.container-2Pjhx-:hover .muted-3mU76i,html.theme-dark .modeSelected-1zApJ_ .content-3at_AU,html.theme-dark .modeSelected-1zApJ_:hover .content-3at_AU,html.theme-dark .selected-aXhQR6 .layout-2DM8Md,html.theme-dark .wrapper-1ucjTd:hover .content-3at_AU{position:relative}html.theme-dark .modeSelected-1zApJ_ .content-3at_AU::before,html.theme-dark .selected-aXhQR6 .layout-2DM8Md::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px var(--ab--selected) solid;border-radius:5px;pointer-events:none}html.theme-dark .clickable-1JJAn8.container-2Pjhx-:hover .muted-3mU76i::before,html.theme-dark .clickable-1JJAn8.container-2Pjhx-:hover::before,html.theme-dark .modeSelected-1zApJ_:hover .content-3at_AU::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px var(--ab--hover) solid;border-radius:5px;pointer-events:none}html.theme-dark .modeSelected-1zApJ_:hover .content-3at_AU::before{border:1px var(--ab--selected) solid}html.theme-dark .expandedFolderBackground-2sPsd-::before,html.theme-dark .wrapper-1ucjTd:hover .content-3at_AU::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px var(--ab--hover) solid;border-radius:5px;pointer-events:none}html.theme-dark .expandedFolderBackground-2sPsd-{min-height:48px;pointer-events:none}html.theme-dark .expandedFolderBackground-2sPsd-::before{border:1px var(--ab--border) solid;border-radius:24px;z-index:1000}html.theme-dark .expandedFolderBackground-2sPsd-.collapsed-1GMuSb::before{border-radius:17px}html.theme-dark .embedFull-2tM8--{border:1px solid var(--ab--border);border-left-width:4px}html.theme-dark .embedFull-2tM8-- .embedMedia-1guQoW{margin-top:5px}html.theme-dark .mentioned-xhSam7{background-color:transparent;position:relative}html.theme-dark .mentioned-xhSam7::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px #faa61a solid;border-radius:5px;pointer-events:none;border-left-width:4px}html.theme-dark .buttons-cl5qTG .wrapper-2aW0bm,html.theme-dark .drawerSizingWrapper-17Mss4,html.theme-dark .menu-3sdvDG,html.theme-dark .modal-3c3bKg .inner-1ilYF7{border:1px var(--ab--border) solid}html.theme-dark .titleBar-AC4pGV{border-bottom:1px var(--ab--border) solid}html.theme-dark .guilds-1SWlCJ{width:71px}html.theme-dark .guilds-1SWlCJ,html.theme-dark .sidebar-2K8pFh{border-right:1px var(--ab--border) solid}html.theme-dark .title-3qD0b-{border-bottom:1px var(--ab--border) solid}html.theme-dark .members-1998pB{border-left:1px var(--ab--border) solid}html.theme-dark .header-2o-2hj,html.theme-dark .searchBar-6Kv8R2{border-bottom:1px var(--ab--border) solid}html.theme-dark .searchBar-6Kv8R2{height:47px}html.theme-dark .hasBanner-14PPlG .header-2o-2hj{border-bottom:none}html.theme-dark .form-2fGMdU,html.theme-dark .panels-j1Uci_{border-top:1px var(--ab--border) solid}html.theme-dark .form-2fGMdU{padding:0}html.theme-dark .channelTextArea-rNsIhG{margin:4px 0 5px}html.theme-dark .wrapper-39oAo3{margin-bottom:1px}html.theme-dark .tooltipPointer-3ZfirK{border-top-color:var(--ab--selected)}html.theme-dark .tooltipContent-bqVLWK{border:1px var(--ab--selected) solid}html.theme-dark .blobContainer-239gwq,html.theme-dark .closedFolderIconWrapper-15K9MK,html.theme-dark .message-2qnXI6 .imageWrapper-2p5ogY{position:relative}html.theme-dark .blobContainer-239gwq::before,html.theme-dark .closedFolderIconWrapper-15K9MK::before,html.theme-dark .message-2qnXI6 .imageWrapper-2p5ogY::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,.3);z-index:999;pointer-events:none}html.theme-dark .container-1D34oG,html.theme-dark .root-1gCeng{background:var(--background-primary)}html.theme-dark .footer-2gL1pp{background:var(--background-secondary)}html.theme-dark .friendSelected-1sa4bG{background:var(--background-modifier-selected);position:relative}html.theme-dark .friendSelected-1sa4bG::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px var(--ab--selected) solid;border-radius:5px;pointer-events:none}html.theme-dark .headerNormal-T_seeN{background:var(--background-tertiary)}html.theme-dark .body-3iLsc4,html.theme-dark .footer-1fjuF6{background:var(--background-secondary)}html.theme-dark .uploadModal-2ifh8j{background:var(--background-primary)}html.theme-dark #MemberCount,html.theme-dark .footer-3mqk7D{background:var(--background-secondary)}html.theme-dark .typing-2GQL18{bottom:100%}html.theme-dark .container-3ayLPN{background:var(--background-primary);border:1px var(--ab--border) solid}html.theme-dark .option-96V44q.selected-rZcOL-{background:var(--background-secondary);border:1px var(--ab--selected) solid}html.theme-dark .option-96V44q.selected-rZcOL-::after,html.theme-dark .option-96V44q::after{background:0 0}html.theme-dark .chatCounter-XOMPsh{bottom:0;right:120px;color:var(--ab--hover)}html.theme-dark .bf-toolbar::before{background:var(--background-accent);border:1px var(--ab--selected) solid} \ No newline at end of file diff --git a/src/theme.scss b/src/theme.scss new file mode 100644 index 0000000..129b462 --- /dev/null +++ b/src/theme.scss @@ -0,0 +1,298 @@ +/** + * @name Discord AMOblack (local) + * @version 1.1 + * @description Very dark theme, ideal for AMOLED displays. + * For bug reports, use GitHub issues. Open our GitHub by using the Website button below. + * @author TheChilliPL + * @authorId 213903338251485185 + * @website https://github.com/TheChilliPL/discord-amoblack + * @source https://github.com/TheChilliPL/discord-amoblack + */ + +@mixin pseudo($after: false) { + @if $after { + &::after { + @content; + } + } @else { + &::before { + @content; + } + } +} + +@mixin pseudo-full($after: false) { + @include pseudo($after) { + content: ""; + position: absolute; + top: 0; right: 0; bottom: 0; left: 0; + @content; + } +} + +@mixin pseudo-border( + $color, + $radius: 5px, + $relative: true, + $z-index: null, + $after: false +) { + @if $relative { + position: relative; + } + + @include pseudo-full($after) { + border: 1px $color solid; + border-radius: $radius; + + pointer-events: none; + + @content; + + @if ($z-index) { + z-index: $z-index; + } + } +} + +html.theme-dark { + // Variables + --background-primary: #000; //#36393f + --background-secondary: #000; //#2f3136 + --background-secondary-alt: #000; //#292b2f + --background-tertiary: #000; //#202225 + --background-accent: #000; //#4f545c + --background-floating: #000; //#18191c + --channeltextarea-background: #000; + --text-normal: #888; + --text-link: #079; + --header-primary: #888; + --interactive-active: var(--text-normal); + --background-modifier-active: transparent; + --interactive-selected: var(--text-normal); + --background-modifier-selected: transparent; + --interactive-hover: var(--text-normal); + --background-modifier-hover: transparent; + --deprecated-text-input-bg: #000; + --deprecated-text-input-border: #666; + --background-mentioned-hover: transparent; + + --ab--selected: #666; + --ab--hover: #444; + --ab--border: #222; + + // Interactive shade to outline + // Member/DM list + .selected-aXhQR6 .layout-2DM8Md { + @include pseudo-border(var(--ab--selected)); + } + .clickable-1JJAn8.container-2Pjhx-:hover, .clickable-1JJAn8.container-2Pjhx-:hover .muted-3mU76i { + @include pseudo-border(var(--ab--hover)); + } + // Channel list + .modeSelected-1zApJ_ .content-3at_AU, .modeSelected-1zApJ_:hover .content-3at_AU { + @include pseudo-border(var(--ab--selected)); + } + .wrapper-1ucjTd:hover .content-3at_AU { + @include pseudo-border(var(--ab--hover)); + } + + // Server folder border + .expandedFolderBackground-2sPsd- { + min-height: 48px; + @include pseudo-border(var(--ab--border), 24px, false, 1000); + pointer-events: none; + + &.collapsed-1GMuSb::before { + border-radius: 17px; + } + } + + // Embed border + .embedFull-2tM8-- { + border: 1px solid var(--ab--border); + border-left-width: 4px; + + .embedMedia-1guQoW { + margin-top: 5px; + } + } + + // Mentioned message + .mentioned-xhSam7 { + background-color: transparent; + @include pseudo-border(#faa61a, $after: true) { + border-left-width: 4px; + }; + } + + // Message buttons + .buttons-cl5qTG .wrapper-2aW0bm { + border: 1px var(--ab--border) solid; + } + + // Context menus + .menu-3sdvDG { + border: 1px var(--ab--border) solid; + } + + // Emoji picker + .drawerSizingWrapper-17Mss4 { + border: 1px var(--ab--border) solid; + } + + // Modals + .modal-3c3bKg .inner-1ilYF7 { + border: 1px var(--ab--border) solid; + } + + // Layout borders --------------------------- + // Title bar + .titleBar-AC4pGV { + border-bottom: 1px var(--ab--border) solid; + } + // Server list + .guilds-1SWlCJ { + width: 71px; + border-right: 1px var(--ab--border) solid; + } + // Channel list + .sidebar-2K8pFh { + border-right: 1px var(--ab--border) solid; + } + // Channel title + .title-3qD0b- { + border-bottom: 1px var(--ab--border) solid; + } + // Members list + .members-1998pB { + border-left: 1px var(--ab--border) solid; + } + // Sidebar header and DM search bar + .header-2o-2hj, .searchBar-6Kv8R2 { + border-bottom: 1px var(--ab--border) solid; + } + .searchBar-6Kv8R2 { + height: 47px; + } + // Unless the server has a banner + .hasBanner-14PPlG .header-2o-2hj { + border-bottom: none; + } + // Sidebar footer + .panels-j1Uci_ { + border-top: 1px var(--ab--border) solid; + } + + // Chat text box + .form-2fGMdU { + padding: 0; + border-top: 1px var(--ab--border) solid; + } + .channelTextArea-rNsIhG { + margin: 4px 0 5px; + } + + // Follow channel updates info + .wrapper-39oAo3 { + margin-bottom: 1px; + } + + // Tooltips + .tooltipPointer-3ZfirK { + border-top-color: var(--ab--selected); + } + .tooltipContent-bqVLWK { + border: 1px var(--ab--selected) solid; + } + + // Dimming -------------------------------- + // Server icons + .blobContainer-239gwq, + .closedFolderIconWrapper-15K9MK, + .message-2qnXI6 .imageWrapper-2p5ogY { + position: relative; + @include pseudo-full { + background-color: transparentize(#000, 0.7); + z-index: 999; + pointer-events: none; + } + } + + // Fixes ---------------------------------- + // Friends fullscreen list fix + .container-1D34oG { + background: var(--background-primary); + } + + // Custom status modal fix + .root-1gCeng { + background: var(--background-primary); + } + // Custom status modal footer fix + .footer-2gL1pp { + background: var(--background-secondary); + } + + // Group add friend selected list element fix + .friendSelected-1sa4bG { + background: var(--background-modifier-selected); + @include pseudo-border(var(--ab--selected)); + } + + // Profile modal header fix + .headerNormal-T_seeN { + background: var(--background-tertiary); + } + .body-3iLsc4, .footer-1fjuF6 { + background: var(--background-secondary); + } + + // Upload modal fix + .uploadModal-2ifh8j { + background: var(--background-primary); + + } + .footer-3mqk7D { + background: var(--background-secondary); + } + + // Typing indicator fix + .typing-2GQL18 { + bottom: 100%; + } + + // Search options window fix + .container-3ayLPN { + background: var(--background-primary); + border: 1px var(--ab--border) solid; + } + .option-96V44q.selected-rZcOL- { + background: var(--background-secondary); + border: 1px var(--ab--selected) solid; + } + .option-96V44q { + &::after, &.selected-rZcOL-::after { + background: transparent; + } + } + + // Plugins ------------------------------------- + // Member count plugin fix + #MemberCount { + background: var(--background-secondary); + } + + // Char counter plugin fix + .chatCounter-XOMPsh { + bottom: 0; + right: 120px; + color: var(--ab--hover); + } + + // BetterFormatting plugin fix + .bf-toolbar::before { + background: var(--background-accent); + border: 1px var(--ab--selected) solid; + } +} \ No newline at end of file diff --git a/theme.css b/theme.css deleted file mode 100644 index 99eb188..0000000 --- a/theme.css +++ /dev/null @@ -1,147 +0,0 @@ -/** - * @name Discord AMOblack (local) - * @version 1.0 - * @description Very dark theme, ideal for AMOLED displays. - * For bug reports, use GitHub issues. Open our GitHub by using the Website button below. - * @author TheChilliPL - * @authorId 213903338251485185 - * @website https://github.com/TheChilliPL/discord-amoblackf - * @source https://github.com/TheChilliPL/discord-amoblackf - */ - -html.theme-dark { - --background-primary: #000; - --background-secondary: #000; - --background-secondary-alt: #000; - --background-tertiary: #000; - --background-accent: #000; - --background-floating: #000; - --channeltextarea-background: #000; - --text-normal: #888; - --text-link: #079; - --header-primary: #888; - --interactive-active: #888; -} - -.da-wrapper > span.da-expandedFolderBackground { - min-height: 48px; - - box-shadow: 0 0 0 1px #333; -} - -.da-folderIconWrapper, .da-expandedFolderIconWrapper, .da-folder { - background-color: transparent; -} - -.da-scroller::-webkit-scrollbar, .da-uploadModal { - background-color: #000 !important; -} - -.da-scroller::-webkit-scrollbar-track { - background-color: #000 !important; - border-color: #000 !important; -} - -.da-scroller::-webkit-scrollbar-track-piece { - background-color: #000 !important; - border-color: #000 !important; - border-radius: 0 !important; -} - -.da-container, .theme-dark .footer-3rDWdC, .da-message, .theme-dark .headerNormal-T_seeN, .da-bodyInner, .da-footer { - background-color: #000 !important; -} - -.da-wrapper.guilds-1SWlCJ, .da-sidebar, .da-members, .da-message .da-imageWrapper img, .da-channelTextArea button, .da-chat > .da-title, img.emoji, .hljs { - filter: brightness(30%); - - transition: 300ms filter ease-in-out; -} - -.da-wrapper.guilds-1SWlCJ:hover, .da-sidebar:hover, .da-members:hover, .da-message .da-imageWrapper img:hover, .da-channelTextArea button:hover, .da-chat > .da-title:hover, img.emoji:hover, .hljs:hover { - filter: brightness(70%); -} - -.da-channelTextArea .da-webkit { - border: 1px #333 solid; - border-radius: 25px; -} - -.da-zalgo .da-avatar::after { - content: ''; - - background-color: rgba(0, 0, 0, 0.7); - - position: absolute; - - left: 0; - top: 0; - width: 100%; - height: 100%; - - transition: 300ms background-color ease-in-out; -} - -.da-zalgo .da-avatar:hover::after { - background-color: rgba(0, 0, 0, 0.3); -} - -.da-unread.da-container { - background-color: transparent !important; -} - -.theme-dark .body-3iLsc4 { - background-color: #000; -} - -.textarea-2r0oV8, .textarea-2r0oV8:hover { - border: 1px #333 solid; -} - -.theme-dark .wrapper-1-Fsb8 { - background-color: #000; -} - -.theme-dark .root-1gCeng { - background-color: #000; -} - -.authedApp-mj2Hmd { - border: 1px #333 solid; -} - -.theme-dark .paymentPane-3bwJ6A, -.theme-dark .paginator-166-09, -.theme-dark .payment-xT17Mq { - background-color: #000; -} - -.theme-dark .codeRedemptionRedirect-1wVR4b { - background-color: #000; -} - -.input-2VB9rf { - background-color: #000; - border: 1px #333 solid; -} - -.theme-dark .headerClickable-2IVFo9, -.theme-dark .headerDefault-1wrJcN { - background: none; -} - -.theme-dark .tierHeaderLocked-1a2opw { - background-color: #000; - border: 1px #333 solid; -} - -.theme-dark .tierBody-x9kBBp { - background-color: #000; - border: 1px #333 solid; - border-top: 0; -} - -/* Member count plugin support */ -.theme-dark #MemberCount { - background-color: #000; -} \ No newline at end of file