u68467/publicfiles
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update CosyDiscord.css

Browse Source
This commit is contained in:
u68467 2025-02-13 12:41:31 +01:00
parent cb06521d96
commit b63d8d086b
1 changed files with 67 additions and 93 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

156
CosyDiscord.css
View File

@ -1,117 +1,91 @@
/** /**
* @name Discord+ (CosyByte Version, personal/private) with RTL Adjustments * @name Discord+
* @author PlusInsta
* @authorId 309931975102300160
* @authorLink https://plusinsta.xyz
* @version 3.2.1
* @description A sleek, customizable Discord theme.
* @donate https://ko-fi.com/plusinsta
* @website https://plusinsta.github.io/discord-plus
* @source https://github.com/PlusInsta/discord-plus * @source https://github.com/PlusInsta/discord-plus
* @updateUrl https://plusinsta.github.io/discord-plus/DiscordPlus.theme.css * @updateUrl https://plusinsta.github.io/discord-plus/DiscordPlus.theme.css
*/ * @invite 2Jwh2nS
*/
@import url(https://plusinsta.github.io/discord-plus/src/DiscordPlus-source.theme.css); @import url(https://plusinsta.github.io/discord-plus/src/DiscordPlus-source.theme.css);
/* Apply RTL globally */ /* I've commented most of these values so you can change them yourself. If you're having trouble, or you want to do more than what these values allow for, a volunteer might be able to help you in my server. */
html, body {
direction: rtl;
}
/* Example: Use CSS logical properties for margins and paddings to auto-adjust for RTL/LTR */
.some-element {
padding-inline-start: var(--dplus-spacing-ui);
padding-inline-end: var(--dplus-spacing-app);
}
/* Example: Adjust sidebar positioning for RTL layouts */
.sidebar {
left: auto; /* remove any LTR anchoring */
right: 0;
}
/* Example: Reverse flex container items if needed */
.flex-container {
display: flex;
flex-direction: row-reverse;
}
/* Example: Flip directional icons (e.g., arrows) if they imply left/right */
.directional-icon {
transform: scaleX(-1);
}
.theme-dark { .theme-dark {
/* Backdrop image */ /* Backdrop image which is shown behind the app. Can also be an HTML color. Falls back to accent color if invalid.
--dplus-backdrop: url(https://i.imgur.com/3AiL3yN.png); To use an image from your computer, upload it somewhere first, copy its link, then paste it below. */
--dplus-backdrop: url('/usr/share/wallpapers/ScarletTree/contents/images_dark/5120x2880.png');
/* Accent color, used to decorate the UI with colors */ /* Accent color, used to decorate the UI with colors. */
--dplus-accent-color-hue: 320; --dplus-accent-color-hue: 320;
--dplus-accent-color-saturation: 60%; --dplus-accent-color-saturation: 60%;
--dplus-accent-color-lightness: 31%; --dplus-accent-color-lightness: 31%;
/* Foreground color: For texts and icons */ /* Foreground color: For things like text and icons. */
--dplus-foreground-color-hue-base: 210; --dplus-foreground-color-hue-base: 210;
--dplus-foreground-color-hue-links: 197; --dplus-foreground-color-hue-links: 197;
--dplus-foreground-color-saturation-amount: 1; --dplus-foreground-color-saturation-amount: 1;
--dplus-foreground-color-lightness-amount: 1; --dplus-foreground-color-lightness-amount: 1;
/* Background color: Covers the backdrop to improve readability */ /* Background color: Covers the backdrop so the app is easier to read. */
--dplus-background-color-hue: 320; --dplus-background-color-hue: 320;
--dplus-background-color-saturation-amount: 1; --dplus-background-color-saturation-amount: 1;
--dplus-background-color-lightness-amount: 1; --dplus-background-color-lightness-amount: 1;
--dplus-background-color-alpha: 0.8; --dplus-background-color-alpha: 0.8;
} }
/* Light theme settings */ /* If you use light theme, you can give it unique settings that are separate from dark theme. */
.theme-light { .theme-light {
--dplus-backdrop: url(https://i.imgur.com/3AiL3yN.png); --dplus-backdrop: url('/usr/share/wallpapers/ScarletTree/contents/images/5120x2880.png');
--dplus-accent-color-hue: 320; --dplus-accent-color-hue: 320;
--dplus-accent-color-saturation: 60%; --dplus-accent-color-saturation: 60%;
--dplus-accent-color-lightness: 31%; --dplus-accent-color-lightness: 31%;
--dplus-foreground-color-hue-base: 210; --dplus-foreground-color-hue-base: 210;
--dplus-foreground-color-hue-links: 197; --dplus-foreground-color-hue-links: 197;
--dplus-foreground-color-saturation-amount: 1; --dplus-foreground-color-saturation-amount: 1;
--dplus-foreground-color-lightness-amount: 1; --dplus-foreground-color-lightness-amount: 1;
--dplus-background-color-hue: 320; --dplus-background-color-hue: 320;
--dplus-background-color-saturation-amount: 1; --dplus-background-color-saturation-amount: 1;
--dplus-background-color-lightness-amount: 1; --dplus-background-color-lightness-amount: 1;
--dplus-background-color-alpha: 0.8; --dplus-background-color-alpha: 0.8;
} }
:root { :root {
/* Fonts */ /* Fonts */
--dplus-font-ui: 'Poppins'; /* You can use any installed font on your device. */
--dplus-font-body: 'Inter'; --dplus-font-ui: 'Poppins';
--dplus-font-header: 'Righteous'; --dplus-font-body: 'Roboto';
--dplus-font-header: 'Righteous';
/* Rounded corners (UI elements, avatars, servers) */ /* Round corner sizes, measured in pixel radius.
--dplus-radius-ui: 10px; Set avatar/server radius to 50% to make them circular.
--dplus-radius-avatar: 20%; UI radius must be in pixels, otherwise things break. */
--dplus-radius-server: 20%; --dplus-radius-ui: 10px;
--dplus-radius-avatar: 20%;
--dplus-radius-server: 20%;
/* Spacing between UI elements */ /* This decides how much breathing room there should be between things like buttons and content. */
--dplus-spacing-ui: 10px; --dplus-spacing-ui: 10px;
/* Spacing for the overall app layout */ /* This sets how much space there should be between the app contents and the edges of the window. It also affects the distance between major UI elements, such as the server list to the channel list and channel list to the chat. */
--dplus-spacing-app: 10px; --dplus-spacing-app: 10px;
/* Icon sizes for various elements */ /* Size of user and server icons */
--dplus-icon-avatar-chat: 64px; --dplus-icon-avatar-chat: 64px;
--dplus-icon-avatar-list: 32px; --dplus-icon-avatar-list: 32px;
--dplus-icon-avatar-profile: 80px; --dplus-icon-avatar-profile: 80px;
--dplus-icon-server-sidebar: 48px; --dplus-icon-server-sidebar: 48px;
--dplus-icon-server-list: 32px; --dplus-icon-server-list: 32px;
/* Home icon URLs for dark and light themes */ /* The Home icon on the top left */
--dplus-icon-home-dark: url(https://plusinsta.github.io/discord-plus/assets/discord/home_dark.svg); --dplus-icon-home-dark: url(https://plusinsta.github.io/discord-plus/assets/discord/home_dark.svg);
--dplus-icon-home-light: url(https://plusinsta.github.io/discord-plus/assets/discord/home_light.svg); --dplus-icon-home-light: url(https://plusinsta.github.io/discord-plus/assets/discord/home_light.svg);
}
[class*="content"] {
direction: rtl;
}
[class*="scroller"] {
direction: rtl;
}
[class*="sidebar"] {
margin-left: 10px;
} }