├── .gitignore ├── LICENSE ├── README.md ├── _screenshots ├── atidyshirt_rice.png ├── chrome_install.png ├── discord2024.png ├── discord_old.png ├── glide2024.png ├── monkeytype_colors.png ├── monkeytype_old.png ├── neofetch.png ├── nord.png ├── old_startpage1.png ├── old_startpage_settings.gif ├── rb_accents.png ├── rb_backgrounds.png ├── rb_misc.png ├── simple_bar.png ├── simplenote.png ├── vim_and_term.png ├── vim_fullscreen.png ├── vivaldi_checkbox.png ├── vivaldi_csspath.png ├── vivaldi_old.png ├── vivaldi_old2.png ├── vivaldi_themesett.png └── ytmdesktop2.png ├── css-themes ├── README.md ├── simplenote.user.css └── ytmdesktop.scss ├── discord ├── .gitignore ├── README.md ├── _tweaks.scss ├── _utils.scss ├── base │ ├── _fonts.scss │ ├── _reset.scss │ └── _variables.scss ├── components │ ├── _buttons.scss │ ├── _codeblocks.scss │ └── _scrollbars.scss ├── dist │ ├── main.css │ ├── main.css.map │ └── roseboxUserStyle.user.css ├── layout │ ├── _channelList.scss │ ├── _floating.scss │ ├── _layout.scss │ ├── _serverList.scss │ └── _userAreaMsgInput.scss ├── lib │ ├── LICENCE_ClearVision.md │ ├── LICENCE_DiscordSelectors.md │ ├── README.md │ ├── _mappings.scss │ └── _rbMappings.scss ├── main.scss ├── modules │ ├── _accentColor.scss │ ├── _emojiPickers.scss │ ├── _homeScreen.scss │ ├── _jumpBars.scss │ ├── _quickSwitcher.scss │ ├── _serverBanner.scss │ ├── _settings.scss │ └── _userPopout.scss ├── reference │ ├── _reference_variables.scss │ ├── discord-mask.svg │ ├── dracula.css │ ├── harmony.css │ ├── main.css │ ├── mask.html │ ├── old │ │ ├── _accentColor.scss.old │ │ ├── _buttons.scss.old │ │ ├── _call.scss.old │ │ ├── _codeblocks.scss.old │ │ ├── _contextMenus.scss.old │ │ ├── _emojiPickers.scss.old │ │ ├── _homeScreen.scss.old │ │ ├── _jumpBars.scss.old │ │ ├── _layout.scss.old │ │ ├── _newServerDarkmode.scss.old │ │ ├── _quickSwitcher.scss.old │ │ ├── _reset.scss.old │ │ ├── _scrollbars.scss.old │ │ ├── _serverBanner.scss.old │ │ ├── _tweaks.scss.old │ │ ├── _userArea.scss.old │ │ ├── _userPopout.scss.old │ │ ├── _userProfile.scss.old │ │ ├── _utils.scss.old │ │ ├── _variables.scss.old │ │ └── main.scss.old │ ├── rosebox.css │ └── zolkBD.theme.css └── scripts │ ├── build.js │ ├── package.json │ ├── pnpm-lock.yaml │ ├── updateSelectors.js │ └── watcher.js ├── editors ├── README.md └── rosebox.nvim │ ├── CHANGELOG.md │ ├── LICENSE.md │ ├── autoload │ ├── airline │ │ └── themes │ │ │ └── rosebox.vim │ ├── lightline │ │ └── colorscheme │ │ │ └── rosebox.vim │ └── rosebox.vim │ ├── colors │ └── rosebox.vim │ ├── package.json │ ├── rosebox_256palette.sh │ └── rosebox_256palette_osx.sh ├── minimal-startpage ├── LICENSE ├── README.md ├── config-handler.js ├── data-handler.js ├── favicon.ico ├── img │ ├── icon64.png │ ├── mai-san.png │ ├── yahallo.png │ └── yahallo2.png ├── index.html ├── main.css ├── main.js ├── manifest.json ├── sample-config.json ├── startpage-handler.js └── w3css.css ├── monkeytype └── README.md ├── simple-bar-rosebox ├── .prettierrc ├── README.md └── rosebox-dark.js ├── terminals ├── README.md ├── alacritty-rosebox.toml └── rosebox.conf ├── vivaldi ├── README.md ├── custom.css ├── custom.oldcss └── tabbar.css └── zathura └── zathurarc /.gitignore: -------------------------------------------------------------------------------- 1 | minimal-startpage/backup/* -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # rosebox 2 | > rosebox is a color theme inspired by gruvbox, but with the main focus on **being easy on the eyes** 3 | 4 | > note: discord theme is broken due to big updates from discord. sorry for the inconvenience. 5 | > no eta on when it will be fixed as i'm busy with uni 6 | > feel free to submit a pr fixing it - a good starting point is running "updateSelectors" in scripts 7 | 8 | ![vim and term](_screenshots/vim_and_term.png) 9 | ![discord3](_screenshots/discord2024.png) 10 | ![overal rosebox](_screenshots/atidyshirt_rice.png) 11 | ![waifu](_screenshots/glide2024.png) 12 | 13 | ## colors 14 | ### Backgrounds 15 | ![backgrounds](_screenshots/rb_backgrounds.png) 16 | if unsure where to use which background color, you can check [variables.scss](./discord/base/_variables.scss) and [main.scss](./discord/main.scss). 17 | 18 | ### Accent colors 19 | ![accent-colors](_screenshots/rb_accents.png) 20 | accents which are mostly transparent are meant to be used on top of the backgrounds. 21 | 22 | ### Misc colors 23 | ![misc-colors](_screenshots/rb_misc.png) 24 | rosebox does not provide colors for syntax highlighting - the nord **frost** or **aurora** palletes are pretty good: 25 | ![nord](_screenshots/nord.png) 26 | these color grids where generated from the [variables.scss](./discord/base/_variables.scss) file using [this svelte REPL](https://svelte.dev/repl/8b52c36d6988472bb82c36837660c3dd?version=3.59.1). 27 | 28 | ## themes 29 | - **_Discord_** - [github pages](https://kraxen72.github.io/rosebox/discord) - [repo](https://github.com/KraXen72/rosebox/tree/master/discord) 30 | - **_Vivaldi_** - [github pages](https://kraxen72.github.io/rosebox/vivaldi) - [repo](https://github.com/KraXen72/rosebox/tree/master/vivaldi) 31 | - **_monkeytype.com_** - [github pages](https://kraxen72.github.io/rosebox/monkeytype) - [repo](https://github.com/KraXen72/rosebox/tree/master/monkeytype) 32 | - **_simple-bar_** - [github pages](https://kraxen72.github.io/rosebox/simple-bar-rosebox) - [repo](https://github.com/KraXen72/rosebox/tree/master/simple-bar-rosebox) 33 | - **Editors** - [repo](https://github.com/KraXen72/rosebox/tree/master/editors) - supported editors: (for now) 34 | - **_Vim_** 35 | - **Terminals** - [repo](https://github.com/KraXen72/rosebox/tree/master/terminals) - supported teminals: (for now) 36 | - **_alacritty_** 37 | - **_kitty_** 38 | - **_Other CSS themes_** - [ytmdesktop2](https://github.com/Venipa/ytmdesktop2), [simplenote](https://simplenote.com) - [repo](https://github.com/KraXen72/rosebox/tree/master/css-themes) 39 | 40 | ## things built with rosebox 41 | - **_glide_** - a modular but comfy startpage for many scenarios - [repo](https://github.com/KraXen72/glide) 42 | - **_playlist-manager_** - offline playlist manager - [repo](https://github.com/KraXen72/playlist-manager) 43 | - **_roseboxlib_** - a (mostly) css and some js utils library i use in my electron projects - [link](https://kraxen72.github.io/roseboxlib/) - [repo](https://github.com/KraXen72/roseboxlib) 44 | 45 | ## rosebox in the wild 46 | - **_Firefox_**/**_Floorp_** **Theme** - [Mozilla Add-ons link](https://addons.mozilla.org/en-US/firefox/addon/rosebox-floorp-edition/) (maintained by [Too Spooky](https://addons.mozilla.org/en-US/firefox/user/17821516/)) 47 | - [This BSPWM rice with rosebox](https://old.reddit.com/r/UsabilityPorn/comments/l8uclp/bspwm_based_on_rosebox_theme_by_kraxen72/) 48 | - [Redlib supports rosebox](https://github.com/redlib-org/redlib) (fork of Libreddit) - [reddit post about the release](https://old.reddit.com/r/rust/comments/r4jzcb/libreddit_v0200_private_frontend_for_reddit_gets/) 49 | 50 | ## support development 51 | [![Recurring donation via Liberapay](https://liberapay.com/assets/widgets/donate.svg)](https://liberapay.com/KraXen72) 52 | [![One-time donation via ko-fi.com](https://ko-fi.com/img/githubbutton_sm.svg)](https://ko-fi.com/kraxen72) 53 | Any donations are highly appreciated! <3 54 | -------------------------------------------------------------------------------- /_screenshots/atidyshirt_rice.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/atidyshirt_rice.png -------------------------------------------------------------------------------- /_screenshots/chrome_install.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/chrome_install.png -------------------------------------------------------------------------------- /_screenshots/discord2024.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/discord2024.png -------------------------------------------------------------------------------- /_screenshots/discord_old.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/discord_old.png -------------------------------------------------------------------------------- /_screenshots/glide2024.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/glide2024.png -------------------------------------------------------------------------------- /_screenshots/monkeytype_colors.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/monkeytype_colors.png -------------------------------------------------------------------------------- /_screenshots/monkeytype_old.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/monkeytype_old.png -------------------------------------------------------------------------------- /_screenshots/neofetch.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/neofetch.png -------------------------------------------------------------------------------- /_screenshots/nord.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/nord.png -------------------------------------------------------------------------------- /_screenshots/old_startpage1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/old_startpage1.png -------------------------------------------------------------------------------- /_screenshots/old_startpage_settings.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/old_startpage_settings.gif -------------------------------------------------------------------------------- /_screenshots/rb_accents.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/rb_accents.png -------------------------------------------------------------------------------- /_screenshots/rb_backgrounds.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/rb_backgrounds.png -------------------------------------------------------------------------------- /_screenshots/rb_misc.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/rb_misc.png -------------------------------------------------------------------------------- /_screenshots/simple_bar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/simple_bar.png -------------------------------------------------------------------------------- /_screenshots/simplenote.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/simplenote.png -------------------------------------------------------------------------------- /_screenshots/vim_and_term.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/vim_and_term.png -------------------------------------------------------------------------------- /_screenshots/vim_fullscreen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/vim_fullscreen.png -------------------------------------------------------------------------------- /_screenshots/vivaldi_checkbox.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/vivaldi_checkbox.png -------------------------------------------------------------------------------- /_screenshots/vivaldi_csspath.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/vivaldi_csspath.png -------------------------------------------------------------------------------- /_screenshots/vivaldi_old.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/vivaldi_old.png -------------------------------------------------------------------------------- /_screenshots/vivaldi_old2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/vivaldi_old2.png -------------------------------------------------------------------------------- /_screenshots/vivaldi_themesett.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/vivaldi_themesett.png -------------------------------------------------------------------------------- /_screenshots/ytmdesktop2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/_screenshots/ytmdesktop2.png -------------------------------------------------------------------------------- /css-themes/README.md: -------------------------------------------------------------------------------- 1 | # CSS Themes 2 | Collection of rosebox (user)css themes for different websites. 3 | Use Stylus (for example) to apply them. Stylus: [chrome](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=sk), [firefox](https://addons.mozilla.org/en-US/firefox/addon/styl-us/?utm_source=addons.mozilla.org&utm_medium=referral&utm_content=search) 4 | 5 | Currently available themes: 6 | ### ytmdesktop2 7 | ``ytmdesktop.scss`` 8 | link: [ytmdesktop2 github repo](https://github.com/Venipa/ytmdesktop2) 9 | author: [xohorses](https://xohorses.glitch.me), [xohorses kofi page](https://ko-fi.com/xohorses) 10 | ![ytmdesktop](../_screenshots/ytmdesktop2.png) 11 | 12 | ### Simplenote 13 | ``simplenote.user.css`` 14 | use with light theme since dark theme is wierd at the moment 15 | > this theme might be broken, as i no longer use simplenote. 16 | > if you find some bugs, feel free to report them or better yet, open a PR. 17 | 18 | ![stylus](../_screenshots/simplenote.png) 19 | 20 | ### Redlib 21 | [Redlib](https://github.com/redlib-org/redlib) supports rosebox out of the box since 2021. [relevant PR](https://github.com/libreddit/libreddit/pull/237) 22 | -------------------------------------------------------------------------------- /css-themes/simplenote.user.css: -------------------------------------------------------------------------------- 1 | /* ==UserStyle== 2 | @name rosebox simplenote 3 | @namespace github.com/openstyles/stylus 4 | @version 2.0.0 5 | @description rosebox theme for simplenote 6 | @author KraXen72 7 | ==/UserStyle== */ 8 | 9 | @-moz-document domain("app.simplenote.com") { 10 | /* Insert code here... */ 11 | /*main variables */ 12 | :root { 13 | --primary-bg: #262626; 14 | --secondary-bg: #222222; 15 | --primary-fg: #a57562; 16 | --primary-text: #a3a5aa; 17 | --alpha-bg: rgba(165, 117, 98, 0.2); 18 | --alpha-bg-2: rgba(165, 117, 98, 0.1); 19 | } 20 | button, .button, input, note-actions *, .checkbox-control:focus-within { 21 | outline: 0px solid transparent !important; 22 | } 23 | /* 24 | ::-webkit-scrollbar-thumb { 25 | border-width: 0px 0px 0px 0px; 26 | width: 2px !important; 27 | border-color: var(--secondary-bg); 28 | border-radius: 5.5px; 29 | background-color: var(--primary-bg); 30 | } 31 | .react-monaco-editor-container .scrollbar.vertical .slider { 32 | border-color: var(--primary-bg) 33 | } 34 | ::-webkit-scrollbar-thumb:active { 35 | background-color: #646970 !important; 36 | }*/ 37 | 38 | :root,body[data-theme='light'], body[data-theme="dark"], body { 39 | --background-color: var(--primary-bg); 40 | --foreground-color: #646970; 41 | --primary-color: var(--primary-text); 42 | --secondary-color: #dcdcde; 43 | --tertiary-color: #a7aaad; 44 | --accent-color: var(--primary-fg); 45 | --secondary-accent-color: var(--primary-fg); 46 | --highlight-color: var(--alpha-bg); 47 | --secondary-highlight-color: var(--alpha-bg-2); 48 | --tertiary-highlight-color: #d63638; 49 | --overlay-color: rgba(0, 0, 0, 0.2); 50 | --search-selection-color: var(--primary-fg); 51 | --wordpress-color: #006088; 52 | --active-controls-color: #1ed15a; 53 | --warning-highlight-color: #faa754 54 | } 55 | 56 | /*fixes*/ 57 | .note-list-item, .note-list-item-text, .theme-color-border, body[data-theme='light'] .theme-color-border:not(.settings-items){ 58 | border-color: transparent !important; 59 | } 60 | 61 | input { 62 | background: var(--secondary-bg); 63 | } 64 | 65 | aside { 66 | background: var(--secondary-bg) !important; 67 | } 68 | .ReactVirtualized__Grid__innerScrollContainer[role="rowgroup"] { 69 | margin-left: 10px; 70 | } 71 | 72 | /*monaco fuckery*/ 73 | 74 | .monaco-editor, .monaco-editor-background, .monaco-editor .inputarea.ime-input, .monaco-editor .margin { 75 | background: var(--primary-bg); 76 | } 77 | .monaco-editor, .monaco-editor .inputarea.ime-input, .view-line * { 78 | color: var(--primary-text) !important; 79 | } 80 | .monaco-editor.vs .selected-text,.monaco-editor.vs-dark .selected-text { 81 | background: var(--alpha-bg) !important; 82 | } 83 | .monaco-editor .cursors-layer > .cursor { 84 | transition: all 80ms; 85 | } 86 | .monaco-editor.vs .cursor,.monaco-editor.vs-dark .cursor { 87 | background-color: var(--primary-text) !important; 88 | } 89 | 90 | /*note actions*/ 91 | .note-actions.theme-color-bg { 92 | background-color: var(--secondary-bg) !important; 93 | } 94 | .button:active { 95 | background: var(--alpha-bg) 96 | } 97 | .note-actions > .button { 98 | width: 100%; 99 | padding: 5px 15px !important; 100 | } 101 | .note-actions .note-actions-item { 102 | padding: 0px; 103 | } 104 | .note-actions .note-actions-item .button, .note-actions .note-actions-item .note-actions-item-text { 105 | padding: 5px 16px !important; 106 | } 107 | .note-actions-item-control { 108 | padding-right: 16px; 109 | } 110 | 111 | /*codeblocks and wierd rendering*/ 112 | .note-detail-markdown p>code { 113 | background-color: #3c434a; 114 | } 115 | /*yoinked all the dark theme codeblocks from normal dark theme simplenote*/ 116 | .note-detail-markdown .hljs { 117 | display: block; 118 | overflow-x: auto; 119 | padding: 0.5em; 120 | background: #002b36; 121 | color: #839496 122 | } 123 | .note-detail-markdown .hljs-comment,.note-detail-markdown .hljs-quote{color:#586e75}.note-detail-markdown .hljs-addition,.note-detail-markdown .hljs-keyword,.note-detail-markdown .hljs-selector-tag{color:#859900}.note-detail-markdown .hljs-doctag,.note-detail-markdown .hljs-literal,.note-detail-markdown .hljs-meta .hljs-meta-string,.note-detail-markdown .hljs-number,.note-detail-markdown .hljs-regexp,.note-detail-markdown .hljs-string{color:#2aa198}.note-detail-markdown .hljs-name,.note-detail-markdown .hljs-section,.note-detail-markdown .hljs-selector-class,.note-detail-markdown .hljs-selector-id,.note-detail-markdown .hljs-title{color:#268bd2}.note-detail-markdown .hljs-attr,.note-detail-markdown .hljs-attribute,.note-detail-markdown .hljs-class .hljs-title,.note-detail-markdown .hljs-template-variable,.note-detail-markdown .hljs-type,.note-detail-markdown .hljs-variable{color:#b58900}.note-detail-markdown .hljs-bullet,.note-detail-markdown .hljs-link,.note-detail-markdown .hljs-meta,.note-detail-markdown .hljs-meta .hljs-keyword,.note-detail-markdown .hljs-selector-attr,.note-detail-markdown .hljs-selector-pseudo,.note-detail-markdown .hljs-subst,.note-detail-markdown .hljs-symbol{color:#cb4b16}.note-detail-markdown .hljs-built_in,.note-detail-markdown .hljs-deletion{color:#dc322f}.note-detail-markdown .hljs-formula{background:#073642}.note-detail-markdown .hljs-emphasis{font-style:italic}.note-detail-markdown .hljs-strong{font-weight:bold}.note-detail-markdown hr{border-color:#2c3338}.note-detail-markdown blockquote{border-color:#2c3338}.note-detail-markdown pre{border-color:#2c3338}.note-detail-markdown table td,.note-detail-markdown table th{border-color:#646970}.note-detail-markdown table tr:nth-child(2n){background-color:#2c3338}.search-results{color:#c3c4c7;border-color:#2c3338;background-color:#1d2327}.search-results button svg{fill:#84a4f0} 124 | 125 | /*scrollbars*/ 126 | 127 | ::-webkit-scrollbar-thumb { 128 | background: #282828 !important; 129 | border: 4px solid var(--secondary-bg) !important; 130 | border-top-width: 0px !important; 131 | border-bottom-width: 0px !important; 132 | border-radius: 6px !important; 133 | } 134 | ::-webkit-scrollbar-thumb:hover { 135 | background: var(--primary-fg) !important; 136 | } 137 | .note-list-item { 138 | border-radius: 5px; 139 | } 140 | 141 | /*tags*/ 142 | 143 | .tag-chip { 144 | background: var(--secondary-bg); 145 | } 146 | 147 | /*settings*/ 148 | .tab-panels__column .button-borderless, .settings-items, .settings-items { 149 | border-style: solid; 150 | border-width: 1px !important; 151 | border-color: var(--alpha-bg) !important; 152 | } 153 | .settings-items, .button-group { 154 | border: 1px solid var(--alpha-bg) !important; 155 | border-radius: 5px; 156 | } 157 | .settings .button.button-borderless { 158 | border-bottom-color: var(--primary-text) 159 | } 160 | 161 | 162 | 163 | 164 | } -------------------------------------------------------------------------------- /discord/.gitignore: -------------------------------------------------------------------------------- 1 | scripts/node_modules 2 | scripts/package-lock.json -------------------------------------------------------------------------------- /discord/README.md: -------------------------------------------------------------------------------- 1 | # rosebox theme for Discord 2 | rosebox css for discord. 3 | built on the ashes of Harmony, my first discord theme, but now **rewritten in scss!** 4 | 5 | ![main](../_screenshots/discord2024.png) 6 | ![frend](../_screenshots/discord_old.png) 7 | 8 | 9 | ## Installation 10 | ### 1. bare import link: 11 | ``` 12 | https://kraxen72.github.io/rosebox/discord/dist/main.css 13 | ``` 14 | - Vencord Themes: [link](https://github.com/Vendicated/Vencord) > `Settings` > `Themes` > `Online Themes` > paste this link in. 15 | - any other mod which supports importing themes from raw links 16 | 17 | ### 2. css with import link: 18 | ```css 19 | @import url('https://kraxen72.github.io/rosebox/discord/dist/main.css'); 20 | ``` 21 | - Vencord QuickCSS: [link](https://github.com/Vendicated/Vencord) > `Settings` > `Vencord` > Enable `Use QuickCSS` > Click `Open QuickCSS File` > paste this link at the top 22 | - Replugged QuickCSS: [link](https://replugged.dev) > `Settings` > `QuickCSS` Tab > paste this link at the top > Click `Apply Changes` button 23 | - Openasar: [link](https://openasar.dev) > `OpenAsar Config` > `Theming` > paste this link at the top 24 | - any other mod which supports custom css. 25 | 26 | ### 3. UserCSS userstyle (any browser) 27 | - Install [Stylus](https://github.com/openstyles/stylus/) extension: [Chrome](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne), [Firefox](https://addons.mozilla.org/firefox/addon/styl-us/), [More](https://add0n.com/stylus.html) 28 | - Visit [this link](https://github.com/KraXen72/rosebox/raw/master/discord/dist/roseboxUserStyle.user.css) 29 | - The stylus install page should pop up; if it doesen't follow the steps 30 | - Go to extension settings in your browser > `Stylus` > `Allow Access to File URLs` 31 | - `git clone https://github.com/KraXen72/rosebox` 32 | - or download this file only [roseboxUserStyle.user.css](https://kraxen72.github.io/rosebox/discord/roseboxUserStyle.user.css) - [alternative link](./roseboxUserStyle.user.css) 33 | - or download ZIP of this repo 34 | - Right-click the file > `Open in...` > Select your browser 35 | - Reload the page (`F5`) 36 | - Hit `Install` 37 | 38 | ## About the discord theme 39 | - this discord theme was initially built on my old [Harmony](https://github.com/KraXen72/harmony-discord) theme i made in 2020. I added a bunch of color and ui modifications on top, until it was a mess and decided to fully re-write it in scss in december 2021. 40 | - The theme is split into a lot of partials and features a lot of color variables, so it should be easy-ish to modify the colors in `_variables.scss` 41 | - overall, the scss rewrite has been a good decisinon as it is a lot easier to maintain. 42 | - a third rewrite in april of 2023 has taken place. We now use ClearVision6's selector placeholders, with a script to pull new ones = i barely ever have to fix classes. 43 | - it might not be perfect, but it's mine :'). if something is missing/broken, report it in the issues and i'll probably fix it. 44 | - thanks for using the theme! 45 | 46 | ## Setting up the dev env (VSCode) 47 | 1. clone this git repo 48 | 2. install [Live Sass by glen2223](https://marketplace.visualstudio.com/items?itemName=glenn2223.live-sass) extension 49 | 3. recommended: install [Some Sass by Somewhat Stationery](https://marketplace.visualstudio.com/items?itemName=SomewhatStationery.some-sass) extension 50 | 4. follow [steps on installing the userstyle](#3-usercss-userstyle-any-browser) (the local file part part) 51 | 5. tick the `Live reload` box 52 | 6. run the following commands: `cd scripts`, `pnpm i`, `pnpm dev` (node ^22 is required) 53 | 54 | the old version of this theme in vanilla css can be found [here](https://github.com/KraXen72/rosebox-discord) 55 | for questions contact `kraxen72` on Discord. -------------------------------------------------------------------------------- /discord/_tweaks.scss: -------------------------------------------------------------------------------- 1 | // i have no idea what these do and i'm too afraid to remove them 2 | // TODO whenever i figure out what they do, add a comment & move them to respective file 3 | 4 | .option_b5597b::after { background: transparent } //remove fade 5 | 6 | .focusLock-2tveLW, .container_f03f1d { 7 | border: none !important; 8 | background: transparent; 9 | } 10 | 11 | /*invert plus and minus*/ 12 | img[src="/assets/9a43e631d506ae4818ecefc825dc02ad.svg"], 13 | img[src="/assets/13c8662cff8e029799a35878b56e23eb.svg"] { 14 | filter: invert(1); 15 | } 16 | 17 | -------------------------------------------------------------------------------- /discord/_utils.scss: -------------------------------------------------------------------------------- 1 | /*general utility mixins and other stuff*/ 2 | 3 | //few useful mixins 4 | @mixin padmar($padding: 0, $margin: 0) { //remove or set the padding and margin at the same time 5 | padding: $padding !important; 6 | margin: $margin !important; 7 | } 8 | 9 | @mixin flex($align: center, $justify: center, $direction : row) { //apply flexbox to an element. center by default 10 | display: flex; 11 | align-items: $align; 12 | justify-content: $justify; 13 | flex-direction: $direction; 14 | } 15 | 16 | @mixin coverarea($important : false) { //cover the whole area 17 | @if $important { 18 | width: 100% !important; 19 | height: 100% !important; 20 | max-width: 100% !important; 21 | max-height: 100% !important; 22 | } @else { 23 | width: 100%; 24 | height: 100%; 25 | max-width: 100% ; 26 | max-height: 100% ; 27 | } 28 | } 29 | @mixin fs($fontsize, $important : false) { //font-size and line-height 30 | @if $important { 31 | font-size: $fontsize !important; 32 | line-height: $fontsize !important; 33 | } @else { 34 | font-size: $fontsize; 35 | line-height: $fontsize; 36 | } 37 | } 38 | //background-image ones 39 | @mixin bg-image-icon($url) { 40 | background-position: center !important; 41 | background-repeat: no-repeat !important; 42 | background-size: $bg-image-icon-size !important; 43 | background-image: url($url) !important; 44 | } 45 | @mixin bg-image-contain() { 46 | background-size: contain; 47 | background-position: center; 48 | background-repeat: no-repeat !important; 49 | } 50 | 51 | @mixin normalize($position : relative, $important : false) { //normalize an elements position, padding and margin 52 | @if $important == true { 53 | position: $position !important; 54 | @include padmar; 55 | } @else { 56 | position: $position; 57 | } 58 | top: initial !important; 59 | bottom: initial !important; 60 | left: initial !important; 61 | right: initial !important; 62 | box-shadow: none !important; 63 | -webkit-box-shadow: none !important; 64 | } 65 | 66 | @mixin unborder() { //remove border 67 | border: 0px solid transparent !important; 68 | } 69 | @mixin untransform($imp: false) { //remove transforms 70 | $suffix: if($imp, "", "!important"); 71 | transform: translate(0, 0) translateX(0) translateY(0) scale(1) $suffix; 72 | } 73 | 74 | @mixin no-shadow() { 75 | box-shadow: none !important; 76 | -webkit-box-shadow: none !important; 77 | } -------------------------------------------------------------------------------- /discord/base/_fonts.scss: -------------------------------------------------------------------------------- 1 | @import url("https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/source.min.css"); 2 | 3 | %forumReactionCount { font-family: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; } -------------------------------------------------------------------------------- /discord/base/_reset.scss: -------------------------------------------------------------------------------- 1 | // hiding elements 2 | %toolbar [href="https://support.discord.com"], 3 | [aria-label="Send a gift"], 4 | [class^="protip"], 5 | %privateChannel a[data-list-item-id$="__shop"], 6 | %profileEffects { 7 | display: none !important 8 | } 9 | 10 | // remove avatar decorations 11 | [mask="url(#svg-mask-avatar-decoration-profile-status-square-80)"] { 12 | mask: url("#svg-mask-avatar-status-round-80") !important; 13 | } 14 | [mask="url(#svg-mask-avatar-decoration-profile-status-mobile-square-80)"] { 15 | mask: url("#svg-mask-avatar-status-mobile-80") !important; 16 | } 17 | %avatarDecoration, 18 | [mask^="url(#svg-mask-avatar-decoration-status"] { 19 | display: none !important; 20 | } 21 | %avatarDecorationHint { 22 | left: 0px; 23 | top: 0px; 24 | height: 80px; 25 | width: 80px; 26 | } 27 | %avatarHintInner { 28 | font-size: 12px !important; 29 | } 30 | 31 | // remove clan tags 32 | %clanTag { display: none !important; } 33 | -------------------------------------------------------------------------------- /discord/base/_variables.scss: -------------------------------------------------------------------------------- 1 | @use "sass:color"; 2 | 3 | // rosebox colors used throughout the theme 4 | $rb-bg-primary: #262626; 5 | $rb-bg-primarya: #262626de; 6 | $rb-bg-secondary: #232323; 7 | $rb-bg-secondary-d: #222222; 8 | $rb-bg-tertiary: #212121; 9 | $rb-bg-quarterary: #282828; 10 | $rb-bg-4: #393939; 11 | $rb-bg-5: #313131; 12 | $rb-bg-slate: #19191b; // from phone wallpaper 13 | 14 | $rb-fg-accent: #a57562; 15 | $rb-text: #a3a5aa; 16 | $rb-text-vibrant: #b5bac1; // more vibrant, discord's built-in --header-secondary 17 | $rb-bg-accent: rgba(165, 117, 98, 0.2); 18 | $rb-bg-accent1: rgba(165, 117, 98, 0.1); 19 | $rb-bg-accent25: rgba(165, 117, 98, 0.25); 20 | $rb-bg-accent80: rgba(165, 117, 98, 0.8); 21 | $rb-bg-accent95: rgba(165, 117, 98, 0.95); 22 | $rb-bg-accent-opaque: #5e4c43; 23 | $rb-fg-accent-hover: #885f4e; // or color.adjust($rb-fg-accent, $lightness: -5%) 24 | $rb-teal-lighter: #88a5aa; 25 | $rb-teal-darker: #6A8F95; 26 | 27 | // misc/util 28 | $border-color: #333131; 29 | $border-color-black: rgba(0,0,0,0.2); 30 | $border-color-faint: rgba(255, 255, 255, 0.15); 31 | 32 | // border radii 33 | $br-small: 5px; 34 | $br-medium: 8px; 35 | $br-big: 1rem; 36 | 37 | $main-row-gap: 1.5vh; 38 | $col-spacer: 1rem; 39 | $bg-image-icon-size: 50%; 40 | 41 | $btn-bg-green: hsl(139,47.3%, 43.9%); 42 | $btn-bg-green-dark: color.adjust($btn-bg-green, $lightness: -10%); 43 | 44 | $btn-bg-red: hsl(359, 82.6%, 59.4%); 45 | $btn-bg-red-dark: color.adjust($btn-bg-red, $lightness: -10%); -------------------------------------------------------------------------------- /discord/components/_buttons.scss: -------------------------------------------------------------------------------- 1 | // buttons 2 | %buttonFilled, %buttonInverted { 3 | background-color: $rb-fg-accent !important; 4 | color: white !important; 5 | &:hover:not(:disabled) { background-color: $rb-fg-accent-hover !important; } 6 | 7 | &%buttonColorRed { 8 | background-color: $btn-bg-red !important; 9 | &:hover { background-color: $btn-bg-red-dark !important; } 10 | } 11 | &%buttonColorGreen { 12 | background-color: $btn-bg-green !important; 13 | &:hover { background-color: $btn-bg-green-dark !important; } 14 | } 15 | } 16 | 17 | %panelActionButtonColor, // rpc / spotify cta buttons 18 | %addFriendButton { 19 | background-color: $rb-fg-accent !important; 20 | &[aria-selected="true"] { 21 | background-color: var(--background-modifier-selected) !important; 22 | } // !important needed for specificity 23 | } 24 | 25 | // markdown editing toolbar 26 | %chatToolbar, #slate-toolbar { 27 | %buttonFilled { 28 | background-color: transparent !important; 29 | &:hover { background-color: rgba(255, 255, 255, 0.1) !important; } 30 | } 31 | } 32 | 33 | %panelActionButtonColor, // voice channel buttons like camera, screenshare 34 | %nitroUpsellButton { 35 | color: #fff !important; 36 | } -------------------------------------------------------------------------------- /discord/components/_codeblocks.scss: -------------------------------------------------------------------------------- 1 | // codeblocks 2 | %markup code, 3 | %textContainerFooter, 4 | %textContainer { 5 | background: $rb-bg-secondary !important; 6 | } -------------------------------------------------------------------------------- /discord/components/_scrollbars.scss: -------------------------------------------------------------------------------- 1 | ::-webkit-scrollbar { 2 | width: 5px !important; 3 | height: 3px !important; 4 | } 5 | 6 | ::-webkit-scrollbar-thumb { 7 | border: none !important; 8 | // background-color: $rb-bg-5; 9 | } 10 | 11 | ::-webkit-scrollbar-track-piece, 12 | ::-webkit-scrollbar-track { 13 | background: transparent !important; 14 | border: none !important; 15 | } -------------------------------------------------------------------------------- /discord/dist/main.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["../base/_fonts.scss","../base/_reset.scss","../components/_codeblocks.scss","../components/_scrollbars.scss","../components/_buttons.scss","../layout/_serverList.scss","../base/_variables.scss","../layout/_channelList.scss","../layout/_userAreaMsgInput.scss","../layout/_floating.scss","../layout/_layout.scss","../modules/_homeScreen.scss","../modules/_quickSwitcher.scss","../modules/_serverBanner.scss","../_utils.scss","../modules/_emojiPickers.scss","../modules/_jumpBars.scss","../modules/_accentColor.scss","../modules/_userPopout.scss","../modules/_settings.scss","../_tweaks.scss","../main.scss"],"names":[],"mappings":"AAAQ,iFAAA,CAER,sBAAA,6EAAA,CCDA,oKAKC,uBAAA,CAID,mEACC,+DAAA,CAAA,uDAAA,CAED,0EACC,gEAAA,CAAA,wDAAA,CAED,mGAEC,uBAAA,CAED,6BACC,QAAA,CACA,OAAA,CACA,WAAA,CACA,UAAA,CAED,wBACC,yBAAA,CAID,+BAAA,uBAAA,CC9BA,yDAGC,6BAAA,CCJD,oBACC,oBAAA,CACA,qBAAA,CAGD,0BACC,sBAAA,CAID,0DAEC,mCAAA,CACA,sBAAA,CCZD,mBACC,mCAAA,CACA,qBAAA,CACA,wCAAA,mCAAA,CAEA,mCACC,mCAAA,CACA,yCAAA,mCAAA,CAED,qCACC,mCAAA,CACA,2CAAA,mCAAA,CAIF,sCAEC,mCAAA,CACA,8EACC,+DAAA,CAMD,qEACC,yCAAA,CACA,iFAAA,gDAAA,CAIF,yCAEC,qBAAA,CCjCD,qBACC,8BCcc,CDZf,gBACC,eCCmB,CDGpB,iBACC,iBAAA,CACA,mBAAA,CAED,yBACC,mBAAA,CACA,kBAAA,CACA,UAAA,CACA,aAAA,CACA,UAAA,CACA,WAAA,CACA,kCAAA,CACA,yBAAA,CAAA,iBAAA,CACA,6BAAA,CAAA,qBAAA,CACA,4BAAA,CAAA,oBAAA,CAEA,+hGAAA,CAAA,uhGAAA,CAGD,yBACC,aChBc,CDiBd,0CAAA,wBCjBc,CCbf,kBACC,qBDKmB,CCDpB,yCACC,wBAAA,CAID,eACE,SAAA,CACA,UAAA,CACA,SAAA,CACA,kBAAA,CAEA,OAAA,CACA,SAAA,CACA,0BAAA,CACA,QAAA,CAEF,mCACC,oBAAA,CAID,gBACC,aAAA,CACA,gBAAA,CAED,oBACC,cAAA,CACA,iBAAA,CC/BD,gEAGC,mBAAA,CACA,+BAAA,CAGD,aACC,mCAAA,CACA,yCACC,kBAAA,CACA,SAAA,CAED,qCAAA,wBAAA,CACA,qBAAA,YAAA,CAID,gBAAA,2BAAA,CAGA,mBACC,kDAAA,CAED,eACC,qBFpBmB,CE2BpB,kBACC,oCAAA,CACA,WAAA,CCnCD,oCAEC,wBHKgB,CGHjB,uCAEC,mCAAA,CAID,iCACC,wBHJgB,CGShB,6FAEC,wBHXe,CGYf,iBHaS,CGPX,6CACC,mCAAA,CACA,+BAAA,CAED,kBACC,mCAAA,CACA,+BAAA,CAGD,wDAAA,0BAAA,CClCA,2BACC,qBJKmB,CIFpB,oBACC,kBJFe,CIKhB,0BAAA,WAAA,CAGA,kEACC,mCAAA,CAGD,8CACC,gCAAA,CAAA,6BAAA,CChBD,uCAAA,wBLUU,CKTV,uBAAA,8BAAA,CAEA,wDAEC,mCAAA,CACA,8CAAA,CAGD,gBAAA,8BAAA,CAEA,8BACC,kBAAA,CCZD,sBACC,kBNEe,CMDf,oCAAA,wBNKgB,CMJhB,uCACC,gBAAA,CACA,cAAA,CACA,gEAAA,wBNIQ,CMHR,gEAAA,mCAAA,CAED,yDAAA,8BNOc,COff,iCCyEC,0BAAA,CACA,kCAAA,CDpED,+BAGC,2BPuBW,COrBZ,qEAIC,0BPiBW,COfZ,8BACC,+BAAA,CAGD,+BAAA,YAAA,CAMA,6BACC,kBPRqB,COSrB,aPhBS,COkBT,oKACC,uCAAA,CAGF,yDACC,sCAAA,CEvBD,8BD4DC,0BAAA,CACA,kCAAA,CC1DA,WAAA,CACA,qBTZmB,CSiBpB,cAAA,+BAAA,CAEA,eACC,2BAAA,CACA,sBAAA,CACA,uBAAA,CAAA,kBAAA,CACA,yCACC,iBAAA,CAIF,uCAEC,qBAAA,CACA,uBAAA,CACA,2BAAA,CAEA,4QAEC,uBAAA,CAGF,kBAAA,wBT1CgB,CS6Cf,6CACC,YA5CmB,CA6CnB,6DAAA,CACA,wBAAA,CAEA,yJAEC,uBAAA,CAGF,4CACC,4BAAA,CACA,WAvDmB,CAwDnB,WAAA,CAEA,4CAAA,CACA,uCAAA,CAEA,4BAAA,CAEA,0DACC,2BAAA,CAMH,mCACC,YArE0B,CAsE1B,sBAAA,CAKA,0CACC,gBAAA,CAED,6BACC,sBAAA,CACA,uBAAA,CAED,4BACC,QAAA,CACA,8BAAA,CAED,0DACC,4EACC,CAKD,+DAAA,CAIF,4BACC,eApGoB,CAqGpB,iDAAA,YAAA,CAID,+BACC,4BAAA,CC5GD,iEAGC,0BAAA,CACA,+BAAA,CACA,SAAA,CAEA,mIACC,aVIgB,CUFjB,gIACC,wBAAA,CAIF,uBFwDC,0BAAA,CACA,kCAAA,CEvDA,WApBiB,CAwBlB,sBACC,0BAAA,CACA,gBAAA,CAED,oBACC,yCAAA,CAED,iBACC,iBAAA,CACA,OAAA,CAUA,WA3CiB,CA4CjB,kBAAA,CAVA,uCACC,cAAA,CAED,mCACC,aAAA,CAED,gCACC,gBAxCgB,CCClB,WACC,iDAAA,CACA,aAAA,CAED,sCACC,+BAAA,CAMD,4FAMC,mCAAA,CACA,qBAAA,CAGD,4DAGC,wBXbc,CWiBf,iGACC,wBXlBc,CWqBf,gBACC,SAAA,CACA,wBXvBc,CWwBd,sBAAA,wBXfoB,CWgBpB,uBAAA,wBXjBqB,CWoBtB,4BACC,aX7Bc,CW8Bd,YX9Bc,CWgCf,iBACC,oBXjCc,CWkCd,kCAAA,CAEA,kCAAA,aXpCc,CWwCf,2BAAA,+BAAA,CACA,iBAAA,iBXtBW,CWuBX,kBAAA,oCXvCe,CWyCf,4CAGC,aX/Cc,CYDf,uFACC,iBAAA,CACA,eAAA,CACA,eAAA,CACA,kBAAA,CACA,WAAA,CAED,oCAAA,iDAAA,CACA,2DACC,kBAAA,CAED,yBAAA,eAAA,CACA,gEACC,sBAAA,CACA,uEACC,UAAA,CACA,OAAA,CACA,iBAAA,CACA,kBAAA,CACA,WAAA,CAIF,yDAAA,sBAAA,CACA,uBAAA,SAAA,CAkHA,uBAAA,uBAAA,CACA,iCACC,iBAhJa,CCRd,aACC,8CAAA,CAED,oBACC,wBbMS,CaHV,wCACC,uDAAA,CAED,4BACC,2BAAA,CACA,iDACC,uBAAA,CAAA,kBAAA,CCVF,sBAAA,wBAAA,CAEA,oCACC,sBAAA,CACA,wBAAA,CAID,gHAEC,gBAAA,CCkBD,sCAGC,6BAAA,CACA,+BAAA,CACA,8CAAA,CACA,8BAAA,CACA,sCAAA,CACA,kCAAA,CACA,2BAAA,CACA,8BAAA,CACA,sBAAA,CACA,sBAAA,CACA,uBAAA,CACA,qCAAA,CAGA,yBAAA,CACA,2BAAA,CAGA,oBAAA,CACA,sBAAA,CAIA,6BAAA,CACA,6CAAA,CAEA,+CAAA,CACA,sDAAA,CACA,+CAAA,CAGA,oBAAA,CACA,2BAAA,CACA,oBAAA,CACA,oBAAA,CACA,oBAAA,CACA,oBAAA,CACA,uCAAA,CAEA,qCAAA,CACA,+CAAA,CACA,oCAAA,CACA,qCAAA,CAEA,kEAAA,CACA,iDAAA,CACA,8CAAA,CAIA,4DACC,sCAAA,CACA,uCAAA,CACA,uCAAA,CACA,wCAAA,CAED,6EACC,6BAAA,CACA,yCAAA,CACA,0CAAA,CACA,4BAAA,CAKF,iBAAA,+CAAA,CAAA,YAAA,+CAAA","file":"main.css"} -------------------------------------------------------------------------------- /discord/layout/_channelList.scss: -------------------------------------------------------------------------------- 1 | %channelsContainer { 2 | background-color: $rb-bg-secondary-d; 3 | } 4 | 5 | // unread channels have the same colors as normal channels 6 | %channelWrapperUnread %channelName { 7 | color: $rb-text !important; 8 | } 9 | 10 | // unread channel indicators -> dots 11 | %channelUnreadPill { 12 | width: 6px; 13 | height: 6px; 14 | z-index: 1; 15 | border-radius: 15px; 16 | 17 | top: 50%; 18 | left: -3px; 19 | transform: translateY(-50%); 20 | margin: 0; 21 | } 22 | [class*="typeThread"] %channelUnreadPill { 23 | left: -3px !important; 24 | } 25 | 26 | // move y spacing in private channels to child's margin, so i can yeet shop tab 27 | %privateChannel { 28 | padding-top: 0; 29 | padding-bottom: 0; 30 | } 31 | %privateChannelInteractive { 32 | margin-top: 2px; 33 | margin-bottom: 2px; 34 | } 35 | -------------------------------------------------------------------------------- /discord/layout/_floating.scss: -------------------------------------------------------------------------------- 1 | %messagesPopoutHeader, 2 | %searchHeader { 3 | background-color: $rb-bg-tertiary; 4 | } 5 | %searchPopoutQueryContainer, 6 | %searchPopoutQueryContainerFocused { 7 | background-color: $rb-bg-tertiary !important; 8 | } 9 | 10 | // friends search bar in library & invite 11 | %modalHeader %friendsSearch { 12 | background-color: $rb-bg-tertiary 13 | } 14 | 15 | 16 | form { // username & password edit popup 17 | %multiInput, %inputWrapper, %inputWrapper > input, 18 | %friendsAddFriendInputWrapper { 19 | background-color: $rb-bg-tertiary; 20 | border-radius: $br-small; 21 | } 22 | } 23 | 24 | 25 | 26 | %privateChannelsSearchBar %privateChannelsSearchBarComponent { 27 | background-color: $rb-bg-quarterary !important; 28 | border: 1px solid $border-color-black; 29 | } 30 | %chatSearchBar { 31 | background-color: $rb-bg-secondary !important; 32 | border: 1px solid $border-color-black; 33 | } 34 | 35 | %recentMentionsPopout, %messagesPopoutWrap { max-height: 93vh !important; } // inbox 36 | -------------------------------------------------------------------------------- /discord/layout/_layout.scss: -------------------------------------------------------------------------------- 1 | #app-mount, body, %bg { 2 | background-color: $rb-bg-secondary-d; 3 | } 4 | 5 | %pageWrapper { 6 | background: $rb-bg-primary; 7 | } 8 | 9 | %searchResultsWrap { width: 500px; } // Wider search results section 10 | 11 | // MEMBER LIST 12 | %membersContainer, %members, %members [class*="member"] { 13 | background-color: $rb-bg-primary !important; 14 | } 15 | 16 | [class^="messageAttachment_"] [class^="lazyImg_"] { 17 | object-fit: contain !important; 18 | } 19 | 20 | // testing these off, we'll see later 21 | 22 | // %privateChannelsScroller { 23 | // background-color: unset; 24 | // } -------------------------------------------------------------------------------- /discord/layout/_serverList.scss: -------------------------------------------------------------------------------- 1 | //discord home button custom bg 2 | %guildChildWrapper { 3 | background: $rb-bg-accent; 4 | } 5 | %guildsWrapper { 6 | background: $rb-bg-secondary-d; 7 | } 8 | 9 | // old wordmark because poggers 10 | %titlebarWordmark { 11 | visibility: hidden; 12 | pointer-events: none; 13 | } 14 | %titlebarWordmark::before { 15 | pointer-events: none; 16 | visibility: visible; 17 | content: ''; 18 | display: block; 19 | width: 55px; 20 | height: 16px; 21 | background-color: var(--text-muted); 22 | mask-size: contain; 23 | mask-repeat: no-repeat; 24 | mask-position: center; 25 | // i typed out "DISCORD" in the Discordinated font in inkscape and converted to path & compressed 26 | mask-image: url('data:image/svg+xml,'); 27 | } 28 | 29 | %circleIconButton { // plus & server discovery buttons 30 | color: $rb-fg-accent; 31 | &[class*="selected"] { background-color: $rb-fg-accent } 32 | } -------------------------------------------------------------------------------- /discord/layout/_userAreaMsgInput.scss: -------------------------------------------------------------------------------- 1 | // edit, message input, apps & commands button 2 | %autocomplete, 3 | %channelTextAreaScrollable, 4 | %appPopoutButton { 5 | border-radius: 0.5rem; 6 | border: 1px solid $border-color-black; 7 | } 8 | // main input 9 | %chatForm { 10 | background: transparent !important; 11 | %channelTextAreaScrollable { 12 | border-radius: 25px; 13 | opacity: 1; 14 | } 15 | %channelTextArea { background: transparent; } 16 | &::before { display: none; } 17 | } 18 | 19 | // set margin to be the same as the attachButton's 20 | %channelTextAreaButtons { margin-right: 5px !important } 21 | 22 | // user input area 23 | #vc-spotify-player { 24 | border: 1px solid var(--background-modifier-accent); 25 | } 26 | %panels, %panels %accountPanel { 27 | background-color: $rb-bg-secondary-d; 28 | } 29 | %accountPanel { 30 | border-style: none; 31 | button:hover { border-radius: 50%; } 32 | } 33 | 34 | %connectionPanel { 35 | background-color: var(--bg-overlay-1); 36 | border: none; 37 | } -------------------------------------------------------------------------------- /discord/lib/LICENCE_DiscordSelectors.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 Zerthox 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /discord/lib/README.md: -------------------------------------------------------------------------------- 1 | # rosebox > discord > lib 2 | this uses the following projects to get up-to-date mappings for discord classes as scss selectors 3 | 4 | - [DiscordSelectors](https://github.com/Zerthox/DiscordSelectors) - MIT licenced, see `LICENCE_DiscordSelectors.md`. 5 | - [ClearVision](https://github.com/ClearVision/ClearVision-v6) - Apache 2.0 licenced, see `LICENCE_ClearVision.md` 6 | - `rbMappings.scss` are missing mappings i added. 7 | 8 | if there is a problem with the way i've included the licences or used the code from these projects, please contact me on discord `KraXen72#9190` -------------------------------------------------------------------------------- /discord/lib/_rbMappings.scss: -------------------------------------------------------------------------------- 1 | // thanks to https://syndishanx.github.io/Website/Update_Classes.html 2 | .upsellButton_c0eeaa { 3 | @extend %nitroUpsellButton !optional; 4 | } 5 | .addFriend__133bf { 6 | @extend %addFriendButton !optional; 7 | } 8 | .wrapper__8b9fc { 9 | @extend %quickswitcherPing !optional; 10 | } 11 | 12 | // emoji picker stuff 13 | .wrapper_c0e32c { 14 | @extend %reactionEmojiPickerContentWrapper !optional; 15 | } 16 | .nav__08434, .nav__2aafa { // normal, reaction 17 | @extend %emojiPickerNav !optional; 18 | } 19 | .navList__08434, .navList__8438b { // normal, reaction 20 | @extend %emojiPickerNavList !optional; 21 | } 22 | .inner_fea832 { // also %groupInvitePopoutSearchBarInner 23 | @extend %emojiPickerSearchBarInner !optional; 24 | } 25 | .positionContainerOnlyEmoji__08434 { 26 | @extend %editEmojiPickerContainer !optional; 27 | } 28 | .emoji__045fa { 29 | @extend %emojiPreview !optional; 30 | } 31 | .resizeHandle__08434 { 32 | @extend %emojiPickerResizeHandle !optional; 33 | } 34 | .emojiListRowMediumSize_fc7141 { 35 | @extend %emojiPickerRowMedium !optional; 36 | } 37 | .diversitySelector_c0e32c { 38 | @extend %emojiPickerSkintoneButton !optional; 39 | } 40 | 41 | 42 | .buttons__74017 { 43 | @extend %channelTextAreaButtons !optional; 44 | } 45 | .barButtonMain__0f481 { 46 | @extend %jumpBarMainButton !optional; 47 | } 48 | .barButtonAlt__0f481 { 49 | @extend %jumpBarAltButton !optional; 50 | } 51 | .clipContainer__841c8 { 52 | @extend %replyBarClipContainer !optional; 53 | } 54 | .content__235ca a { 55 | @extend %systemMessageUsernameAnchor !optional; 56 | } 57 | .communityInfoContainer_f37cb1 { 58 | @extend %serverHeaderPublicPill !optional; 59 | } 60 | .cardPrimary_cb7a0e { 61 | @extend %settingsCardPrimary !optional; 62 | } 63 | .rolePillBorder_fa2f72 { 64 | @extend %rolePillBorder !optional; 65 | } 66 | .timestamp__75297 { 67 | @extend %markdownTimestamp !optional; 68 | } 69 | 70 | // modal/popout 71 | .textAreaForUserProfile__74017 { 72 | @extend %userPopoutTextareaInput !optional; 73 | } 74 | .nickname_c9ccf6 { 75 | @extend %userModalNickname !optional; 76 | } 77 | .profileEffects__01370 { 78 | @extend %profileEffects !optional; 79 | } 80 | .avatarWrapper_f89da9 { 81 | @extend %decoratedAvatarWrapper !optional; 82 | } 83 | .bannerSVGWrapper_b32cc2 { 84 | @extend %bannerSVGWrapper !optional; 85 | } 86 | .avatarDecoration__44b0c, // profile 87 | .avatarDecoration_c19a55, 88 | .avatarDecoration_c19a55 // chat 89 | { 90 | @extend %avatarDecoration !optional; 91 | } 92 | .avatarDecorationHint_f89da9 { 93 | @extend %avatarDecorationHint !optional; 94 | } 95 | .avatarHintInner_f89da9 { 96 | @extend %avatarHintInner !optional; 97 | } 98 | 99 | // new userpopout stuff... 100 | .biteSizeOuter_c69a7b { 101 | @extend %bitesizePopoutOuter !optional; 102 | } 103 | .header__5be3e { 104 | @extend %bitesizePopoutHeader !optional; 105 | } 106 | .body__5be3e { 107 | @extend %bitesizePopoutBody !optional; 108 | } 109 | 110 | .footer__5be3e { 111 | @extend %bitesizePopoutFooter !optional; 112 | } 113 | .container__8061a { 114 | @extend %bitesizePopoutBadgeContainer !optional; 115 | } 116 | .card__39ec2 { 117 | @extend %bitesizePopoutRpcCard !optional; 118 | } 119 | 120 | // stauspicker 121 | .body_af7fb7 { // in status picker 122 | @extend %bitesizePopoutBody2 !optional; 123 | } 124 | %bitesizePopoutBody2 .menuOverlay_af7fb7 { 125 | @extend %statusPickerSection !optional; 126 | } 127 | 128 | // new userpopout - role 129 | button.button__7d7f7, .showMoreButton_c83b44 { @extend %roleAddButton !optional; } 130 | 131 | // clan tags 132 | .chipletContainerInline__4a25c { 133 | @extend %clanTag !optional; 134 | } -------------------------------------------------------------------------------- /discord/main.scss: -------------------------------------------------------------------------------- 1 | @import 'base/fonts'; 2 | @import 'base/variables'; 3 | @import 'lib/mappings'; 4 | @import 'lib/rbMappings'; 5 | 6 | @import 'base/reset'; 7 | @import 'utils'; 8 | 9 | @import 'components/codeblocks'; 10 | @import 'components/scrollbars'; 11 | @import 'components/buttons'; 12 | 13 | @import 'layout/serverList.scss'; 14 | @import 'layout/channelList.scss'; 15 | @import 'layout/userAreaMsgInput'; 16 | @import 'layout/floating'; 17 | @import 'layout/layout'; 18 | 19 | @import 'modules/homeScreen'; 20 | @import 'modules/quickSwitcher'; 21 | @import 'modules/serverBanner'; 22 | @import 'modules/emojiPickers'; 23 | @import 'modules/jumpBars'; 24 | @import 'modules/accentColor'; 25 | @import 'modules/userPopout'; 26 | @import 'modules/settings'; 27 | 28 | @import 'tweaks'; 29 | 30 | // TODO switch over to @use from @import in scss => would require namespacing all the variables? 31 | // TODO once finalized, update rosebox colors in the readme 32 | :root, .theme-dark, .focusLock-2tveLW *, %userPopoutOuter.theme-light { 33 | // $scss-variables > --discord-variables 34 | 35 | --background-primary: #{$rb-bg-primary}; 36 | --background-secondary: #{$rb-bg-secondary-d}; 37 | --background-secondary-alt: #{$rb-bg-5} !important; 38 | --background-tertiary: #{$rb-bg-quarterary}; 39 | --modal-background: #{$rb-bg-quarterary} !important; 40 | --modal-footer-background: #{$rb-bg-tertiary}; 41 | --input-background: #{$rb-bg-quarterary}; 42 | --background-floating: #{$rb-bg-secondary}; 43 | --primary-600: #{$rb-bg-tertiary}; 44 | --primary-630: #{$rb-bg-quarterary}; // slash command headers 45 | --bg-overlay-1: #{$rb-bg-secondary}; // panel bg 46 | --channeltextarea-background: #{$rb-bg-secondary-d}; 47 | // --background-modifier-selected: ; 48 | 49 | --header-primary: #{$rb-fg-accent}; 50 | --header-secondary: #{$rb-text-vibrant}; 51 | // --header-spotify: ; 52 | 53 | --text-link: #{$rb-fg-accent}; 54 | --text-normal: #{$rb-text}; 55 | // --text-muted: ; 56 | 57 | // [@Username] message 58 | --mention-foreground: #{$rb-fg-accent}; 59 | --mention-background: #{$rb-bg-accent}; 60 | // message that mentions you 61 | --background-mentioned: #{$rb-bg-accent}; 62 | --background-mentioned-hover: #{$rb-bg-accent25}; 63 | --brand-experiment-05a: #{$rb-bg-accent}; 64 | 65 | // discord's accent color 66 | --brand-500: #{$rb-fg-accent}; // (BETA) pill 67 | --brand-experiment: #{$rb-fg-accent}; // reaction border + general accent 68 | --brand-400: #{$rb-bg-accent-opaque}; // checkbox border 69 | --brand-500: #{$rb-fg-accent}; // checked checkboxes among other things 70 | --brand-560: #{$rb-fg-accent}; // server context menu hover background 71 | --brand-600: #{$rb-bg-accent-opaque}; // server context menu active background 72 | --control-brand-foreground-new: #{$rb-fg-accent}; // spotify progress bar (vencord) 73 | // discord's accent color alpha variants 74 | --brand-10a: #{$rb-bg-accent25}; // hover on replying message 75 | --brand-15a: #{$rb-bg-accent} !important; // reaction bg 76 | --brand-80a: #{$rb-bg-accent80}; // gif picker favorites 77 | --brand-95a: #{$rb-bg-accent95}; // gif picker favorites hover 78 | 79 | --background-message-highlight: #{$rb-bg-accent} !important; // reacting to bg 80 | --brand-200: var(--interactive-normal) !important; // reaction text 81 | --control-brand-foreground: #{$rb-fg-accent} !important; // some accents 82 | } 83 | 84 | :is(%userPopoutOuter, %bitesizePopoutOuter.custom-profile-theme) { 85 | &.theme-light { 86 | --interactive-active: var(--white-500); 87 | --interactive-hover: var(--primary-230); 88 | --interactive-muted: var(--primary-500); 89 | --interactive-normal: var(--primary-330); 90 | } 91 | &:is(.theme-light, .theme-dark) { 92 | --bg-surface-overlay: #{$rb-bg-tertiary}; 93 | --border-faint: #{$border-color-faint}; 94 | --border-strong: #{$border-color-faint}; 95 | --bg-surface-raised: #{$rb-bg-tertiary}; 96 | } 97 | } 98 | 99 | 100 | ::selection { background-color: $rb-bg-accent !important; } -------------------------------------------------------------------------------- /discord/modules/_accentColor.scss: -------------------------------------------------------------------------------- 1 | @use 'sass:color'; 2 | 3 | %searchResultHighlight { 4 | background-color: rgba($color: white, $alpha: 0.15) !important; 5 | color: color.adjust($rb-text, $lightness: + 20%); 6 | } 7 | %reactionMe, %forumReactionMe { 8 | border-color: $rb-bg-accent-opaque !important; 9 | } 10 | %settingsSide %tabBarItemSelected:not(:hover) { 11 | background-color: $rb-bg-accent !important; 12 | } 13 | 14 | %numberBadge, // ping indicators with numbers - uses inline styles, !important needed 15 | %inboxBadge, 16 | %quickswitcherPing, 17 | %headerBarIconBadge, 18 | %quickSwitcherPingWrapper, 19 | %mentionWrapper:hover { 20 | background-color: $rb-fg-accent !important; 21 | color: white !important; 22 | } 23 | 24 | %channelUnreadPill, 25 | %unreadPill, 26 | %mentioned::before { 27 | background-color: $rb-fg-accent; 28 | } 29 | 30 | // menu items 31 | :is(%menuPopoutSelected:hover, %menuPopoutItemHover):not(%menuPopoutItemDanger):not(%menuPopoutItemInvite) { 32 | background-color: $rb-fg-accent; 33 | } 34 | 35 | %channelsMentionIndicator { /// (new) pill 36 | opacity: 1; 37 | background-color: $rb-fg-accent; 38 | &:hover { background-color: $rb-fg-accent-hover } 39 | &:active { background-color: $rb-bg-accent-opaque; } 40 | } 41 | 42 | %unreadPillCapStroke { 43 | color: $rb-fg-accent; 44 | fill: $rb-fg-accent; 45 | } 46 | %dividerUnread { // ----- span // members group title 60 | { 61 | color: $rb-fg-accent; 62 | } 63 | -------------------------------------------------------------------------------- /discord/modules/_emojiPickers.scss: -------------------------------------------------------------------------------- 1 | /*---------- EMOJI PICKERS ----------*/ 2 | // 2020 - credit to emma🌺#0968 (customa creator) for the original code 3 | // 2022 - thanks katlyn for fixing this 4 | // 2023 - rewritten (3rd time) - removed dead classes & used placeholder selectors 5 | 6 | $emoji-picker-width: 428px; 7 | $emoji-picker-min-height: 416px; // without categoryList 8 | $edit-emoji-picker-height: 498px; // for container 9 | 10 | $catlist-rotate: -90deg; 11 | $catlist-tr-x: -193px; 12 | $catlist-tr-y: 190px; 13 | 14 | /* remove nav*/ 15 | %emojiPickerHeader, 16 | %gifPickerHeader { 17 | @include no-shadow; 18 | filter: none; 19 | background-color: $rb-bg-secondary-d; 20 | } 21 | %gifPicker %gifPickerSearchInput { background-color: var(--background-primary); } 22 | 23 | // fix inconsistent serach button sizing in emoji/gif/sticker pickers 24 | %emojiPickerSearchBarInner { overflow: hidden auto !important; } 25 | 26 | %emojiPickerHeader { 27 | padding: 0px 16px !important; 28 | align-items: flex-start; 29 | height: min-content; 30 | %emojiPickerSkintoneButton { 31 | align-self: center; 32 | } 33 | } 34 | 35 | %emojiPickerWrapper, 36 | %reactionEmojiPickerContentWrapper { 37 | box-sizing: border-box; 38 | grid-template-rows: auto; 39 | min-height: 442px !important; 40 | 41 | %emojiPickerNav, 42 | %emojiPickerNavList { 43 | display: none !important; 44 | } 45 | } 46 | %emojiPickerInspector { background-color: $rb-bg-primary; } 47 | 48 | #emoji-picker-tab-panel { 49 | %emojiCategoryList { 50 | height: $emoji-picker-width; 51 | transform: rotate($catlist-rotate) translateX($catlist-tr-x) translateY($catlist-tr-y); 52 | padding-top: 0 !important; 53 | 54 | %autocompleteListItems %emojiCategoryItem, 55 | %emojiCategoryUnicodeShortcut { 56 | transform: rotate(90deg); 57 | } 58 | } 59 | %emojiPicker { 60 | position: relative !important; 61 | width: $emoji-picker-width; 62 | height: 100%; 63 | 64 | grid-template-rows: 48px auto calc(48px * 2) !important; 65 | grid-template-columns: 0 auto !important; 66 | 67 | border-radius: 5px !important; 68 | 69 | %emojiPreview { //center emoji preview 70 | margin-left: -6px !important; 71 | } 72 | } 73 | } 74 | 75 | // edit message emoji picker 76 | %editEmojiPickerContainer { 77 | height: $edit-emoji-picker-height; 78 | width: $emoji-picker-width !important; 79 | } 80 | 81 | // reaction emoji picker 82 | [id^="popout"] { 83 | &:has(#emoji-picker-tab-panel) { 84 | margin-top: -48px; // temp reaction emoji picker fix 85 | } 86 | %reactionEmojiPickerContentWrapper { 87 | width: $emoji-picker-width !important; 88 | height: $edit-emoji-picker-height !important; 89 | } 90 | %emojiPickerHeader { 91 | top: 2rem; 92 | padding-top: 1.25rem !important; 93 | } 94 | #emoji-picker-tab-panel %emojiCategoryList { 95 | transform: 96 | rotate($catlist-rotate) 97 | translateX(calc($catlist-tr-x - 3.7rem)) 98 | translateY($catlist-tr-y); 99 | 100 | // disord's variable btw 101 | border-top-left-radius: var(--custom-emoji-picker-border-radius); 102 | } 103 | } 104 | // limit max width & disable resizing 105 | %emojiPickerSizer { 106 | max-width: $emoji-picker-width; 107 | %emojiPickerResizeHandle { display: none; } 108 | } 109 | 110 | // fix medium emoji grid row distribution 111 | %emojiPickerRowMedium { 112 | justify-content: space-evenly; 113 | } -------------------------------------------------------------------------------- /discord/modules/_homeScreen.scss: -------------------------------------------------------------------------------- 1 | %friendsColumn %friendsSearch { background-color: $rb-bg-5; } 2 | %friendsItem { border-top-color: transparent; } 3 | 4 | %activeNowOuterCard:hover, 5 | %activeNowOuterCard:hover %activeNowCardSection { 6 | background-color: $rb-bg-5 !important; 7 | border-color: var(--background-modifier-accent) 8 | } 9 | 10 | %activeNowCardSection { border: 1px solid transparent; } 11 | 12 | %activeNowOuterCard, %activeNowOuterCard * { 13 | transition: all 0.2s; 14 | } -------------------------------------------------------------------------------- /discord/modules/_jumpBars.scss: -------------------------------------------------------------------------------- 1 | $jump-bar-height: 26px; 2 | $jump-bar-gutter: 12px; 3 | 4 | %jumpToPresentBar, 5 | %newMessagesBar, 6 | %replyBar { 7 | background: $rb-bg-secondary-d !important; 8 | border: 1px solid $border-color-black; 9 | opacity: 1; 10 | 11 | %jumpBarMainButton { 12 | color: $rb-text-vibrant; 13 | } 14 | %jumpBarAltButton { 15 | color: $rb-fg-accent !important; 16 | } 17 | } 18 | 19 | %newMessagesBar { 20 | @include no-shadow; 21 | height: $jump-bar-height; 22 | } 23 | 24 | // the reply bar might need a rewrite in the future. it's pretty hacky & ugly but whatevs 25 | %replyBarClipContainer { 26 | padding-top: 0px !important; 27 | overflow: visible; 28 | } 29 | %channelTextAreAttachedBar { 30 | background-color: transparent !important; 31 | } 32 | %replyBar { 33 | position: relative; 34 | top: 1px; 35 | %replyCancelButton, %replyMentionButton { 36 | padding: 0 $jump-bar-gutter; 37 | } 38 | %replySeperator { 39 | height: calc($jump-bar-height / 5) * 3; 40 | } 41 | [class*="text-"] { 42 | margin-left: $jump-bar-gutter; 43 | } 44 | height: $jump-bar-height; 45 | align-items: center; 46 | } 47 | -------------------------------------------------------------------------------- /discord/modules/_quickSwitcher.scss: -------------------------------------------------------------------------------- 1 | %quickswitcher { 2 | background: $rb-bg-primary; 3 | %quickswitcherInput { background-color: $rb-bg-tertiary; } 4 | %quickswitcherScroller { 5 | max-height: 400px; 6 | margin-right: 0; 7 | &::-webkit-scrollbar-thumb { background-color: $rb-bg-5; } 8 | &::-webkit-scrollbar-track { background-color: $rb-bg-tertiary !important; } // !important is needed, discord uses it too 9 | } 10 | %quickswitcherResult[aria-selected="true"] { background: $rb-bg-accent; } 11 | } -------------------------------------------------------------------------------- /discord/modules/_serverBanner.scss: -------------------------------------------------------------------------------- 1 | // remove shadow 2 | %channelsHeader, 3 | %bannerAnimatedContainer, 4 | %privateChannelsSearchBar { 5 | @include no-shadow; 6 | } 7 | 8 | %channelsSidebar, 9 | %channelsHeader, 10 | %bannerAnimatedContainer { 11 | border-top-right-radius: $br-medium; 12 | } 13 | %headerBar, 14 | %chat, 15 | %friends, 16 | %pageWrapper { 17 | border-top-left-radius: $br-medium; 18 | } 19 | %headerBarIconSelected %headerBarIcon { 20 | color: var(--interactive-normal); 21 | } 22 | 23 | %serverHeaderPublicPill { display: none; } // hide public pill 24 | 25 | // this seems to only appear once in a while 26 | // i cannot get it to appear now, so i'll fix it if it breaks 27 | 28 | // upsell popup 29 | .upsellTooltipWrapper-1wqikQ { 30 | background: $rb-bg-accent-opaque; 31 | color: $rb-text; 32 | 33 | .upsellTooltipHeader-28hJ7J, .upsellTooltipText-SIthpf, .text-sm-normal-3Zj3Iv { 34 | color: rgba(255, 255, 255, 0.847) !important; 35 | } 36 | } 37 | .upsellTooltipWrapper-1wqikQ.caretTopCenter-1wqGIE:after { 38 | border-bottom-color: $rb-bg-accent-opaque !important; 39 | } 40 | -------------------------------------------------------------------------------- /discord/modules/_settings.scss: -------------------------------------------------------------------------------- 1 | %settingsCard { 2 | --__card-accent-color: #{$rb-bg-accent1}; 3 | } 4 | %settingsCardPrimary { 5 | background-color: $rb-bg-5; 6 | } 7 | 8 | #vencordsetting-tab, #vencordplugins-tab { 9 | --background-modifier-selected: var(--input-background); 10 | } 11 | .vc-plugins-filter-controls { 12 | --input-background: #{$rb-bg-tertiary}; 13 | %inputWrapper { 14 | height: min-content; 15 | } 16 | } -------------------------------------------------------------------------------- /discord/modules/_userPopout.scss: -------------------------------------------------------------------------------- 1 | $banner-original-width: 340px; 2 | $banner-original-height: 120px; 3 | 4 | $up-border-color: var(--background-modifier-accent); //$rb-bg-accent; 5 | $up-desired-width: 300px; 6 | $up-br-outer: 8px; 7 | $up-padding: 0.5rem; 8 | $up-spacing-thin: 4px; // themed popoutOuter's padding will still be 4px regardless of this. 9 | $up-br-inner: calc($up-br-outer - $up-spacing-thin); 10 | 11 | // role pills 12 | // originally by Cynthia, fixed by Cynthia (Davri#0015) in 2022, further maintained by KraXen72 13 | %role:not(%roleAddButton) { 14 | position: relative; 15 | overflow: hidden; 16 | background: none; 17 | border-radius: 50px; 18 | padding: 4px; 19 | } 20 | %rolePillBorder, %role { border: 1px solid $border-color-faint !important; } 21 | %roleAddButton { 22 | border-radius: 50px; 23 | } 24 | %roleRemoveButton { position: static; } 25 | %role %roleCircle:not([class*="popoutRoleCircle-"]) { 26 | margin: 0px 4px 0px 0px; 27 | &::after { 28 | content: ""; 29 | inset: 0; 30 | position: absolute; 31 | background: inherit; 32 | opacity: 0.25; 33 | } 34 | } 35 | // normalize old margins with new ones 36 | %role > %roleRemoveButton > %roleCircle { margin: 0px 4px 0px 0px; } 37 | %roleRemoveIcon { left: 11px; } 38 | 39 | // userPopout attempt 3 or 4 idk 40 | // user popouts (new, bitesized ones) 41 | %userPopoutOuter { 42 | background: $border-color; 43 | background-image: none; 44 | max-width: $up-desired-width; 45 | border-radius: $up-br-outer; 46 | } 47 | %userPopoutInner { 48 | background-image: none !important; 49 | background: $border-color !important; 50 | row-gap: 0; 51 | &::before { background-color: transparent; } 52 | 53 | // DMS disabled = empty footer = round body 54 | &:has(%bitesizePopoutFooter:empty) { 55 | %bitesizePopoutBody { border-radius: $up-br-inner; } 56 | %bitesizePopoutFooter { display: none; } 57 | } 58 | 59 | %bitesizePopoutHeader { 60 | background: $border-color; 61 | } 62 | %decoratedAvatarWrapper svg, %avatarWrapper svg { 63 | rect[fill="black"], circle[fill="black"], circle[fill="white"], rect[fill="white"] { 64 | fill: transparent; 65 | } 66 | } 67 | %userProfileBadgeList { 68 | background-color: $border-color; 69 | border-color: $border-color; 70 | padding: 2px; 71 | } 72 | 73 | %bitesizePopoutBody, 74 | %bitesizePopoutBody2, 75 | %bitesizePopoutFooter { 76 | background: $rb-bg-secondary; 77 | 78 | padding-inline: $up-padding; 79 | margin-inline: $up-spacing-thin; 80 | } 81 | %bitesizePopoutBody, 82 | %bitesizePopoutBody2 { 83 | margin-top: $up-padding; // so status bubble doesen't touch body 84 | padding-block: $up-padding; 85 | border-top-left-radius: $up-br-inner; 86 | border-top-right-radius: $up-br-inner; 87 | 88 | [class^="text-sm"] { 89 | color: var(--text-normal) !important; 90 | } 91 | } 92 | %bitesizePopoutBody2 { // status picker body 93 | overflow: unset !important; 94 | border-radius: $up-br-inner; 95 | padding-right: $up-padding !important; 96 | padding-left: $up-padding !important; 97 | } 98 | %bitesizePopoutRpcCard { 99 | background-color: $rb-bg-accent !important; 100 | border-radius: $up-br-inner; 101 | padding: $up-padding; 102 | } 103 | %bitesizePopoutFooter { 104 | padding-block: $up-padding; 105 | border-bottom-left-radius: $up-br-inner; 106 | border-bottom-right-radius: $up-br-inner; 107 | } 108 | %userProfileMessage { 109 | background: $border-color !important; 110 | color: var(--text-normal) !important; 111 | } 112 | %channelTextArea { 113 | > %channelTextAreaScrollable { 114 | border-radius: $up-br-inner; 115 | } 116 | %userPopoutTextareaInput { 117 | --channel-text-area-placeholder: $rb-text !important; 118 | border-radius: $up-br-inner; 119 | } 120 | } 121 | } 122 | 123 | // nitro theme fixes 124 | %userProfileOuterThemed:is(%bitesizePopoutOuter) { 125 | // nitro popouts are too wide because they're 300px + 4px each side 126 | // and no border-box by default 127 | box-sizing: border-box; 128 | min-width: unset !important; 129 | width: $up-desired-width !important; 130 | max-width: $up-desired-width !important; 131 | 132 | // fix banners overflowing after width correction & add border-radius 133 | %userProfileBanner { 134 | overflow: hidden; 135 | max-width: calc(#{$up-desired-width} - 2*#{$up-spacing-thin}); 136 | border-radius: $up-br-inner; 137 | } 138 | 139 | // nitro popouts have a 4px border by default so we remove ours 140 | %userPopoutInner { 141 | padding-bottom: 0; 142 | 143 | %bitesizePopoutBody, 144 | %bitesizePopoutFooter { 145 | margin-inline: 0 146 | } 147 | } 148 | } 149 | 150 | // hide small line under banner 151 | %userProfileBanner::before { display: none !important; } 152 | %statusPickerSection { 153 | border-radius: $up-br-inner; 154 | } 155 | 156 | // bot userpopouts (old ones) 157 | %userPopoutOuter:not(%bitesizePopoutOuter) { 158 | %userPopoutOverlayBackground { 159 | margin: $up-spacing-thin; 160 | margin-top: calc(#{$up-spacing-thin} + 1.5rem); 161 | border-radius: $up-br-inner; 162 | } 163 | } -------------------------------------------------------------------------------- /discord/reference/_reference_variables.scss: -------------------------------------------------------------------------------- 1 | // old discord's colors 2 | $Col-dcweb-1: #7289DA; /*blue*/ 3 | $Col-dcweb-2: #99AAB5; /*grey*/ 4 | $Col-dcweb-3: #2C2F33; /*more grey*/ 5 | $Col-dcweb-4: #23272A; /*not quite black*/ 6 | $col-dcweb-5: #36393f; /*original grey color from discord*/ 7 | $col-dcweb-6: #40444b; /*original chatbox color from discord*/ 8 | $col-dcweb-7: #2f3136; /*original embeds color*/ 9 | 10 | /*from app*/ 11 | $Col-dcapp-1: var(--background-primary); /*main chat window*/ 12 | $Col-dcapp-2: var(--background-secondary); /*channel list*/ 13 | $Col-dcapp-3: var(--background-tertiary); /*server selector bg*/ 14 | 15 | /*fron slate*/ 16 | $slate-background-light: #2f363d; 17 | $slate-background: #24292e; 18 | $slate-background-alt: #2a3036; 19 | $slate-background-dark: #1d2125; 20 | 21 | $Colr: #1d1e1f; /*messenger grey bg*/ -------------------------------------------------------------------------------- /discord/reference/discord-mask.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 16 | 36 | 38 | 42 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /discord/reference/dracula.css: -------------------------------------------------------------------------------- 1 | :root { 2 | --background-primary: #181920; 3 | --background-secondary: #1C1D25; 4 | --background-secondary-alt: #16171D; 5 | --background-tertiary: #1F2029; 6 | --channeltextarea-background: #1F2029; 7 | --background-message-hover: rgba(4, 4, 5, 0.07); 8 | --background-accent: #22232E; 9 | --background-floating: #1F2029; 10 | --scrollbar-thin-thumb: #9B78CC; 11 | --scrollbar-auto-thumb: #9B78CC; 12 | --scrollbar-auto-scrollbar-color-thumb: #9B78CC; 13 | --scrollbar-auto-track: #16171D; 14 | --scrollbar-auto-scrollbar-color-track: #16171D; 15 | --brand-color: #9B78CC; 16 | --brand-color-hover: #896BB5; 17 | } 18 | -------------------------------------------------------------------------------- /discord/reference/mask.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 18 | 19 |
20 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /discord/reference/old/_accentColor.scss.old: -------------------------------------------------------------------------------- 1 | /*----//----CUSTOMA ACCENT COLOR SYSTEM----------*/ 2 | /*alpha*/ 3 | .buffer-26XPkd, 4 | .buffer-26XPkd::after, 5 | .buffer-26XPkd::before, 6 | .content-3dzVd8.isMentioned-N-h9aa, 7 | .mediaBarPreview-1jfyFs, 8 | .mediaBarPreview-1jfyFs::after, 9 | .mediaBarPreview-1jfyFs::before, 10 | .mentioned-xhSam7, 11 | .replying-1x3H0T, 12 | .message-2qnXI6.replying-1x3H0T:hover, 13 | .message-2qnXI6.mentioned-xhSam7.selected-2P5D_Z, 14 | .mouse-mode .message-2qnXI6.mentioned-xhSam7:hover, 15 | .reaction-1hd86g.reactionMe-wv5HKu, 16 | .theme-dark .wrapper-3WhCwL, 17 | .wrapper-3WhCwL { 18 | background-color: $rb-bg-accent 19 | } 20 | .checkbox-1ix_J3[style*="rgba(67, 181, 129, 0.15)"], 21 | .folderIconWrapper-226oVY[style="background-color: rgba(114, 137, 218, 0.4);"] { 22 | background: $rb-bg-accent !important 23 | } 24 | //reply message hover 25 | .message-2qnXI6.ephemeral-1PsL1r.selected-2P5D_Z, 26 | .message-2qnXI6.replying-1x3H0T.selected-2P5D_Z, 27 | .mouse-mode.full-motion .ephemeral-1PsL1r:hover, 28 | .mouse-mode.full-motion .replying-1x3H0T:hover { 29 | background: $rb-bg-accent1 !important 30 | } 31 | 32 | .highlight { 33 | background-color: $rb-bg-accent; 34 | filter: brightness(3) 35 | } 36 | /*normal*/ 37 | .barFill-23-gu-, 38 | .checkbox-3kaeSU .checkboxInner-3yjcPe .checkboxElement-1qV33p:checked + span, 39 | .children-rWhLdy .nowPlaying-284llR, 40 | .circleIconButton-jET_ig.selected-ugP_am, 41 | .container-3ayLPN .datePicker--XZbmJ .datePickerHint-3Q1Udw .hintValue-29ny8Z, 42 | .container-3ayLPN .datePicker--XZbmJ .datePickerHint-3Q1Udw .hintValue-29ny8Z:hover, 43 | .containerDragAfter-1F4fgZ::after, 44 | .containerDragAfter-3TEhpe::before, 45 | .containerDragBefore-31UGCO::before, 46 | .containerDragBefore-3Dzc5x::before, 47 | .datePicker--XZbmJ .calendarPicker-2yf6Ci .react-datepicker__day.react-datepicker__day--selected::after, 48 | .datePicker--XZbmJ .calendarPicker-2yf6Ci .react-datepicker__day.react-datepicker__day--selected:hover, 49 | .datePicker--XZbmJ .calendarPicker-2yf6Ci .react-datepicker__day:hover, 50 | .headerPlaying-j0WQBV, 51 | .headerSpotify-zpWxgT, 52 | .headerStreaming-2FjmGz, 53 | .headerXbox-3G-4PF, 54 | .iconBadge-2wi9r4.participating-NBGDkr, 55 | .iconBadge-qZ4Ksk, 56 | .isUnread-3Ef-o9 .content-1o0f9g, 57 | .item-2hkk8m, 58 | .item-3eFBNF.selected-2DeaDa, 59 | .mediaBarGrabber-1FqnbN, 60 | .mediaBarInteraction-37i2O4:hover .mediaBarGrabber-1FqnbN, 61 | .mediaBarInteractionDragging-2QurIZ .mediaBarGrabber-1FqnbN, 62 | .mediaBarProgress-1xaPtl, 63 | .mediaBarProgress-1xaPtl::after, 64 | .mediaBarProgress-1xaPtl::before, 65 | .mention-1f5kbO, //mentioned 66 | .mention-1f5kbO:active, 67 | .mentioned-xhSam7::before, 68 | //replying 69 | .replying-1x3H0T::before, 70 | .newMessagesBar-mujexs, 71 | .progressBar-2Hd4f8 .barForeground-3KglC8, 72 | .questionMark-CWEQZn.flexCenter-3_1bcw, 73 | .questionMark-CWEQZn.flexCenter-3_1bcw:hover, 74 | .result-3w1ZcL .result-3w1ZcL .selectorButtonSelected-1j4DmC, 75 | .selectorButtonSelected-336oUc, 76 | .side-8zPYf6 .role-3wi9Tf.selected-3s45Ha.item-PXvHYJ, 77 | .sidebar-CFHs9e .side-8zPYf6 .selected-3s45Ha.item-PXvHYJ, 78 | .switch-3wwwcV.valueChecked-m-4IJZ, 79 | .tooltip-2QfLtc.tooltipBrand-g03Nz8, 80 | .topSectionPlaying-1J5E4n, 81 | .topSectionSpotify-1lI0-P, 82 | .topSectionStreaming-1Tpf5X, 83 | .topSectionXbox-3fWLjS, 84 | .unread-3zKkbm, 85 | .unreadPill-2HyYtt, 86 | .userSettingsVoice-iwdUCU .sliderBar-3DezvM.speaking-2bFhO4, 87 | .wanderingCubesItem-WPXqao, 88 | .wrapper-1BJsBx.selected-bZ3Lue .childWrapper-anI2G9, 89 | .wrapper-1BJsBx:hover .childWrapper-anI2G9, 90 | .wrapper-232cHJ, 91 | .wrapper-3WhCwL:hover, .unread-2lAfLh { 92 | background-color: $rb-fg-accent; 93 | } 94 | //bot tags 95 | .botTagRegular-2HEhHi { 96 | background: $rb-fg-accent; 97 | } 98 | 99 | /* ping indicators with numbers*/ 100 | .item-26Dhrx[style*="rgb(114, 137, 218)"], 101 | .languageCheckbox .checkbox-1ix_J3.checked-3_4uQ9, 102 | .numberBadge-2s8kKX, 103 | .pageControl-1aUwvK .activeButton-1BJAiN, 104 | .progress-3Rbvu0 .progressBar-3u8FBM, 105 | .result-3w1ZcL[style*=background-color], 106 | .selectableItem-1MP3MQ.selected-31soGA, 107 | .switch-3wwwcV.valueChecked-m-4IJZ[style*="rgb(67, 181, 129)"], 108 | .tabBar-ZmDY9v .item-3HknzM[style*="background-color: rgb(67, 181, 129);"], 109 | .botTag-3W9SuW, .listContent-2_qb-y .botText-1526X_, .listContent-2_qb-y .botTagVerified-1klIIt { 110 | background-color: $rb-fg-accent!important 111 | } 112 | .attachButtonPlay-3iJ0mf, 113 | /*server plus and search button is the only thing i can notice*/ 114 | .circleIconButton-jET_ig, 115 | .hasMore-3e72_v, 116 | .hasMoreButton-1MELpI, 117 | .progress-LWvunf .foreground-2EIns2, 118 | .reaction-1hd86g.reactionMe-wv5HKu .reactionCount-2mvXRV, 119 | .searchBar-3dMhjb .searchAnswer-3Dz2-q, 120 | .selectorNitroIcon-3FDeDE, 121 | .statusGreen-168O6Q, 122 | .tier-12tKuZ .tierUnlocked-25K6Kv, 123 | .tierHeaderContent-2-YfvN .tierUnlocked-27DwHo, 124 | .unreadPill-2HyYtt .unreadPillCapStroke-7rkHbg, 125 | .updateIconForeground-3tnNZn, 126 | .wrapper-3WhCwL { 127 | color: $rb-fg-accent; 128 | } 129 | .reaction-1hd86g.reactionMe-wv5HKu { 130 | border-color: transparent !important; 131 | } 132 | .expandedFolderIconWrapper-1xLaU- svg[style="color: rgb(114, 137, 218);"], .theme-dark .wrapper-3WhCwL { 133 | color: $rb-fg-accent!important 134 | } 135 | .checkbox-3kaeSU, 136 | .checkboxInner-3yjcPe, 137 | .checkboxElement-1qV33p:checked + span, 138 | .dropdown-2fxkrS .lookFilled-1h1y05.select-1Pkeg4:focus, 139 | .dropdown-2fxkrS .lookFilled-1h1y05.select-1Pkeg4:hover.selectOpen-hQuR6b, 140 | .dropdown-2fxkrS .lookFilled-1h1y05.selectOpen-hQuR6b, 141 | .emojiPicker-3m1S-j .categories-1feg4n .selected-39BZ4S, 142 | .footer-1fjuF6 .quickMessage-1yeL4E:focus, 143 | .horizontalAutocomplete-L5KnTN .selector-2IcQBU.selectorSelected-1_M1WV, 144 | .imageSelected-4Kl81J, 145 | .input-cIJ7To.focused-1mmYsC, 146 | .input-cIJ7To:focus, 147 | .isUnread-3Ef-o9, 148 | .regionSelectModal-12e-57 .regionSelectModalOption-2DSIZ3:hover, 149 | .select-1Pkeg4.lookFilled-1h1y05.sizeMedium-6vZ9JV.selectOpen-hQuR6b, 150 | .select-1Pkeg4.lookFilled-1h1y05.sizeMedium-6vZ9JV.selectOpen-hQuR6b:hover, 151 | .select-1Pkeg4.lookFilled-1h1y05.sizeMedium-6vZ9JV:focus { 152 | border-color: $rb-fg-accent 153 | } 154 | .lookLink-9FtZy-.colorBrand-3pXr91:hover { 155 | border-bottom: 1px solid $rb-fg-accent; 156 | } 157 | .border-Jn5IOt.video-3SrWSI.speaking-B2MXPi, 158 | .border-Jn5IOt.voice-3bPYC-.speaking-B2MXPi, 159 | .content-ySCtCx .focused-1En8bG::after, 160 | .content-ySCtCx .result-3w1ZcL:hover::after, 161 | .tile-2silOL:hover .sourceThumbnail-14Iubx { 162 | box-shadow: inset 0 0 0 3px $rb-fg-accent; 163 | } 164 | .tabBar-ZmDY9v .item-3HknzM[style*="background-color: rgba(67, 181, 129, 0.2);"] { 165 | background-color: $rb-bg-accent!important; 166 | color: $rb-fg-accent !important 167 | } 168 | .uploadModal-2ifh8j .inner-3nWsbo .file-34mY5K .icon-kyxXVr.image-2yrs5j { 169 | /*upload 2nd screen border around preview*/ 170 | border: 2px solid $rb-fg-accent 171 | } 172 | .uploadModal-2ifh8j .inner-3nWsbo, 173 | .uploadModalIn-1z07Bv .uploadDropModal-2kTwbc .inner-3nWsbo { 174 | border: 2px dashed $rb-fg-accent; 175 | border-radius: 10px; 176 | } 177 | /* i don't use powercord anymore so i can't test this, Mathias says it looks better like this, so ig. 178 | .powercord-spotify-playlist:hover { 179 | background-color: var(--ColTransparent1)!important; 180 | border-color: $rb-fg-accent!important 181 | }*/ 182 | .regionSelect-3lf4eE button, 183 | /* what is .wrapper-2ZbzR9 and .downloadApps-wbBFdZ ?*/ 184 | .wrapper-2ZbzR9 .header-3ZP1MY, 185 | .wrapper-2ZbzR9 .sampleLink-KPFu3I, 186 | .wrapper-2ZbzR9 .slide-2pHaq5 h5 { 187 | color: $rb-fg-accent 188 | } 189 | .regionSelectWrapper-1favwk .regionSelect-3lf4eE:hover .regionSelectInner-24f4Ce, 190 | .regionSelectWrapper-1favwk .regionSelect-3lf4eE:hover button { 191 | border-color: $rb-fg-accent 192 | } 193 | .powercord .check-2by_h9::after { 194 | content: "\f00c"; 195 | color: $rb-fg-accent; 196 | font-weight: 900; 197 | font-family: "Font Awesome 5 Pro", sans-serif!important 198 | } 199 | .container svg path .unreadPillCapStroke-7rkHbg, 200 | .unreadPillCap-3_K2q2 { 201 | color: $rb-fg-accent; 202 | stroke: $rb-fg-accent !important; 203 | } 204 | .flowerStar-1GeTsn path, 205 | .selectorNitroIcon-3FDeDE g path, 206 | .unreadPill-2HyYtt .unreadPillCapStroke-7rkHbg, 207 | .updateIconForeground-3tnNZn { 208 | fill: currentColor 209 | } 210 | .content-1o0f9g, 211 | .mention:hover { 212 | /*fix the -----date----new bar .mention:hover*/ 213 | color: white !important; 214 | } 215 | 216 | //spotify progress bar 217 | .barInner-3NDaY_ { 218 | background-color: $rb-fg-accent !important; 219 | } -------------------------------------------------------------------------------- /discord/reference/old/_buttons.scss.old: -------------------------------------------------------------------------------- 1 | //buttons 2 | .lookFilled-1Gx00P, .lookInverted-2D7oAl, .selectorButtonSelected-t5V9On { 3 | background-color: $rb-fg-accent !important; 4 | color: white !important; 5 | } 6 | .toolbar-2bjZV7 > .lookFilled-1Gx00P { 7 | background-color: transparent !important; 8 | } -------------------------------------------------------------------------------- /discord/reference/old/_call.scss.old: -------------------------------------------------------------------------------- 1 | //call buttons 2 | .colorable-1bkp8v { 3 | background: $rb-bg-primary; 4 | color: white !important; 5 | 6 | .centerIcon-2G6o-T, 7 | .controlIcon-35oS15 { 8 | color: white !important; 9 | } 10 | 11 | &:hover { 12 | background: $rb-bg-secondary-d !important; 13 | } 14 | 15 | &.active-1QRrIS, 16 | &.white-3GPOIp { 17 | background: white !important; 18 | color: $rb-bg-primary !important; 19 | 20 | .centerIcon-2G6o-T, 21 | .controlIcon-35oS15 { 22 | color: $rb-bg-primary !important; 23 | } 24 | } 25 | &.active-1QRrIS:hover, 26 | &.white-3GPOIp:hover, 27 | &.white-3GPOIp.active-1QRrIS:hover { 28 | background: #f2f3f5 !important; 29 | } 30 | } 31 | /*scale the circular calling state*/ 32 | .participant-1lOCsd { 33 | transform: scale(1.3, 1.3) !important; 34 | margin-left: 20px; 35 | margin-right: 20px; 36 | } 37 | -------------------------------------------------------------------------------- /discord/reference/old/_codeblocks.scss.old: -------------------------------------------------------------------------------- 1 | /*----//----CODEBLOCKS----------*/ 2 | .powercord-quickcss { 3 | border-radius: 5px; 4 | overflow: hidden; 5 | border: 1px solid var(--background-tertiary); 6 | background: var(--background-secondary); 7 | } 8 | :root .powercord-quickcss-header, 9 | :root .powercord-quickcss-footer, 10 | .powercord-quickcss .CodeMirror, 11 | .powercord-quickcss .CodeMirror-gutters { 12 | background: transparent !important; 13 | } 14 | 15 | code, .footer-2yA7Ep, 16 | .embedWrapper-lXpS3L .textContainer-C0szpm { 17 | background: $rb-bg-secondary !important; 18 | border-color: rgba(0,0,0,0.2); 19 | } -------------------------------------------------------------------------------- /discord/reference/old/_contextMenus.scss.old: -------------------------------------------------------------------------------- 1 | /*----//----STATUS PICKER AND SERVER CONTEXT MENU----------*/ 2 | .statusItem-33LqPf[aria-label="Hide Game Activity"] svg, 3 | .statusItem-33LqPf[aria-label="Show Game Activity"] svg { 4 | margin-left: -2px; 5 | } 6 | .separator-2I32lJ, .description-2L932D { /*hide the thingers that explain status*/ 7 | display: none; 8 | } 9 | foreignObject[mask="url(#svg-mask-status-offline)"] { /*fixed svg colors for status picker*/ 10 | color: rgb(116, 127, 141) !important; 11 | } 12 | foreignObject[mask="url(#svg-mask-status-idle)"] { 13 | color: rgb(250, 166, 26) !important; 14 | } 15 | foreignObject[mask="url(#svg-mask-status-dnd)"] { 16 | color: rgb(240, 71, 71) !important; 17 | } 18 | foreignObject[mask="url(#svg-mask-status-online)"] { 19 | color: rgb(67, 181, 129) !important; 20 | } 21 | /*boost*/ 22 | path[d="M4 0L0 4V8L4 12L8 8V4L4 0ZM7 7.59L4 10.59L1 7.59V4.41L4 1.41L7 4.41V7.59Z"], 23 | path[d="M2 4.83V7.17L4 9.17L6 7.17V4.83L4 2.83L2 4.83Z"] { 24 | fill: #ff73fa !important; 25 | } 26 | /*leave server*/ 27 | path[d="M10.418 13L12.708 15.294L11.292 16.706L6.586 11.991L11.294 7.292L12.707 8.708L10.41 11H21.949C21.446 5.955 17.177 2 12 2C6.486 2 2 6.487 2 12C2 17.513 6.486 22 12 22C17.177 22 21.446 18.046 21.949 13H10.418Z"] 28 | { 29 | fill: #f04747; 30 | } 31 | div#guild-header-popout-invite-people { color: #677bc4 !important;}/*invite people server context menu*/ 32 | .selected-1Tbx07, .colorDefault-2K3EoJ:active:not(.hideInteraction-1iHO1O) {background-color: var(--background-modifier-selected) !important;} 33 | .colorDefault-2K3EoJ.focused-3afm-j {background-color: var(--background-modifier-selected) !important;} 34 | .colorDanger-2qLCe1.focused-3afm-j {color: var(--interactive-normal) !important;} -------------------------------------------------------------------------------- /discord/reference/old/_emojiPickers.scss.old: -------------------------------------------------------------------------------- 1 | /*----//---- EMOJI PICKERS----------*/ 2 | /*credit to emma🌺#0968 for the code */ 3 | //seriously the code from emma is carrying this shit in 2021. after 2 hours of writing my own implementation i just returned to this one becaue mine didn't work 4 | 5 | /* remove nav*/ 6 | 7 | //stuff im too afraid to remove tbh 8 | .header-1nkwgG, 9 | .header-8ilj5e, 10 | .header-1TOWci { 11 | --webkit-shadow: none; 12 | box-shadow: none !important; 13 | filter: none; 14 | } 15 | .header-8ilj5e { 16 | padding-top: 16px; 17 | } 18 | div#popout_7505 { 19 | top: 500px !important; 20 | right: 265px !important; 21 | } 22 | 23 | .contentWrapper-SvZHNd { 24 | grid-template-rows: auto; 25 | min-height: 442px !important; 26 | 27 | .nav-7UD0KD {display: none !important} 28 | .navList-2UtuhC {display: none;} 29 | } 30 | 31 | .drawerSizingWrapper-27qFHb { 32 | height: 442px !important; 33 | max-width: 424px; 34 | .resizeHandle-3NRr0z { 35 | //disable, resize and reenable this if ur emoji FAT 36 | display: none; 37 | cursor: default; 38 | } 39 | } 40 | 41 | #emoji-picker-tab-panel { 42 | .wrapper-2Gsate.categoryList-2Kzf65{ 43 | transform: rotate(-90deg); 44 | transform: rotate(-90deg) translateX(-143px) translateY(190px); 45 | height: 430px; 46 | padding-top: 0px !important; 47 | 48 | .listItems-1uJgMC .categoryItem-1D0nxC, 49 | .unicodeShortcut-15J8Ck { 50 | transform: rotate(90deg); 51 | } 52 | .unicodeShortcut-15J8Ck, .scroller-3gAZLs, .listItems-1uJgMC { 53 | background: $rb-bg-secondary-d !important; 54 | } 55 | 56 | //spacing between and recent. doesen't work because they are wrapped in listItem and have forced width, height and viewbox. 57 | /*.categoryItemDefaultCategory-aBZ6nJ:last-child { 58 | margin-left: 0.25rem; 59 | margin-right: 0.25rem; 60 | }*/ 61 | } 62 | .emojiPicker-3PwZFl { 63 | grid-template-rows: 46px auto calc(calc(48px * 2) + 8px) !important; 64 | grid-template-columns: 0 auto !important; 65 | position: relative !important; 66 | height: 440px; 67 | width: 428px; 68 | border-radius: 5px !important; 69 | 70 | .emoji-AAbs8r {margin-left: -5px !important;} //emoji preview center it 71 | 72 | .searchBar-5di9mG, .inspector-3LQtX9 { 73 | background: $rb-bg-primary !important; 74 | } 75 | } 76 | } 77 | 78 | #gif-picker-tab-panel { 79 | .searchBar--fTZYa { 80 | background: $rb-bg-primary !important; 81 | } 82 | } 83 | 84 | .container-2XeR5Z, .inner-3ErfOT { 85 | background: $rb-bg-primary !important; 86 | } 87 | 88 | .emojiItem-14v6tW .emojiItemImageLoading-1yEIxx /* Fix Loading Emojis */ { 89 | background-image: none; 90 | background-color: var(--background-primary) !important; 91 | border-radius: 30%; 92 | } -------------------------------------------------------------------------------- /discord/reference/old/_homeScreen.scss.old: -------------------------------------------------------------------------------- 1 | .scroller-2ZPeAD { 2 | background: $rb-bg-primary; 3 | } 4 | 5 | .wrapper-3D2qGf { 6 | background-color: var(--Colleft) !important; 7 | margin: 16px; 8 | border-radius: 10px; 9 | box-shadow: unset; 10 | border: none; 11 | -webkit-border-radius: 10px; 12 | -moz-border-radius: 10px; 13 | -ms-border-radius: 10px; 14 | -o-border-radius: 10px; 15 | transition: all 0.3s; 16 | } 17 | .wrapper-3D2qGf:hover, .wrapper-3D2qGf:hover .section-2gLsgF {background-color: var(--background-secondary-alt) !important;} 18 | .wrapper-3D2qGf:hover .section-2gLsgF {filter: brightness(1.2)} 19 | .peopleListItem-2nzedh {border-top-color: transparent;} 20 | .nowPlayingColumn-2sl4cE {background: var(--background-primary)} 21 | 22 | /*----//----now playing - home - friends - active now----------*/ 23 | .itemCard-v9viV7.wrapper-3D2qGf.outer-1AjyKL { 24 | opacity: 0.83; 25 | border-radius: 7px; 26 | border-width: 1px; 27 | 28 | background: #282828 !important; 29 | border-color: $rb-bg-accent !important; 30 | border-width: 1px !important; 31 | border-style: solid !important; 32 | 33 | .body-1ld4H7:hover { 34 | .section-2gLsgF { 35 | background: $rb-bg-primary !important; 36 | border-color: $rb-bg-primary !important; 37 | } 38 | } 39 | 40 | .section-2gLsgF, .body-1ld4H7, .separator-XqIyoz { 41 | background: $rb-bg-primary; 42 | border-color: $rb-bg-primary; 43 | 44 | &:hover { 45 | background: $rb-bg-primary !important; 46 | border-color: $rb-bg-primary !important; 47 | } 48 | } 49 | 50 | } 51 | .itemCard-v9viV7:hover { 52 | .section-2gLsgF { 53 | background: #282828 !important; 54 | } 55 | } 56 | .itemCard-v9viV7, .section-2gLsgF, .body-1ld4H7, .itemCard-v9viV7 * { 57 | transition: all 0.2s !important; 58 | } 59 | 60 | -------------------------------------------------------------------------------- /discord/reference/old/_jumpBars.scss.old: -------------------------------------------------------------------------------- 1 | /*----//----JUMP BARS----------*/ 2 | .jumpToPresentBar-9P20AM {padding-bottom: 0px;} 3 | .form-2fGMdU:before {display: none;} 4 | 5 | .jumpToPresentBar-9P20AM, 6 | .jumpToPresentBar-G1R9s6, 7 | .newMessagesBar-265mhP, 8 | #NewMessagesBarJumpToNewMessages_803, //just to be sure 9 | .searchBar-3dMhjb, 10 | .searchBarComponent-32dTOx { 11 | background-color: $rb-bg-secondary-d !important; 12 | border: 1px solid rgba(0,0,0,0.2); 13 | opacity: 1; 14 | } 15 | 16 | .innerDisabled-1YTFPN, 17 | .scrollableContainer-2NUZem { 18 | opacity: 1 !important; 19 | } 20 | 21 | .newMessagesBar-265mhP { 22 | box-shadow: none !important; 23 | -webkit-box-shadow: none !important; 24 | 25 | .barButtonAlt-mYL1lj { 26 | color: $rb-fg-accent !important; 27 | } 28 | /**.barButtonMain-3K-jeJ { 29 | color: $Col-dcweb-2; 30 | }*/ 31 | } 32 | .jumpToPresentBar-G1R9s6 { 33 | .barButtonAlt-mYL1lj { 34 | color: $rb-fg-accent !important; 35 | } 36 | /*.barButtonMain-3K-jeJ { 37 | color: $Col-dcweb-2; 38 | }*/ 39 | } 40 | 41 | 42 | 43 | /*reply bar*/ 44 | .clipContainer-eeROt0 { 45 | padding-top: 0px !important; 46 | .container-2fRDfG { 47 | padding-top: 3px; 48 | background-color: $rb-bg-primary !important; 49 | opacity: 1; 50 | border: 1px solid $rb-bg-primary; 51 | } 52 | } 53 | .attachedBars-tZDmyV { 54 | background: transparent; 55 | } 56 | .replyBar-1YLQ2F, .container-2fRDfG { 57 | border-top-left-radius: 6px !important; 58 | border-top-right-radius: 6px !important; 59 | background-color: $rb-bg-primary; 60 | } 61 | /*.replyBar-1YLQ2F { 62 | //border: 1px solid rgba(0,0,0,0.2); 63 | }*/ 64 | .closeButton-37O8QC {color:rgb(240, 71, 71);} 65 | //.name-hpTFiv {color: $Col-dcweb-1} 66 | 67 | /*----//----NEW REPLIES-----------*/ 68 | .repliedMessage-VokQwo.da-repliedMessage { 69 | font-size: inherit !important; 70 | } -------------------------------------------------------------------------------- /discord/reference/old/_layout.scss.old: -------------------------------------------------------------------------------- 1 | .container-3w7J-x, //channels bar 2 | .wrapper-3NnKdC.guilds-1SWlCJ, .scroller-1Bvpku, //server bar //top bar 3 | #app-mount, body, .bg-h5JY_x //app bg idk 4 | { 5 | background-color: $rb-bg-secondary-d !important; 6 | } 7 | .withFrame-haYltI, .wordmark-2iDDfm { 8 | background-color: transparent; 9 | } 10 | 11 | /*----//----applying respecive color variables----------*/ 12 | .scroller-2TZvBN { 13 | /*server selector*/ 14 | background-color: $rb-bg-secondary-d !important; 15 | } 16 | .categoryWrapper-UZ5YNj, 17 | .header-8ilj5e, 18 | .nav-2KnmHb, 19 | .header-1TOWci, 20 | .container-2lgZY8, 21 | .privateChannels-1nO12o, 22 | .container-PNkimc, 23 | .searchBar-6Kv8R2 { 24 | background-color: $rb-bg-secondary-d !important; 25 | } 26 | .inspector-S2gM3e, .input-1Rv96N, .uploadModal-2ifh8j, .footer-3mqk7D.hasSpoilers-1IRtQC, .theme-dark .root-1gCeng, .message-2qRu38 /*color fixes*/ { 27 | background-color: var(--background-primary) !important; 28 | } 29 | 30 | .searchBarComponent-32dTOx, .search-36MZv-, .searchBar-3dMhjb /*search bars*/ { 31 | background-color: var(--background-primary) !important; 32 | } 33 | 34 | .autocompleteInner-zh20B_ , .theme-dark .container-3ayLPN, .jumpToPresentBar-G1R9s6, .barBase-1c2Rfb, 35 | .calendarPicker-2yf6Ci, .calendarPicker-2yf6Ci div, 36 | .scrollableContainer-2NUZem, .container-2fRDfG, /*message box & reply bar*/ 37 | .footer-2gL1pp, .focusLock-Ns3yie *.message-2qRu38 /*delete message ig*/ { 38 | background: $rb-bg-secondary-d !important; 39 | } 40 | 41 | .header-8ilj5e, 42 | .header-1TOWci { 43 | background-color: var(--background-secondary) !important; 44 | } 45 | 46 | .members-1998pB, 47 | .membersWrap-2h-GB4 *:not(.botText-1526X_):not(.botTagVerified-1klIIt):not(.botTag-3W9SuW) { 48 | /*fix bot tag stuff idk + members list*/ 49 | background-color: var(--background-primary) !important; 50 | } 51 | .membersGroup-v9BXpm span:not(.nameAndDecorators-5FJ2dg) { 52 | color: $rb-fg-accent; 53 | } 54 | 55 | //.titleBar-AC4pGV {background-color: var(--ColTitleBar); background:transparent;} 56 | 57 | .scroller-1JbKMe { 58 | background-color: unset; 59 | } 60 | .tabBody-3YRQ8W, .pageWrapper-1PgVDX { 61 | background: var(--background-primary) !important; 62 | } 63 | 64 | //discord home button 65 | #bd-pub-button, 66 | .childWrapper-anI2G9 { 67 | background: $rb-bg-accent; 68 | } 69 | 70 | .theme-dark .option-96V44q:after { 71 | background: transparent !important; 72 | background-color: transparent !important; 73 | background-image: transparent !important; 74 | } 75 | 76 | .connectedAccount-36nQx7 { 77 | border: 1px solid rgba(0, 0, 0, 0.2) !important; 78 | } 79 | 80 | /*color fixes*/ 81 | .button-1YfofB.buttonColor-7qQbGO { 82 | color: #fff !important; 83 | } 84 | 85 | 86 | .headerTop-2y3V6H { 87 | border-bottom: 0px solid transparent !important; 88 | } 89 | .avatar-22FtUu { 90 | border: 6px solid #282828; 91 | } 92 | 93 | /*unread channels*/ 94 | .modeUnread-1qO3K1 .name-23GUGE { 95 | color: var(--text-fix) !important; 96 | } 97 | //unread channel indicators 98 | :root .unread-2lAfLh { 99 | top: 54%; 100 | left: 5px; 101 | width: 6px; 102 | height: 6px; 103 | z-index: 1; 104 | border-radius: 10px; 105 | animation: 2s channel-unread infinite; 106 | } 107 | @keyframes channel-unread { 108 | 0% { 109 | box-shadow: 0 0 0 0 var(--unread-color); 110 | } 111 | 70% { 112 | box-shadow: 0 0 0 4px rgba(0, 0, 0, 0); 113 | } 114 | 100% { 115 | box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); 116 | } 117 | } 118 | 119 | //topic channel mentions 120 | .topic-TCb_qw .channelIcon-1MN1lz { 121 | width: 18px !important; 122 | height: 18px !important; 123 | } -------------------------------------------------------------------------------- /discord/reference/old/_newServerDarkmode.scss.old: -------------------------------------------------------------------------------- 1 | /*----//----remove light theme for new server----*/ 2 | .layer-2KE1M9 .theme-light, .layer-2KE1M9 .theme-light *, .focusLock-Ns3yie, .focusLock-Ns3yie * { /*overwrite light theme colors*/ 3 | --header-primary: #fff; 4 | --header-secondary: #b9bbbe; 5 | --text-normal: #dcddde; 6 | --text-muted: #72767d; 7 | --text-link: #00b0f4; 8 | --channels-default: #8e9297; 9 | --interactive-normal: #b9bbbe; 10 | --interactive-hover: #dcddde; 11 | --interactive-active: #fff; 12 | --interactive-muted: #4f545c; 13 | --background-primary: #262626; 14 | --background-secondary: #222222; 15 | --background-secondary-alt: #292b2f; 16 | --background-tertiary: #202225; 17 | --background-accent: #4f545c; 18 | --background-floating: #18191c; 19 | --background-mobile-primary: #36393f; 20 | --background-mobile-secondary: #2f3136; 21 | --background-modifier-hover: rgba(79, 84, 92, 0.16); 22 | --background-modifier-active: rgba(79, 84, 92, 0.24); 23 | --background-modifier-selected: rgba(79, 84, 92, 0.32); 24 | --background-modifier-accent: hsla(0, 0%, 100%, 0.06); 25 | --background-mentioned: rgba(250, 166, 26, 0.05); 26 | --background-mentioned-hover: rgba(250, 166, 26, 0.08); 27 | --background-message-hover: rgba(4, 4, 5, 0.07); 28 | --background-help-warning: rgba(250, 166, 26, 0.1); 29 | --background-help-info: rgba(0, 176, 244, 0.1); 30 | --scrollbar-thin-thumb: #202225; 31 | --scrollbar-thin-track: transparent; 32 | --scrollbar-auto-thumb: #202225; 33 | --scrollbar-auto-track: #2e3338; 34 | --scrollbar-auto-scrollbar-color-thumb: #202225; 35 | --scrollbar-auto-scrollbar-color-track: #2f3136; 36 | --elevation-stroke: 0 0 0 1px rgba(4, 4, 5, 0.15); 37 | --elevation-low: 0 1px 0 rgba(4, 4, 5, 0.2), 0 1.5px 0 rgba(6, 6, 7, 0.05), 0 2px 0 rgba(4, 4, 5, 0.05); 38 | --elevation-medium: 0 4px 4px rgba(0, 0, 0, 0.16); 39 | --elevation-high: 0 8px 16px rgba(0, 0, 0, 0.24); 40 | --logo-primary: #fff; 41 | --focus-primary: #00b0f4; 42 | --radio-group-dot-foreground: #8ea1e1; 43 | --guild-header-text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4); 44 | --channeltextarea-background: #40444b; 45 | --activity-card-background: #202225; 46 | --textbox-markdown-syntax: #8e9297; 47 | } 48 | .layer-2KE1M9 .theme-light .root-1gCeng {background: var(--background-primary) !important} 49 | .container-UC8Ug1, .regionSelectModal-12e-57 {background: var(--Colleft) !important} 50 | .theme-light .footer-2gL1pp {background-color: var(--background-primary) !important; 51 | box-shadow: none !important; -webkit-box-shadow: none !important;} -------------------------------------------------------------------------------- /discord/reference/old/_quickSwitcher.scss.old: -------------------------------------------------------------------------------- 1 | 2 | .container-3qKHyN { 3 | .quickswitcher-3JagVE { 4 | background: $rb-bg-primary !important; 5 | 6 | .input-2VB9rf { //searchbox 7 | background: #191919; 8 | } 9 | .content-3YMskv { //results list 10 | background: $rb-bg-primary !important; 11 | .result-oB0z--[aria-selected="true"] { 12 | background: $rb-bg-accent !important; 13 | } 14 | } 15 | 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /discord/reference/old/_reset.scss.old: -------------------------------------------------------------------------------- 1 | /*normalizing and reseting related mixins and stuff*/ 2 | @mixin fullscreen($position : absolute) { //fullscreen a div and reset its stuff 3 | height: 100vh !important; 4 | width: 100vw !important; 5 | @include padmar; 6 | 7 | position: $position !important; 8 | top: initial !important; 9 | bottom: initial !important; 10 | left: initial !important; 11 | right: initial !important; 12 | } 13 | 14 | @mixin unUiScale() { //remove ui scale from uiBase 15 | width: 100vw !important; 16 | height: 100vh !important; 17 | max-width: 100vw !important; 18 | max-height: 100vh !important; 19 | transform: scale(1) !important; 20 | } 21 | 22 | @mixin normalize($position : relative, $important : false) { //normalize an elements position, padding and margin 23 | @if $important == true { 24 | position: $position !important; 25 | @include padmar; 26 | } @else { 27 | position: $position; 28 | } 29 | top: initial !important; 30 | bottom: initial !important; 31 | left: initial !important; 32 | right: initial !important; 33 | box-shadow: none !important; 34 | -webkit-box-shadow: none !important; 35 | } 36 | 37 | @mixin unborder() { //remove border 38 | border: 0px solid transparent !important; 39 | } 40 | @mixin untransform($imp: false) { //remove transforms 41 | $suffix: if($imp, "", "!important"); 42 | transform: translate(0, 0) translateX(0) translateY(0) scale(1) $suffix; 43 | } 44 | 45 | //fixes 46 | .matchVote, #matchVoteHolder * { 47 | pointer-events: all !important; 48 | } 49 | .endCard .tabBody { 50 | max-height: 100% !important; 51 | overflow-y: auto !important; 52 | } //fix max height on end tab 53 | 54 | /* Reverts Icon to Old Discord Icon */ 55 | .homeIcon-AaowEC path { 56 | d: path('M 34.8511 36.0025 L 34.8511 36.255 Z M 20.7053 19.9378 C 20.7053 19.9378 19.8437 18.9268 19.1256 18.0334 C 22.2611 17.1634 23.4579 15.2355 23.4579 15.2355 C 22.4765 15.8703 21.5431 16.317 20.7053 16.6227 C 19.5086 17.1164 18.3597 17.4456 17.2347 17.6337 C 14.9369 18.0569 12.8306 17.9393 11.0355 17.6102 C 9.6712 17.3515 8.4983 16.9754 7.517 16.5992 C 6.9665 16.3876 6.3681 16.1289 5.7697 15.7998 C 5.6979 15.7527 5.6261 15.7292 5.5543 15.6822 C 5.5064 15.6587 5.4825 15.6352 5.4585 15.6117 C 5.0277 15.3765 4.7884 15.212 4.7884 15.212 C 4.7884 15.212 5.9373 17.0929 8.9771 17.9864 C 8.259 18.8798 7.3734 19.9378 7.3734 19.9378 C 2.0836 19.7733 0.0731 16.364 0.0731 16.364 C 0.0731 8.7932 3.5197 2.6567 3.5197 2.6567 C 6.9665 0.1174 10.2456 0.1879 10.2456 0.1879 L 10.4849 0.4701 C 6.1767 1.6927 4.19 3.5501 4.19 3.5501 C 4.19 3.5501 4.7166 3.268 5.6022 2.8683 C 8.1632 1.7632 10.1978 1.4575 11.0355 1.387 C 11.1791 1.3635 11.2988 1.34 11.4424 1.34 C 12.9024 1.1519 14.554 1.1049 16.2773 1.293 C 18.5512 1.5516 20.9925 2.2099 23.4818 3.5501 C 23.4818 3.5501 21.5909 1.7867 17.5219 0.5641 L 17.857 0.1879 C 17.857 0.1879 21.1362 0.1174 24.5828 2.6567 C 24.5828 2.6567 28.0295 8.7932 28.0295 16.364 C 28.0295 16.364 25.995 19.7733 20.7053 19.9378 Z M 9.5754 8.9578 C 8.2111 8.9578 7.134 10.1334 7.134 11.5676 C 7.134 13.0019 8.235 14.1774 9.5754 14.1774 C 10.9397 14.1774 12.0168 13.0019 12.0168 11.5676 C 12.0407 10.1334 10.9397 8.9578 9.5754 8.9578 M 18.3118 8.9578 C 16.9475 8.9578 15.8704 10.1334 15.8704 11.5676 C 15.8704 13.0019 16.9714 14.1774 18.3118 14.1774 C 19.6761 14.1774 20.7532 13.0019 20.7532 11.5676 C 20.7532 10.1334 19.6761 8.9578 18.3118 8.9578'); 57 | } 58 | 59 | /*old wordmark because poggers*/ 60 | .wordmark-2iDDfm svg {width: 0px;} 61 | .wordmark-2iDDfm::after { 62 | position: absolute; 63 | font-family: "Discordinated"; 64 | content: "Discord"; 65 | top: 3px; 66 | font-size: 14px; 67 | font-weight: normal; 68 | color: var(--wordmark-text-color); 69 | height: 19px; 70 | width: 235px; 71 | transform: translateY(-8%); 72 | line-height: 20px; 73 | } -------------------------------------------------------------------------------- /discord/reference/old/_scrollbars.scss.old: -------------------------------------------------------------------------------- 1 | /*----//----SCROLLBARS IDK----------*/ 2 | /*scrollbars form Customa - big thanks to emma*/ 3 | ::-webkit-scrollbar { 4 | width: 5px!important; 5 | height: 3px!important; 6 | display: block; 7 | } 8 | ::-webkit-scrollbar-track-piece, 9 | .auto-Ge5KZx::-webkit-scrollbar-track-piece { 10 | background-color: rgba(0, 0, 0, 0) !important; 11 | border: none !important; 12 | } 13 | ::-webkit-scrollbar-thumb, 14 | ::-webkit-scrollbar-track { 15 | border: none !important; 16 | } 17 | ::-webkit-scrollbar-track { 18 | background: transparent !important; 19 | } 20 | 21 | /*show scrollbar only on hover*/ 22 | .messages-3amgkR::-webkit-scrollbar-thumb { 23 | visibility: hidden !important; 24 | } 25 | .messages-3amgkR:hover::-webkit-scrollbar-thumb { 26 | visibility: visible !important; 27 | } 28 | 29 | //make some scroller bgs transparent 30 | .scrollerBase-289Jih::-webkit-scrollbar-track, 31 | .content-3YMskv::-webkit-scrollbar-track, 32 | .scroller-zPkAnE::-webkit-scrollbar-track { 33 | background-color: transparent !important; 34 | background: transparent !important; 35 | } -------------------------------------------------------------------------------- /discord/reference/old/_serverBanner.scss.old: -------------------------------------------------------------------------------- 1 | /*----//----server title bar, banner, channel header----------*/ 2 | .title-3qD0b- { 3 | /*channel title bar hosting search etc.*/ 4 | border-top-left-radius: 15px !important; 5 | } 6 | //server header 7 | .header-2o-2hj, 8 | .searchBar-6Kv8R2, 9 | .container-1taM1r, .container-3w7J-x, .sidebar-2K8pFh{ 10 | z-index: 99; 11 | box-shadow: none; 12 | background-color: var(--ColChannelList); 13 | border-top-right-radius: 8px !important; //add another corner smol 14 | } 15 | .bannerVisible-14J9lQ { /*remove shadow if banner is visible*/ 16 | box-shadow: none; 17 | filter: none; 18 | position: relative; 19 | } 20 | .animatedContainer-1pJv5C { 21 | /*add rounded corner to banner*/ 22 | border-top-right-radius: 8px; 23 | } 24 | .header-2V-4Sw { 25 | -webkit-box-shadow: none !important; 26 | box-shadow: none !important; 27 | } 28 | /* add a small rounded corner thing? to message titlebar*/ 29 | .chat-3bRxxu, 30 | .container-1D34oG, 31 | .libraryHeader-3g95kE, 32 | .container-1r6BKw, 33 | .homeWrapper-3-Wh5T 34 | .title-3qD0b-, 35 | .applicationStore-1pNvnv, 36 | .scroller-1d5FgU, 37 | .pageHeaderDrag-OPlmbm, 38 | .pageWrapper-1PgVDX { 39 | border-top-left-radius: 10px !important; 40 | } 41 | .scroller-2FKFPG.scroller-2TZvBN { 42 | border-top-left-radius: 0px !important; 43 | } -------------------------------------------------------------------------------- /discord/reference/old/_tweaks.scss.old: -------------------------------------------------------------------------------- 1 | //small tweaks and snippets you can toggle on and off 2 | 3 | //.wrapper-1F5TKx[aria-hidden="true"] { visibility: hidden;} /*placeholder messages delet*/ 4 | .searchResultsWrap-3-pOjs{ width: 500px; } /*Wider search results section */ 5 | .verified-1eC5dy:not(.disableColor-MwOAZf) > svg path { fill: #7289DA} /*Bring Back Blurple Verified Badge */ 6 | //.expandedFolderBackground-2sPsd-, .folder-21wGz3 {background-color: var(--background-primary);transition: all 0.3s;} /*server folder*/ 7 | .recentMentionsPopout-3rCiI6, .messagesPopoutWrap-1MQ1bW {max-height: 93vh !important;} /*inbox*/ 8 | .sidebar-2K8pFh {background-color: var(--Colleft);} /*new server discovery */ 9 | .searchBarComponent-32dTOx, .search-36MZv-, .searchBar-3dMhjb {background-color: var(--background-primary) !important} /*search bars*/ 10 | .botTagVerified-1klIIt {border-top-left-radius: 3px;border-bottom-left-radius: 3px;} /*bot tag fix*/ 11 | .jumpToPresentBar-G1R9s6, .barBase-1c2Rfb {width: 88%; margin-left: auto; margin-right: auto;} /*bottom jump to present bar is slightly shorter*/ 12 | .embedSuppressButton-1FonMn {cursor: pointer;display: none;} /*hide remove embed button*/ 13 | .input-2VB9rf {Background-Color: #36383d;} /*ctrl + K quick switcher made the input a bit darker*/ 14 | .bodyTitle-Y0qMQz {text-transform: capitalize;font-size: 15px;} /*change some text from all caps to only fist letter cap*/ 15 | .protip-YaFfgO/*, .protip-1b9XPC*/ {display: none;} /*hide protips bc im a pro*/ 16 | * {outline: 0px solid transparent !important;} /*remove all outlines just because chrome*/ 17 | [aria-label="Send a gift"] {display: none;} /*hide gift nitro button*/ 18 | [aria-label="Open GIF picker"] {margin-top: 3px;} /*gif picker realign*/ 19 | [href="https://support.discord.com"] {display: none !important } /*hide help*/ 20 | 21 | /*invert plus and minus*/ 22 | img[src="/assets/9a43e631d506ae4818ecefc825dc02ad.svg"], 23 | img[src="/assets/13c8662cff8e029799a35878b56e23eb.svg"] { 24 | filter: invert(1); 25 | } 26 | 27 | /*calendar*/ 28 | .datePicker--XZbmJ .calendarPicker-2yf6Ci .react-datepicker__day:hover {background: var(--ColAccent) !important;} 29 | 30 | /*fix emoji suggestions not being scrollable*/ 31 | .autocompleteInner-zh20B_ { 32 | overflow-y: auto; 33 | max-height: 75vh; 34 | } 35 | /*nicer connected accounts*/ 36 | .connectedAccount-36nQx7 { 37 | background-color: var(--background-tertiary); 38 | border: 0 !important; 39 | } 40 | /* Fix fade thingy for good looking titlebar snippet */ 41 | .children-19S4PO:after { 42 | background: transparent !important; 43 | } 44 | .searchResultMessage-1fxgXh.hit-1fVM9e > div > .contents-2mQqc9 img, 45 | div[id^=pinned-messages-] .contents-2mQqc9 img { 46 | top: 15px 47 | } 48 | /*cool gradient user popout bgs*/ 49 | .headerPlaying-j0WQBV, .topSectionPlaying-1J5E4n { 50 | z-index: 1; 51 | background-image: linear-gradient(to top right,#60adff,#4453fc); 52 | } 53 | .headerSpotify-zpWxgT, .topSectionSpotify-1lI0-P { 54 | z-index: 1; 55 | background-image: linear-gradient(to top right,#50e498,#30ae5d); 56 | } 57 | 58 | /*css snipet also from the person above - old streamin color*/ 59 | :root .headerStreaming-2FjmGz{ 60 | background: #593695 !important; 61 | } 62 | 63 | 64 | .userInfoViewing-16kqK3 .flex-1xMQg5 .flexChild-faoVW3 .marginBottom20-32qID7 + div .selectable-2GY4I1 { /*blur email until hover*/ 65 | filter: blur(5px); 66 | transition: filter .5s; 67 | } 68 | 69 | /*small tweaks*/ 70 | .selected-1Tbx07, .colorDefault-2K3EoJ.focused-3afm-j {background-color: var(--background-modifier-selected) !important;} 71 | .topSectionNormal-2-vo2m {background-color: #202225 !important;} 72 | .body-3ND3kc, .theme-dark .body-3iLsc4, .theme-dark .footer-1fjuF6, .theme-dark .footer-2gL1pp, .section-2gLsgF, .headerNormal-1l1Znk, .headerTop-2y3V6H {background-color: #282828;} 73 | 74 | //goosemod spotify 75 | .gm-spotify-controls-playback-bar { 76 | margin-left: .25rem; 77 | margin-right: .25rem; 78 | border-radius: 2rem; 79 | 80 | --interactive-active: #{$rb-fg-accent}; 81 | 82 | .gm-spotify-controls-playback-thumb { 83 | background: $rb-fg-accent !important; 84 | } 85 | } -------------------------------------------------------------------------------- /discord/reference/old/_userArea.scss.old: -------------------------------------------------------------------------------- 1 | /*----//---- MUTE, DEAFEN AND DISCONNECT BUTTON AREA----------*/ 2 | .panels-j1Uci_ { 3 | /*username, mute, deafen and settings panel*/ 4 | background-color: $rb-bg-secondary-d; 5 | } 6 | /*mute, deafen and settings button hover to circle - Also inspired from Customa*/ 7 | .container-3baos1 button:not([aria-label=Unmute]):not([aria-label=Undeafen]):hover { 8 | border-radius: 50%; 9 | } 10 | 11 | // yeet border bottom from userArea 12 | .activityPanel-28dQGo, .container-1giJp5 { 13 | border-bottom: none !important; 14 | } 15 | 16 | /*----//----MESSAGE INPUT BOX AND RELATED CHANGES----------*/ 17 | .scrollableContainer-2NUZem { /*main input bar*/ 18 | border-radius: 25px; 19 | background: $col-dcweb-6; 20 | border: 1px solid rgba(0,0,0,0.2); 21 | } 22 | .channelTextArea-rNsIhG {background: transparent;} 23 | .attachButton-2WznTc, 24 | .attachWrapper-2TRKBi { border-right: none;} /*remove divider from attachbutton*/ 25 | .buttons-3JBrkn {margin-right: 5px !important;} /*add back margin to emoji button*/ 26 | 27 | 28 | .autocomplete-1vrmpx {background-color: $rb-bg-secondary-d;} /*autocomplete*/ 29 | 30 | .inner-MADQqc, .scrollableContainer-2NUZem { 31 | background-color: $rb-bg-secondary-d; 32 | } -------------------------------------------------------------------------------- /discord/reference/old/_userPopout.scss.old: -------------------------------------------------------------------------------- 1 | /*----//----USER POPOUT----------*/ 2 | /*role pills*/ 3 | .role-2irmRk{ 4 | position: relative; 5 | overflow: hidden; 6 | z-index: 1; 7 | border: none; 8 | padding: 5px; 9 | 10 | border-radius: 100px; 11 | } 12 | .roleCircle-3xAZ1j::before{ 13 | content: ""; 14 | position: absolute; 15 | top:0; 16 | left:0; 17 | width:100%; 18 | height: 100%; 19 | background: inherit; 20 | opacity: .2; 21 | z-index: -1; 22 | pointer-events: none; 23 | } 24 | .roleCircle-3xAZ1j { 25 | margin-left: 2px; 26 | } 27 | .footer-1fjuF6{border-top: none;} 28 | .note-3kmerW textarea:focus { background-color: transparent;} /* fix edit note profile idk*/ 29 | 30 | /*user popout*/ 31 | .userPopout-xaxa6l, .footer-3UKYOU, .bodyInnerWrapper-26fQXj { background-color: #282828; } 32 | .input-2_SIlA, .connectedAccount-2Jb-Z0 { background-color: $rb-bg-secondary-d; } 33 | 34 | .avatarWrapper-3r9PdD, .avatar-37jOim { 35 | background: #282828; 36 | border-color: #282828; 37 | } 38 | .aboutMeSection-3bipSD { background: #282828 !important; } -------------------------------------------------------------------------------- /discord/reference/old/_userProfile.scss.old: -------------------------------------------------------------------------------- 1 | /*----//----PROFILE BUTTONS (SEND MESSAGE, FRIEND REQUEST etc.)----------*/ 2 | .lookFilled-1Gx00P.colorGreen-29iAKY {background-color: $Col-dcweb-1;} 3 | .lookFilled-1Gx00P.colorGreen-29iAKY:hover {background-color: $Col-dcweb-1; opacity: 0.95;} 4 | .lookFilled-1Gx00P.colorGreen-29iAKY:active {background-color: $Col-dcweb-1; opacity: 0.90;} 5 | .lookFilled-1Gx00P.colorGreen-29iAKY:disabled {background-color: $Col-dcweb-1 ;color: #eee;} 6 | .lookInverted-2D7oAl.colorBrand-3pXr91:hover {background-color: #fff; opacity: 0.75;} 7 | .lookInverted-2D7oAl.colorBrand-3pXr91:active {background-color: #fff; opacity: 0.70;} 8 | .lookInverted-2D7oAl.colorBrand-3pXr91:disabled {background-color: rgb(255, 255, 255);} 9 | .lookInverted-2D7oAl.colorGreen-29iAKY:hover {background-color: #fff; opacity: 0.75;} 10 | .lookInverted-2D7oAl.colorGreen-29iAKY:active {background-color: #fff; opacity: 0.70;} 11 | 12 | .connectedAccount-2Jb-Z0 { 13 | background: $rb-bg-secondary-d; 14 | } 15 | 16 | /*user profile*/ 17 | .nameTag-ECvD8P, .topSection-y3p-_D, .infoScroller-1Qu30O, .listScroller-3GmIYj, .avatar-AvHqJA { 18 | background-color: var(--background-primary); 19 | } 20 | .avatar-AvHqJA, .header-4zuFdR { 21 | background: $rb-bg-primary !important; 22 | border-color: $rb-bg-primary !important; 23 | } -------------------------------------------------------------------------------- /discord/reference/old/_utils.scss.old: -------------------------------------------------------------------------------- 1 | /*general utility mixins and other stuff*/ 2 | 3 | //few useful mixins 4 | @mixin padmar($padding: 0, $margin: 0) { //remove or set the padding and margin at the same time 5 | padding: $padding !important; 6 | margin: $margin !important; 7 | } 8 | 9 | @mixin flex($align: center, $justify: center, $direction : row) { //apply flexbox to an element. center by default 10 | display: flex; 11 | align-items: $align; 12 | justify-content: $justify; 13 | flex-direction: $direction; 14 | } 15 | 16 | @mixin coverarea($important : false) { //cover the whole area 17 | @if $important { 18 | width: 100% !important; 19 | height: 100% !important; 20 | max-width: 100% !important; 21 | max-height: 100% !important; 22 | } @else { 23 | width: 100%; 24 | height: 100%; 25 | max-width: 100% ; 26 | max-height: 100% ; 27 | } 28 | } 29 | @mixin fs($fontsize, $important : false) { //font-size and line-height 30 | @if $important { 31 | font-size: $fontsize !important; 32 | line-height: $fontsize !important; 33 | } @else { 34 | font-size: $fontsize; 35 | line-height: $fontsize; 36 | } 37 | } 38 | //background-image ones 39 | @mixin bg-image-icon($url) { 40 | background-position: center !important; 41 | background-repeat: no-repeat !important; 42 | background-size: $bg-image-icon-size !important; 43 | background-image: url($url) !important; 44 | } 45 | @mixin bg-image-contain() { 46 | background-size: contain; 47 | background-position: center; 48 | background-repeat: no-repeat !important; 49 | } -------------------------------------------------------------------------------- /discord/reference/old/_variables.scss.old: -------------------------------------------------------------------------------- 1 | $rb-bg-primary: #262626; 2 | $rb-bg-primarya: #262626de; 3 | $rb-bg-secondary: #232323; 4 | $rb-bg-secondary-d: #222222; 5 | $rb-bg-tertiary: #212121; 6 | $rb-bg-4: #393939; 7 | $rb-bg-5: #313131; 8 | 9 | $rb-bg-accent: rgba(165, 117, 98, 0.2); 10 | $rb-bg-accent1: rgba(165, 117, 98, 0.1); 11 | $rb-fg-accent: #a57562; 12 | $rb-text: #a3a5aa; 13 | 14 | $Col-dcweb-1: #7289DA; /*blue*/ 15 | $Col-dcweb-2: #99AAB5; /*grey*/ 16 | $Col-dcweb-3: #2C2F33; /*more grey*/ 17 | $Col-dcweb-4: #23272A; /*not quite black*/ 18 | $col-dcweb-5: #36393f; /*original grey color from discord*/ 19 | $col-dcweb-6: #40444b; /*original chatbox color from discord*/ 20 | $col-dcweb-7: #2f3136; /*original embeds color*/ 21 | 22 | /*from app*/ 23 | $Col-dcapp-1: var(--background-primary); /*main chat window*/ 24 | $Col-dcapp-2: var(--background-secondary); /*channel list*/ 25 | $Col-dcapp-3: var(--background-tertiary); /*server selector bg*/ 26 | 27 | /*fron slate*/ 28 | $slate-background-light: #2f363d; 29 | $slate-background: #24292e; 30 | $slate-background-alt: #2a3036; 31 | $slate-background-dark: #1d2125; 32 | 33 | /*form last time*/ 34 | $Colr: #1d1e1f; /*messenger grey bg*/ 35 | 36 | /*my color variables*/ 37 | $Col1: var(--Col-dcweb-4); 38 | $Col2: var(--background-secondary); 39 | $Col3: var(--Colr); 40 | $Col4: var(--Col-dcweb-1); 41 | $Col5: #121212; 42 | 43 | //misc 44 | 45 | $border-color: #333131; 46 | $br-small: 5px; //border radius small 47 | $br-big: 1rem; //border radius big 48 | $bg-image-icon-size: 50%; 49 | 50 | $main-row-gap: 1.5vh; 51 | $col-spacer: 1rem; -------------------------------------------------------------------------------- /discord/reference/old/main.scss.old: -------------------------------------------------------------------------------- 1 | @import url("https://kckarnige.github.io/femboi_owo/discord-font.css"); 2 | 3 | @import 'base/variables'; 4 | @import 'base/reset'; 5 | @import 'utils'; 6 | @import 'layout'; 7 | 8 | @import 'components/codeblocks'; 9 | @import 'components/contextMenus'; 10 | @import 'components/scrollbars'; 11 | @import 'components/buttons'; 12 | 13 | @import 'modules/newServerDarkmode'; 14 | @import 'modules/homeScreen'; 15 | @import 'modules/quickSwitcher'; 16 | @import 'modules/serverBanner'; 17 | @import 'modules/userArea'; 18 | @import 'modules/emojiPickers'; 19 | @import 'modules/jumpBars'; 20 | @import 'modules/accentColor'; 21 | @import 'modules/userPopout'; 22 | @import 'modules/userProfile'; 23 | @import 'modules/call'; 24 | 25 | @import 'tweaks'; 26 | 27 | :root, .theme-dark, .focusLock-Ns3yie * { 28 | /*gruvbox override*/ 29 | --Colleft: var(--slate-background); 30 | --background-primary: var(--slate-background-light); 31 | --background-primary: #262626; 32 | --Colleft: #222222; 33 | --background-secondary: var(--Colleft); 34 | --ColAccent: #a57562; 35 | --ColAccentAlpha: RGBA(165, 117, 98, 0.2); 36 | 37 | /*set respecitve colors to Colleft - ignore*/ 38 | --ColServerSelBG: var(--Colleft); 39 | --ColChannelList: var(--Colleft); 40 | --ColTitleBar: var(--Colleft); 41 | --ColMemberList:var(--background-primary); 42 | --ColLink: var(--ColAccent); 43 | --text-link: var(--ColLink); 44 | 45 | --text-fix: #a3a5aa; 46 | 47 | --text-normal: var(--text-fix); 48 | --header-primary: var(--ColAccent); 49 | } 50 | 51 | ::selection {background-color: $rb-bg-accent !important;} -------------------------------------------------------------------------------- /discord/reference/rosebox.css: -------------------------------------------------------------------------------- 1 | /** 2 | * @name rosebox 3 | * @author KraXen72 4 | * @version 6 5 | * @description rosebox discord theme 6 | * @source https://github.com/KraXen72/rosebox 7 | */ 8 | 9 | /*@import url('https://kraxen72.github.io/rosebox/discord/main.css'); 10 | 11 | .emojiItemDisabled-1FvFuF {filter: grayscale(0)}*/ 12 | 13 | @import url("https://kraxen72.github.io/harmony-discord/main.css"); 14 | :root, .theme-dark, .focusLock-Ns3yie * { 15 | /*gruvbox override*/ 16 | --Colleft: var(--slate-background); 17 | --background-primary: var(--slate-background-light); 18 | --background-primary: #262626; 19 | --Colleft: #222222; 20 | --background-secondary: var(--Colleft); 21 | --ColAccent: #a57562; 22 | --ColAccentAlpha: RGBA(165, 117, 98, 0.2); 23 | 24 | /*set respecitve colors to Colleft - ignore*/ 25 | --ColServerSelBG: var(--Colleft); 26 | --ColChannelList: var(--Colleft); 27 | --ColTitleBar: var(--Colleft); 28 | --ColMemberList:var(--background-primary); 29 | --ColLink: var(--ColAccent); 30 | --text-link: var(--ColLink); 31 | 32 | --text-fix: #a3a5aa; 33 | 34 | --text-normal: var(--text-fix); 35 | --header-primary: var(--ColAccent); 36 | } 37 | 38 | .searchBarComponent-32dTOx, .search-36MZv-, .searchBar-3dMhjb /*search bars*/ 39 | {background-color: var(--background-primary) !important;} 40 | 41 | .inspector-S2gM3e, .input-1Rv96N, .uploadModal-2ifh8j, .footer-3mqk7D.hasSpoilers-1IRtQC, .theme-dark .root-1gCeng, .message-2qRu38 /*color fixes*/ 42 | {background-color: var(--background-primary) !important} 43 | 44 | .lookFilled-1Gx00P.colorBrand-3pXr91 /*stream button*/ 45 | {background-color: var(--ColAccent) !important;} 46 | 47 | /*all Colleft stuff*/ 48 | 49 | .autocompleteInner-zh20B_ , .theme-dark .container-3ayLPN, .jumpToPresentBar-G1R9s6, .barBase-1c2Rfb, 50 | .calendarPicker-2yf6Ci, .calendarPicker-2yf6Ci div, 51 | .scrollableContainer-2NUZem, .container-2fRDfG, /*message box & reply bar*/ 52 | .footer-2gL1pp, .focusLock-Ns3yie *.message-2qRu38 /*delete message ig*/ 53 | {background: var(--Colleft) !important;} 54 | 55 | .attachButtonInner-PQjIyk svg path {fill: var(--col-mute);} /* attach button the same color */ 56 | 57 | .theme-dark .option-96V44q:after { 58 | background: transparent !important; 59 | background-color: transparent !important; 60 | background-image: transparent !important; 61 | } 62 | 63 | /*calendar*/ 64 | .datePicker--XZbmJ .calendarPicker-2yf6Ci .react-datepicker__day:hover {background: var(--ColAccent) !important;} 65 | 66 | ::selection {background-color: var(--ColAccentAlpha) !important;} 67 | 68 | /*small tweaks*/ 69 | .selected-1Tbx07, .colorDefault-2K3EoJ.focused-3afm-j {background-color: var(--background-modifier-selected) !important;} 70 | .topSectionNormal-2-vo2m {background-color: #202225 !important;} 71 | .body-3ND3kc, .theme-dark .body-3iLsc4, .theme-dark .footer-1fjuF6, .theme-dark .footer-2gL1pp, .section-2gLsgF, 72 | .headerNormal-1l1Znk, 73 | .headerTop-2y3V6H 74 | {background-color: #282828;} 75 | .aboutMeSection-3bipSD { 76 | background: #282828 !important; 77 | } 78 | 79 | .connectedAccount-36nQx7 {border: 1px solid rgba(0,0,0,0.2) !important;} 80 | 81 | /*color fixes*/ 82 | .button-1YfofB.buttonColor-7qQbGO {color: #fff !important; } 83 | .modeUnread-1qO3K1 .name-23GUGE {color: var(--text-fix) !important;} /*unread channels*/ 84 | 85 | .headerTop-2y3V6H { border-bottom: 0px solid transparent !important; } 86 | .avatar-22FtUu { border: 6px solid #282828; } 87 | 88 | /*user popout*/ 89 | .userPopout-xaxa6l, .footer-3UKYOU, .bodyInnerWrapper-26fQXj { background-color: #282828; } 90 | .input-2_SIlA, .connectedAccount-2Jb-Z0 { background-color: var(--Colleft); } 91 | 92 | /*user profile*/ 93 | .nameTag-ECvD8P, .topSection-y3p-_D, .infoScroller-1Qu30O, .listScroller-3GmIYj { 94 | background-color: var(--background-primary); 95 | } 96 | 97 | -------------------------------------------------------------------------------- /discord/scripts/build.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs') 2 | const colors = require('colors') 3 | 4 | const pathToSettingsJSON = `C:\\Users\\Nex\\AppData\\Roaming\\Discord\\settings.json` 5 | const importLink = `@import url('https://kraxen72.github.io/rosebox/discord/dist/main.css');` 6 | 7 | let contents = JSON.parse(fs.readFileSync(pathToSettingsJSON, 'utf8')) 8 | contents.openasar.css = importLink 9 | fs.writeFileSync(pathToSettingsJSON, JSON.stringify(contents)) 10 | 11 | console.log(`sucessfully set openasar's css to '${importLink}'`.green) -------------------------------------------------------------------------------- /discord/scripts/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "rosebox-discord-css", 3 | "version": "3.28.0", 4 | "description": "scripts for rosebox scss", 5 | "main": "watcher.js", 6 | "scripts": { 7 | "dev": "node ./watcher.js", 8 | "build": "node ./build.js", 9 | "bump": "pnpm version patch && pnpm run dev", 10 | "selectors": "node ./updateSelectors.js" 11 | }, 12 | "repository": "https://github.com/KraXen72/rosebox", 13 | "author": "KraXen72", 14 | "license": "MIT", 15 | "dependencies": { 16 | "chokidar": "^3.5.3", 17 | "colors": "^1.4.0", 18 | "css-simple-parser": "^3.0.0" 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /discord/scripts/pnpm-lock.yaml: -------------------------------------------------------------------------------- 1 | lockfileVersion: '9.0' 2 | 3 | settings: 4 | autoInstallPeers: true 5 | excludeLinksFromLockfile: false 6 | 7 | importers: 8 | 9 | .: 10 | dependencies: 11 | chokidar: 12 | specifier: ^3.5.3 13 | version: 3.5.3 14 | colors: 15 | specifier: ^1.4.0 16 | version: 1.4.0 17 | css-simple-parser: 18 | specifier: ^3.0.0 19 | version: 3.0.0 20 | 21 | packages: 22 | 23 | anymatch@3.1.3: 24 | resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==} 25 | engines: {node: '>= 8'} 26 | 27 | binary-extensions@2.2.0: 28 | resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==} 29 | engines: {node: '>=8'} 30 | 31 | braces@3.0.2: 32 | resolution: {integrity: sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==} 33 | engines: {node: '>=8'} 34 | 35 | chokidar@3.5.3: 36 | resolution: {integrity: sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==} 37 | engines: {node: '>= 8.10.0'} 38 | 39 | colors@1.4.0: 40 | resolution: {integrity: sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==} 41 | engines: {node: '>=0.1.90'} 42 | 43 | css-simple-parser@3.0.0: 44 | resolution: {integrity: sha512-vCQf8BH7UO+HqA4DG1gkYzLVlRSLHD64leDWmfBrZZnZuHyGcTDFs6OqYNTDV36n4JbKMA6v4DnJeNRVXdk2nw==} 45 | 46 | fill-range@7.0.1: 47 | resolution: {integrity: sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==} 48 | engines: {node: '>=8'} 49 | 50 | fsevents@2.3.3: 51 | resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==} 52 | engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0} 53 | os: [darwin] 54 | 55 | glob-parent@5.1.2: 56 | resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==} 57 | engines: {node: '>= 6'} 58 | 59 | is-binary-path@2.1.0: 60 | resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==} 61 | engines: {node: '>=8'} 62 | 63 | is-extglob@2.1.1: 64 | resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==} 65 | engines: {node: '>=0.10.0'} 66 | 67 | is-glob@4.0.3: 68 | resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==} 69 | engines: {node: '>=0.10.0'} 70 | 71 | is-number@7.0.0: 72 | resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==} 73 | engines: {node: '>=0.12.0'} 74 | 75 | normalize-path@3.0.0: 76 | resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==} 77 | engines: {node: '>=0.10.0'} 78 | 79 | picomatch@2.3.1: 80 | resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==} 81 | engines: {node: '>=8.6'} 82 | 83 | readdirp@3.6.0: 84 | resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==} 85 | engines: {node: '>=8.10.0'} 86 | 87 | string-indexes@2.0.0: 88 | resolution: {integrity: sha512-ATTNLgMvr27CtHUsOslQrMMR9+T3py6hhwKJtJPhu0YoRsiG7ybim70Kvdw/qk3Ill0sp0jzlxS5ILdBA3LW6w==} 89 | 90 | to-regex-range@5.0.1: 91 | resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==} 92 | engines: {node: '>=8.0'} 93 | 94 | snapshots: 95 | 96 | anymatch@3.1.3: 97 | dependencies: 98 | normalize-path: 3.0.0 99 | picomatch: 2.3.1 100 | 101 | binary-extensions@2.2.0: {} 102 | 103 | braces@3.0.2: 104 | dependencies: 105 | fill-range: 7.0.1 106 | 107 | chokidar@3.5.3: 108 | dependencies: 109 | anymatch: 3.1.3 110 | braces: 3.0.2 111 | glob-parent: 5.1.2 112 | is-binary-path: 2.1.0 113 | is-glob: 4.0.3 114 | normalize-path: 3.0.0 115 | readdirp: 3.6.0 116 | optionalDependencies: 117 | fsevents: 2.3.3 118 | 119 | colors@1.4.0: {} 120 | 121 | css-simple-parser@3.0.0: 122 | dependencies: 123 | string-indexes: 2.0.0 124 | 125 | fill-range@7.0.1: 126 | dependencies: 127 | to-regex-range: 5.0.1 128 | 129 | fsevents@2.3.3: 130 | optional: true 131 | 132 | glob-parent@5.1.2: 133 | dependencies: 134 | is-glob: 4.0.3 135 | 136 | is-binary-path@2.1.0: 137 | dependencies: 138 | binary-extensions: 2.2.0 139 | 140 | is-extglob@2.1.1: {} 141 | 142 | is-glob@4.0.3: 143 | dependencies: 144 | is-extglob: 2.1.1 145 | 146 | is-number@7.0.0: {} 147 | 148 | normalize-path@3.0.0: {} 149 | 150 | picomatch@2.3.1: {} 151 | 152 | readdirp@3.6.0: 153 | dependencies: 154 | picomatch: 2.3.1 155 | 156 | string-indexes@2.0.0: {} 157 | 158 | to-regex-range@5.0.1: 159 | dependencies: 160 | is-number: 7.0.0 161 | -------------------------------------------------------------------------------- /discord/scripts/updateSelectors.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs') 2 | const path = require('path') 3 | 4 | const banner = `// map placeholders to classes, so when discord changes the class names i only have to fix them in one place 5 | // in 2023 this theme was re-written to use as little class selectors as possible, so it is easier to maintain 6 | // credits: https://github.com/ClearVision/ClearVision-v6/blob/master/lib/selectors/selectorPlaceholders.scss 7 | // this repo uses a script (scripts/updateSelectors.js) to fetch these mappings into lib/_mappings.scss 8 | // unused mappings don't get included in the theme, due to the way they are written 9 | 10 | ` 11 | 12 | // process.env['NODE_TLS_REJECT_UNAUTHORIZED'] = '0'; 13 | 14 | fetch("https://raw.githubusercontent.com/ClearVision/ClearVision-v6/master/lib/selectors/selectorPlaceholders.scss") 15 | .then(data => data.text()) 16 | .then(text => { 17 | const scssContent = banner + text; 18 | fs.writeFileSync(path.resolve(__dirname, '..', 'lib', '_mappings.scss'), scssContent); 19 | console.log("written new class mappings"); 20 | 21 | return scssContent; 22 | }) 23 | .then(findDuplicateSelectors) 24 | .then(duplicateSelectors => { 25 | console.log("duplicate selectors:", duplicateSelectors); 26 | }) 27 | 28 | async function findDuplicateSelectors(_mappingsCSS) { 29 | const Parser = (await import('css-simple-parser')).default; 30 | 31 | const mappingsCSS = removeComments(_mappingsCSS) 32 | const rbMappingsCSS = removeComments(fs.readFileSync( 33 | path.resolve(__dirname, '..', 'lib', '_rbMappings.scss'), 34 | 'utf-8' 35 | )); 36 | 37 | const clearvisSelectors = await getCSSSelectorSet(Parser, mappingsCSS) 38 | const rbSelectors = await getCSSSelectorSet(Parser, rbMappingsCSS) 39 | 40 | const diff = Array.from(clearvisSelectors.intersection(rbSelectors)) 41 | return diff 42 | } 43 | 44 | function removeComments(scss) { 45 | return scss.split('\n').filter(line => !line.startsWith("//")).join('\n'); 46 | } 47 | 48 | async function getCSSSelectorSet(parser, scss) { 49 | const selectorSet = new Set() 50 | const ast = parser.parse(scss) 51 | parser.traverse(ast, (node) => { 52 | selectorSet.add(node.selector.trim()) 53 | }) 54 | return selectorSet 55 | } -------------------------------------------------------------------------------- /discord/scripts/watcher.js: -------------------------------------------------------------------------------- 1 | const chokidar = require('chokidar'); 2 | const fs = require('fs'); 3 | const path = require('path'); 4 | const colors = require('colors') 5 | 6 | const dist = path.resolve(__dirname, "..", "dist") 7 | const compiledCSSPath = path.resolve(dist, "main.css") 8 | const MODES = ["quickcss", "userstyle"] // quickcss || settingsjson || userstyle 9 | const packageJson = JSON.parse(fs.readFileSync('./package.json')) 10 | 11 | // const pathToQuickCSSFile = `C:\\Users\\Nex\\AppData\\Roaming\\Vencord\\settings\\quickCss.css` 12 | // const pathToSettingsJSON = `C:\\Users\\Nex\\AppData\\Roaming\\Discord\\settings.json` 13 | 14 | const quickCssOutPaths = [ 15 | `/home/nex/.config/Vencord/settings/quickCss.css`, 16 | '/home/nex/.var/app/dev.vencord.Vesktop/config/vesktop/settings/quickCss.css', 17 | `/home/nex/.config/vesktop/settings/quickCss.css`, 18 | ] 19 | const pathToSettingsJSON = `/home/nex/.config/discord/settings.json` 20 | const pathToUserStyle = path.resolve(dist, "roseboxUserStyle.user.css") 21 | 22 | const userStyleHeader = [ 23 | '/* ==UserStyle==', 24 | '@name rosebox discord userstyle', 25 | '@namespace https://github.com/KraXen72/rosebox', 26 | `@version ${packageJson.version}`, 27 | '@description the rosebox discord theme as a userstyle', 28 | '@author KraXen72 and contributors', 29 | '==/UserStyle== */', 30 | ] 31 | 32 | const WAIT_MS = 500 33 | console.log(`${getTimestamp()}watching main.css`.cyan) 34 | 35 | function fileWriteCallback() { 36 | let contents = fs.readFileSync(compiledCSSPath, 'utf8') 37 | if (MODES.includes('settingsjson')) { 38 | let settingsJSON = JSON.parse(fs.readFileSync(pathToSettingsJSON)) 39 | settingsJSON.openasar.css = contents.replaceAll('"', "\"") 40 | fs.writeFileSync(pathToSettingsJSON, JSON.stringify(settingsJSON)) 41 | } 42 | if (MODES.includes("userstyle")) { 43 | const outputCSS = [...userStyleHeader, '', '@-moz-document domain("discord.com") {', contents, '}'].join("\n") 44 | fs.writeFileSync(pathToUserStyle, outputCSS) 45 | } 46 | if (MODES.includes("quickcss") || MODES.length === 0) { 47 | for (p of quickCssOutPaths) { 48 | if (fs.existsSync(p)) fs.writeFileSync(p, contents) 49 | } 50 | } 51 | console.log(`${getTimestamp()}updated compiled.user.css`.green, `modes: ${MODES.join(", ")}`.cyan) 52 | } 53 | 54 | chokidar.watch(compiledCSSPath, { ignorePermissionErrors: true }).on('all', (event, eventPath) => { 55 | //console.log(event, path); 56 | if (event === "change") { 57 | console.clear(); 58 | console.log(`${getTimestamp()}changes detected in main.css`.yellow) 59 | 60 | setTimeout(fileWriteCallback, WAIT_MS) 61 | } 62 | }).on('error', error => console.log(`Watcher error: ${error}`)); 63 | fileWriteCallback() 64 | 65 | function getTimestamp() { 66 | let d = new Date(Date.now()) 67 | return (`${pad(d.getHours(), 2)}:${pad(d.getMinutes(), 2)}:${pad(d.getSeconds(), 2)} > `) 68 | } 69 | function pad(n, width) { 70 | let z = '0'; 71 | n = n + ''; 72 | return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n; 73 | } -------------------------------------------------------------------------------- /editors/README.md: -------------------------------------------------------------------------------- 1 | # Editors 2 | 3 | ![vim preview](../_screenshots/vim_fullscreen.png) 4 | 5 | ## Vim 6 | 7 | **Usage** 8 | 9 | To install this, using your plug-in manager of choice 10 | 11 | ```python 12 | # using vim-plug 13 | Plug 'atidyshirt/rosebox.nvim' 14 | 15 | # using dein 16 | call dein#add('atidyshirt/rosebox.nvim') 17 | ``` 18 | 19 | Then we need to set the colorscheme 20 | 21 | ```python 22 | colorscheme rosebox 23 | ``` 24 | 25 | Separate repository for neovim theme made by: [*atidyshirt*](https://github.com/atidyshirt/rosebox.nvim) 26 | 27 | **Further configuration and plugin support** 28 | 29 | There is further configuration that has been done to extend the functionality of the theme 30 | 31 | ```vimscript 32 | if (has('termguicolors')) 33 | set termguicolors 34 | endif 35 | 36 | if &term == "screen-256color" || &term == "tmux-256color" || &term == "screen" || &term == "tmux" 37 | map [1;5D 38 | map! [1;5D 39 | map [1;5C 40 | map! [1;5C 41 | endif 42 | 43 | colorscheme rosebox 44 | set background=dark 45 | 46 | if &term == "screen-256color" 47 | set t_Co=256 48 | endif 49 | 50 | luafile $HOME/.config/nvim/themes/rosebox-extended.lua 51 | ``` 52 | 53 | And for further extension for treesitter, nvim-tree plugins using Lua. 54 | 55 | ```lua 56 | local cmd = vim.cmd 57 | 58 | local colors = { 59 | white = "#a3a5aa", 60 | darker_black = "#2b2b2b", 61 | black = "#282828", -- nvim bg 62 | black2 = "#2b2b2b", 63 | one_bg = "#2b2b2b", 64 | one_bg2 = "#2b2b2b", 65 | one_bg3 = "#2b2b2b", 66 | grey = "#46494a", 67 | grey_fg = "#5d6061", 68 | grey_fg2 = "#5b5e5f", 69 | light_grey = "#585b5c", 70 | red = "#D08770", 71 | baby_pink = "#ce8196", 72 | pink = "#ff75a0", 73 | line = "#2c2f30", -- for lines like vertsplit 74 | green = "#A3BE8C", 75 | vibrant_green = "#a9b665", 76 | nord_blue = "#6f8faf", 77 | blue = "#637A8A", 78 | yellow = "#EBCB8B", 79 | sun = "#d1b171", 80 | purple = "#B48EAD", 81 | dark_purple = "#cc7f94", 82 | teal = "#749689", 83 | orange = "#af3a03", 84 | cyan = "#8FBCBB", 85 | statusline_bg = "#252829", 86 | lightbg = "#2d3139", 87 | lightbg2 = "#262a32" 88 | } 89 | 90 | local white = colors.white 91 | local darker_black = colors.darker_black 92 | local black = colors.black 93 | local black2 = colors.black2 94 | local one_bg = colors.one_bg 95 | local one_bg2 = colors.one_bg2 96 | local one_bg3 = colors.one_bg3 97 | local light_grey = colors.light_grey 98 | local grey = colors.grey 99 | local grey_fg = colors.grey_fg 100 | local red = colors.red 101 | local line = colors.line 102 | local green = colors.green 103 | local nord_blue = colors.nord_blue 104 | local blue = colors.blue 105 | local yellow = colors.yellow 106 | local purple = colors.purple 107 | 108 | -- for guifg , bg 109 | local function fg(group, color) 110 | cmd("hi " .. group .. " guifg=" .. color) 111 | end 112 | 113 | local function bg(group, color) 114 | cmd("hi " .. group .. " guibg=" .. color) 115 | end 116 | 117 | local function fg_bg(group, fgcol, bgcol) 118 | cmd("hi " .. group .. " guifg=" .. fgcol .. " guibg=" .. bgcol) 119 | end 120 | 121 | -- blankline 122 | fg("IndentBlanklineChar", line) 123 | 124 | -- misc -- 125 | fg("LineNr", grey) 126 | fg("Comment", grey) 127 | fg("NvimInternalError", red) 128 | fg("VertSplit", line) 129 | fg("EndOfBuffer", black) 130 | 131 | -- Pmenu 132 | bg("Pmenu", one_bg) 133 | bg("PmenuSbar", one_bg2) 134 | bg("PmenuSel", green) 135 | bg("PmenuThumb", nord_blue) 136 | 137 | -- inactive statuslines as thin splitlines 138 | -- cmd("hi! StatusLineNC gui=underline guifg=" .. line) 139 | 140 | -- line n.o 141 | cmd "hi clear CursorLine" 142 | fg("cursorlinenr", white) 143 | 144 | -- git signs --- 145 | fg_bg("DiffAdd", nord_blue, "none") 146 | fg_bg("DiffChange", one_bg2, "none") 147 | fg_bg("DiffModified", nord_blue, "none") 148 | 149 | -- NvimTree 150 | fg("NvimTreeFolderIcon", blue) 151 | fg("NvimTreeFolderName", blue) 152 | fg("NvimTreeOpenedFolderName", blue) 153 | fg("NvimTreeEmptyFolderName", blue) 154 | fg("NvimTreeIndentMarker", one_bg2) 155 | fg("NvimTreeVertSplit", darker_black) 156 | bg("NvimTreeVertSplit", darker_black) 157 | fg("NvimTreeEndOfBuffer", darker_black) 158 | 159 | fg("NvimTreeRootFolder", darker_black) 160 | bg("NvimTreeNormal", darker_black) 161 | fg_bg("NvimTreeStatuslineNc", darker_black, darker_black) 162 | fg_bg("NvimTreeWindowPicker", red, black2) 163 | 164 | -- LspDiagnostics --- 165 | 166 | -- error / warnings 167 | fg("LspDiagnosticsSignError", red) 168 | fg("LspDiagnosticsVirtualTextError", red) 169 | fg("LspDiagnosticsSignWarning", yellow) 170 | fg("LspDiagnosticsVirtualTextWarning", yellow) 171 | 172 | -- info 173 | fg("LspDiagnosticsSignInformation", green) 174 | fg("LspDiagnosticsVirtualTextInformation", green) 175 | 176 | -- hint 177 | fg("LspDiagnosticsSignHint", purple) 178 | fg("LspDiagnosticsVirtualTextHint", purple) 179 | 180 | -- separators 181 | fg_bg("BufferLineSeparator", black2, black2) 182 | fg_bg("BufferLineSeparatorVisible", black2, black2) 183 | fg_bg("BufferLineSeparatorSelected", black, black2) 184 | ``` 185 | 186 | This lua configuration is stolen from the [NVChad project](https://github.com/siduck76/NvChad) 187 | -------------------------------------------------------------------------------- /editors/rosebox.nvim/LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Pavel Pertsev 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /editors/rosebox.nvim/autoload/airline/themes/rosebox.vim: -------------------------------------------------------------------------------- 1 | " ----------------------------------------------------------------------------- 2 | " File: rosebox.vim 3 | " Description: Retro groove color scheme for Airline 4 | " Author: morhetz 5 | " Source: https://github.com/rosebox-community/rosebox 6 | " ----------------------------------------------------------------------------- 7 | 8 | let g:airline#themes#rosebox#palette = {} 9 | 10 | function! airline#themes#rosebox#refresh() 11 | 12 | let M0 = airline#themes#get_highlight('Identifier') 13 | let accents_group = airline#themes#get_highlight('Special') 14 | let modified_group = [M0[0], '', M0[2], '', ''] 15 | let warning_group = airline#themes#get_highlight2(['RoseboxBg0', 'fg'], ['Question', 'fg']) 16 | let error_group = airline#themes#get_highlight2(['RoseboxBg0', 'fg'], ['WarningMsg', 'fg']) 17 | 18 | let s:N1 = airline#themes#get_highlight2(['RoseboxBg0', 'fg'], ['StatusLineNC', 'bg']) 19 | let s:N2 = airline#themes#get_highlight2(['StatusLineNC', 'bg'], ['Pmenu', 'bg']) 20 | let s:N3 = airline#themes#get_highlight2(['StatusLineNC', 'bg'], ['StatusLineNC', 'fg']) 21 | let g:airline#themes#rosebox#palette.normal = airline#themes#generate_color_map(s:N1, s:N2, s:N3) 22 | let g:airline#themes#rosebox#palette.normal_modified = { 'airline_c': modified_group } 23 | let g:airline#themes#rosebox#palette.normal.airline_warning = warning_group 24 | let g:airline#themes#rosebox#palette.normal_modified.airline_warning = warning_group 25 | let g:airline#themes#rosebox#palette.normal.airline_error = error_group 26 | let g:airline#themes#rosebox#palette.normal_modified.airline_error = error_group 27 | let g:airline#themes#rosebox#palette.normal.airline_term = s:N3 28 | let g:airline#themes#rosebox#palette.normal_modified.airline_term = s:N3 29 | 30 | let s:I1 = airline#themes#get_highlight2(['RoseboxBg0', 'fg'], ['Identifier', 'fg']) 31 | let s:I2 = s:N2 32 | let s:I3 = airline#themes#get_highlight2(['RoseboxFg1', 'fg'], ['Pmenu', 'bg']) 33 | let g:airline#themes#rosebox#palette.insert = airline#themes#generate_color_map(s:I1, s:I2, s:I3) 34 | let g:airline#themes#rosebox#palette.insert_modified = g:airline#themes#rosebox#palette.normal_modified 35 | let g:airline#themes#rosebox#palette.insert.airline_warning = g:airline#themes#rosebox#palette.normal.airline_warning 36 | let g:airline#themes#rosebox#palette.insert_modified.airline_warning = g:airline#themes#rosebox#palette.normal_modified.airline_warning 37 | let g:airline#themes#rosebox#palette.insert.airline_error = g:airline#themes#rosebox#palette.normal.airline_error 38 | let g:airline#themes#rosebox#palette.insert_modified.airline_error = g:airline#themes#rosebox#palette.normal_modified.airline_error 39 | let g:airline#themes#rosebox#palette.insert.airline_term = g:airline#themes#rosebox#palette.normal.airline_term 40 | let g:airline#themes#rosebox#palette.insert_modified.airline_term = g:airline#themes#rosebox#palette.normal_modified.airline_term 41 | 42 | let s:R1 = airline#themes#get_highlight2(['RoseboxBg0', 'fg'], ['Structure', 'fg']) 43 | let s:R2 = s:I2 44 | let s:R3 = s:I3 45 | let g:airline#themes#rosebox#palette.replace = airline#themes#generate_color_map(s:R1, s:R2, s:R3) 46 | let g:airline#themes#rosebox#palette.replace_modified = g:airline#themes#rosebox#palette.normal_modified 47 | let g:airline#themes#rosebox#palette.replace.airline_warning = g:airline#themes#rosebox#palette.normal.airline_warning 48 | let g:airline#themes#rosebox#palette.replace_modified.airline_warning = g:airline#themes#rosebox#palette.normal_modified.airline_warning 49 | let g:airline#themes#rosebox#palette.replace.airline_error = g:airline#themes#rosebox#palette.normal.airline_error 50 | let g:airline#themes#rosebox#palette.replace_modified.airline_error = g:airline#themes#rosebox#palette.normal_modified.airline_error 51 | let g:airline#themes#rosebox#palette.replace.airline_term = g:airline#themes#rosebox#palette.normal.airline_term 52 | let g:airline#themes#rosebox#palette.replace_modified.airline_term = g:airline#themes#rosebox#palette.normal_modified.airline_term 53 | 54 | let s:V1 = airline#themes#get_highlight2(['RoseboxBg0', 'fg'], ['Question', 'fg']) 55 | let s:V2 = s:N2 56 | let s:V3 = airline#themes#get_highlight2(['RoseboxBg0', 'fg'], ['TabLine', 'fg']) 57 | let g:airline#themes#rosebox#palette.visual = airline#themes#generate_color_map(s:V1, s:V2, s:V3) 58 | let g:airline#themes#rosebox#palette.visual_modified = { 'airline_c': [ s:V3[0], '', s:V3[2], '', '' ] } 59 | let g:airline#themes#rosebox#palette.visual.airline_warning = g:airline#themes#rosebox#palette.normal.airline_warning 60 | let g:airline#themes#rosebox#palette.visual_modified.airline_warning = g:airline#themes#rosebox#palette.normal_modified.airline_warning 61 | let g:airline#themes#rosebox#palette.visual.airline_error = g:airline#themes#rosebox#palette.normal.airline_error 62 | let g:airline#themes#rosebox#palette.visual_modified.airline_error = g:airline#themes#rosebox#palette.normal_modified.airline_error 63 | let g:airline#themes#rosebox#palette.visual.airline_term = g:airline#themes#rosebox#palette.normal.airline_term 64 | let g:airline#themes#rosebox#palette.visual_modified.airline_term = g:airline#themes#rosebox#palette.normal_modified.airline_term 65 | 66 | let s:C1 = airline#themes#get_highlight2(['RoseboxBg0', 'fg'], ['RoseboxGreen', 'fg']) 67 | let s:C2 = s:I2 68 | let s:C3 = s:I3 69 | let g:airline#themes#rosebox#palette.commandline = airline#themes#generate_color_map(s:C1, s:C2, s:C3) 70 | let g:airline#themes#rosebox#palette.commandline_modified = g:airline#themes#rosebox#palette.normal_modified 71 | let g:airline#themes#rosebox#palette.commandline.airline_warning = g:airline#themes#rosebox#palette.normal.airline_warning 72 | let g:airline#themes#rosebox#palette.commandline_modified.airline_warning = g:airline#themes#rosebox#palette.normal_modified.airline_warning 73 | let g:airline#themes#rosebox#palette.commandline.airline_error = g:airline#themes#rosebox#palette.normal.airline_error 74 | let g:airline#themes#rosebox#palette.commandline_modified.airline_error = g:airline#themes#rosebox#palette.normal_modified.airline_error 75 | let g:airline#themes#rosebox#palette.commandline.airline_term = g:airline#themes#rosebox#palette.normal.airline_term 76 | let g:airline#themes#rosebox#palette.commandline_modified.airline_term = g:airline#themes#rosebox#palette.normal.airline_term 77 | 78 | let s:IA = airline#themes#get_highlight2(['TabLine', 'fg'], ['CursorLine', 'bg']) 79 | let g:airline#themes#rosebox#palette.inactive = airline#themes#generate_color_map(s:IA, s:IA, s:IA) 80 | let g:airline#themes#rosebox#palette.inactive_modified = { 'airline_c': modified_group } 81 | 82 | let g:airline#themes#rosebox#palette.accents = { 'red': accents_group } 83 | 84 | let s:TF = airline#themes#get_highlight2(['RoseboxBg0', 'fg'], ['RoseboxBg0', 'fg']) 85 | let g:airline#themes#rosebox#palette.tabline = { 86 | \ 'airline_tab': s:N2, 87 | \ 'airline_tabsel': s:N1, 88 | \ 'airline_tabtype': s:V1, 89 | \ 'airline_tablabel': s:V1, 90 | \ 'airline_tablabel_right': s:V1, 91 | \ 'airline_tabfill': s:TF, 92 | \ 'airline_tabhid': s:IA, 93 | \ 'airline_tabmod': s:I1 94 | \ } 95 | 96 | endfunction 97 | 98 | call airline#themes#rosebox#refresh() 99 | 100 | " vim: set sw=2 ts=2 sts=2 et tw=80 ft=vim fdm=marker: 101 | -------------------------------------------------------------------------------- /editors/rosebox.nvim/autoload/lightline/colorscheme/rosebox.vim: -------------------------------------------------------------------------------- 1 | " ----------------------------------------------------------------------------- 2 | " File: rosebox.vim 3 | " Description: Rosebox colorscheme for Lightline (itchyny/lightline.vim) 4 | " Author: gmoe 5 | " Source: https://github.com/rosebox-community/rosebox 6 | " ----------------------------------------------------------------------------- 7 | 8 | function! s:getRoseColor(group) 9 | let guiColor = synIDattr(hlID(a:group), "fg", "gui") 10 | let termColor = synIDattr(hlID(a:group), "fg", "cterm") 11 | return [ guiColor, termColor ] 12 | endfunction 13 | 14 | if exists('g:lightline') 15 | 16 | let s:bg0 = s:getRoseColor('RoseboxBg0') 17 | let s:bg1 = s:getRoseColor('RoseboxBg1') 18 | let s:bg2 = s:getRoseColor('RoseboxBg2') 19 | let s:bg4 = s:getRoseColor('RoseboxBg4') 20 | let s:fg1 = s:getRoseColor('RoseboxFg1') 21 | let s:fg4 = s:getRoseColor('RoseboxFg4') 22 | 23 | let s:yellow = s:getRoseColor('RoseboxYellow') 24 | let s:blue = s:getRoseColor('RoseboxBlue') 25 | let s:aqua = s:getRoseColor('RoseboxAqua') 26 | let s:orange = s:getRoseColor('RoseboxOrange') 27 | let s:red = s:getRoseColor('RoseboxRed') 28 | let s:green = s:getRoseColor('RoseboxGreen') 29 | 30 | let s:p = {'normal':{}, 'inactive':{}, 'insert':{}, 'replace':{}, 'visual':{}, 'tabline':{}, 'terminal':{}} 31 | let s:p.normal.left = [ [ s:bg0, s:fg4, 'bold' ], [ s:fg4, s:bg2 ] ] 32 | let s:p.normal.right = [ [ s:bg0, s:fg4 ], [ s:fg4, s:bg2 ] ] 33 | let s:p.normal.middle = [ [ s:fg4, s:bg1 ] ] 34 | let s:p.inactive.right = [ [ s:bg4, s:bg1 ], [ s:bg4, s:bg1 ] ] 35 | let s:p.inactive.left = [ [ s:bg4, s:bg1 ], [ s:bg4, s:bg1 ] ] 36 | let s:p.inactive.middle = [ [ s:bg4, s:bg1 ] ] 37 | let s:p.insert.left = [ [ s:bg0, s:blue, 'bold' ], [ s:fg1, s:bg2 ] ] 38 | let s:p.insert.right = [ [ s:bg0, s:blue ], [ s:fg1, s:bg2 ] ] 39 | let s:p.insert.middle = [ [ s:fg4, s:bg1 ] ] 40 | let s:p.terminal.left = [ [ s:bg0, s:green, 'bold' ], [ s:fg1, s:bg2 ] ] 41 | let s:p.terminal.right = [ [ s:bg0, s:green ], [ s:fg1, s:bg2 ] ] 42 | let s:p.terminal.middle = [ [ s:fg4, s:bg1 ] ] 43 | let s:p.replace.left = [ [ s:bg0, s:aqua, 'bold' ], [ s:fg1, s:bg2 ] ] 44 | let s:p.replace.right = [ [ s:bg0, s:aqua ], [ s:fg1, s:bg2 ] ] 45 | let s:p.replace.middle = [ [ s:fg4, s:bg1 ] ] 46 | let s:p.visual.left = [ [ s:bg0, s:orange, 'bold' ], [ s:bg0, s:bg4 ] ] 47 | let s:p.visual.right = [ [ s:bg0, s:orange ], [ s:bg0, s:bg4 ] ] 48 | let s:p.visual.middle = [ [ s:fg4, s:bg1 ] ] 49 | let s:p.tabline.left = [ [ s:fg4, s:bg2 ] ] 50 | let s:p.tabline.tabsel = [ [ s:bg0, s:fg4 ] ] 51 | let s:p.tabline.middle = [ [ s:bg0, s:bg4 ] ] 52 | let s:p.tabline.right = [ [ s:bg0, s:orange ] ] 53 | let s:p.normal.error = [ [ s:bg0, s:red ] ] 54 | let s:p.normal.warning = [ [ s:bg0, s:yellow ] ] 55 | 56 | let g:lightline#colorscheme#rosebox#palette = lightline#colorscheme#flatten(s:p) 57 | endif 58 | -------------------------------------------------------------------------------- /editors/rosebox.nvim/autoload/rosebox.vim: -------------------------------------------------------------------------------- 1 | " ----------------------------------------------------------------------------- 2 | " File: rosebox.vim 3 | " Description: Retro groove color scheme for Vim 4 | " Author: morhetz 5 | " Source: https://github.com/rosebox-community/rosebox 6 | " ----------------------------------------------------------------------------- 7 | 8 | function! rosebox#invert_signs_toggle() 9 | if g:rosebox_invert_signs == 0 10 | let g:rosebox_invert_signs=1 11 | else 12 | let g:rosebox_invert_signs=0 13 | endif 14 | 15 | colorscheme rosebox 16 | endfunction 17 | 18 | " Search Highlighting {{{ 19 | 20 | function! rosebox#hls_show() 21 | set hlsearch 22 | call RoseboxHlsShowCursor() 23 | endfunction 24 | 25 | function! rosebox#hls_hide() 26 | set nohlsearch 27 | call RoseboxHlsHideCursor() 28 | endfunction 29 | 30 | function! rosebox#hls_toggle() 31 | if &hlsearch 32 | call rosebox#hls_hide() 33 | else 34 | call rosebox#hls_show() 35 | endif 36 | endfunction 37 | 38 | " }}} 39 | 40 | " vim: set sw=2 ts=2 sts=2 et tw=80 ft=vim fdm=marker: 41 | -------------------------------------------------------------------------------- /editors/rosebox.nvim/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "gruvbox", 3 | "version": "2.0.0", 4 | "repository": "git@github.com:gruvbox-community/gruvbox.git", 5 | "author": "gruvbox-community", 6 | "license": "MIT", 7 | "vim": { 8 | "opt": true 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /editors/rosebox.nvim/rosebox_256palette.sh: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | 3 | if [ "${TERM%%-*}" = "screen" ] || [ "${TERM%%-*}" = "tmux" ]; then 4 | if [ -n "$TMUX" ]; then 5 | printf "\033Ptmux;\033\033]4;236;rgb:32/30/2f\007\033\\" 6 | printf "\033Ptmux;\033\033]4;234;rgb:1d/20/21\007\033\\" 7 | 8 | printf "\033Ptmux;\033\033]4;235;rgb:28/28/28\007\033\\" 9 | printf "\033Ptmux;\033\033]4;237;rgb:3c/38/36\007\033\\" 10 | printf "\033Ptmux;\033\033]4;239;rgb:50/49/45\007\033\\" 11 | printf "\033Ptmux;\033\033]4;241;rgb:66/5c/54\007\033\\" 12 | printf "\033Ptmux;\033\033]4;243;rgb:7c/6f/64\007\033\\" 13 | 14 | printf "\033Ptmux;\033\033]4;244;rgb:92/83/74\007\033\\" 15 | printf "\033Ptmux;\033\033]4;245;rgb:92/83/74\007\033\\" 16 | 17 | printf "\033Ptmux;\033\033]4;228;rgb:f2/e5/bc\007\033\\" 18 | printf "\033Ptmux;\033\033]4;230;rgb:f9/f5/d7\007\033\\" 19 | 20 | printf "\033Ptmux;\033\033]4;229;rgb:fb/f1/c7\007\033\\" 21 | printf "\033Ptmux;\033\033]4;223;rgb:eb/db/b2\007\033\\" 22 | printf "\033Ptmux;\033\033]4;250;rgb:d5/c4/a1\007\033\\" 23 | printf "\033Ptmux;\033\033]4;248;rgb:bd/ae/93\007\033\\" 24 | printf "\033Ptmux;\033\033]4;246;rgb:a8/99/84\007\033\\" 25 | 26 | printf "\033Ptmux;\033\033]4;167;rgb:fb/49/34\007\033\\" 27 | printf "\033Ptmux;\033\033]4;142;rgb:b8/bb/26\007\033\\" 28 | printf "\033Ptmux;\033\033]4;214;rgb:fa/bd/2f\007\033\\" 29 | printf "\033Ptmux;\033\033]4;109;rgb:83/a5/98\007\033\\" 30 | printf "\033Ptmux;\033\033]4;175;rgb:d3/86/9b\007\033\\" 31 | printf "\033Ptmux;\033\033]4;108;rgb:8e/c0/7c\007\033\\" 32 | printf "\033Ptmux;\033\033]4;208;rgb:fe/80/19\007\033\\" 33 | 34 | printf "\033Ptmux;\033\033]4;88;rgb:9d/00/06\007\033\\" 35 | printf "\033Ptmux;\033\033]4;100;rgb:79/74/0e\007\033\\" 36 | printf "\033Ptmux;\033\033]4;136;rgb:b5/76/14\007\033\\" 37 | printf "\033Ptmux;\033\033]4;24;rgb:07/66/78\007\033\\" 38 | printf "\033Ptmux;\033\033]4;96;rgb:8f/3f/71\007\033\\" 39 | printf "\033Ptmux;\033\033]4;65;rgb:42/7b/58\007\033\\" 40 | printf "\033Ptmux;\033\033]4;130;rgb:af/3a/03\007\033\\" 41 | else 42 | printf "\033P\033]4;236;rgb:32/30/2f\007\033\\" 43 | printf "\033P\033]4;234;rgb:1d/20/21\007\033\\" 44 | 45 | printf "\033P\033]4;235;rgb:28/28/28\007\033\\" 46 | printf "\033P\033]4;237;rgb:3c/38/36\007\033\\" 47 | printf "\033P\033]4;239;rgb:50/49/45\007\033\\" 48 | printf "\033P\033]4;241;rgb:66/5c/54\007\033\\" 49 | printf "\033P\033]4;243;rgb:7c/6f/64\007\033\\" 50 | 51 | printf "\033P\033]4;244;rgb:92/83/74\007\033\\" 52 | printf "\033P\033]4;245;rgb:92/83/74\007\033\\" 53 | 54 | printf "\033P\033]4;228;rgb:f2/e5/bc\007\033\\" 55 | printf "\033P\033]4;230;rgb:f9/f5/d7\007\033\\" 56 | 57 | printf "\033P\033]4;229;rgb:fb/f1/c7\007\033\\" 58 | printf "\033P\033]4;223;rgb:eb/db/b2\007\033\\" 59 | printf "\033P\033]4;250;rgb:d5/c4/a1\007\033\\" 60 | printf "\033P\033]4;248;rgb:bd/ae/93\007\033\\" 61 | printf "\033P\033]4;246;rgb:a8/99/84\007\033\\" 62 | 63 | printf "\033P\033]4;167;rgb:fb/49/34\007\033\\" 64 | printf "\033P\033]4;142;rgb:b8/bb/26\007\033\\" 65 | printf "\033P\033]4;214;rgb:fa/bd/2f\007\033\\" 66 | printf "\033P\033]4;109;rgb:83/a5/98\007\033\\" 67 | printf "\033P\033]4;175;rgb:d3/86/9b\007\033\\" 68 | printf "\033P\033]4;108;rgb:8e/c0/7c\007\033\\" 69 | printf "\033P\033]4;208;rgb:fe/80/19\007\033\\" 70 | 71 | printf "\033P\033]4;88;rgb:9d/00/06\007\033\\" 72 | printf "\033P\033]4;100;rgb:79/74/0e\007\033\\" 73 | printf "\033P\033]4;136;rgb:b5/76/14\007\033\\" 74 | printf "\033P\033]4;24;rgb:07/66/78\007\033\\" 75 | printf "\033P\033]4;96;rgb:8f/3f/71\007\033\\" 76 | printf "\033P\033]4;65;rgb:42/7b/58\007\033\\" 77 | printf "\033P\033]4;130;rgb:af/3a/03\007\033\\" 78 | fi 79 | 80 | elif [ "$TERM" = "fbterm" ]; then 81 | printf "\033[3;236;50;48;47}" 82 | printf "\033[3;234;29;32;33}" 83 | 84 | printf "\033[3;235;40;40;40}" 85 | printf "\033[3;237;60;56;54}" 86 | printf "\033[3;239;80;73;69}" 87 | printf "\033[3;241;102;92;84}" 88 | printf "\033[3;243;124;111;100}" 89 | 90 | printf "\033[3;244;146;131;116}" 91 | printf "\033[3;245;146;131;116}" 92 | 93 | printf "\033[3;228;242;229;188}" 94 | printf "\033[3;230;249;245;215}" 95 | 96 | printf "\033[3;229;253;244;193}" 97 | printf "\033[3;223;235;219;178}" 98 | printf "\033[3;250;213;196;161}" 99 | printf "\033[3;248;189;174;147}" 100 | printf "\033[3;246;168;153;132}" 101 | 102 | printf "\033[3;167;251;73;52}" 103 | printf "\033[3;142;184;187;38}" 104 | printf "\033[3;214;250;189;47}" 105 | printf "\033[3;109;131;165;152}" 106 | printf "\033[3;175;211;134;155}" 107 | printf "\033[3;108;142;192;124}" 108 | printf "\033[3;208;254;128;25}" 109 | 110 | printf "\033[3;88;157;0;6}" 111 | printf "\033[3;100;121;116;14}" 112 | printf "\033[3;136;181;118;20}" 113 | printf "\033[3;24;7;102;120}" 114 | printf "\033[3;96;143;63;113}" 115 | printf "\033[3;65;66;123;88}" 116 | printf "\033[3;130;175;58;3}" 117 | 118 | elif [ "$TERM" != "linux" ] && [ "$TERM" != "vt100" ] && [ "$TERM" != "vt220" ]; then 119 | 120 | printf "\033]4;236;rgb:32/30/2f\033\\" 121 | printf "\033]4;234;rgb:1d/20/21\033\\" 122 | 123 | printf "\033]4;235;rgb:28/28/28\033\\" 124 | printf "\033]4;237;rgb:3c/38/36\033\\" 125 | printf "\033]4;239;rgb:50/49/45\033\\" 126 | printf "\033]4;241;rgb:66/5c/54\033\\" 127 | printf "\033]4;243;rgb:7c/6f/64\033\\" 128 | 129 | printf "\033]4;244;rgb:92/83/74\033\\" 130 | printf "\033]4;245;rgb:92/83/74\033\\" 131 | 132 | printf "\033]4;228;rgb:f2/e5/bc\033\\" 133 | printf "\033]4;230;rgb:f9/f5/d7\033\\" 134 | 135 | printf "\033]4;229;rgb:fb/f1/c7\033\\" 136 | printf "\033]4;223;rgb:eb/db/b2\033\\" 137 | printf "\033]4;250;rgb:d5/c4/a1\033\\" 138 | printf "\033]4;248;rgb:bd/ae/93\033\\" 139 | printf "\033]4;246;rgb:a8/99/84\033\\" 140 | 141 | printf "\033]4;167;rgb:fb/49/34\033\\" 142 | printf "\033]4;142;rgb:b8/bb/26\033\\" 143 | printf "\033]4;214;rgb:fa/bd/2f\033\\" 144 | printf "\033]4;109;rgb:83/a5/98\033\\" 145 | printf "\033]4;175;rgb:d3/86/9b\033\\" 146 | printf "\033]4;108;rgb:8e/c0/7c\033\\" 147 | printf "\033]4;208;rgb:fe/80/19\033\\" 148 | 149 | printf "\033]4;88;rgb:9d/00/06\033\\" 150 | printf "\033]4;100;rgb:79/74/0e\033\\" 151 | printf "\033]4;136;rgb:b5/76/14\033\\" 152 | printf "\033]4;24;rgb:07/66/78\033\\" 153 | printf "\033]4;96;rgb:8f/3f/71\033\\" 154 | printf "\033]4;65;rgb:42/7b/58\033\\" 155 | printf "\033]4;130;rgb:af/3a/03\033\\" 156 | fi 157 | -------------------------------------------------------------------------------- /editors/rosebox.nvim/rosebox_256palette_osx.sh: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | 3 | if [ "${TERM%%-*}" = "screen" ] || [ "${TERM%%-*}" = "tmux" ]; then 4 | if [ -n "$TMUX" ]; then 5 | printf "\033Ptmux;\033\033]4;236;rgb:26/24/23\007\033\\" 6 | printf "\033Ptmux;\033\033]4;234;rgb:16/18/19\007\033\\" 7 | 8 | printf "\033Ptmux;\033\033]4;235;rgb:1e/1e/1e\007\033\\" 9 | printf "\033Ptmux;\033\033]4;237;rgb:2e/2a/29\007\033\\" 10 | printf "\033Ptmux;\033\033]4;239;rgb:3f/39/35\007\033\\" 11 | printf "\033Ptmux;\033\033]4;241;rgb:53/4a/42\007\033\\" 12 | printf "\033Ptmux;\033\033]4;243;rgb:68/5c/51\007\033\\" 13 | 14 | printf "\033Ptmux;\033\033]4;244;rgb:7f/70/61\007\033\\" 15 | printf "\033Ptmux;\033\033]4;245;rgb:7f/70/61\007\033\\" 16 | 17 | printf "\033Ptmux;\033\033]4;228;rgb:ef/df/ae\007\033\\" 18 | printf "\033Ptmux;\033\033]4;230;rgb:f8/f4/cd\007\033\\" 19 | 20 | printf "\033Ptmux;\033\033]4;229;rgb:fa/ee/bb\007\033\\" 21 | printf "\033Ptmux;\033\033]4;223;rgb:e6/d4/a3\007\033\\" 22 | printf "\033Ptmux;\033\033]4;250;rgb:cb/b8/90\007\033\\" 23 | printf "\033Ptmux;\033\033]4;248;rgb:af/9f/81\007\033\\" 24 | printf "\033Ptmux;\033\033]4;246;rgb:97/87/71\007\033\\" 25 | 26 | printf "\033Ptmux;\033\033]4;167;rgb:f7/30/28\007\033\\" 27 | printf "\033Ptmux;\033\033]4;142;rgb:aa/b0/1e\007\033\\" 28 | printf "\033Ptmux;\033\033]4;214;rgb:f7/b1/25\007\033\\" 29 | printf "\033Ptmux;\033\033]4;109;rgb:71/95/86\007\033\\" 30 | printf "\033Ptmux;\033\033]4;175;rgb:c7/70/89\007\033\\" 31 | printf "\033Ptmux;\033\033]4;108;rgb:7d/b6/69\007\033\\" 32 | printf "\033Ptmux;\033\033]4;208;rgb:fb/6a/16\007\033\\" 33 | 34 | printf "\033Ptmux;\033\033]4;88;rgb:89/00/09\007\033\\" 35 | printf "\033Ptmux;\033\033]4;100;rgb:66/62/0d\007\033\\" 36 | printf "\033Ptmux;\033\033]4;136;rgb:a5/63/11\007\033\\" 37 | printf "\033Ptmux;\033\033]4;24;rgb:0e/53/65\007\033\\" 38 | printf "\033Ptmux;\033\033]4;96;rgb:7b/2b/5e\007\033\\" 39 | printf "\033Ptmux;\033\033]4;65;rgb:35/6a/46\007\033\\" 40 | printf "\033Ptmux;\033\033]4;130;rgb:9d/28/07\007\033\\" 41 | else 42 | printf "\033P\033]4;236;rgb:26/24/23\007\033\\" 43 | printf "\033P\033]4;234;rgb:16/18/19\007\033\\" 44 | 45 | printf "\033P\033]4;235;rgb:1e/1e/1e\007\033\\" 46 | printf "\033P\033]4;237;rgb:2e/2a/29\007\033\\" 47 | printf "\033P\033]4;239;rgb:3f/39/35\007\033\\" 48 | printf "\033P\033]4;241;rgb:53/4a/42\007\033\\" 49 | printf "\033P\033]4;243;rgb:68/5c/51\007\033\\" 50 | 51 | printf "\033P\033]4;244;rgb:7f/70/61\007\033\\" 52 | printf "\033P\033]4;245;rgb:7f/70/61\007\033\\" 53 | 54 | printf "\033P\033]4;228;rgb:ef/df/ae\007\033\\" 55 | printf "\033P\033]4;230;rgb:f8/f4/cd\007\033\\" 56 | 57 | printf "\033P\033]4;229;rgb:fa/ee/bb\007\033\\" 58 | printf "\033P\033]4;223;rgb:e6/d4/a3\007\033\\" 59 | printf "\033P\033]4;250;rgb:cb/b8/90\007\033\\" 60 | printf "\033P\033]4;248;rgb:af/9f/81\007\033\\" 61 | printf "\033P\033]4;246;rgb:97/87/71\007\033\\" 62 | 63 | printf "\033P\033]4;167;rgb:f7/30/28\007\033\\" 64 | printf "\033P\033]4;142;rgb:aa/b0/1e\007\033\\" 65 | printf "\033P\033]4;214;rgb:f7/b1/25\007\033\\" 66 | printf "\033P\033]4;109;rgb:71/95/86\007\033\\" 67 | printf "\033P\033]4;175;rgb:c7/70/89\007\033\\" 68 | printf "\033P\033]4;108;rgb:7d/b6/69\007\033\\" 69 | printf "\033P\033]4;208;rgb:fb/6a/16\007\033\\" 70 | 71 | printf "\033P\033]4;88;rgb:89/00/09\007\033\\" 72 | printf "\033P\033]4;100;rgb:66/62/0d\007\033\\" 73 | printf "\033P\033]4;136;rgb:a5/63/11\007\033\\" 74 | printf "\033P\033]4;24;rgb:0e/53/65\007\033\\" 75 | printf "\033P\033]4;96;rgb:7b/2b/5e\007\033\\" 76 | printf "\033P\033]4;65;rgb:35/6a/46\007\033\\" 77 | printf "\033P\033]4;130;rgb:9d/28/07\007\033\\" 78 | fi 79 | else 80 | printf "\033]4;236;rgb:26/24/23\033\\" 81 | printf "\033]4;234;rgb:16/18/19\033\\" 82 | 83 | printf "\033]4;235;rgb:1e/1e/1e\033\\" 84 | printf "\033]4;237;rgb:2e/2a/29\033\\" 85 | printf "\033]4;239;rgb:3f/39/35\033\\" 86 | printf "\033]4;241;rgb:53/4a/42\033\\" 87 | printf "\033]4;243;rgb:68/5c/51\033\\" 88 | 89 | printf "\033]4;244;rgb:7f/70/61\033\\" 90 | printf "\033]4;245;rgb:7f/70/61\033\\" 91 | 92 | printf "\033]4;228;rgb:ef/df/ae\033\\" 93 | printf "\033]4;230;rgb:f8/f4/cd\033\\" 94 | 95 | printf "\033]4;229;rgb:fa/ee/bb\033\\" 96 | printf "\033]4;223;rgb:e6/d4/a3\033\\" 97 | printf "\033]4;250;rgb:cb/b8/90\033\\" 98 | printf "\033]4;248;rgb:af/9f/81\033\\" 99 | printf "\033]4;246;rgb:97/87/71\033\\" 100 | 101 | printf "\033]4;167;rgb:f7/30/28\033\\" 102 | printf "\033]4;142;rgb:aa/b0/1e\033\\" 103 | printf "\033]4;214;rgb:f7/b1/25\033\\" 104 | printf "\033]4;109;rgb:71/95/86\033\\" 105 | printf "\033]4;175;rgb:c7/70/89\033\\" 106 | printf "\033]4;108;rgb:7d/b6/69\033\\" 107 | printf "\033]4;208;rgb:fb/6a/16\033\\" 108 | 109 | printf "\033]4;88;rgb:89/00/09\033\\" 110 | printf "\033]4;100;rgb:66/62/0d\033\\" 111 | printf "\033]4;136;rgb:a5/63/11\033\\" 112 | printf "\033]4;24;rgb:0e/53/65\033\\" 113 | printf "\033]4;96;rgb:7b/2b/5e\033\\" 114 | printf "\033]4;65;rgb:35/6a/46\033\\" 115 | printf "\033]4;130;rgb:9d/28/07\033\\" 116 | fi 117 | -------------------------------------------------------------------------------- /minimal-startpage/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) [2020] [Deepjyoti Barman] 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /minimal-startpage/README.md: -------------------------------------------------------------------------------- 1 | # HEADS UP! new startpage is done! 2 | this is my old startpage, however i have completely rewritten it to be modular. you can find it [here](https://github.com/KraXen72/glide). 3 | this part of the rosebox repo (minimal-startpage) will no longer be updated. 4 | [https://github.com/KraXen72/glide](https://github.com/KraXen72/glide) 5 | 6 | # heya ~ 7 | this is my minimal rosebox-themed startpage made with HTML, CSS, W3.CSS and JS. 8 | 9 | - click **bottom right ◐** to toggle the visibility of the image 10 | - click **bottom left ⚙** to open the settings popup 11 | - you can make these buttons **invisible but clickable** in the settings. 12 | 13 | ![waifu](../_screenshots/old_startpage1.png) 14 | ## intuitive settings / config ui + saving config to localStorage. 15 | ![config](../_screenshots/old_startpage_settings.gif) 16 | 17 | ## installation (chrome / chromium) 18 | I included a simple ``manifest.json`` so you can import it as a chrome extension. 19 | just clone this repo and load unpacked extension. (you have to enable developer mode) 20 | ![install](../_screenshots/chrome_install.png) 21 | 22 | you can also install this in firefox or any browser, just set the ``index.html`` to your new tab page / create an addon which replaces the new tab page with this ``index.html`` 23 | 24 | or just use this [link](https://kraxen72.github.io/rosebox/minimal-startpage) idc 25 | 26 | ## custom image 27 | if you want a custom image, put it in the ``rosebox/minimal-startpage/img`` folder. 28 | it is recommended for the image to have an aspect ratio of 0.75 to 0.85 to fit correctly. (aspect ratio = width / height). alternatively, if you don't want to edit the image, you can uncomment the last few lines in ``main.css`` and play around with it until satisfied: 29 | - ``object-fit:`` can be ``cover`` which selects a portion of the image to fit the space or ``contain`` which resizes the whole image to fit 30 | - ``object-position:`` determines where the image will be aligned. some basic ones are ``top``, ``center`` and ``bottom``. check [this link](https://css-tricks.com/almanac/properties/o/object-position/#examples) for more complex alignments. 31 | -------------------------------------------------------------------------------- /minimal-startpage/data-handler.js: -------------------------------------------------------------------------------- 1 | // this file is used to handle all localStorage logic, data saving and loading, all saving and loading utility functions 2 | 3 | //the main object which has all the data in it 4 | var config = { 5 | "config": { 6 | "greeting": "heya", 7 | "img": "img/yahallo.png" 8 | 9 | }, 10 | "links-left": [ 11 | { 12 | "name": "gmail", 13 | "url": "https://mail.google.com/mail/u/0/#inbox" 14 | }, 15 | { 16 | "name": "outlook", 17 | "url": "https://login.microsoftonline.com/common/oauth2/authorize?client_id=00000002-0000-0ff1-ce00-000000000000&redirect_uri=https%3a%2f%2foutlook.office365.com%2fowa%2f&resource=00000002-0000-0ff1-ce00-000000000000&response_mode=form_post&response_type=code+id_token&scope=openid&msafed=0&client-request-id=78bf890f-0b5c-4cf4-a80a-a4400ccc6641&protectedtoken=true&domain_hint=gamca.sk&nonce=637094247029805070.17ea6557-27d5-4316-a030-99ab8b69723a&state=Dcs7EoAgDEVR0NqlRMInPLKcoI6F41hYuH0pzu2ud87NwzR4HnGoGawlFXDSxsLgNeKwKgJK2IVKjpWMM5Oq9darImXz413C81k47d5sfa8f" 18 | }, 19 | { 20 | "name": "r/unixpron", 21 | "url": "https://www.reddit.com/r/unixporn/" 22 | }, 23 | { 24 | "name": "r/mk", 25 | "url": "https://www.reddit.com/r/MechanicalKeyboards/" 26 | }, 27 | { 28 | "name": "monkeytype", 29 | "url": "https://monkeytype.com/" 30 | }, 31 | { 32 | "name": "rosebox", 33 | "url": "https://github.com/KraXen72/rosebox" 34 | }, 35 | { 36 | "name": "krunker market", 37 | "url": "https://www.krunker.io/social.html" 38 | }, 39 | { 40 | "name": "yeehow item list", 41 | "url": "https://yee.how/item-list/" 42 | } 43 | 44 | ], 45 | "links-right": [ 46 | { 47 | "name": "github", 48 | "url": "https://github.com/" 49 | }, 50 | { 51 | "name": "vivaldi mod forum", 52 | "url": "https://forum.vivaldi.net/category/52/modifications" 53 | }, 54 | { 55 | "name": "trello", 56 | "url": "https://trello.com/kraxen7/boards" 57 | }, 58 | { 59 | "name": "pcmskin3d", 60 | "url": "https://www.planetminecraft.com/pmcskin3d/" 61 | }, 62 | { 63 | "name": "keybr", 64 | "url": "https://www.keybr.com/" 65 | }, 66 | { 67 | "name": "planning center", 68 | "url": "https://services.planningcenteronline.com/dashboard/0" 69 | }, 70 | { 71 | "name": "wallpaper collection", 72 | "url": "https://mega.nz/folder/PpohCIpT#tII4Q60AFpgfnEYFywwlow" 73 | }, 74 | { 75 | "name": "catus airsoft", 76 | "url": "https://catus.sk" 77 | } 78 | ] 79 | } 80 | 81 | //main Handler object which will house all the methods. 82 | const dataHandler = {} 83 | 84 | /** 85 | * load the links into the startpage from localStorage or provided json 86 | * @param {String} mode "normal" or "config" normal loads everything normally, config loads stuff for configuring (drag n drop enabled etc) 87 | * @param {String} customjson json (string) to load 88 | */ 89 | dataHandler.configLoad = (mode, customjson) => { 90 | const parentLeft = window.globals.parentLeft 91 | const parentRight = window.globals.parentRight 92 | 93 | parentLeft.innerHTML = "" 94 | parentRight.innerHTML = "" 95 | 96 | if (typeof customjson !== "undefined") { 97 | config = JSON.parse(customjson) 98 | parentRight.innerHTML = "" 99 | parentLeft.innerHTML = "" 100 | } 101 | 102 | if ('config' in config) { 103 | if ('greeting' in config["config"]) { 104 | document.querySelector('#greeting').innerText = config.config.greeting 105 | } 106 | if ('img' in config["config"]) { 107 | document.querySelector('img').src = config.config.img 108 | } 109 | } 110 | 111 | let borderme = document.querySelectorAll(".borderme") 112 | 113 | if (mode == "config") { 114 | borderme.forEach(e => {e.classList.add("borderme-bordered")}); 115 | } else { 116 | borderme.forEach(e => {e.classList.remove("borderme-bordered")}); 117 | } 118 | 119 | for (let i = 0; i < Object.keys(config["links-left"]).length; i++) { 120 | spHandler.renderLink(mode, config, "left", i) 121 | } 122 | 123 | for (let i = 0; i < Object.keys(config["links-right"]).length; i++) { 124 | spHandler.renderLink(mode, config, "right", i) 125 | } 126 | 127 | if (mode == "config") { 128 | spHandler.dragSetup() 129 | } 130 | 131 | console.log("loaded config: ", config) 132 | } 133 | function configloadnormal() {configLoad("normal")} 134 | 135 | console.log("init data-handler"/*, dataHandler*/) 136 | 137 | -------------------------------------------------------------------------------- /minimal-startpage/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/minimal-startpage/favicon.ico -------------------------------------------------------------------------------- /minimal-startpage/img/icon64.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/minimal-startpage/img/icon64.png -------------------------------------------------------------------------------- /minimal-startpage/img/mai-san.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/minimal-startpage/img/mai-san.png -------------------------------------------------------------------------------- /minimal-startpage/img/yahallo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/minimal-startpage/img/yahallo.png -------------------------------------------------------------------------------- /minimal-startpage/img/yahallo2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KraXen72/rosebox/b2aa4c2db81f8913781bc8ff90440d559621dd6c/minimal-startpage/img/yahallo2.png -------------------------------------------------------------------------------- /minimal-startpage/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | ~ 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 37 | 40 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /minimal-startpage/main.css: -------------------------------------------------------------------------------- 1 | :root { 2 | --max-width-col: 35rem; 3 | --max-width-ext: 60rem; 4 | --spacer: 1.5rem; 5 | --radius: 5px; 6 | --border-size: 2px; 7 | 8 | --rb-primary-bg: #262626; 9 | --rb-accent-fg: #a57562; 10 | } 11 | html { 12 | background: #222222; 13 | color: #a3a5aa; 14 | } 15 | .showcontainer {display: block !important;} 16 | img { 17 | /*height: 354.25px !important;*/ 18 | height: 358px; 19 | width: auto; 20 | user-select: none; 21 | -moz-user-select: none; 22 | -webkit-user-drag: none; 23 | -webkit-user-select: none; 24 | -ms-user-select: none; 25 | 26 | border-top-left-radius: var(--radius); 27 | border-bottom-left-radius: var(--radius); 28 | } 29 | .w3gridclass { 30 | width: 100%; 31 | } 32 | 33 | body { 34 | position: relative; 35 | 36 | display: flex; 37 | justify-content: center; 38 | align-items: center; 39 | flex-direction: column; 40 | 41 | min-height: 100vh; 42 | } 43 | #settings-wrapper { 44 | position: absolute; 45 | bottom: var(--spacer) !important; 46 | } 47 | .container-outer { 48 | box-sizing: border-box; 49 | user-select: none; 50 | position: relative; 51 | 52 | width: max-content; 53 | padding: 0 !important; 54 | } 55 | /*inner container in the outer container, so js doesent fuck up*/ 56 | #maincontainer { 57 | box-sizing: border-box; 58 | display: grid; 59 | grid-template: min-content 1fr / min-content 1fr 1fr; 60 | grid-template-areas: 61 | "image title title" 62 | "image links links"; 63 | 64 | max-width: var(--max-width-ext); 65 | width: 100%; 66 | padding: 0; 67 | border-radius: var(--radius); 68 | background: var(--rb-primary-bg); 69 | } 70 | #maincontainer.noimage { 71 | max-width: var(--max-width-col); 72 | width: 100%; 73 | } 74 | 75 | .left-img{ grid-area: image; } 76 | h1.heya { 77 | grid-area: title; 78 | padding: calc( var(--spacer) / 2 ) var(--spacer) calc( var(--spacer) / 2 ) var(--spacer) !important; 79 | } 80 | .linkholder { 81 | grid-area: links; 82 | padding: 0 var(--spacer) var(--spacer) var(--spacer) !important; 83 | 84 | display: grid; 85 | grid-template: 1fr / 1fr 1fr; 86 | grid-template-areas: "left right"; 87 | gap: calc( var(--spacer) / 2); 88 | } 89 | /*link holders*/ 90 | .linkstop { /*links top*/ 91 | width: 100%; 92 | box-sizing: border-box; 93 | } 94 | #leftlinks { grid-area: left; } 95 | #rightlinks { grid-area: right; } 96 | 97 | 98 | ul { 99 | list-style-type: none; 100 | font-size: 20px; 101 | user-select: none; 102 | } 103 | li{user-select: none;} 104 | a {text-decoration: none ;} 105 | a:not(span):hover {opacity: 0.8;} 106 | .accent { 107 | color: var(--rb-accent-fg) ; 108 | padding-right: 10px; 109 | } 110 | 111 | /*tweaks*/ 112 | span.accent {min-width: 25px ;} 113 | .jsoninp {width: 50%;} 114 | 115 | .toggle, .settings { /*small buttons*/ 116 | padding: 5px; 117 | position: absolute; 118 | bottom: 0; 119 | right: 0; 120 | background: transparent; 121 | border: none; 122 | color: #a3a5aa; 123 | outline: 0px transparent; 124 | transition: color 0.05s; 125 | user-select: none; 126 | cursor: pointer; 127 | } 128 | .toggle:active, .settings:active { 129 | background: transparent; 130 | border: none; 131 | color: #4f4f50; 132 | } 133 | .settings {left: 0} 134 | 135 | /*resizing when img is hidden*/ 136 | .leftimghidden {display: none !important;} 137 | 138 | /*rosebox buttons and inputs*/ 139 | .rb-button { 140 | background-color: #5e4c44; 141 | border-color: var(--rb-accent-fg); 142 | border-radius: var(--radius); 143 | border-style: solid; 144 | color: #a3a5aa; 145 | } 146 | .rb-button, .rb-input {outline: 0px transparent !important;} 147 | .rb-button:hover {opacity: 0.9;} 148 | .rb-button:active {opacity: 0.5;} 149 | .rb-input { 150 | background-color: #232323; 151 | border-color: var(--rb-accent-fg); 152 | border-radius: var(--radius); 153 | border-style: solid; 154 | color: #a3a5aa 155 | } 156 | 157 | 158 | /*dragging*/ 159 | .dragabble-link { 160 | cursor: grab; 161 | opacity: 1; 162 | user-select: none; 163 | } 164 | .dragabble-link a {user-select: none !important; } 165 | .dragabble-link.dragging { 166 | opacity: .5; 167 | user-select: none !important; 168 | cursor: grabbing; 169 | } 170 | .dragging a {user-select: none !important;} 171 | 172 | .top-config { 173 | width: 100%; 174 | } 175 | 176 | /*hidden buttons*/ 177 | .incognito {opacity: 0.001;} 178 | .incognito:hover {opacity: 1;} 179 | 180 | /*config stuff*/ 181 | .borderme { 182 | transition: all, 0.2s; 183 | transition-timing-function: ease-in; 184 | } 185 | .borderme-bordered { 186 | border: 2px dashed rgba(211, 211, 211, 0.534); 187 | border-radius: var(--radius); 188 | padding: 0 .5rem; 189 | } 190 | #config-controls { 191 | display: none; 192 | } 193 | #cancel { 194 | display: none; 195 | float: right; 196 | } 197 | 198 | /*link containers*/ 199 | .drag-container { 200 | min-height: 7vh; 201 | min-width: 100%; 202 | padding-inline-start: 0px; 203 | margin: 0; 204 | } 205 | .extrasettings { 206 | width: var(--max-width-ext) !important; 207 | margin: auto; 208 | background: #282828; 209 | padding: 10px; 210 | border-radius: var(--radius); 211 | } 212 | 213 | /*search*/ 214 | .search { 215 | padding: 1rem; 216 | background-color: var(--rb-primary-bg); 217 | margin-bottom: var(--spacer); 218 | border-radius: var(--radius); 219 | overflow: hidden; 220 | font-family: Verdana,sans-serif; 221 | font-size: 20px; 222 | 223 | border: var(--border-size) solid var(--rb-primary-bg); 224 | } 225 | /*.search:hover { border: var(--border-size) solid var(--rb-accent-fg);}*/ 226 | .search form { display: inline; } 227 | .search input { 228 | font-family: Verdana,sans-serif; 229 | background: none; 230 | display: inline; 231 | border: none; 232 | color: var(--rb-accent-fg); 233 | margin: 0 /*1rem*/; 234 | font-size: 20px; 235 | } 236 | .search input:focus { outline: none; } 237 | .search input[type="text"] { width: 80%;} 238 | 239 | 240 | /*uncomment this if you have a tall image*/ 241 | /* 242 | img { 243 | width: 277px; 244 | object-fit: cover; 245 | object-position: top; 246 | } 247 | */ 248 | -------------------------------------------------------------------------------- /minimal-startpage/main.js: -------------------------------------------------------------------------------- 1 | //globals 2 | window.globals = {} 3 | window.globals.parentLeft = {} 4 | window.globals.parentRight = {} 5 | window.globals.leftimage = {} 6 | window.globals.maincontainer = {} 7 | 8 | //localstorage 9 | let hideWaifu = localStorage.getItem("hideWaifu"); //saved value if image is hidden or not 10 | let localSettings = localStorage.getItem("jsonConfig") //current links and settings saved in localstorage 11 | 12 | let showSettings = false; 13 | 14 | document.addEventListener('DOMContentLoaded', () => { 15 | window.globals.parentLeft = document.getElementById("wrapper-left") 16 | window.globals.parentRight = document.getElementById("wrapper-right") 17 | window.globals.leftimage = document.getElementById("waifuimg"); 18 | window.globals.maincontainer = document.getElementById("maincontainer"); 19 | 20 | document.querySelector('img').onload = showbody 21 | document.querySelector('img').onerror = showbody 22 | 23 | //if we checked "make settings and toggle buttons only appear on hover", then add .incognito to them 24 | if (localStorage.getItem("hidebuttons") == "true") { 25 | document.getElementById("toggle").classList.add('incognito') 26 | document.getElementById("settings").classList.add('incognito') 27 | } 28 | 29 | //load config 30 | if (localSettings !== null) { //if we already have something saved, load it 31 | dataHandler.configLoad("normal", localSettings) 32 | } else { 33 | dataHandler.configLoad("normal", JSON.stringify(config)) 34 | } 35 | 36 | //image toggling 37 | if (hideWaifu === "enabled") {spHandler.waifu.hide()}; //hide image if set to hide 38 | document.querySelector("#toggle").onclick = () => { //add eventlistener to toggle 39 | hideWaifu = localStorage.getItem('hideWaifu'); 40 | if (hideWaifu !== "enabled") { 41 | spHandler.waifu.hide() 42 | } else { 43 | spHandler.waifu.show() 44 | } 45 | } 46 | 47 | //settings 48 | document.getElementById('settings').addEventListener("click", () => { 49 | if (showSettings == false) { 50 | showSettings = true 51 | confHandler.createSettingsElem() 52 | } else { 53 | document.getElementById("settings-wrapper").remove() 54 | showSettings = false 55 | } 56 | }) 57 | }) 58 | 59 | function showbody() { 60 | document.getElementById('outercontainer').classList.add("showcontainer"); //show the container on image load 61 | } 62 | 63 | console.log("---------- loaded main ----------") -------------------------------------------------------------------------------- /minimal-startpage/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "chrome_url_overrides": { 3 | "newtab": "index.html" 4 | }, 5 | "description": "Overrides the browsers newtab page with a rosebox minimal-startpage.", 6 | "icons": { 7 | "64": "img/icon64.png" 8 | }, 9 | "manifest_version": 2, 10 | "name": "minimal-startpage", 11 | "short_name": "minimal-startpage", 12 | "version": "2.0", 13 | "author": "kraxen72", 14 | "permissions": ["storage"] 15 | } 16 | -------------------------------------------------------------------------------- /minimal-startpage/sample-config.json: -------------------------------------------------------------------------------- 1 | { 2 | "links-left": [ 3 | { 4 | "name": "gmail", 5 | "url": "https://mail.google.com/mail/u/0/#inbox" 6 | }, 7 | { 8 | "name": "outlook", 9 | "url": "https://login.microsoftonline.com/common/oauth2/authorize?client_id=00000002-0000-0ff1-ce00-000000000000&redirect_uri=https%3a%2f%2foutlook.office365.com%2fowa%2f&resource=00000002-0000-0ff1-ce00-000000000000&response_mode=form_post&response_type=code+id_token&scope=openid&msafed=0&client-request-id=78bf890f-0b5c-4cf4-a80a-a4400ccc6641&protectedtoken=true&domain_hint=gamca.sk&nonce=637094247029805070.17ea6557-27d5-4316-a030-99ab8b69723a&state=Dcs7EoAgDEVR0NqlRMInPLKcoI6F41hYuH0pzu2ud87NwzR4HnGoGawlFXDSxsLgNeKwKgJK2IVKjpWMM5Oq9darImXz413C81k47d5sfa8f" 10 | }, 11 | { 12 | "name": "r/unixpron", 13 | "url": "https://www.reddit.com/r/unixporn/" 14 | }, 15 | { 16 | "name": "r/mk", 17 | "url": "https://www.reddit.com/r/MechanicalKeyboards/" 18 | }, 19 | { 20 | "name": "monkeytype", 21 | "url": "https://monkeytype.com/" 22 | }, 23 | { 24 | "name": "rosebox", 25 | "url": "https://github.com/KraXen72/rosebox" 26 | }, 27 | { 28 | "name": "krunker market", 29 | "url": "https://www.krunker.io/social.html" 30 | }, 31 | { 32 | "name": "yeehow item list", 33 | "url": "https://yee.how/item-list/" 34 | } 35 | 36 | ], 37 | "links-right": [ 38 | { 39 | "name": "github", 40 | "url": "https://github.com/" 41 | }, 42 | { 43 | "name": "vivaldi mod forum", 44 | "url": "https://forum.vivaldi.net/category/52/modifications" 45 | }, 46 | { 47 | "name": "trello", 48 | "url": "https://trello.com/kraxen7/boards" 49 | }, 50 | { 51 | "name": "pcmskin3d", 52 | "url": "https://www.planetminecraft.com/pmcskin3d/" 53 | }, 54 | { 55 | "name": "keybr", 56 | "url": "https://www.keybr.com/" 57 | }, 58 | { 59 | "name": "planning center", 60 | "url": "https://services.planningcenteronline.com/dashboard/0" 61 | }, 62 | { 63 | "name": "wallpaper collection", 64 | "url": "https://mega.nz/folder/PpohCIpT#tII4Q60AFpgfnEYFywwlow" 65 | }, 66 | { 67 | "name": "catus airsoft", 68 | "url": "https://catus.sk" 69 | } 70 | ] 71 | } -------------------------------------------------------------------------------- /minimal-startpage/startpage-handler.js: -------------------------------------------------------------------------------- 1 | //this file is for handling anything with setting up / displaying the startpage itself 2 | 3 | //main Handler object which will house all the methods. 4 | const spHandler = { 5 | waifu: {} 6 | } 7 | 8 | /** 9 | * render link for a specific parent. must be called separately for every link (ex. using a for loop) 10 | * @param {String} mode "normal" or "config", normal adds ~ before links, config adds × which are x buttons 11 | * @param {Object} config the config object to reference data from 12 | * @param {String} leftright "left" or "right", used to determine which side to render links for 13 | * @param {Number} i index of the link 14 | */ 15 | spHandler.renderLink = (mode, config, leftright, i) => { 16 | let li = document.createElement("li"); 17 | 18 | if (mode == "config") { 19 | li.draggable = "true" 20 | li.classList.add("dragabble-link") 21 | li.style.userSelect = "none"; 22 | } 23 | 24 | let a = document.createElement("a") 25 | a.href = config[`links-${leftright}`][i].url 26 | a.id = `link-${i+1}` 27 | a.innerText = config[`links-${leftright}`][i].name 28 | a.style.cursor = "pointer" 29 | 30 | let span = document.createElement("span"); 31 | span.classList.add("accent") 32 | span.innerHTML = mode == "normal" ? "~" : "×" 33 | span.style.cursor = "pointer" 34 | if (mode == "config") { 35 | a.setAttribute("url", a.getAttribute("href")) 36 | a.removeAttribute('href'); 37 | a.style.cursor = "grab" 38 | span.addEventListener("click", () => {if (window.confirm(`delete '${a.innerText}' ?`)) {li.remove()}}) 39 | } 40 | if (mode == "config") { 41 | li.prepend(span) 42 | li.appendChild(a) 43 | if (leftright == "left") { 44 | window.globals.parentLeft.appendChild(li) 45 | } else { 46 | window.globals.parentRight.appendChild(li) 47 | } 48 | 49 | } else { 50 | a.prepend(span) 51 | li.appendChild(a) 52 | if (leftright == "left") { 53 | window.globals.parentLeft.appendChild(li) 54 | } else { 55 | window.globals.parentRight.appendChild(li) 56 | } 57 | } 58 | } 59 | 60 | /** 61 | * set up dragging behaviour. expects .draggable-link as draggables and .drag-container as their parent 62 | */ 63 | spHandler.dragSetup = () => { 64 | console.log("setting up drag&drop") 65 | const draggables = document.querySelectorAll('.dragabble-link') 66 | const containers = document.querySelectorAll('.drag-container') 67 | 68 | 69 | draggables.forEach(link => { 70 | //add dragging class when we recieve 'dragstart' event and remove the class on 'dragend' event 71 | link.addEventListener('dragstart', () => { 72 | link.classList.add("dragging") 73 | link.style.userSelect = "none" 74 | }) 75 | 76 | link.addEventListener('dragend', () => { 77 | link.classList.remove("dragging") 78 | link.style.userSelect = "none" 79 | }) 80 | }) 81 | 82 | containers.forEach(container => { 83 | container.addEventListener('dragover', e => { 84 | e.preventDefault() 85 | //inserts the element in the correct position in the container after finished dragging 86 | const afterElement = getAfterElement(container, e.clientY) 87 | const current = document.querySelector('.dragging') 88 | 89 | if (afterElement == null) { 90 | container.appendChild(current) 91 | } else { 92 | container.insertBefore(current, afterElement) 93 | } 94 | }) 95 | }) 96 | 97 | //get the element we want to put the .dragging element after 98 | function getAfterElement(c, y) { 99 | const dragabbleElements = [...c.querySelectorAll(".dragabble-link:not(.dragging)")] 100 | 101 | //black magic to determine if its before or after the element, using the boundingClientRect 102 | //don't ask me how it works only webDevSimplified on youtube knows 103 | return dragabbleElements.reduce((closest, child) => { 104 | const box = child.getBoundingClientRect() 105 | const offset = y - box.top - box.height / 2 106 | if (offset < 0 && offset > closest.offset) { 107 | return { offset: offset, element: child} 108 | } else { 109 | return closest 110 | } 111 | }, {offset: Number.NEGATIVE_INFINITY}).element 112 | } 113 | } 114 | 115 | //waifu toggling (left image toggling) 116 | //show and hide the left image respectively 117 | spHandler.waifu.show = () => { 118 | window.globals.leftimage.classList.remove("leftimghidden"); 119 | window.globals.maincontainer.classList.remove("noimage"); 120 | 121 | localStorage.setItem("hideWaifu", null); 122 | } 123 | spHandler.waifu.hide = () => { 124 | window.globals.leftimage.classList.add("leftimghidden"); 125 | window.globals.maincontainer.classList.add("noimage"); 126 | 127 | localStorage.setItem("hideWaifu", "enabled"); 128 | } 129 | 130 | console.log("init startpage-handler"/*, spHandler*/) -------------------------------------------------------------------------------- /monkeytype/README.md: -------------------------------------------------------------------------------- 1 | # rosebox theme for monkeytype.com 2 | 3 | ![thumb](../_screenshots/monkeytype_old.png) 4 | 5 | ## color values 6 | ![preview](../_screenshots/monkeytype_colors.png) 7 | 8 | yes i changed the text color its still wip 9 | 10 | [link to try out the theme](https://monkeytype.com?customTheme=%23242425%2C%23a57562%2C%23a57562%2C%23505b5e%2C%23ccc2b1%2C%237e2a2a%2C%23771d1d%2C%23ca4754%2C%237e2a33) 11 | -------------------------------------------------------------------------------- /simple-bar-rosebox/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "trailingComma": "none", 3 | "tabWidth": 2, 4 | "semi": false, 5 | "singleQuote": true, 6 | "printWidth": 120 7 | } 8 | -------------------------------------------------------------------------------- /simple-bar-rosebox/README.md: -------------------------------------------------------------------------------- 1 | # simple-bar 2 | 3 | ![bar](../_screenshots/simple_bar.png) 4 | 5 | **Note:** This is a fork of Jean Tinlands wonderful Simple-Bar, all that has been altered here is the colors to match Rosebox. 6 | 7 | Developed by [Jean Tinland](https://www.jeantinland.com) 8 | 9 | ## Installation 10 | 11 | Clone this repo to your Übersicht widgets directory with the following command. 12 | 13 | ```bash 14 | $ git clone https://github.com/Jean-Tinland/simple-bar $HOME/Library/Application\ Support/Übersicht/widgets/simple-bar 15 | ``` 16 | 17 | Follow the install instructions found here: https://github.com/Jean-Tinland/simple-bar 18 | 19 | Then overwrite the 'simple-bar/lib/styles/Theme.js' with the 'Theme.js' found in this folder 20 | 21 | Then overwrite the 'simple-bar/lib/data.js' with the 'data.js' found in this folder 22 | 23 | > DONE! 24 | 25 | 26 | -------------------------------------------------------------------------------- /simple-bar-rosebox/rosebox-dark.js: -------------------------------------------------------------------------------- 1 | export const RoseboxDark = { 2 | name: 'Rosebox Dark', 3 | kind: 'dark', 4 | main: '#262626', 5 | mainAlt: '#3a3a3a', 6 | minor: '#5e4c44', 7 | red: '#D08770', 8 | green: '#A3BE8C', 9 | yellow: '#bebebe', 10 | orange: '#8b8f7e', 11 | blue: '#637a8a', 12 | magenta: '#78758A', 13 | cyan: '#877979', 14 | black: '#262626', 15 | white: '#bab5b7', 16 | foreground: '#d5be98', 17 | transparentDark: 'rgba(0, 0, 0, 0.05)', 18 | defaultFont: 'JetBrains Mono, monospace', 19 | barHeight: '28px', 20 | barRadius: '3px', 21 | barInnerMargin: '3px', 22 | itemRadius: '3px', 23 | itemInnerMargin: '3px 7px', 24 | itemOuterMargin: '0 0 0 5px', 25 | hoverRing: '0 0 0 2px rgba(255, 255, 255, 0.75)', 26 | focusRing: '0 0 0 2px rgb(255, 255, 255)', 27 | lightShadow: '0 0px 0px rgba(0, 0, 0, 0.24)', 28 | transitionEasing: 'cubic-bezier(0.4, 0, 0.2, 1)', 29 | clickEffect: 'rgba(255, 255, 255, 0.3)' 30 | } 31 | -------------------------------------------------------------------------------- /terminals/README.md: -------------------------------------------------------------------------------- 1 | # Terminals 2 | 3 | ![alacritty](../_screenshots/neofetch.png) 4 | 5 | **supported terminals: (for now)** 6 | - Alacritty 7 | + Download the file `alacritty-rosebox.toml` 8 | + To your `alacritty.toml` add the following: 9 | ```toml 10 | import = [ 11 | "path-to-alacritty-rosebox.toml/alacritty-rosebox.toml" 12 | ] 13 | ``` 14 | - Kitty 15 | 16 | ``all config files are in this directory`` 17 | 18 | -------------------------------------------------------------------------------- /terminals/alacritty-rosebox.toml: -------------------------------------------------------------------------------- 1 | # Rewrite of Rosebox theme in .toml 2 | [colors.primary] 3 | background = "#262626" 4 | foreground = "#bab5b7" 5 | 6 | [colors.cursor] 7 | text = "#262626" 8 | cursor = "#bab5b7" 9 | 10 | [colors.normal] 11 | black = "#262626" 12 | red = "#d08770" 13 | green = "#a3be8c" 14 | yellow = "#a57562" 15 | blue = "#637a8a" 16 | magenta = "#78758a" 17 | cyan = "#877979" 18 | white = "#a3a5aa" 19 | 20 | [colors.bright] 21 | black = "#827e80" 22 | red = "#d08770" 23 | green = "#a3be8c" 24 | yellow = "#a57562" 25 | blue = "#637a8a" 26 | magenta = "#78758a" 27 | cyan = "#877979" 28 | white = "#a3a5aa" 29 | -------------------------------------------------------------------------------- /terminals/rosebox.conf: -------------------------------------------------------------------------------- 1 | background #262626 2 | foreground #bab5b7 3 | 4 | selection_background #bab5b7 5 | selection_foreground #1d2021 6 | 7 | cursor #a89984 8 | cursor_text_color background 9 | 10 | active_tab_background #1d2021 11 | active_tab_foreground #d4be98 12 | active_tab_font_style bold 13 | inactive_tab_background #1d2021 14 | inactive_tab_foreground #a89984 15 | inactive_tab_font_style normal 16 | 17 | # Black 18 | color0 #262626 19 | color8 #3a3a3a 20 | 21 | # Red 22 | color1 #D08770 23 | color9 #D08770 24 | 25 | # Green 26 | color2 #A3BE8C 27 | color10 #A3BE8C 28 | 29 | # Yellow 30 | color3 #bebebe 31 | color11 #8b8f7e 32 | 33 | # Blue 34 | color4 #637a8a 35 | color12 #637a8a 36 | 37 | # Magenta 38 | color5 #78758A 39 | color13 #78758A 40 | 41 | # Cyan 42 | color6 #877979 43 | color14 #877979 44 | 45 | # White 46 | color7 #bab5b7 47 | color15 #bab5b7 48 | -------------------------------------------------------------------------------- /vivaldi/README.md: -------------------------------------------------------------------------------- 1 | # rosebox theme for vivaldi 2 | 3 | ## Vivaldi theme: 4 | ![1](../_screenshots/vivaldi_old.png) 5 | ![2](../_screenshots/vivaldi_old2.png) 6 | Create a new theme and set it up like this: 7 | > **vivaldi 5.0 and up: [apply from vivaldi theme store](https://themes.vivaldi.net/themes/g1OJ53DlAob)** 8 | 9 | ![theme](../_screenshots/vivaldi_themesett.png) 10 | 11 | ## Custom css 12 | this css is mostly just what i use/my tweaks. 13 | 14 | go to ``vivaldi://experiments`` 15 | enable 16 | ![this](../_screenshots/vivaldi_checkbox.png) 17 | this will show up in your settings(set your own directory): 18 | ![css](../_screenshots/vivaldi_csspath.png) 19 | and put the custom.css file from this repo there 20 | -------------------------------------------------------------------------------- /vivaldi/custom.css: -------------------------------------------------------------------------------- 1 | /* mostly just tweaks, not rly related to rosebox in any way */ 2 | 3 | /* remove white outline on favicons if tab is active*/ 4 | #switch button.webviewbtn img { 5 | background-color: transparent !important; 6 | } 7 | .theme-dark .tab-position .tab.active .tab-header .favicon { 8 | filter: none !important; 9 | } 10 | .tab-header .favicon { 11 | filter: none; 12 | background: transparent !important; 13 | } 14 | 15 | #tabs-container .tab .favicon { 16 | filter: grayscale(30%) !important; 17 | } 18 | /* fix the fluid corner before & after positioning*/ 19 | .tabs-top .tab.active:not(.marked, .tab-mini, .tab-in-accordion):after, 20 | .tabs-top .tab.active:not(.marked, .tab-mini, .tab-in-accordion):before { 21 | bottom: -1px; 22 | } 23 | 24 | .tab:not(.active) .tab-header .title { 25 | color: var(--colorFg); 26 | } 27 | 28 | #browser.tabs-top .sync-and-trash-container { 29 | display: none; 30 | } 31 | 32 | /* vertical tabs overrides */ 33 | :is(#browser.address-top.tabs-left, #browser.address-top.tabs-right, #browser.address-top.tabs-off) { 34 | .UrlBar-AddressField { 35 | margin-inline: 12px; 36 | } 37 | .button-toolbar.profile-popup { 38 | margin-right: 12px; 39 | } 40 | /* #tabs-container .tab-strip { 41 | -webkit-app-region: drag; 42 | } */ 43 | 44 | &.maximized { 45 | .toolbar:has(.window-buttongroup.on-mainbar) { 46 | min-height: 0; 47 | } 48 | .window-buttongroup { 49 | height: 100%; 50 | } 51 | } 52 | } 53 | #browser.address-top.tabs-off #header > .tabbar-wrapper { 54 | height: 0px; 55 | } 56 | 57 | /* workspace switcher css */ 58 | :is(.tabs-top, .tabs-bottom) 59 | .button-toolbar.workspace-popup.tabbar-workspace-button { 60 | button[name="WorkspaceButton"] { 61 | max-width: 30px !important; 62 | } 63 | } 64 | 65 | #app .button-toolbar.workspace-popup button[title="Workspaces"] { 66 | padding-left: 4px !important; 67 | padding-right: 4px !important; 68 | 69 | /* workspace-switcher: down-arrow */ 70 | .button-toolbar-menu-indicator { 71 | display: none; 72 | } 73 | } 74 | 75 | .button-popup::before { 76 | filter: none; 77 | } 78 | 79 | /* different workspace playing audio */ 80 | span.button-icon.audio { 81 | position: absolute; 82 | /* box-sizing: border-box; */ 83 | left: 8px !important; 84 | bottom: 2px; 85 | height:20px !important; 86 | width: 20px !important; 87 | padding: 0 !important; 88 | 89 | background: var(--colorBg); 90 | border-radius: 100%; 91 | } 92 | span.button-icon.audio > canvas { 93 | transform: scale(0.45) translateX(4px); 94 | } 95 | 96 | /* linux fixes */ 97 | #browser.linux.address-top .toolbar-mainbar:has(.window-buttongroup.on-mainbar) { 98 | min-height: calc(32px / var(--uiZoomLevel)); 99 | } 100 | 101 | #browser.linux .window-buttongroup { 102 | height: 100%; 103 | top: 0; 104 | right: 0; 105 | button { 106 | position: relative; 107 | transform: none; 108 | margin: 0; 109 | width: 30px; 110 | background-color: transparent; 111 | display: flex; 112 | justify-content: center; 113 | padding-block: 10px; 114 | border-radius: 0px; 115 | /* border: 1px solid red; */ 116 | height: calc(34px / var(--uiZoomLevel) + 10px); 117 | 118 | &::before { 119 | z-index: -1; 120 | position: absolute; 121 | top: 5px; 122 | box-sizing: border-box; 123 | border-radius: 100%; 124 | content: ''; 125 | display: block; 126 | width: 20px; 127 | aspect-ratio: 1/1; 128 | } 129 | &:hover { 130 | fill: black; 131 | background-color: transparent; 132 | } 133 | } 134 | 135 | /* custom kde plasma breeze window decorations*/ 136 | /* please trust me when i tell you not to worry about how long this took */ 137 | .window-minimize path { 138 | d: path("M 5.0000001,8.7941666 1e-7,3.7941667 0.5891668,3.205 5.0000001,7.6158332 9.4108334,3.205 9.9999999,3.7941667 Z"); 139 | } 140 | .window-close path { 141 | d: path("M 10,0.67307692 9.3269231,0 5,4.3269231 0.67307692,0 0,0.67307692 4.3269231,5 0,9.3269231 0.67307692,10 5,5.6730769 9.3269231,10 10,9.3269231 5.6730769,5"); 142 | } 143 | .window-maximize { 144 | overflow: visible; 145 | .window-maximize-glyph path { 146 | d: path("M 5.0000001,2.3 1e-7,7.2999999 0.5891668,7.8891666 5.0000001,3.4783334 9.4108334,7.8891666 9.9999999,7.2999999 Z"); 147 | } 148 | .window-restore-glyph { 149 | transform-origin: 50% 50%; 150 | transform: scale(1.125) !important; 151 | path { 152 | d: path("M 5.0000002,-1.2e-7 4.6898547,0.3092692 2e-8,4.9999999 5.0000002,10 10,4.9999999 Z m 0,0.73900012 L 9.261,5 5,9.161 0.639,5 Z"); 153 | } 154 | } 155 | } 156 | 157 | button.window-minimize, 158 | button.window-maximize { 159 | &:hover::before { 160 | background-color: #AAAAAB; 161 | } 162 | &:active::before { 163 | background-color: #48484A; 164 | } 165 | } 166 | button.window-close { 167 | &:hover::before { 168 | background-color: #FF98A2; 169 | } 170 | &:active::before { 171 | background-color: #6C2128; 172 | } 173 | } 174 | } 175 | 176 | /* fix blurry tabs since vivaldi-stable 7.0 */ 177 | .linux .tab-strip .tab .title { 178 | mask: inherit !important; 179 | display: flex !important; 180 | height: unset !important; 181 | line-height: 1.45 !important; 182 | font-size: 13px !important; 183 | 184 | /* just in case */ 185 | mask-image: -webkit-linear-gradient(180deg, transparent 0, #fff 12px) !important; 186 | /* mask-position: top right !important; */ 187 | } 188 | .tab-position { 189 | will-change: auto; 190 | } 191 | 192 | #browser.linux #tabs-container { 193 | font-family: system-ui, 'Noto Sans', Cantarell, sans-serif; 194 | /* font-family: "Lexica Ultralegible", "Atkinson Hyperlegible", Helvetica, Arial, sans-serif; */ 195 | /* font-family: "Lexica Ultralegible", "Atkinson Hyperlegible", system-ui, 'Noto Sans', Cantarell, Helvetica, Arial, sans-serif; */ 196 | /* font-size: 100%; */ 197 | /* font-weight: 400; */ 198 | /* font-variant-numeric: slashed-zero; */ 199 | /* font-variant-ligatures: no-common-ligatures; */ 200 | } 201 | 202 | /* slightly larger text in url input / display (for laptop) */ 203 | .UrlFragment-Wrapper, .UrlBar-UrlField, 204 | #urlFieldInput, 205 | .OmniDropdown { 206 | font-size: 14px 207 | } 208 | .UrlBar-UrlField, #urlFieldInput { 209 | height: min-content !important; 210 | line-height: 1.35; 211 | } 212 | -------------------------------------------------------------------------------- /vivaldi/custom.oldcss: -------------------------------------------------------------------------------- 1 | html, body { 2 | background: #222222; 3 | } 4 | 5 | /*remove ugly border on omnibox*/ 6 | .vivaldi-addressfield:focus-within, .UrlBar-AddressField:focus, .UrlBar-AddressField:focus-within, .color-behind-tabs-on .SearchField:focus-within, .color-behind-tabs-on .UrlBar-AddressField:focus-within { 7 | border-color: transparent !important; 8 | box-shadow: none !important; 9 | } 10 | 11 | /*round close button idk*/ 12 | .tab-header .close { 13 | border-radius: 50%; 14 | } 15 | 16 | .vivaldi-v svg {transform: scale(1.025, 1);} /*vivali icon fix*/ 17 | 18 | /* remove white outline on favicons if tab is active*/ 19 | #switch button.webviewbtn img { background-color: transparent !important; } 20 | .theme-dark .tab-position .tab.active .tab-header .favicon { 21 | filter: none !important; 22 | } 23 | .tab-header .favicon { 24 | filter: none; 25 | background: transparent !important; 26 | } 27 | 28 | /* startpage quick switch to bg*/ 29 | .startpage { transition: background 0s !important; } 30 | #browser.break-mode {--colorAccentBgDarker: initial !important;} 31 | #browser, #browser ~ div[fill="currentcolor"] {fill: #e3dfdb !important;} 32 | 33 | /*f2*/ 34 | .quick-command-search-hint { 35 | background: transparent; 36 | } 37 | #modal-bg { 38 | top: 36% !important; 39 | } 40 | 41 | .tab:not(.active) .tab-header .title { 42 | color: var(--colorFg); 43 | } 44 | 45 | button[title="SharpBlade"] img { 46 | border-radius: 100% !important; 47 | } 48 | 49 | #tabs-container .tab .favicon {filter: grayscale(30%) !important;} 50 | 51 | .sync-and-trash-container { 52 | display: none; 53 | } 54 | 55 | .window-buttongroup button svg { 56 | background: #777777; 57 | fill: transparent; 58 | border-radius: 50% 59 | } 60 | 61 | .window-buttongroup button:hover svg { 62 | background: #999999; 63 | } 64 | 65 | .button-toolbar.newtab { 66 | transition-duration: 0s !important; 67 | transition-delay: 0s !important; 68 | animation-duration: 0s !important; 69 | animation-delay: 0s !important; 70 | } 71 | 72 | /* vertical tabs overrides */ 73 | :is(#browser.address-top.tabs-left, #browser.address-top.tabs-right, #browser.address-top.tabs-off) { 74 | .UrlBar-AddressField { margin-inline: 12px; } 75 | .button-toolbar.profile-popup { margin-right: 12px; } 76 | #tabs-container .tab-strip { -webkit-app-region: drag; } 77 | 78 | &.maximized { 79 | .toolbar:has(.window-buttongroup.on-mainbar) { 80 | min-height: 0; 81 | } 82 | .window-buttongroup { 83 | height: 100%; 84 | } 85 | } 86 | } 87 | #browser.address-top.tabs-off #header > .tabbar-wrapper { 88 | height: 0px; 89 | } 90 | 91 | /*google tasks tab stacking override*/ 92 | .mosaic-tile[style*="inset: 0% 0% 0% 80%;"] { 93 | inset: 0% 0% 0% 82.5% !important; 94 | } 95 | 96 | .mosaic-tile[style*="inset: 0% 20% 0% 0%;"] { 97 | inset: 0% 17.5% 0% 0% !important; 98 | } 99 | 100 | .mosaic-split[style*="inset: 0% 0% 0% 80%;"] { 101 | inset: 0% 0% 0% 82.5% !important; 102 | } 103 | #app .button-toolbar.workspace-popup button[title="Workspaces"] { 104 | padding-left: 4px !important; 105 | padding-right: 4px !important; 106 | } 107 | 108 | /* workspace switcher css */ 109 | .ToolbarButton-Button[title="Workspaces"], 110 | .button-toolbar.button-menu > button.ToolbarButton-Button[title="Workspaces"]:not(.button-textonly) { 111 | padding: 0 3px !important; 112 | } 113 | .ToolbarButton-Button[title="Workspaces"] .button-icon { 114 | margin: 0 3px 0 6px; 115 | } 116 | .ToolbarButton-Button[title="Workspaces"] .button-title { 117 | padding-left: 6px; 118 | } 119 | .ToolbarButton-Button[title="Workspaces"] .button-toolbar-menu-indicator { 120 | display: none; 121 | } -------------------------------------------------------------------------------- /vivaldi/tabbar.css: -------------------------------------------------------------------------------- 1 | /* 2 | v *ersion: 1.0.5 3 | variant: Auto Hide Tabbar 4 | update: 2024.11.03 5 | vivaldi version: v7.0 6 | 7 | modified from VivalArc by KraXen72 8 | */ 9 | /* AutoHide Tabbar by @Zettry*/ 10 | 11 | /* TODO auto-hide tabbar fully? + hinting as you approach edge */ 12 | /* TODO uniform bg when tabs left */ 13 | /* TODO a tiny bit of padding around tabs */ 14 | 15 | :root{ 16 | --window-border:4px; /* window border, recommend 4px~16px */ 17 | --addressbar-height:36px; 18 | --tab-padding:calc(var(--window-border) / 2); 19 | --colorToviTransparent:transparent; 20 | --webview-shadow-light: 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 0px var(--window-border) 0px rgba(0, 0, 0, 0.10); 21 | --webview-shadow-dark: 0px 2px 2px 0px rgba(0, 0, 0, 0.05), 0px 2px 8px 0px rgba(0, 0, 0, 0.05), 0px 0px 0px 1.2px #ffffff18; 22 | 23 | --tabbar-size: 32px; /* 32px */ 24 | --tabbar-anim-duration: 0ms; 25 | } 26 | 27 | /*tabbarButton*/ 28 | /* #browser:not(.tabs-top):not(.tabs-bottom) .toolbar-tabbar>.button-toolbar>button{ 29 | * opacity:0.4; 30 | } * 31 | 32 | #browser:not(.tabs-top):not(.tabs-bottom) .toolbar-tabbar>.button-toolbar>button:hover{ 33 | opacity:0.8; 34 | } */ 35 | 36 | /*tabbar left & tabbar right*/ 37 | 38 | /* #browser #tabs-tabbar-container.left ::-webkit-scrollbar, 39 | # *browser #tabs-tabbar-container.right ::-webkit-scrollbar{ 40 | display: none; 41 | } */ 42 | 43 | /*rounded webview*/ 44 | /* #main, #main > .inner{ 45 | * overflow:visible; 46 | } * 47 | #browser:not(.tabs-top):not(.tabs-bottom):not(.fullscreen) #webpage-stack{ 48 | border-radius:var(--radiusCap); 49 | } 50 | 51 | #browser:not(.tabs-top):not(.tabs-bottom):not(.fullscreen).theme-light #webpage-stack{ 52 | box-shadow: var(--webview-shadow-light); 53 | } 54 | #browser:not(.tabs-top):not(.tabs-bottom):not(.fullscreen).theme-dark #webpage-stack{ 55 | box-shadow: var(--webview-shadow-dark); 56 | } 57 | 58 | #browser:not(.tabs-top):not(.tabs-bottom):not(.fullscreen) #webpage-stack:has(.tiled .visible), 59 | #browser:not(.tabs-top):not(.tabs-bottom):not(.fullscreen) #webpage-stack:has(.mosaic .visible){ 60 | box-shadow: none; 61 | } */ 62 | 63 | /* workspace switcher button */ 64 | .tabs-left .inner .button-toolbar.workspace-popup.tabbar-workspace-button.button-menu { 65 | .button-toolbar-menu-indicator { display: none; } 66 | .button-icon:not(.override) { 67 | position: absolute; 68 | left: 3px; 69 | } 70 | .button-icon.override { 71 | position: absolute; 72 | left: 2px; 73 | } 74 | .button-title { 75 | position: relative; 76 | top: 2px; 77 | left: calc(var(--tabbar-size) + var(--densityGap)) !important; 78 | } 79 | } 80 | 81 | 82 | .tabs-left { 83 | /* tabbar container */ 84 | .inner > .tabbar-wrapper, 85 | .inner > .tabbar-wrapper > .tabbar-wrapper { 86 | will-change: width; 87 | transition: width var(--tabbar-anim-duration); 88 | } 89 | 90 | .overflow.tab-strip { 91 | min-width: unset !important; 92 | } 93 | } 94 | 95 | /* width changing on hover */ 96 | .tabs-left .inner > :is( 97 | .tabbar-wrapper, 98 | .tabbar-wrapper > .tabbar-wrapper, 99 | ) { 100 | :is( 101 | #tabs-tabbar-container, 102 | #tabs-tabbar-container .resize, 103 | .button-toolbar.workspace-popup.tabbar-workspace-button 104 | ) { 105 | will-change: width; 106 | transition: width var(--tabbar-anim-duration) !important; 107 | } 108 | 109 | &:not(:hover) :is( 110 | #tabs-tabbar-container, 111 | #tabs-tabbar-container .resize, 112 | .button-toolbar.workspace-popup.tabbar-workspace-button 113 | ) { 114 | width: calc(var(--tabbar-size) + var(--densityGap)) !important; 115 | } 116 | } 117 | 118 | /* tab fixes */ 119 | .tabs-left { 120 | .tab .tab-header { 121 | padding-left: 6px !important; 122 | border-left-width: 1px !important; 123 | } 124 | } 125 | 126 | 127 | /* scrollbar */ 128 | .tabbar-wrapper, .tabbar-wrapper .tab-strip, 129 | #tabs-tabbar-container .resize, 130 | #tabs-tabbar-container, #tabs-container { 131 | --autotab-sb-track-color: var(--colorTabBar, transparent); 132 | --autotab-sb-thumb-color: #6baf8d; 133 | --autotab-sb-thumb-color: var(--colorHighlightBgDark); 134 | --autotab-sb-size: 16px; 135 | 136 | -webkit-app-region: unset !important; 137 | 138 | &::-webkit-scrollbar { 139 | box-sizing: border-box; 140 | width: var(--autotab-sb-size) !important; 141 | transition: none !important; 142 | } 143 | &::-webkit-scrollbar-button { display: none; transition: none !important; } 144 | &::-webkit-scrollbar-track { 145 | background: var(--autotab-sb-track-color) !important; 146 | border-radius: 4px !important; 147 | transition: none !important; 148 | } 149 | &::-webkit-scrollbar-thumb { 150 | background: var(--autotab-sb-thumb-color) !important; 151 | border-radius: 8px !important; 152 | border: 5px solid var(--autotab-sb-track-color) !important; 153 | transition: none !important; 154 | } 155 | } 156 | 157 | /* hide scrollbar unless hovered */ 158 | :is(.tabbar-wrapper, .tabbar-wrapper .tab-strip, 159 | #tabs-tabbar-container .resize, 160 | #tabs-tabbar-container, #tabs-container):not(:hover) { 161 | &::-webkit-scrollbar, 162 | &::-webkit-scrollbar-track, 163 | &::-webkit-scrollbar-thumb { 164 | display: none !important; 165 | } 166 | } 167 | 168 | .tabs-left .inner > .tabbar-wrapper { 169 | position: relative; 170 | width: calc(var(--tabbar-size) + var(--densityGap)); 171 | box-sizing: border-box; 172 | z-index: 1; 173 | } 174 | 175 | .tabs-left .inner > .tabbar-wrapper > .tabbar-wrapper { 176 | box-sizing: border-box; 177 | position: absolute; 178 | overflow: hidden; 179 | } 180 | 181 | #browser.linux:not(.is-settingspage):not(.tabs-top):not(.tabs-bottom) .window-buttongroup{ 182 | right: calc(1px / var(--uiZoomLevel)) !important; 183 | top: calc(1px / var(--uiZoomLevel)) !important; 184 | opacity: 1; 185 | } 186 | 187 | .tabs-left .tab-strip:not(.overflow) 188 | .button-toolbar.newtab { 189 | left: 1px !important; 190 | } -------------------------------------------------------------------------------- /zathura/zathurarc: -------------------------------------------------------------------------------- 1 | #!/bin/config 2 | 3 | set selection-clipboard clipboard # Enables clipboard 4 | set guioptions "" # Disables window decorations 5 | set scroll-step 12 6 | set statusbar-h-padding 15 7 | set statusbar-v-padding 15 8 | 9 | set notification-error-bg "#262626" # bg 10 | set notification-error-fg "#D08770" # bright:red 11 | set notification-warning-bg "#262626" # bg 12 | set notification-warning-fg "#bebebe" # bright:yellow 13 | set notification-bg "#262626" # bg 14 | set notification-fg "#A3BE8C" # bright:green 15 | 16 | set completion-bg "#3a3a3a" # bg2 17 | set completion-fg "#bab5b7" # fg 18 | set completion-group-bg "#3a3a3a" # bg1 19 | set completion-group-fg "#928374" # gray 20 | set completion-highlight-bg "#637a8a" # bright:blue 21 | set completion-highlight-fg "#3a3a3a" # bg2 22 | 23 | # Define the color in index mode 24 | set index-bg "#3a3a3a" # bg2 25 | set index-fg "#bab5b7" # fg 26 | set index-active-bg "#A3BE8C" # bright:blue 27 | set index-active-fg "#3a3a3a" # bg2 28 | 29 | set inputbar-bg "#262626" # bg 30 | set inputbar-fg "#bab5b7" # fg 31 | 32 | set statusbar-bg "#504945" # bg2 33 | set statusbar-fg "#bab5b7" # fg 34 | 35 | set highlight-color "#bebebe" # bright:yellow 36 | set highlight-active-color "#8b8f7e" # bright:orange 37 | 38 | set default-bg "#262626" # bg 39 | set default-fg "#bab5b7" # fg 40 | set render-loading true 41 | set render-loading-bg "#262626" # bg 42 | set render-loading-fg "#bab5b7" # fg 43 | 44 | # Recolor book content's color 45 | set recolor-lightcolor "#262626" # bg 46 | set recolor-darkcolor "#bab5b7" # fg 47 | set recolor "true" 48 | # set recolor-keephue true # keep original color 49 | --------------------------------------------------------------------------------