/* *** Dark Theme — GameBanana UI Theme *** Coded for — GameBanana UI Themes (https://gamebanana.com/scripts/cats/2238) Coded by — Danial Zahid *** Contact *** ► Email address — danialz@pm.me ► Portfolio — http://danialzahid.ga ► Discord — Danial Zahid#2017 ► GameBanana — https://gamebanana.com/members/1336101 ► Steam — https://steamcommunity.com/id/DanialZahid ► YouTube — http://bit.ly/DanialZahidYT *** Info *** Refer to the following link for the full info. https://gamebanana.com/scripts/10339 *** Details *** Tested on — Google Chrome [ Version 74.0.3729.157 (Official Build) (64-bit) ] Version — 1.5 Date published — 8th November, 2018 Last updated — 17th May, 2019 *** Updates / Changelog *** Version 1.5 — 17th May, 2019 • Updated the BuddyChat pane. • Updated the WYSIWYG palettes area (Element Config, Attached Images, etc.). • Fixed the SubNavigator's bottom border. • Tweaked the Activity/Alerts pane page number color. • Tweaked the post textarea (WYSIWYG and Source). This will also affect some other textareas/fields which is intentional. • Minor Search area tweaks. • Some other minor tweaks. Version 1.4 — 21st November, 2018 • Updated the Add Update > ChangeLog area to match with the theme (which was left with the default UI). • Fixed the hidden column's pop-up arrow icon color when it's popped up. Version 1.3 — 16th November, 2018 • Updated the group letter text color on the game selection form in the Add section. • Updated the link hover color on the Attributes module (which was left default). • Fixed the exemplary post bottom border style, as well as tweaked the exemplary post style in general to match with the theme. Version 1.2 — 11th November, 2018 • Updated the PM recipient area, particularly the recipient adder area to match with the theme. • Updated the Stats icon notification indicator to match with the theme (same as the Alerts and Activity icon indicator). • Fixed the "#BodyWrapper" selector background. • Fixed a minor background color leftover on the "#MainContentHeader.Fixed" selector to match with the theme. Version 1.1 — 9th November, 2018 • Updated the Profile WYSIWYG Editor page to match with the theme (which was left with the default UI). • Some other minor tweaks. Version 1.0 — 8th November, 2018 • Initial release. License: Refer to the following link for the full license. https://gamebanana.com/scripts/license/10339 */ /* *** CORE *** */ @import url('https://fonts.googleapis.com/css?family=Oxygen|Signika|Cuprum|Source+Code+Pro'); body { font-size: 14px; font-family: Oxygen; color: #FAFAFA; } #BodyWrapper { background: #2E2E2E url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAHElEQVQoU2NkIA5IMhKnjmFUId6AAgePJDFhCQDDFAEFiQDatQAAAABJRU5ErkJggg==); } #PageFooter { background: #1C1C1C url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAHElEQVQoU2NkIA5IMhKnjmFUId6AAgePJDFhCQDDFAEFiQDatQAAAABJRU5ErkJggg==); } #MasterLog { background: #1C1C1C; } /* *** SUB NAVIGATOR *** */ body[data-_sSideNavMode=Collapsed][data-_sSideNavPosition=Right][data-_sSideNavIconSize=Small][data-_sHeaderStyle=Floating] #MainContentHeader.Fixed { border-bottom: 1px solid #000000; } #SubNavigator .BasicSubNavigator .ActiveEntry a { color: #ffffff; } #SubNavigator .BasicSubNavigator .ActiveEntry { background: rgba(46, 204, 113, 0.15); border-bottom-color: #2ecc71; } #SubNavigator .BasicSubNavigator li:hover { background: rgba(255, 255, 255, 0.15); border-bottom-color: #ffffff; } #SubNavigator .BasicSubNavigator li a { color: #c0c0c0; } #SubNavigator .BasicSubNavigator li a:hover { color: #ffffff; } #SubNavigator { border-bottom-width: 1px; border-bottom-color: #000000; border-bottom-style: none; } #SubNavigator .DropdownMenuSubNavigator > li:hover { background: rgba(255, 255, 255, 0.15); border-bottom-color: #ffffff; } #SubNavigator .DropdownMenuSubNavigator .ActiveEntry { background: rgba(46, 204, 113, 0.15); border-bottom-color: #2ecc71; } #SubNavigator .DropdownMenuSubNavigator .ActiveEntry a { color: #ffffff; } body[data-_sHeaderStyle=Floating] #MainContentHeader.Fixed #SubNavigator { background: #424242; } #SubNavigator .DropdownMenuSubNavigator > li ul > li { background: #1C1C1C; } #SubNavigator .DropdownMenuSubNavigator > li ul > li > a:hover { color: #ffffff; } #SubNavigator .DropdownMenuSubNavigator > li ul > li > a { color: #c0c0c0; } #SubNavigator .DropdownMenuSubNavigator > li > a:hover { color: #ffffff; } /* *** TOP AND SIDE NAVIGATOR *** */ #TopNav #StatsNavModule.PointsGained widget, #TopNav #StatsNavModule.PointsGained icon, #SideNav #StatsNavModule.PointsGained widget, #SideNav #StatsNavModule.PointsGained icon { background: #2ecc71; border-color: #2ecc71; } #TopNav #StatsNavModule.PointsLost widget, #TopNav #StatsNavModule.PointsLost icon, #SideNav #StatsNavModule.PointsLost widget, #SideNav #StatsNavModule.PointsLost icon { background: #F44336; border-color: #F44336; } #SideNav > wrapper module.HasUpdates icon { background: #2ecc71; border-color: #2ecc71; } #TopNav module.HasUpdates widget { background: #2ecc71; border-color: #2ecc71; } #NavOptionsNavModule pane #NavOptionsUiThemeList { border: 1px solid #000000; background: #585858; border-radius: 0; padding: 5px; } #NavOptionsNavModule pane #NavOptionsUiThemeList li { background: #1C1C1C; border-radius: 0; font-size: 12px; } #TopNav, #SideNav { background: #1C1C1C url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAHElEQVQoU2NkIA5IMhKnjmFUId6AAgePJDFhCQDDFAEFiQDatQAAAABJRU5ErkJggg==); } #SideNav > wrapper module pane header, #SideNav > wrapper module pane footer { background: #6E6E6E; } #TopNav module.Selected icon, #TopNav module.Selected widget, #SideNav module.Selected icon, #SideNav module.Selected widget { background: #151515; } #TopNav module pane, #SideNav module pane { background: #151515; } /* *** BUTTONS *** */ .ExtendedContentButton { background: #696969; } button:hover, button.Selected, button.Expanded, .ButtonLike:hover, .ButtonLike.Selected, .ButtonLike.Expanded { background: #2E2E2E; color: #ffffff; } button, .ButtonLike { font-weight: bold; font-size: 14px; font-family: Signika; border: 1px solid #000000; border-radius: 0; padding: 5px; background: #696969; color: #ffffff; } #PageFooter #ImportantLinks li a:hover { background: #2E2E2E; } #PageFooter #ImportantLinks li a { font-size: 14px; font-family: Signika; border: 1px solid #000000; border-radius: 0; padding: 5px; background: #696969; color: #ffffff; } #PageFooter #ImportantLinks li a:hover span { color: #ffffff; } button[disabled]:hover, button[disabled].Selected, button[disabled].Expanded, .ButtonLike[disabled]:hover, .ButtonLike[disabled].Selected, .ButtonLike[disabled].Expanded { background: #2E2E2E; color: #ffffff; } /* *** LINKS *** */ a:hover, .Linklike:hover { color: #ffffff; } a, .Linklike { color: #c0c0c0; } .RecipientGroups .RecipientGroup .MasterSwitch .CustomOptionsToggle { color: #c0c0c0 !important; } .RecipientGroups .RecipientGroup .MasterSwitch .CustomOptionsToggle:hover { color: #ffffff !important; } /* *** HEADINGS *** */ .PageModule > h3 { font-size: 24px; font-family: Cuprum; } #TopNav module pane header h4, #SideNav module pane header h4 { font-size: 20px; font-family: Cuprum; } #TopNav module pane h5, #SideNav module pane h5 { font-size: 16px; font-family: Cuprum; } h4, h5, h6 { font-size: 18px; font-family: Cuprum; } /* *** TEXT EDITOR AND SUBMISSION FORM *** */ input[type=text], input[type=password], input[type=password], input[type=number], input[type=email], input[type=num], input[type=tel], select, .SelectLike, option, .OptionLike, optgroup, textarea, .TextareaLike { border-radius: 0; font-size: 14px; font-family: Oxygen; padding: 10px; color: #ffffff; border: 1px solid #000000; background: #212121; } input[type=text]:focus, input[type=password]:focus, input[type=password]:focus, input[type=number]:focus, input[type=email]:focus, input[type=num]:focus, input[type=tel]:focus, select:focus, .SelectLike:focus, option:focus, .OptionLike:focus, optgroup:focus, textarea:focus, .TextareaLike:focus { background: #212121; border: 1px solid #2ecc71 !important; } input[type=text]:hover, input[type=password]:hover, input[type=password]:hover, input[type=number]:hover, input[type=email]:hover, input[type=num]:hover, input[type=tel]:hover, select:hover, .SelectLike:hover, option:hover, .OptionLike:hover, optgroup:hover, textarea:hover, .TextareaLike:hover { background: #212121; border: 1px solid #2ecc71 !important; } .ContentEditableEditor .InputWrapper .Editor .ViewModes .Wysiwyg .RichText:focus { background: #212121; border: 1px solid #2ecc71 !important; } .ContentEditableEditor .InputWrapper .Editor .ViewModes .Wysiwyg .RichText:hover { background: #212121; border: 1px solid #2ecc71; } .ContentEditableEditor .InputWrapper .Editor .ViewModes .Wysiwyg .RichText { border-radius: 0; font-size: 14px; font-family: Oxygen; padding: 10px; color: #ffffff; border: 1px solid #000000; background: #212121; } .MainForm fieldset#SubmissionAuthors #AuthorGroupsList { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } .MainForm fieldset#SubmissionAuthors #AuthorGroupsList li { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; padding: 5px !important; } .MainForm fieldset#SubmissionAuthors #AuthorGroupsList li .AuthorsList { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } .MainForm fieldset#EmbeddedMedia ul { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } .MainForm fieldset#EmbeddedMedia ul li { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; } .MainForm fieldset .UploadedFiles { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } .MainForm fieldset .UploadedFiles li { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; } .MainForm fieldset#Attributes .AvailableAttributes ul .AttributesGroup { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; } .MainForm fieldset#Attributes .SelectedAttributes > div, .MainForm fieldset#Attributes .AvailableAttributes > div { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } .MainForm fieldset#Attributes .SelectedAttributes ul li { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; } .Content .DefinitionListEntries ul { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } .Content .DefinitionListEntries ul li { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; } .AdvancedElement_Tabs li.Selected { background: rgba(46, 204, 113, 0.15) !important; border-bottom-color: #2ecc71 !important; color: #ffffff !important; } .AdvancedElement_Tabs li:hover { background: rgba(255, 255, 255, 0.15); border-bottom-color: #ffffff; } .AdvancedElement_Tabs li { transition: all 0.15s ease-in-out; } .AdvancedElement_Tabs { border-bottom-color: #000000 } .MainForm fieldset#Category .UberSelect .OptionsWrapper .Options li:hover { color: #ffffff !important; background: rgba(46, 204, 113, 0.15); } .MainForm fieldset#Category .UberSelect .OptionsWrapper .Options .Selected { color: #ffffff !important; background: rgba(255, 255, 255, 0.15); } .MainForm fieldset#Category .UberSelect .OptionsWrapper .Options { background: rgba(28, 28, 28, 0.9); } .ContentEditableEditor .InputWrapper .Inserters .BitpitFileInserter ul li span:hover, .ContentEditableEditor .InputWrapper .Inserters .BitpitFileInserter ul li img:hover { outline: 1px dashed #ffffff; } .MainForm fieldset#SubmissionAuthors #AuthorGroupsList li .AuthorsList li .AuthorIsMember { color: #ffffff !important; } .MainForm fieldset#Attributes .AvailableAttributes h5:hover { color: #ffffff !important; } .MainForm fieldset#Attributes .AvailableAttributes h5 { color: #c0c0c0; } .MainForm fieldset#Requirements ul { border: 1px solid #000000 !important; background: #151515 !important; border-radius: 0 !important; padding: 5px !important; } .MainForm fieldset#Requirements ul li { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; padding: 5px !important; } .WysiwygList ul { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } .WysiwygList ul li { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; padding: 5px !important; } .MainForm fieldset#AlternateFileSources ul { font-size: 16px !important; border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } .MainForm fieldset#AlternateFileSources ul li { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; } /* *** MISC. *** */ .tooltipster-sidetip .tooltipster-box { background: rgba(0, 0, 0, 0.9); border-radius: 0; } .PageModule.Maximized { background: #1C1C1C; border-radius: 0; } .MainForm .InputsWrapper fieldset > legend stateLabel.RequiredInput { color: #FF8000; } stateLabel { padding: 5px; border-radius: 0; background: #424242; font-weight: bold; font-family: "Source Code Pro"; font-size: 15px; } recordCell.Identifiers stateLabel { font-size: 15px; } stateLabel.RatingState_Unjustified { color: #FF8000; } .MainForm .InputsWrapper fieldset > legend stateLabel.RequiredInput, .MainForm .InputsWrapper fieldset > legend stateLabel.RecommendedInput, .MainForm .InputsWrapper fieldset > legend stateLabel.ErroneousInput { font-size: 13px; } .PostsListModule .Posts > li .PostTools .PostUrlForm input { font-size: 10px; font-family: "Source Code Pro"; } .PostsListModule .Posts > li .TogglePostRepliesButton { color: #ffffff; } #WeightModule table { font-size: 12px; } #CriteriaModule ul { font-size: 12px; } #EmbeddableImagesListModule li input { color: #ffffff; } #EmbeddableImagesListModule li input, #EmbeddableImagesListModule li label { font-size: 12px; } recordCell.Identifiers stateLabel { font-size: 12px; } .PageModule > h3:after { width: 2.5em; background: #BDBDBD; } .AdvancedElement_InputSuggestionsList li:hover { color: #ffffff !important; background: rgba(46, 204, 113, 0.15); } .AdvancedElement_InputSuggestionsList li { background: rgba(28, 28, 28, 0.9); } #SectionAddFormSelectorModule .Content #SelectSectionStep .Column li a div small { color: #ffffff !important; } #EmbeddableImagesListModule li input { color: #ffffff !important; } recordCell.Identifiers .DirectCategory a { color: #c0c0c0; } recordCell.Identifiers .DirectCategory a:hover { color: #ffffff; } recordCell.Stats { font-size: 12px; } #LicenseModule div.Content a:hover { color: #ffffff; } .MainForm .InputsWrapper .CategoryTabs li small .RequiredInputsCount { color: #FF8000; } .MainForm .InputsWrapper .CategoryTabs li small .RecommendedInputsCount { color: #2ecc71; } .MainForm .InputsWrapper fieldset > legend stateLabel.RecommendedInput { color: #2ecc71; } #ItemProfileModule .CodeWithLineNumbers { border: 1px solid #000000 !important; background: #1C1C1C !important; border-radius: 0 !important; padding: 5px !important; } #Loader span { border-width: 8px; border-color: #F2F2F2; border-style: double; border-left-color: #FF8000; animation: LoaderSpinner 1s infinite linear; border-right-color: #FF8000; } #Loader.Complete span { border-color: #2ecc71; } #Loader.Complete num { color: #2ecc71; } #Loader num { color: #FF8000; font-size: 10px; text-align: center; font-weight: bold; } .RichText .TableOfContents ul li { color: #c0c0c0; } .RichText .TableOfContents ul li:hover { color: #ffffff; } .PostsListModule .Posts > li { border-bottom: 1px solid #A4A4A4 !important; } #SearchNavModule #SearchForm button:hover faIcon { color: #ffffff; } #SearchNavModule #SearchForm button faIcon { color: #c0c0c0; } #SearchNavModule #SearchForm button { margin-left: -35px; } #SectionMatchesModule ul li.Selected a span, #GameMatchesModule ul li.Selected a span { color: #ffffff; } .lg-outer .lg-toogle-thumb { background-color: #585858; color: #ffffff; } .lg-outer .lg-thumb-outer { background-color: #585858 } .lg-outer .lg-thumb-item.active, .lg-outer .lg-thumb-item:hover { border-color: #ffffff; } .lg-actions .lg-next, .lg-actions .lg-prev { background-color: #585858; border-radius: 0; color: #ffffff; } #ToggleHiddenColumnModeButton.Active faIcon { background-color: #585858; border-radius: 0; color: #ffffff !important; border-color: #2ecc71; } #ToggleHiddenColumnModeButton.Selected faIcon { color: #F44336; transform: rotateY(180deg); border-color: #F44336; } #MainContent #ContentGrid.HiddenColumnMode > row > column.xs-h { background: #616161; } .AdvancedElement_Tabs.Minimal li:hover { background: rgba(255, 255, 255, 0.15) !important; border-bottom-color: #ffffff !important; } #SectionExplanationsModule #SectionAreas > li .Sections li .AddLink:hover { color: #ffffff !important; } #SectionExplanationsModule #SectionAreas > li .Sections li .AddLink { color: #2ecc71 !important; } #SearchSuggesterModule .GameChannels { background: #1C1C1C !important; border-radius: 0 !important; border: 2px solid #000000 !important; } #SearchSuggesterModule .GameChannels h4 { color: #ffffff !important; } #SectionMatchesModule ul li.Selected a span, #GameMatchesModule ul li.Selected a span { color: #ffffff !important; } #LicenseModule div.Content { font-size: 12px; } #ProfileWysiwygEditor .InputWrapper #AvailableModules { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } #ProfileWysiwygEditor .InputWrapper #AvailableModules .TemplateModule { background: #1C1C1C !important; border-radius: 0 !important; font-size: 12px !important; } #ProfileWysiwygEditor .InputWrapper #TemplateGrid row { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 5px !important; } #ProfileWysiwygEditor .InputWrapper #TemplateGrid row column { background: #1C1C1C !important; border-radius: 0 !important; font-size: 14px !important; } #ProfileWysiwygEditor .InputWrapper #TemplateGrid row column placeholder { background: #424242 !important; border-radius: 0 !important; font-size: 14px !important; } .RedBorder:hover, .BlueBorder:hover, .GreenBorder:hover, .OrangeBorder:hover, .GreyBorder:hover { border-color: #ffffff; } .RedBorder { color: #F44336; } .RedColor { color: #F44336; } .GreenColor { color: #2ecc71; } #Recipients .RecipientGroup > div ul { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 10px !important; } #Recipients .RecipientGroup > div ul li { font-size: 10px; padding: 5px !important; border-radius: 0 !important; } #Recipients .RecipientGroup > div ul li.SelectedRecipient { background: rgba(255, 255, 255, 0.5); color: #111; font-size: 12px; font-weight: bold; } #Recipients .RecipientGroup > div ul li:hover { background: rgba(255, 255, 255, 0.2); } #Recipients small, #Recipients textarea { font-size: 12px; color: #ffffff; display: block; } em.SelectedRecipientsCount.PurpleColor { color: #2ecc71; } #MainContentHeader.Fixed { background: #424242 !important; } .PostsListModule .Posts > li.IsExemplary { background: rgba(46, 204, 113, 0.2); border-radius: 0; border: 1px solid #2ecc71 !important; } #AttributesModule a:hover { color: #ffffff !important; } #SectionAddFormSelectorModule .Content #SelectGameStep .GamesList .LetterGroup { color: #000000 !important; } .MainForm fieldset#ChangeLog ul { border: 1px solid #000000 !important; background: #585858 !important; border-radius: 0 !important; padding: 10px !important; } .MainForm fieldset#ChangeLog ul li { background: #1C1C1C !important; border-radius: 0 !important; font-size: 16px !important; padding: 5px !important; } .AdvancedListSettingsModule > .Content .OrderAndSortControls fieldset legend { color: #c0c0c0 !important; } .AdvancedListSettingsModule > .Content .OrderAndSortControls fieldset legend:hover { color: #ffffff !important; } #AlertsNavModule pane .Controls .PageNumber, #ActivityNavModule pane .Controls .PageNumber { padding: 5px; color: #ffffff; } .Editor .WysiwygPalettes { background: #585858; border-radius: 0; } .Editor .WysiwygPalettes > h4 { font-size: 10px; opacity: 0.8; padding: 5px; border-radius: 0; background: #1C1C1C; margin: 2px 2px 2px 0px; font-family: Oxygen; } .Editor .WysiwygPalettes > palette { background: #1C1C1C; font-size: 12px; border-radius: 0; } .Editor .WysiwygPalettes .ImageInserter ul { background: #424242; border: 1px solid #000000; border-radius: 0; } .Editor .WysiwygPalettes .UsernameInserter ul { background: #424242; border: 1px solid #000000; border-radius: 0; } .Editor .WysiwygPalettes .BitpitFileInserter ul { background: #424242; border: 1px solid #000000; border-radius: 0; } .Editor .WysiwygPalettes .BitpitFileInserter ul li { background: #1C1C1C; border-radius: 0; } #SearchNavModule #SearchForm input[type=text] { color: grey; border-radius: 0; padding: 10px; background: #3d3d3d; font-size: 14px; } /* *** CHAT MODULE / BUDDIES PANE *** */ #BuddiesNavModule pane article .ChannelContents > .Messages > .SelfMessage .RichText { background: #2d3436; border-radius: 0; } #BuddiesNavModule pane article .ChannelContents > .Messages > .Message .RichText { background: #636e72; border-radius: 0; } #BuddiesNavModule pane article .ChannelContents > .Messages { background: #1C1C1C; }