diff --git a/Grey Mesh.theme.css b/Grey Mesh.theme.css new file mode 100644 index 0000000..998140a --- /dev/null +++ b/Grey Mesh.theme.css @@ -0,0 +1,22 @@ +/** + * @name Grey Mesh + * @description A light theme that aims to be less blinding than default discord light mode. USE DARK MODE FOR THIS THEME TO WORK. + * @author RazerMoon + * @version 0.8 + * @source https://github.com/RazerMoon/Grey-Mesh + * @website https://razermoon.github.io/ + */ + +/* + .oooooo. ooo ooooo oooo + d8P' `Y8b `88. .888' `888 +888 oooo d8b .ooooo. oooo ooo 888b d'888 .ooooo. .oooo.o 888 .oo. +888 `888""8P d88' `88b `88. .8' 8 Y88. .P 888 d88' `88b d88( "8 888P"Y88b +888 ooooo 888 888ooo888 `88..8' 8 `888' 888 888ooo888 `"Y88b. 888 888 +`88. .88' 888 888 .o `888' 8 Y 888 888 .o o. )88b 888 888 + `Y8bood8P' d888b `Y8bod8P' .8' o8o o888o `Y8bod8P' 8""888P' o888o o888o + .P' + `Y8P' +*/ + +@import url('https://raw.githubusercontent.com/razermoon/grey-mesh/master/base/base.css'); \ No newline at end of file diff --git a/README.md b/README.md index 45d3849..78b3e7e 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,17 @@ # Grey-Mesh + A light theme for Bandaged BetterDiscord (BBD) that aims to be less blinding that light mode + +![Theme](media/main.png) + +## User Popouts + +This theme uses [USRGB Popouts](https://github.com/Discord-Custom-Covers/usrbg) by [Tropix126](https://github.com/Tropix126). + +![Popout](media/popout.png) + +## User Tags + +This theme uses [User Tags](https://github.com/monstrousdev/themes/blob/master/addons/user-tags.css) by [Monster Dev](https://github.com/monstrousdev) + +![Tag](media/usertags.png) \ No newline at end of file diff --git a/base/base.css b/base/base.css new file mode 100644 index 0000000..a6adf90 --- /dev/null +++ b/base/base.css @@ -0,0 +1,380 @@ +@import url('https://monstrousdev.github.io/themes/addons/user-tags.css'); +@import url('https://discord-custom-covers.github.io/usrbg/snippets/userPopouts.css'); + +:root { + --background-primary: #c4c4c4; + --background-secondary: #bbbbbb; + --background-secondary-alt: #cecece; + --background-tertiary: #9c9c9c; + --background-accent: #747f8d; + + --channeltextarea-background: #e4e4e4; + + --header-primary: #060607; + --header-secondary: #4f5660; + + --text-normal: #2e3338; + --text-muted: #747f8d; + --text-link: #0067e0; + + --channels-default: #515963; + + --interactive-normal: #464d58; + --interactive-hover: #33393f; + --interactive-active: #060607; + + --interactive-muted: #9ea2a7; + + --background-floating: rgba(180, 180, 180, 0.5); + + --background-modifier-hover: rgba(116,127,141,0.08); + --background-modifier-active: rgba(116,127,141,0.16); + --background-modifier-selected: rgba(116,127,141,0.24); + --background-modifier-accent: rgba(6,6,7,0.08); + --background-mentioned: rgba(250,166,26,0.1); + --background-mentioned-hover: rgba(250,166,26,0.2); + --background-message-hover: rgba(6,6,7,0.02); + + --elevation-stroke: 0 0 0 1px rgba(6,6,7,0.08); + --elevation-low: 0 1px 0 rgba(6,6,7,0.1),0 1.5px 0 rgba(6,6,7,0.025),0 2px 0 rgba(6,6,7,0.025); + --elevation-medium: 0 4px 4px rgba(0,0,0,0.08); + --elevation-high: 0 8px 16px rgba(0,0,0,0.16); + + --logo-primary: #7289da; + --focus-primary: #00b0f4; + --guild-header-text-shadow: 0 1px 1px hsla(0,0%,100%,0.4); + --activity-card-background: #fff; + --textbox-markdown-syntax: #6a7480; + + --deprecated-card-bg: var(--background-secondary); + --deprecated-card-editable-bg: var(--background-secondary-alt); + + --deprecated-store-bg: #f8f9f9; + + --deprecated-quickswitcher-input-background: #fff; + --deprecated-quickswitcher-input-placeholder: rgba(79,84,92,0.3); + + --deprecated-text-input-bg: var(--channeltextarea-background); + --deprecated-text-input-border: rgba(79,84,92,0.3); + --deprecated-text-input-border-hover: #b9bbbe; + --deprecated-text-input-border-disabled: #dcddde; + --deprecated-text-input-prefix: #b9bbbe; + + --gmesh-header: rgb(75, 75, 75); + --gmesh-box: 0 2px 10px 0 rgba(0,0,0,.2), 0 0 0 1px rgba(165, 165, 165, 0.6); + --gmesh-floating-matte: rgba(180, 180, 180, 0.9); +} + +/* Special */ + +.da-typeWindows::after { + content: "𝔾𝕣𝕖π•ͺ 𝕄𝕖𝕀𝕙"; + position: absolute; + top: 4.5px; + left: 70px; + color: var(--channels-default); + height: 16px; + font-size: 14px; +} + +/* General */ + +[aria-label="Channel header"] .da-searchBar { + background-color: var(--channeltextarea-background); +} + +.theme-dark .lookOutlined-3sRXeN.colorBrand-3pXr91 { + background-color: var(--deprecated-card-bg); +} + +.theme-dark .lookLink-9FtZy-.colorPrimary-3b3xI6 { + color: var(--interactive-normal); +} + +.theme-dark .codeRedemptionRedirect-1wVR4b { + background-color: var(--interactive-normal); +} + +.theme-dark .ghostPill-2-KUPM { + background-color: rgba(0,0,0,.1); +} + +.theme-dark .da-modal > div { + background-color: var(--background-primary); + border-radius: 0px; +} + +/* Backdrop */ +.da-backdropWithLayer { + background-color: var(--background-floating) !important; + opacity: 1 !important; + backdrop-filter: blur(5px) !important; +} + +.da-backdrop { + background-color: var(--background-floating) !important; + opacity: 1 !important; + backdrop-filter: blur(5px) !important; +} + +/* Search */ + +.da-layer .da-elevationBorderHigh { + background-color: var(--background-floating); + border-color: var(--background-secondary); + backdrop-filter: blur(5px); +} + +.da-layer .da-queryContainer { + color: var(--text-normal); + background-color: var(--background-floating); +} + +.theme-dark .da-option strong, .theme-dark .da-option.da-user .da-displayedNick, .da-elevationBorderHigh > .da-resultsGroup > .da-header { + color: var(--text-normal); +} + +.da-elevationBorderHigh > .da-resultsGroup > .da-option:after { + background: none; +} + +.da-elevationBorderHigh > .da-resultsGroup > .da-selected, .da-elevationBorderHigh > .da-resultsGroup > .da-option:hover { + background-color: var(--background-tertiary); +} + +/* Home */ + +.da-peopleColumn { + background-color: var(--background-primary); +} + +.theme-dark .da-itemCard { + background-color: var(--background-primary) !important; +} + +.theme-dark .da-itemCard:hover { + background-color: var(--background-tertiary) !important; +} + +.theme-dark .da-inset { + background-color: var(--background-secondary); +} + +.theme-dark .da-popout { + background-color: var(--background-floating); + border-color: var(--background-secondary); + backdrop-filter: blur(5px); +} + +.theme-dark .da-memberListItem:hover { + background-color: var(--background-tertiary) !important; +} + +.theme-dark .da-memberListHeader { + color: var(--text-normal); +} + +.da-popout [role="button"]:hover { + background-color: var(--background-tertiary); +} + +/* Settings */ + +.theme-dark .userSettingsAccount-2eMFVR .viewBody-2Qz-jg { + color: var(--text-normal); +} + +.theme-dark .da-emptyStateHeader { + color: var(--channels-default) +} + +.theme-dark .emptyStateSubtext-2hdA9c { + color: var(--background-tertiary); +} + +.theme-dark .card-FDVird:before { + background-color: var(--background-secondary); + border-color: var(--background-primary); +} + +.theme-dark .gameName-1RiWHm { + color: var(--interactive-normal); +} + +.theme-dark .da-userSettingsVoice .da-previewOverlay, .da-flexChild .da-select, .css-181m2lf-menu { + background-color: var(--background-secondary); +} + +.da-grabber { + background-color: var(--background-secondary); + border-color: var(--background-tertiary); +} + +.da-deviceOption { + color: var(--text-normal); +} + +.theme-dark .da-bar { + background: var(--background-tertiary); +} + +.theme-dark .gameName-1RiWHm:hover { + background-color: rgba(0,0,0,.1); +} + +.theme-dark .nowPlayingAdd-1Kdmh_ { + color: var(--interactive-normal); +} + +.theme-dark #bd-settingspane-container h2.ui-form-title { + color: var(--header-primary); +} + +.theme-dark #bd-settingspane-container .ui-switch-item h3 { + color: var(--text-normal); +} + +/* Better Discord */ + +.bd-search-wrapper { + background-color: var(--channeltextarea-background); +} + +.theme-dark .bd-addon-list .bd-addon-card { + background-color: var(--deprecated-card-bg); + border-color: rgba(0, 0, 0, 0.3); +} + +.theme-dark .bd-addon-list .bda-description { + color: var(--text-normal); +} + +.theme-dark .bd-addon-list .bda-header { + color: var(--gmesh-header); +} + +.theme-dark .bd-addon-list .bd-select { + color: var(--gmesh-header); +} + +.bd-select-wrapper label { + color: var(--text-normal); +} + +.bd-select-value { + color: rgb(0, 0, 0); +} + +.bd-icon { + color: var(--gmesh-header); +} + +.bd-search-wrapper > svg { + fill: var(--interactive-normal); +} + +.bd-icon { + fill: var(--interactive-normal); +} + +.theme-dark #bd-settings-sidebar .ui-tab-bar-item { + color: var(--interactive-normal); +} + +.theme-dark #bd-settings-sidebar .ui-tab-bar-item.selected { + color: var(--channeltextarea-background); /* Can't take away important for some reason */ +} + +.theme-dark #bd-settings-sidebar .ui-tab-bar-item:not(.selected):hover { + color: var(--header-primary); + background-color: rgba(79, 84, 92, 0.07); +} + +/* User Popout */ +.theme-dark .headerNormal-T_seeN { + background-color: var(--background-floating); +} + +.da-userPopout { + backdrop-filter: blur(5px); + box-shadow: var(--gmesh-box); +} + +.da-roleName { + color: var(--text-normal); +} + +.da-userPopout .da-footer { + background-color: var(--gmesh-floating-matte); +} + +.theme-dark .da-bodyInner { + background-color: rgba(180, 180, 180, 0); +} + +.theme-dark .da-quickMessage { + background-color: var(--channeltextarea-background); + border-color: var(--background-secondary); +} + +/* Account Popout */ +.da-didRender > .da-menu { + backdrop-filter: blur(5px); +} + +/* Context Menu */ + +.da-contextMenu { + backdrop-filter: blur(5px); + box-shadow: var(--gmesh-box); +} + +/* Scroll Bar */ + +.theme-dark .scroller-2FKFPG::-webkit-scrollbar-track-piece { + background-color: rgba(255, 255, 255, 0) !important; + border: 0px solid rgb(255, 255, 255) !important; + border-radius: 0px !important; +} + +.theme-dark .scroller-2FKFPG::-webkit-scrollbar-thumb { + background-color: var(--background-tertiary) !important; +} + +/* Usernames */ + +.da-header > .da-username:not(.da-headerTagUsernameNoNickname) { + text-shadow: 0 0 5px rgb(214, 214, 214); + -webkit-text-stroke: 0.3px black; +} + +.da-roleColor { + text-shadow: 0 0 5px rgb(214, 214, 214); + -webkit-text-stroke: 0.3px black; +} + +/* Changelog */ +.theme-dark .root-1gCeng { + background-color: var(--background-primary); +} + +.theme-dark .footer-3rDWdC { + background-color: var(--background-primary); +} + +.da-scroller.da-systemPad > p { + color: var(--text-normal) !important; +} + +.theme-dark .da-flexChild > .da-date { + color: var(--text-normal); +} + +.theme-dark .content-8biNdB.da-systemPad ul li { + color: var(--text-normal); +} + +.theme-dark .content-8biNdB.da-systemPad > h1 { + text-shadow: 0 0 5px rgb(230, 230, 230); + -webkit-text-stroke: 0.4px rgb(148, 148, 148); +} diff --git a/media/main.png b/media/main.png new file mode 100644 index 0000000..c0e261c Binary files /dev/null and b/media/main.png differ diff --git a/media/popout.png b/media/popout.png new file mode 100644 index 0000000..1e09724 Binary files /dev/null and b/media/popout.png differ diff --git a/media/usertags.png b/media/usertags.png new file mode 100644 index 0000000..761cebf Binary files /dev/null and b/media/usertags.png differ