mirror of
https://github.com/stronk-dev/Tokyo-Night-Linux.git
synced 2024-11-21 20:36:51 -05:00
Switch discord theme to https://github.com/Dyzean/Tokyo-Night which gets maintained by someone else 👍
This commit is contained in:
parent
05846583af
commit
289f3d4a41
3 changed files with 139 additions and 7 deletions
136
.config/BetterDiscord/themes/tokyo-night.theme.css
Normal file
136
.config/BetterDiscord/themes/tokyo-night.theme.css
Normal file
|
@ -0,0 +1,136 @@
|
|||
/**
|
||||
* @name Tokyo Night
|
||||
* @description Discord Port of Visual Studio Code Theme
|
||||
* @author Ashtrath
|
||||
* @version 1.0.0
|
||||
* @authorId 2354831939099688962
|
||||
*/
|
||||
|
||||
/* DONT TOUCH THIS!!! */
|
||||
@import url("https://dyzean.github.io/Tokyo-Night/main.css");
|
||||
|
||||
/* Read this before editing stuff!!!
|
||||
*
|
||||
* > To comment or uncomment a line you need to put those "/" and "*" characters as you can see at the beginning and ending of my comments.
|
||||
* (You don't need to put a * at each line like I do, it's just for readability). See more here : https://developer.mozilla.org/en-US/docs/Web/CSS/Comments
|
||||
*
|
||||
* > You can play with the values and see how it goes, don't delete "px" after the value if you don't have knowledges in CSS.
|
||||
*
|
||||
* > To change the colors, replace the HEX code with the one you picked here : https://htmlcolorcodes.com
|
||||
*/
|
||||
|
||||
/* Optional Addons */
|
||||
@import url("https://goose-nest.github.io/GT-RevertRebrand/RevertRebrand.theme.css");
|
||||
@import url("https://nyri4.github.io/Discolored/main.css");
|
||||
|
||||
/* Mac Titlebar, Delete the line below if you want the normal titlebar */
|
||||
.withFrame-haYltI { margin: 0; height: 24px; } .typeWindows-1za-n7 { flex-direction: row; margin-left: 3px !important; } .withFrame-haYltI .winButton-iRh8-Z > svg { display: none; } .withFrame-haYltI .winButton-iRh8-Z:hover { background-color: var(--background-teritary); } .withFrame-haYltI .winButton-iRh8-Z { pointer-events: none; margin-left: -4px; top: 0; } .withFrame-haYltI .winButton-iRh8-Z::after { content: ""; padding: 7px; border-radius: 50px; pointer-events: fill; transition-duration: 200ms; } .withFrame-haYltI .winButtonClose-1HsbF-::after { background-color: #e92a2ade !important; margin-top: 0px; } .withFrame-haYltI .winButtonMinMax-PBQ2gm:nth-child(3)::after { background-color: #f7bc1bde !important; margin-top: 0px; } .withFrame-haYltI .winButtonMinMax-PBQ2gm:nth-child(4):after { background-color: #12db33de !important; margin-top: 0px; } .typeWindows-1za-n7 > div:hover::after { transform: scale(1.1); }
|
||||
|
||||
/* ---- Discord Variables ---- */
|
||||
.theme-dark { /* Dark Mode */
|
||||
|
||||
/* Header Color */
|
||||
--header-primary: #fff;
|
||||
--header-secondary: #b9bbbe;
|
||||
|
||||
/* Text Color */
|
||||
--text-normal: #dcddde;
|
||||
--text-muted: #72767d;
|
||||
--interactive-normal: #6f738e;
|
||||
--interactive-hover: #a6aac5;
|
||||
--interactive-active: #aeb4cf;
|
||||
--interactive-muted: #484a57;
|
||||
|
||||
/* Background Color */
|
||||
--background-primary: #1a1b26;
|
||||
--background-secondary: #171722;
|
||||
--background-secondary-alt: #13131a;
|
||||
--background-tertiary: #16161e;
|
||||
--background-tertiary-alt: #13131a;
|
||||
--background-accent: #434461;
|
||||
--background-floating: #161620;
|
||||
--background-modifier-hover: #212331c0;
|
||||
--background-modifier-active: #282a3680;
|
||||
--background-modifier-selected: #24263171;
|
||||
--background-modifier-accent: #21212c;
|
||||
--background-mentioned: #252836;
|
||||
--border-mentioned: #474c64;
|
||||
--background-mentioned-hover: #2f3344;
|
||||
--accent-color: #365aaa;
|
||||
|
||||
/* Folder Color */
|
||||
--folder-color: #272a36d0;
|
||||
--folder-color-light: #2f3342d0;
|
||||
|
||||
/* Input Box Color */
|
||||
--input-box-bg: #14141b;
|
||||
--input-box-border: #0f0f14;
|
||||
--input-box-border-focus: #1b1c26;
|
||||
|
||||
/* Scrollbars Color */
|
||||
--scrollbar-thin-thumb: transparent;
|
||||
--scrollbar-thin-track: transparent;
|
||||
--scrollbar-auto-thumb: #2b2b46af;
|
||||
--scrollbar-auto-thumb-hover: #27273d85;
|
||||
--scrollbar-auto-track: transparent;
|
||||
--scrollbar-auto-scrollbar-color-thumb: var(--scrollbar-auto-thumb);
|
||||
--scrollbar-auto-scrollbar-color-track: var(--scrollbar-auto-track);
|
||||
|
||||
/* Chat Box Color */
|
||||
--channeltextarea-background: var(--background-secondary);
|
||||
--channeltextarea-background-hover: var(--background-tertiary);
|
||||
}
|
||||
|
||||
.theme-light { /* Light Mode */
|
||||
|
||||
/* Header Color */
|
||||
--header-primary: #1c1c1d;
|
||||
--header-secondary: #4f5660;
|
||||
|
||||
/* Text Color */
|
||||
--text-normal: #2e3338;
|
||||
--text-muted: #747f8d;
|
||||
--interactive-normal: #4c505e;
|
||||
--interactive-hover: #404350;
|
||||
--interactive-active: #373a44;
|
||||
--interactive-muted: #77797c;
|
||||
|
||||
/* Background Color */
|
||||
--background-primary: #d5d6db;
|
||||
--background-secondary: #cecfd4;
|
||||
--background-secondary-alt: #b6b7bd;
|
||||
--background-tertiary: #c5c6cc;
|
||||
--background-tertiary-alt: #bbbbc2;
|
||||
--background-accent: #9ca3bb;
|
||||
--background-floating: #c2c2c9;
|
||||
--background-mentioned: #c4c7da;
|
||||
--background-modifier-hover: #2c2a2a25;
|
||||
--background-modifier-active: #5a525229;
|
||||
--background-modifier-selected: #555e693d;
|
||||
--background-modifier-accent: #06060714;
|
||||
--border-mentioned: #a9afcf;
|
||||
--background-mentioned-hover: #cfd2e9;
|
||||
--accent-color: #365aaa;
|
||||
|
||||
/* Folder Color */
|
||||
--folder-color: #a7a6a6d0;
|
||||
--folder-color-light: #afafafd0;
|
||||
|
||||
/* Input Box Color */
|
||||
--input-box-bg: #c2c2c7;
|
||||
--input-box-border: #b3b4b8;
|
||||
--input-box-border-focus: #959699;
|
||||
|
||||
/* Scrollbars Color */
|
||||
--scrollbar-thin-thumb: transparent;
|
||||
--scrollbar-thin-track: transparent;
|
||||
--scrollbar-auto-thumb: #a0a0a0af;
|
||||
--scrollbar-auto-thumb-hover: #77777785;
|
||||
--scrollbar-auto-track: transparent;
|
||||
--scrollbar-auto-scrollbar-color-thumb: var(--scrollbar-auto-thumb);
|
||||
--scrollbar-auto-scrollbar-color-track: var(--scrollbar-auto-track);
|
||||
|
||||
/* Chat Box Color */
|
||||
--channeltextarea-background: var(--background-secondary);
|
||||
--channeltextarea-background-hover: var(--background-tertiary);
|
||||
}
|
10
README.md
10
README.md
|
@ -6,7 +6,7 @@ Although replacing your icon theme is not required, this theme goes well with th
|
|||
|
||||
The GTK theme was made by modifying the <a href="https://www.gnome-look.org/p/1316887">Material Black</a> theme
|
||||
|
||||
The discord theme was made by modifying the <a href="https://betterdiscord.app/theme/Nocturnal">Nocturnal</a> theme
|
||||
The included Discord theme is pulled from here <a href="https://github.com/Dyzean/Tokyo-Night">Tokyo Night</a>
|
||||
|
||||
## Dependencies
|
||||
|
||||
|
@ -19,10 +19,7 @@ Theming
|
|||
- <a href="https://github.com/enkia/tokyo-night-vscode-theme">VS code Tokyo Night theme</a>
|
||||
|
||||
Optional Utils
|
||||
- st: The terminal we are using in our configs. Requires <a href="https://wiki.archlinux.org/title/st#Patches">patches</a> to get it good, but pre-patched versions can be found <a href="https://github.com/LukeSmithxyz/st">on github</a> . urxvt can be used as an alternative and is themed using the included config files.
|
||||
- powerline: Status bar for Bash. For example, it shows you what Git repo you are in
|
||||
- gvim: Contains vim with clipboard support and more
|
||||
- vim-airline: Status bar for vim
|
||||
- kava, neofetch, lolcat, cowsay, wisdom-mod, bash-pipes, cbonsai: important stuff
|
||||
- bpytop: resource monitor
|
||||
- nm-applet: manage your (wireless) connections and has a tray icon
|
||||
|
@ -66,7 +63,7 @@ When using Sway as window manager
|
|||
- Polybar: Theme and config for the status bar when using I3 with modules n shit enabled
|
||||
- Spicetify: Contains theme for modifying Spotify
|
||||
- Sway: Example sway config with auto starting applications, borders and gaps settings, etc
|
||||
- Polybar: Theme and config for the status bar when using Sway
|
||||
- Waybar: Theme and config for the status bar when using Sway
|
||||
- Wofi: Actually contains an example config and theme for Rofi and Wofi, although we are using Rofi in the configs
|
||||
|
||||
- /etc/logid.conf: Optional example configuration for the Logitech MX Master mouse, using gestures to call certain key combinations set in the I3/Sway config
|
||||
|
@ -80,7 +77,6 @@ When using Sway as window manager
|
|||
### Configuration
|
||||
- GTK theme: If certain colours aren't to your liking, you can `` grep -rl "old_string" . | xargs sed -i 's/old_string/new_string/g' `` to replace specific colour codes quickly. If you go this route you might want to do this to the <a href="https://www.gnome-look.org/p/1316887">source</a>, since the original theme has more different colours.
|
||||
- Spotify: Manually edit ./config/spicetify/Themes/Base/color.ini
|
||||
- Discord: There is an <a href="https://limeshark.dev/editor/Nocturnal">online editor</a> to edit all the themes
|
||||
- Polybar comes bundled with various modules. Check out their <a href="https://github.com/polybar/polybar/wiki">wiki</a> for more info. Also check out the <a href="https://github.com/adi1090x/polybar-themes#readme">readme</a> of polybar-themes if you are using I3.
|
||||
- Picom can be be configured for more or less transparency or different kinds of blur. The included config uses dual-kawase blur which goes over an image as background
|
||||
|
||||
|
@ -88,7 +84,7 @@ When using Sway as window manager
|
|||
### Copying files
|
||||
All the files go into your home directory, except for:
|
||||
- /etc/logid.conf
|
||||
- /usr/share/themes/UltimateBlack-0.1
|
||||
- /usr/share/themes/TokyoNight
|
||||
|
||||
If using polybar-themes, install it from the original source first to get all their dependencies and fonts. Then you can overwrite their files with the included ones.
|
||||
|
||||
|
|
Loading…
Reference in a new issue