From 17d903074409fb139b777f5acff7b5099f724ebf Mon Sep 17 00:00:00 2001 From: db074 Date: Tue, 23 Dec 2025 14:33:37 -0500 Subject: [PATCH 1/3] Enable dark theme on Windows --- src/abaddon.cpp | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/abaddon.cpp b/src/abaddon.cpp index 337bd5d5..0edee46f 100644 --- a/src/abaddon.cpp +++ b/src/abaddon.cpp @@ -287,6 +287,11 @@ int Abaddon::StartGTK() { Gtk::Settings::get_default()->set_property("gtk-xft-dpi", newdpi); } +#ifdef _WIN32 + // Enable dark theme on Windows + Gtk::Settings::get_default()->set_property("gtk-application-prefer-dark-theme", true); +#endif + // store must be checked before this can be called m_main_window->UpdateComponents(); From ae0681ad26784f95fbe8352e98674a3a2b3be03f Mon Sep 17 00:00:00 2001 From: db074 Date: Tue, 23 Dec 2025 14:40:47 -0500 Subject: [PATCH 2/3] Update UI to Discord-like dark theme styling --- css/main.css | 510 +++++++++++++++++++++++++++++++++++++++++++++++ res/css/main.css | 468 ++++++++++++++++++++++++++++++++++++------- 2 files changed, 902 insertions(+), 76 deletions(-) create mode 100644 css/main.css diff --git a/css/main.css b/css/main.css new file mode 100644 index 00000000..c97d1805 --- /dev/null +++ b/css/main.css @@ -0,0 +1,510 @@ +/* ============================================ + DISCORD-LIKE THEME FOR ABADDON + Based on Discord's Dark Theme Colors + ============================================ */ + +/* ============================================ + GLOBAL WINDOW & BASE STYLES + ============================================ */ + +/* Main application window */ +.app-window, +window { + background-color: #313338; + color: #dbdee1; +} + +/* General text styling */ +* { + font-family: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; +} + +/* Remove default GTK borders/outlines */ +*:focus { + outline: none; + box-shadow: none; +} + +/* ============================================ + GUILD/SERVER LIST (Leftmost Sidebar) + ============================================ */ + +.classic-guild-list, +.guild-list-scroll { + background-color: #1e1f22; +} + +.guild-list-scroll > scrollbar { + border: none; + background: transparent; +} + +.guild-list-scroll > scrollbar slider { + border: none; + margin: 0px; + min-width: 4px; + min-height: 20px; + background-color: #1a1b1e; + border-radius: 4px; +} + +.classic-guild-list > row { + padding-left: 0px; + box-shadow: none; + border: none; + outline: none; +} + +.classic-guild-list > row:hover { + background: none; +} + +/* Unread indicator - white pill on left */ +.classic-guild-list-guild.has-unread { + background: radial-gradient(4px circle at 2px center, #ffffff 100%, transparent 0%); +} + +.classic-guild-list-folder.has-unread stack { + background: radial-gradient(4px circle at 2px center, #ffffff 100%, transparent 0%); +} + +.classic-guild-list-guild box, +.classic-guild-list-folder stack { + padding-left: 12px; +} + +/* ============================================ + CHANNEL LIST (Second Sidebar) + ============================================ */ + +.channel-list, +.channel-list .view { + background-color: #2b2d31; + color: #949ba4; +} + +.channel-list .view:selected { + background-color: #404249; + color: #f2f3f5; +} + +.channel-list .view:hover { + background-color: #35373c; + color: #dbdee1; +} + +/* Category headers */ +.channel-list label { + color: #949ba4; + font-size: 12px; + font-weight: 600; + text-transform: uppercase; +} + +/* ============================================ + MAIN CHAT AREA + ============================================ */ + +/* Chat background */ +scrolledwindow, +.message-container-outer { + background-color: #313338; +} + +/* Individual messages */ +.message-container { + margin-bottom: 0px; + padding: 2px 16px 2px 72px; + background-color: #313338; +} + +.message-container:hover { + background-color: #2e3035; +} + +/* Message text */ +.message-text, +.message-text text { + background: inherit; + color: #dbdee1; +} + +.message-text.pending { + color: rgba(219, 222, 225, 0.5); +} + +.message-text.failed { + color: #f23f43; +} + +/* Message reply styling */ +.message-reply { + border-left: 2px solid #4e5058; + padding-left: 10px; + padding-top: 6px; + padding-bottom: 6px; + opacity: 0.8; + color: #949ba4; +} + +/* ============================================ + MESSAGE INPUT BOX + ============================================ */ + +.message-input { + background-color: #383a40; + border-radius: 8px; + margin: 0 16px 24px 16px; +} + +.message-input textview, +.message-input textview text { + background-color: #383a40; + color: #dbdee1; + border-radius: 8px; +} + +.message-input textview { + padding: 12px 16px; +} + +.message-input scrollbar.vertical slider { + min-height: 0px; +} + +/* ============================================ + MEMBER LIST (Right Sidebar) + ============================================ */ + +.member-list, +treeview { + background-color: #2b2d31; + color: #949ba4; +} + +treeview:selected { + background-color: #35373c; +} + +treeview:hover { + background-color: #35373c; +} + +/* Role headers in member list */ +.member-list-role { + color: #949ba4; + font-size: 12px; + font-weight: 600; + text-transform: uppercase; + padding: 16px 8px 4px 16px; +} + +/* ============================================ + STATUS INDICATORS (Discord Colors) + ============================================ */ + +.status-indicator.dnd { + color: #f23f43; +} + +.status-indicator.online { + color: #23a55a; +} + +.status-indicator.offline { + color: #80848e; +} + +.status-indicator.idle { + color: #f0b232; +} + +/* ============================================ + EMBEDS + ============================================ */ + +.embed { + border-radius: 4px; + padding: 8px 16px 16px 12px; + background-color: #2b2d31; + border-left: 4px solid #5865f2; +} + +.embed-footer { + margin-top: 8px; + font-size: 12px; + color: #949ba4; +} + +.embed-author { + margin-bottom: 8px; + font-size: 14px; + font-weight: 600; + color: #f2f3f5; +} + +/* ============================================ + ATTACHMENTS + ============================================ */ + +.message-attachment-box { + border: 1px solid #4e5058; + border-radius: 8px; + padding: 10px; + background-color: #2b2d31; +} + +.message-attachment-box label { + margin: 5px; + color: #00a8fc; +} + +/* ============================================ + REACTIONS + ============================================ */ + +.reaction-box { + padding: 4px 8px; + border-radius: 8px; + border: none; + background-color: #2b2d31; + margin-right: 4px; +} + +.reaction-box:hover { + background-color: #35373c; +} + +.reaction-box.reacted { + border: none; + background-color: rgba(88, 101, 242, 0.3); +} + +/* ============================================ + PROFILE/USER POPUP + ============================================ */ + +.profile-main-container { + padding: 20px; + background-color: #232428; +} + +.profile-username { + margin-left: 10px; + font-size: 20px; + font-weight: 600; + color: #f2f3f5; +} + +.profile-username-nondisplay { + margin-left: 10px; + color: #949ba4; +} + +.profile-switcher { + padding-top: 5px; +} + +.profile-stack { + padding-top: 5px; +} + +.profile-notes-label { + padding-top: 5px; + padding-bottom: 5px; + color: #949ba4; +} + +.profile-badges { + padding-left: 5px; +} + +.profile-badge { + margin-right: 5px; +} + +.profile-connections { + margin-top: 10px; +} + +.profile-connection { + padding: 8px 12px; + border-radius: 8px; + border: none; + background-color: #1e1f22; +} + +.profile-connection-image { + padding-right: 8px; +} + +/* ============================================ + DIALOGS + ============================================ */ + +.set-status-dialog .dialog-vbox { + padding: 16px; + background-color: #313338; +} + +.set-status-dialog .dialog-action-area { + margin: 16px; +} + +dialog, +messagedialog { + background-color: #313338; + color: #dbdee1; +} + +/* ============================================ + VOICE SETTINGS + ============================================ */ + +.voice-settings-window > box { + padding: 16px; + background-color: #313338; +} + +.voice-settings-window scale { + margin-right: 8px; +} + +.voice-settings-window scale trough { + background-color: #4e5058; + border-radius: 4px; +} + +.voice-settings-window scale slider { + background-color: #5865f2; + border-radius: 50%; +} + +/* ============================================ + SCROLLBARS (Discord-style thin scrollbars) + ============================================ */ + +scrollbar { + background-color: transparent; +} + +scrollbar slider { + background-color: #1a1b1e; + border-radius: 4px; + min-width: 8px; + min-height: 40px; +} + +scrollbar slider:hover { + background-color: #27282c; +} + +scrollbar.vertical slider { + min-width: 8px; +} + +scrollbar.horizontal slider { + min-height: 8px; +} + +/* ============================================ + MENU BAR + ============================================ */ + +menubar { + background-color: #2b2d31; + color: #dbdee1; + padding: 4px 8px; +} + +menubar > menuitem { + padding: 4px 12px; + border-radius: 4px; +} + +menubar > menuitem:hover { + background-color: #35373c; +} + +menu { + background-color: #111214; + color: #dbdee1; + border-radius: 4px; + padding: 6px 8px; + border: none; +} + +menu > menuitem { + padding: 6px 8px; + border-radius: 4px; +} + +menu > menuitem:hover { + background-color: #5865f2; + color: #ffffff; +} + +/* ============================================ + BUTTONS (Discord Blurple) + ============================================ */ + +button { + background-color: #5865f2; + color: #ffffff; + border: none; + border-radius: 3px; + padding: 8px 16px; +} + +button:hover { + background-color: #4752c4; +} + +button:active { + background-color: #3c45a5; +} + +button.destructive-action { + background-color: #da373c; +} + +button.destructive-action:hover { + background-color: #a12d31; +} + +/* ============================================ + MENTIONS + ============================================ */ + +.classic-mention-overlay:selected { + color: #ffffff; + background-color: #5865f2; + border-radius: 3px; +} + +/* ============================================ + TEXT ENTRIES + ============================================ */ + +entry { + background-color: #1e1f22; + color: #dbdee1; + border: none; + border-radius: 3px; + padding: 8px 12px; +} + +entry:focus { + border: none; + outline: none; +} + +/* ============================================ + PANED SEPARATORS + ============================================ */ + +paned > separator { + background-color: #1e1f22; + min-width: 1px; + min-height: 1px; +} diff --git a/res/css/main.css b/res/css/main.css index 7292101d..c97d1805 100644 --- a/res/css/main.css +++ b/res/css/main.css @@ -1,79 +1,304 @@ -.embed { - border-radius: 5px; - padding: 10px; - background-color: rgba(0.0, 0.0, 0.0, 0.1); +/* ============================================ + DISCORD-LIKE THEME FOR ABADDON + Based on Discord's Dark Theme Colors + ============================================ */ + +/* ============================================ + GLOBAL WINDOW & BASE STYLES + ============================================ */ + +/* Main application window */ +.app-window, +window { + background-color: #313338; + color: #dbdee1; } -.embed-footer { - margin-top: 5px; - font-size: 11px; +/* General text styling */ +* { + font-family: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; } -.embed-author { - margin-bottom: 10px; - font-size: 12px; +/* Remove default GTK borders/outlines */ +*:focus { + outline: none; + box-shadow: none; } -.message-attachment-box { - border: 1px solid #aaaaaa; - padding: 2px 5px 2px 5px; +/* ============================================ + GUILD/SERVER LIST (Leftmost Sidebar) + ============================================ */ + +.classic-guild-list, +.guild-list-scroll { + background-color: #1e1f22; } -.message-attachment-box label { - margin: 5px; +.guild-list-scroll > scrollbar { + border: none; + background: transparent; } -.status-indicator.dnd { - color: #982929; +.guild-list-scroll > scrollbar slider { + border: none; + margin: 0px; + min-width: 4px; + min-height: 20px; + background-color: #1a1b1e; + border-radius: 4px; } -.status-indicator.online { - color: #43B581; +.classic-guild-list > row { + padding-left: 0px; + box-shadow: none; + border: none; + outline: none; } -.status-indicator.offline { - color: #808080; +.classic-guild-list > row:hover { + background: none; } -.status-indicator.idle { - color: #FAA61A; +/* Unread indicator - white pill on left */ +.classic-guild-list-guild.has-unread { + background: radial-gradient(4px circle at 2px center, #ffffff 100%, transparent 0%); +} + +.classic-guild-list-folder.has-unread stack { + background: radial-gradient(4px circle at 2px center, #ffffff 100%, transparent 0%); +} + +.classic-guild-list-guild box, +.classic-guild-list-folder stack { + padding-left: 12px; +} + +/* ============================================ + CHANNEL LIST (Second Sidebar) + ============================================ */ + +.channel-list, +.channel-list .view { + background-color: #2b2d31; + color: #949ba4; +} + +.channel-list .view:selected { + background-color: #404249; + color: #f2f3f5; +} + +.channel-list .view:hover { + background-color: #35373c; + color: #dbdee1; +} + +/* Category headers */ +.channel-list label { + color: #949ba4; + font-size: 12px; + font-weight: 600; + text-transform: uppercase; } +/* ============================================ + MAIN CHAT AREA + ============================================ */ + +/* Chat background */ +scrolledwindow, +.message-container-outer { + background-color: #313338; +} + +/* Individual messages */ .message-container { - margin-bottom: 8px; + margin-bottom: 0px; + padding: 2px 16px 2px 72px; + background-color: #313338; } -.message-input textview, .message-input textview text { - background-color: inherit; +.message-container:hover { + background-color: #2e3035; } -.message-text, .message-text text { +/* Message text */ +.message-text, +.message-text text { background: inherit; + color: #dbdee1; } -.message-input textview { - padding: 10px 5px; +.message-text.pending { + color: rgba(219, 222, 225, 0.5); } +.message-text.failed { + color: #f23f43; +} + +/* Message reply styling */ .message-reply { - border-left: 2px solid gray; + border-left: 2px solid #4e5058; padding-left: 10px; padding-top: 6px; padding-bottom: 6px; opacity: 0.8; + color: #949ba4; +} + +/* ============================================ + MESSAGE INPUT BOX + ============================================ */ + +.message-input { + background-color: #383a40; + border-radius: 8px; + margin: 0 16px 24px 16px; +} + +.message-input textview, +.message-input textview text { + background-color: #383a40; + color: #dbdee1; + border-radius: 8px; +} + +.message-input textview { + padding: 12px 16px; +} + +.message-input scrollbar.vertical slider { + min-height: 0px; +} + +/* ============================================ + MEMBER LIST (Right Sidebar) + ============================================ */ + +.member-list, +treeview { + background-color: #2b2d31; + color: #949ba4; +} + +treeview:selected { + background-color: #35373c; +} + +treeview:hover { + background-color: #35373c; +} + +/* Role headers in member list */ +.member-list-role { + color: #949ba4; + font-size: 12px; + font-weight: 600; + text-transform: uppercase; + padding: 16px 8px 4px 16px; +} + +/* ============================================ + STATUS INDICATORS (Discord Colors) + ============================================ */ + +.status-indicator.dnd { + color: #f23f43; +} + +.status-indicator.online { + color: #23a55a; +} + +.status-indicator.offline { + color: #80848e; +} + +.status-indicator.idle { + color: #f0b232; +} + +/* ============================================ + EMBEDS + ============================================ */ + +.embed { + border-radius: 4px; + padding: 8px 16px 16px 12px; + background-color: #2b2d31; + border-left: 4px solid #5865f2; +} + +.embed-footer { + margin-top: 8px; + font-size: 12px; + color: #949ba4; +} + +.embed-author { + margin-bottom: 8px; + font-size: 14px; + font-weight: 600; + color: #f2f3f5; +} + +/* ============================================ + ATTACHMENTS + ============================================ */ + +.message-attachment-box { + border: 1px solid #4e5058; + border-radius: 8px; + padding: 10px; + background-color: #2b2d31; +} + +.message-attachment-box label { + margin: 5px; + color: #00a8fc; +} + +/* ============================================ + REACTIONS + ============================================ */ + +.reaction-box { + padding: 4px 8px; + border-radius: 8px; + border: none; + background-color: #2b2d31; + margin-right: 4px; +} + +.reaction-box:hover { + background-color: #35373c; +} + +.reaction-box.reacted { + border: none; + background-color: rgba(88, 101, 242, 0.3); } +/* ============================================ + PROFILE/USER POPUP + ============================================ */ + .profile-main-container { padding: 20px; + background-color: #232428; } .profile-username { margin-left: 10px; font-size: 20px; + font-weight: 600; + color: #f2f3f5; } .profile-username-nondisplay { margin-left: 10px; + color: #949ba4; } .profile-switcher { @@ -87,6 +312,7 @@ .profile-notes-label { padding-top: 5px; padding-bottom: 5px; + color: #949ba4; } .profile-badges { @@ -102,93 +328,183 @@ } .profile-connection { - padding: 5px; - border-radius: 10px; - border: 1px solid @theme_fg_color; + padding: 8px 12px; + border-radius: 8px; + border: none; + background-color: #1e1f22; } .profile-connection-image { - padding-right: 5px; + padding-right: 8px; } -.reaction-box { - padding: 2px 5px 2px 5px; - border-radius: 5px; - border: 1px solid @theme_fg_color; -} - -.reaction-box.reacted { - border: 1px solid #5865f2; - background-color: alpha(@theme_selected_bg_color, 0.5); -} +/* ============================================ + DIALOGS + ============================================ */ .set-status-dialog .dialog-vbox { - padding: 5px; + padding: 16px; + background-color: #313338; } .set-status-dialog .dialog-action-area { - margin: 10px 5px 5px 5px; + margin: 16px; } +dialog, +messagedialog { + background-color: #313338; + color: #dbdee1; +} + +/* ============================================ + VOICE SETTINGS + ============================================ */ + .voice-settings-window > box { - padding: 5px; + padding: 16px; + background-color: #313338; } .voice-settings-window scale { margin-right: 8px; } -.message-input scrollbar.vertical slider { - min-height: 0px; +.voice-settings-window scale trough { + background-color: #4e5058; + border-radius: 4px; } -.message-text.pending { - color: alpha(currentColor, 0.5); +.voice-settings-window scale slider { + background-color: #5865f2; + border-radius: 50%; } -.message-text.failed { - color: red; +/* ============================================ + SCROLLBARS (Discord-style thin scrollbars) + ============================================ */ + +scrollbar { + background-color: transparent; } -.guild-list-scroll > scrollbar { - border: none; +scrollbar slider { + background-color: #1a1b1e; + border-radius: 4px; + min-width: 8px; + min-height: 40px; } -.guild-list-scroll > scrollbar slider { +scrollbar slider:hover { + background-color: #27282c; +} + +scrollbar.vertical slider { + min-width: 8px; +} + +scrollbar.horizontal slider { + min-height: 8px; +} + +/* ============================================ + MENU BAR + ============================================ */ + +menubar { + background-color: #2b2d31; + color: #dbdee1; + padding: 4px 8px; +} + +menubar > menuitem { + padding: 4px 12px; + border-radius: 4px; +} + +menubar > menuitem:hover { + background-color: #35373c; +} + +menu { + background-color: #111214; + color: #dbdee1; + border-radius: 4px; + padding: 6px 8px; border: none; - margin: 0px; - min-width: 0px; - min-height: 0px; } -.classic-mention-overlay:selected { - color: @theme_selected_color; - background-color: @theme_selected_bg_color; +menu > menuitem { + padding: 6px 8px; + border-radius: 4px; } -.channel-list .view:selected { - background-color: @theme_selected_bg_color; +menu > menuitem:hover { + background-color: #5865f2; + color: #ffffff; } -.classic-guild-list > row { - padding-left: 0px; - box-shadow: none; +/* ============================================ + BUTTONS (Discord Blurple) + ============================================ */ + +button { + background-color: #5865f2; + color: #ffffff; border: none; - outline: none; + border-radius: 3px; + padding: 8px 16px; } -.classic-guild-list > row:hover { - background: none; +button:hover { + background-color: #4752c4; } -.classic-guild-list-guild.has-unread { - background: radial-gradient(7px circle at left, @theme_selected_bg_color 50%, transparent 20%); +button:active { + background-color: #3c45a5; } -.classic-guild-list-folder.has-unread stack { - background: radial-gradient(7px circle at left, @theme_selected_bg_color 50%, transparent 20%); +button.destructive-action { + background-color: #da373c; } -.classic-guild-list-guild box, .classic-guild-list-folder stack { - padding-left: 10px; +button.destructive-action:hover { + background-color: #a12d31; +} + +/* ============================================ + MENTIONS + ============================================ */ + +.classic-mention-overlay:selected { + color: #ffffff; + background-color: #5865f2; + border-radius: 3px; +} + +/* ============================================ + TEXT ENTRIES + ============================================ */ + +entry { + background-color: #1e1f22; + color: #dbdee1; + border: none; + border-radius: 3px; + padding: 8px 12px; +} + +entry:focus { + border: none; + outline: none; +} + +/* ============================================ + PANED SEPARATORS + ============================================ */ + +paned > separator { + background-color: #1e1f22; + min-width: 1px; + min-height: 1px; } From ca393d062c69b339aebc1733876d9f26f46e93dc Mon Sep 17 00:00:00 2001 From: db074 Date: Tue, 23 Dec 2025 14:51:14 -0500 Subject: [PATCH 3/3] Refine UI: darker backgrounds, larger fonts/scrollbars, text input padding --- res/css/main.css | 164 +++++++++++++++++++++++++++-------------------- 1 file changed, 96 insertions(+), 68 deletions(-) diff --git a/res/css/main.css b/res/css/main.css index c97d1805..62ef408a 100644 --- a/res/css/main.css +++ b/res/css/main.css @@ -7,16 +7,17 @@ GLOBAL WINDOW & BASE STYLES ============================================ */ -/* Main application window */ +/* Main application window - DARKER/BLACKER */ .app-window, window { - background-color: #313338; + background-color: #1a1a1d; color: #dbdee1; } -/* General text styling */ +/* General text styling - LARGER FONT */ * { font-family: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 15px; } /* Remove default GTK borders/outlines */ @@ -31,31 +32,39 @@ window { .classic-guild-list, .guild-list-scroll { - background-color: #1e1f22; + background-color: #0f0f10; } -.guild-list-scroll > scrollbar { +/* Make guild icons larger via padding */ +.classic-guild-list image { + min-width: 48px; + min-height: 48px; +} + +.guild-list-scroll>scrollbar { border: none; background: transparent; } -.guild-list-scroll > scrollbar slider { +.guild-list-scroll>scrollbar slider { border: none; margin: 0px; - min-width: 4px; - min-height: 20px; - background-color: #1a1b1e; + min-width: 8px; + min-height: 30px; + background-color: #27282c; border-radius: 4px; } -.classic-guild-list > row { +.classic-guild-list>row { padding-left: 0px; + padding-top: 4px; + padding-bottom: 4px; box-shadow: none; border: none; outline: none; } -.classic-guild-list > row:hover { +.classic-guild-list>row:hover { background: none; } @@ -79,54 +88,55 @@ window { .channel-list, .channel-list .view { - background-color: #2b2d31; - color: #949ba4; + background-color: #18181b; + color: #b5bac1; + font-size: 15px; } .channel-list .view:selected { - background-color: #404249; + background-color: #35373c; color: #f2f3f5; } .channel-list .view:hover { - background-color: #35373c; + background-color: #2a2a2e; color: #dbdee1; } /* Category headers */ .channel-list label { color: #949ba4; - font-size: 12px; + font-size: 13px; font-weight: 600; - text-transform: uppercase; } /* ============================================ MAIN CHAT AREA ============================================ */ -/* Chat background */ +/* Chat background - DARKER */ scrolledwindow, .message-container-outer { - background-color: #313338; + background-color: #1a1a1d; } /* Individual messages */ .message-container { margin-bottom: 0px; - padding: 2px 16px 2px 72px; - background-color: #313338; + padding: 8px 16px 8px 72px; + background-color: #1a1a1d; } .message-container:hover { - background-color: #2e3035; + background-color: #1e1e21; } -/* Message text */ +/* Message text - LARGER */ .message-text, .message-text text { background: inherit; color: #dbdee1; + font-size: 16px; } .message-text.pending { @@ -148,24 +158,27 @@ scrolledwindow, } /* ============================================ - MESSAGE INPUT BOX + MESSAGE INPUT BOX - FIXED OFFSET ============================================ */ .message-input { - background-color: #383a40; + background-color: #27282c; border-radius: 8px; - margin: 0 16px 24px 16px; + margin: 0 16px 16px 16px; } .message-input textview, .message-input textview text { - background-color: #383a40; + background-color: #27282c; color: #dbdee1; border-radius: 8px; + font-size: 16px; } +/* TEXT INPUT PADDING - OFFSET FROM EDGE */ .message-input textview { - padding: 12px 16px; + padding: 14px 20px; + margin: 4px 8px; } .message-input scrollbar.vertical slider { @@ -173,30 +186,35 @@ scrolledwindow, } /* ============================================ - MEMBER LIST (Right Sidebar) + MEMBER LIST (Right Sidebar) - LARGER ============================================ */ .member-list, treeview { - background-color: #2b2d31; - color: #949ba4; + background-color: #18181b; + color: #b5bac1; + font-size: 15px; } treeview:selected { - background-color: #35373c; + background-color: #2a2a2e; } treeview:hover { - background-color: #35373c; + background-color: #2a2a2e; } -/* Role headers in member list */ +/* Increase row height for larger avatars */ +treeview.view { + -GtkTreeView-vertical-separator: 8; +} + +/* Role headers in member list - LARGER */ .member-list-role { color: #949ba4; - font-size: 12px; + font-size: 14px; font-weight: 600; - text-transform: uppercase; - padding: 16px 8px 4px 16px; + padding: 20px 8px 8px 16px; } /* ============================================ @@ -226,19 +244,19 @@ treeview:hover { .embed { border-radius: 4px; padding: 8px 16px 16px 12px; - background-color: #2b2d31; + background-color: #18181b; border-left: 4px solid #5865f2; } .embed-footer { margin-top: 8px; - font-size: 12px; + font-size: 13px; color: #949ba4; } .embed-author { margin-bottom: 8px; - font-size: 14px; + font-size: 15px; font-weight: 600; color: #f2f3f5; } @@ -251,7 +269,7 @@ treeview:hover { border: 1px solid #4e5058; border-radius: 8px; padding: 10px; - background-color: #2b2d31; + background-color: #18181b; } .message-attachment-box label { @@ -267,7 +285,7 @@ treeview:hover { padding: 4px 8px; border-radius: 8px; border: none; - background-color: #2b2d31; + background-color: #27282c; margin-right: 4px; } @@ -286,12 +304,12 @@ treeview:hover { .profile-main-container { padding: 20px; - background-color: #232428; + background-color: #111113; } .profile-username { margin-left: 10px; - font-size: 20px; + font-size: 22px; font-weight: 600; color: #f2f3f5; } @@ -331,7 +349,7 @@ treeview:hover { padding: 8px 12px; border-radius: 8px; border: none; - background-color: #1e1f22; + background-color: #0f0f10; } .profile-connection-image { @@ -344,7 +362,7 @@ treeview:hover { .set-status-dialog .dialog-vbox { padding: 16px; - background-color: #313338; + background-color: #1a1a1d; } .set-status-dialog .dialog-action-area { @@ -353,7 +371,7 @@ treeview:hover { dialog, messagedialog { - background-color: #313338; + background-color: #1a1a1d; color: #dbdee1; } @@ -361,9 +379,9 @@ messagedialog { VOICE SETTINGS ============================================ */ -.voice-settings-window > box { +.voice-settings-window>box { padding: 16px; - background-color: #313338; + background-color: #1a1a1d; } .voice-settings-window scale { @@ -381,7 +399,7 @@ messagedialog { } /* ============================================ - SCROLLBARS (Discord-style thin scrollbars) + SCROLLBARS - LARGER ============================================ */ scrollbar { @@ -389,22 +407,22 @@ scrollbar { } scrollbar slider { - background-color: #1a1b1e; - border-radius: 4px; - min-width: 8px; - min-height: 40px; + background-color: #3a3a3f; + border-radius: 6px; + min-width: 12px; + min-height: 50px; } scrollbar slider:hover { - background-color: #27282c; + background-color: #4a4a50; } scrollbar.vertical slider { - min-width: 8px; + min-width: 12px; } scrollbar.horizontal slider { - min-height: 8px; + min-height: 12px; } /* ============================================ @@ -412,34 +430,34 @@ scrollbar.horizontal slider { ============================================ */ menubar { - background-color: #2b2d31; + background-color: #18181b; color: #dbdee1; padding: 4px 8px; } -menubar > menuitem { +menubar>menuitem { padding: 4px 12px; border-radius: 4px; } -menubar > menuitem:hover { - background-color: #35373c; +menubar>menuitem:hover { + background-color: #27282c; } menu { - background-color: #111214; + background-color: #0f0f10; color: #dbdee1; border-radius: 4px; padding: 6px 8px; border: none; } -menu > menuitem { +menu>menuitem { padding: 6px 8px; border-radius: 4px; } -menu > menuitem:hover { +menu>menuitem:hover { background-color: #5865f2; color: #ffffff; } @@ -487,11 +505,11 @@ button.destructive-action:hover { ============================================ */ entry { - background-color: #1e1f22; + background-color: #111113; color: #dbdee1; border: none; border-radius: 3px; - padding: 8px 12px; + padding: 10px 14px; } entry:focus { @@ -503,8 +521,18 @@ entry:focus { PANED SEPARATORS ============================================ */ -paned > separator { - background-color: #1e1f22; +paned>separator { + background-color: #0f0f10; min-width: 1px; min-height: 1px; } + +/* ============================================ + ADDITIONAL SIZING + ============================================ */ + +/* Larger avatar/icon containers */ +image { + min-width: 40px; + min-height: 40px; +} \ No newline at end of file