Get light mode on your guilded, if you really want your eyes to burn!
Used blueberry by Metalloriff as base cause im too lazy to type so go check it https://github.com/Metalloriff/ReGuildedThemes/tree/main/Blueberry
It's not finished yet!
Supposed to be used with legacy navigation.
Guilded Light Mode WIP by robolaks
Details
Authorrobolaks
LicenseNo License
Categoryguilded
Created
Updated
Size14 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Update August 28, 2021
-Code is a bigger mess, maybe someday im going to rewrite it.
-Annoucements are more readable.
-Documents and lists support light mode, but there's still some stuff unfinished.
-Most shadows are lighter, wanted to delete them but some people liked them.
Update August 21, 2021
-Fixed presence not showing up
-Media, Streaming and Voice channels fully support light mode
-Settings are more readable
-Share boxes now support light mode
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Guilded Light Mode
@namespace https://github.com/robloaks/guilded-light-mode
@version 0.0.3
@description Get your eyes burnt with Guilded Light Mode.
@author robolaks
==/UserStyle== */
@-moz-document domain("guilded.gg") {
:root {
--primary-color: #d0d0d0;
--secondary-color: #f4f4f4;
--primary-bg: #ececec;
--secondary-bg: #e1e1e1;
--tertiary-bg: #f2f2f2;
--text-color: 0, 0, 0;
--white-text-color: 255, 255, 255;
--color-five: 207, 207, 207;
}
#app .ChannelWrapper-container,
#app .MyTeamsPage-container,
#app .PlayerLfgPortal-container,
#app .UserProfileV3-container,
#app .TournamentsPortalPage-container,
#app .CollapsibleItemHeader-container {
background-color: var(--primary-bg);
}
#app .PageSidebarWrapper-container,
#app .TeamPageNavV3-nav-sections,
#app .ScreenHeader-container,
#app .WebAppV2-sidebar,
#app .TeamPageNavV3-header,
#app .ChatChannelList-container,
#app .NavV4SectionSidebar-container,
#app .OptionsMenuPageWrapper-container,
#app .ModalV2-container {
background-color: var(--secondary-bg);
}
#app .GroupSelector-container,
#app .ChatChannelInput-editor,
#app .WindowsTitleBar-container,
#app .Navbar-container,
#app .ChatV2MessageReplyTooltip-content-wrapper,
#app .QuickActionBar-container,
#app .TransientMenu-container-style-default,
#app .ProfileHoverCardV2Overlay-container,
#app .UserProfilePostPanel-container,
#app .DraftInputWithTitleV2-title-wrapper,
#app .OpenGraphEmbed-content,
#app .CodeContainerRenderer-container,
#app .CodeLineRenderer,
#app .TeamThreadPostPanelDisplay-container,
#app .TeamThreadPostEditor-container,
#app .OptionsMenu-container-desktop .OptionsMenu-options-control,
#app .DefaultReadonlyEditableForm-container,
#app .UserSettingsServerSubscriptionsUpsell-container,
#app .ServerSubscriptionBar-container,
#app .PersistentUpsell-container-flavor-settings,
#app .SocialLinkPanel-header,
#app .ReactionPicker-content,
#app .ChannelActivityDisplay-container,
#app .ChannelActivityDisplay-group-header,
#app .ChatChannelInputInlineReplyStatusBar-container {
background-color: var(--tertiary-bg);
}
#app .InlineAddItemControl-add-icon,
#app .CalloutBadge-container,
#app .VerticalSelectionIndicator-container,
#app .SwitchInput-container-on .SwitchInput-slide {
background-color: var(--primary-color);
fill: white;
}
#app .LinkRenderer,
#app .LinkRenderer:hover,
#app .LinkRenderer:visited,
#app .LinkRenderer:active,
#app .LinkRenderer:focus,
#app .GuildedText-container-color-gilded1 {
color: var(--primary-color);
}
#app .SidebarInfoItem-container {
background: none;
}
#app .Navbar-container,
#app .GroupSelector-container,
#app .ChatChannelInput-editor,
#app .WindowsTitleBar-container,
#app .GroupSelector-container,
#app .WebAppV2-sidebar,
#app .PageSidebarWrapper-container,
#app .ScreenHeader-container,
#app .QuickActionBar-container,
#app .ChatChannelList-container,
#app .OpenGraphEmbed-content {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
#app .GroupSelector-container,
#app .ScreenHeader-container {
z-index: 5;
}
#app .ProfileHoverCardV2Overlay-action-menu,
#app .ReactionPickerFooter-container,
#app .ReactionPickerNavbar-container,
#app .ReactionPicker-search-bar,
#app .TeamChannelItemContents-container-selected,
#app .ChannelActivityDisplay-item {
background-color: rgba(255, 255, 255, 0.05);
}
#app .ChatV2Message-container-mentioned {
background-color: transparent;
border-left: var(--primary-color);
border-radius: var(--primary-border-radius);
}
#app .ChatV2Message-container-mentioned::Before {
content: "";
width: 100%;
height: 100%;
background-color: var(--primary-color);
opacity: 0.3;
pointer-events: none;
z-index: -100;
}
#app .QuickActionBar-container {
border: none;
}
#app .ChatV2Message-container:hover {
background: none;
}
#app .ChatV2Message-container:hover::Before {
content: "";
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: var(--primary-color);
opacity: 0.1;
pointer-events: none;
z-index: -100;
}
#app .OpenGraphEmbed-content {
border: none;
border-left: var(--primary-color);
border-radius: 0 var(--secondary-border-radius) var(--secondary-border-radius) 0;
}
#app .TeamNavHeaderRowButton-container,
#app .FormConfirmButtonV2-container {
border: none;
background: var(--primary-color);
border-radius: var(--primary-border-radius);
}
#app .TeamNavHeaderRowButton-container:hover,
#app .FormConfirmButtonV2-container:hover {
background-color: var(--secondary-color);
}
#app .TeamNavHeaderRowButton-container .FormConfirmButtonV2-button-content,
#app .FormConfirmButtonV2-container .FormConfirmButtonV2-button-content {
color: white;
}
#app .RangeSlider-container-type-gilded .RangeSlider-selected-rail {
background: var(--primary-color);
}
#app .HotkeyRecorder-container {
border: none;
background-color: var(--tertiary-bg);
}
#app .FormConfirmButtonV2-container-hollow {
border: none;
background-color: var(--primary-color);
border-radius: var(--primary-border-radius);
}
#app .UserProfilePostPanel-container {
border-radius: var(--secondary-border-radius);
border-top-color: var(--primary-color);
}
#app .DraftInputWithTitleV2-title-wrapper {
border-radius: var(--secondary-border-radius);
}
#app .UserGameSummaryCard-container {
border-radius: var(--secondary-border-radius);
background-color: var(--tertiary-bg);
overflow: hidden;
}
#app .UserGameSummaryCard-container * {
border: none;
}
#app .MyTeamsPage-grid .CardWrapper-container {
background-color: var(--secondary-bg);
border-radius: var(--secondary-border-radius);
}
#app .MyTeamsPage-grid .CardWrapper-container:after {
content: none;
}
#app .MyTeamsPage-grid .CardWrapper-container image {
border-radius: var(--secondary-border-radius) !important;
mask: none !important;
overflow: hidden;
}
#app .TeamChannelItemContents-container-selected {
background-color: var(--primary-color);
}
#app .ParagraphRenderer,
#app .TeamNavSectionsList-header,
#app .OptionsMenu-container-desktop,
#app .Form-header {
color: rgb(var(--text-color));
}
#app .GuildedText-container-type-subtext3,
#app .TeamNavSectionItem-name {
color: rgba(var(--text-color), 0.8);
}
#app .ChatV2MessageTimestamp-container {
color: rgba(var(--text-color), 0.5);
}
#app .ChannelIcon-icon-primary {
fill: rgb(var(--text-color));
}
#app .GuildedText-container-type-heading3 {
color: rgba(var(--text-color));
}
#app .LinkRenderer-read-only {
color: rgba(var(--text-color));
}
#app .icon-plus {
color: rgba(var(--text-color));
}
#app .SearchBarInput-container {
background-color: var(--secondary-color);
}
#app .TeamNavHeaderRowButton-text {
color: rgba(var(--text-color));
}
#app .OverviewWidgetItem-text {
color: rgba(var(--text-color));
}
#app .TeamMemberRolePill-name {
color: rgba(var(--text-color));
}
#app .ContextMenuItem-label {
color: rgba(var(--text-color));
}
#app .UserInfoSummaryItem-summary-content {
color: rgba(var(--text-color));
}
#app .UserName-container {
color: rgba(var(--text-color));
}
#app .OpenGraphEmbedContent-description {
color: rgba(var(--text-color));
}
#app .ChannelListHeader-amount {
color: rgba(var(--text-color));
}
#app .TeamWidgetProfileRank-rank-name {
color: rgba(var(--text-color));
}
#app .title {
color: rgba(var(--text-color));
}
#app .UserStatusMessageOption-preset-message-content {
color: rgba(var(--text-color));
}
#app .GuildedSelect-default-label {
color: rgba(var(--text-color));
}
#app .ModalHeaderV2-container {
background-color: var(--tertiary-bg);
}
#app .ModalHeaderV2-header {
color: rgba(var(--text-color));
}
#app .TeamPageContent-container {
background-color: var(--tertiary-bg);
}
#app .TeamOverviewRoot-description {
color: rgba(var(--text-color));
}
#app .ScreenHeader-name {
color: rgba(var(--text-color));
}
#app .ChatChannelListItemInfo-name {
color: rgba(var(--text-color));
}
#app .ChatChannelListItem-container-selected {
background-color: var(--color-five);
}
#app .IconAndLabel-label {
color: rgba(var(--text-color));
}
#app .TeamPageContentSidebarGames-see-all-games {
color: rgba(var(--text-color));
}
#app .TextInputWithLabel-floating-label {
color: rgba(var(--text-color));
}
#app .TextInputWithLabel-input-element {
color: rgba(var(--text-color));
}
#app .DesktopOptionsControlItemTemplate-label-text {
color: rgba(var(--text-color));
}
#app .PostDisplayV2-container {
background-color: var(--secondary-color);
}
#app .TeamOverviewSectionHeader-title {
color: rgba(var(--text-color));
}
#app .TeamOverviewCont...