Ads keep us online. Without them, we wouldn't exist. We don't have paywalls or sell mods - we never will. But every month we have large bills and running ads is our only way to cover them. Please consider unblocking us. Thank you from GameBanana <3

Dark Theme (CSUI) [Frost]

A Config Script for GameBanana

501/ 2,887   Truncated 74 kb Raw Code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
/*
        # Dark Theme (CSUI) [Frost]

        [DESCRIPTION]

        A UI theme (custom CSS) for GameBanana website.

        Based off of the original Dark Theme (CSUI) UI theme, Dark Theme (CSUI) [Frost] primarily uses the blur filter (titled as Frost).
        -----------------------------

        [DETAILS]
       
        Browsers tested:

        * Google Chrome (version 79.0.3945.88 (Official Build) (64-bit))
        * Mozilla Firefox (version 68.0 (64-bit))
        * Opera (version 62.0.3331.72)

        Date released: 2019-12-06
        Last updated: 2019-12-27
        Current version: 1.0.2

        On my portfolio: http://danialzahid.ga/dark-theme-csui-frost-
        On GitHub: https://github.com/DanialZahid/Dark-Theme-CSUI-Frost-
        On GameBanana: https://gamebanana.com/scripts/10507/
        -----------------------------

        [AUTHORS]

        * Danial Zahid [Code] (danialz@pm.me)

        Special thanks to:

        * tom [QuickDL material icon class addition]
        * Ring-A-Ding Rampage [Helped with a few issues]
        * Daniil Silantev [Background image]
        -----------------------------

        [CHANGELOG]

        ## Version 1.0.2 [2019-12-27]

        * [Fixed] Fixed master log background color.
        * [Fixed] Fixed hidden column toggle button (mobile device view) background color.
        * [Fixed] Fixed record padding.
        * [Miscellaneous] A few other tweaks.

        ## Version 1.0.1 [2019-12-21]

        * [Fixed] Background image link.
        * [Miscellaneous] Updated several modules UI to match with the rest of the theme.

        ## Version 1.0.0 [2019-12-06]

        * Initial release.

        [LICENSE]

        You are allowed to install this UI theme.

        You are not allowed to:

        1. Redistribute this UI theme on the Internet.
        2. Use this UI theme in your own work (either, published or not).
        3. Modify and publish the modified version of this UI theme on the Internet.
        4. Take or use any components (either, modified or not) of this UI theme and use in your own work (either, published or not).
        5. Take or use any components (either, modified or not) of this UI theme and publish on the Internet.
        6. Use this UI theme or its components for commercial purposes.
        -----------------------------
*/

@import url("https://fonts.googleapis.com/css?family=Arimo|Aldrich|Fira+Mono|Doppio+One&display=swap");
* {
  border-radius: 0 !important;
  filter: none !important;
}

html {
  background: #212121;
}

::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: var(--CSUIDBGColor);
}

::-webkit-scrollbar-thumb {
  background: var(--CSUIPurpleColor);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--CSUIWhiteColor);
}

::selection {
  background-color: var(--CSUIPurpleColor);
  color: #fff;
}

#BodyWrapper {
  background: var(--CSUIBodyBG) #212121;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

body {
  font-size: var(--CSUIFontSize);
  font-family: var(--CSUITextFF) !important;
  color: var(--CSUITextColor);
  background: var(--CSUIBodyColor);
  text-shadow: var(--CSUIBodyTS);
}

a:hover,
.Linklike:hover,
#SectionAddFormSelectorModule .Content #SelectSectionStep .Column li a:hover div strong,
#SectionAddFormSelectorModule .Content #SelectSectionStep .Column li a:hover div small,
.MainForm fieldset#Category .UberSelect .OptionsWrapper .Options li:hover,
.MainForm fieldset#Attributes .AvailableAttributes h5:hover,
.RichText .TableOfContents ul li:hover,
.AdvancedListSettingsModule > .Content .OrderAndSortControls fieldset legend:hover,
#SectionMatchesModule ul li.Selected a,
#SectionMatchesModule ul li:hover a,
#SectionMatchesModule ul li.Selected a span,
#GameMatchesModule ul li.Selected a span,
#AttributesModule a:hover {
  color: var(--CSUILinkHoverColor) !important;
}

a,
.Linklike,
.RichText .TableOfContents ul li {
  color: var(--CSUILinkColor);
  text-shadow: var(--CSUILinkShadow);
}

#AttributesModule a {
  color: var(--CSUILinkColor) !important;
  text-shadow: var(--CSUILinkShadow) !important;
}

#ContentGrid.HiddenColumnMode.xs row > column.xs-h {
  background: #212121;
  border-left: var(--CSUIDBorder);
}

.PageModule > .Content {
  padding: 10px;
}

#ContentGrid > row > column:not(:first-child) {
  background: initial;
  border: initial;
}

#MasterLog log {
  color: var(--CSUIGreenColor);
  font-weight: bold;
  border: 1px solid var(--CSUIGreenColor);
  font-size: var(--CSUIFontSize);
  background: var(--CSUIDBGColor);
  padding: 5px;
}

#MasterLog log span {
  border: none;
}

#Loader span,
#Loader span:after {
  border-radius: 50% !important;
  width: 22px;
  height: 22px;
}

#Loader.Complete span {
  border-color: var(--CSUIGreenColor);
}

#Loader span {
  border: 3px dashed var(--CSUIRedColor);
}

#Loader.Complete num {
  color: var(--CSUIGreenColor);
}

#Loader num {
  color: var(--CSUIRedColor);
  font-size: 10px;
  text-align: center;
  margin-top: 1px;
}

@media only screen and (min-width: 400px) {
  #PostsListModule_0 > .Content > .Posts > .Post > .PostReplies > .PostsListModule {
    border-left: 1px solid rgba(255, 255, 255, 0.1);
  }
  .PostsListModule .Posts > li .PostReplies.Focussed > .PostsListModule {
    border-left: 1px solid var(--CSUIWhiteColor);
  }
}

.PageModule > h3,
moduleGroup > h3 {
  text-align: center;
  padding: 5px;
  background: var(--CSUICardHeaderBG);
  margin: 0 0 10px 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
fieldset legend {
  font-family: var(--CSUIHFF) !important;
  color: var(--CSUIHColor);
}

h5,
h6,
#TopNav module pane h5,
#SideNav module pane h5 {
  font-size: var(--CSUIH56FontSize);
}

h3,
#SubmissionsListModuleGroup h3 {
  font-size: var(--CSUIH3FontSize) !important;
  text-align: center;
}

h4 {
  font-size: var(--CSUIH4FontSize) !important;
}

#HeadlineWrapper {
  background: transparent;
}

#AlertsNavModule pane .Broadcasts > li,
#ActivityNavModule pane .Broadcasts > li {
  padding: var(--CSUIPanesCardPadding);
  margin: var(--CSUIPanesCardMargin);
  opacity: 0.8;
  border: var(--CSUIPanesCardBorder) !important;
  background: var(--CSUIPanesCardBGColor);
}

#SearchNavModule pane #SearchOptionsForm {
  font-size: var(--CSUISmallFontSize);
  border: 2px solid rgba(156, 204, 101, 0.2) !important;
  box-shadow: inset 3px 3px 5px 0px rgba(0, 0, 0, 0.5) !important;
  border-radius: 0 !important;
  background: var(--CSUITextAreaBGColor) !important;
}

#BuddiesNavModule pane article .ChannelContents > .Messages > .SelfMessage .RichText,
#BuddiesNavModule pane article .ChannelContents > .Messages > .Message .RichText {
  font-size: var(--CSUISmallFontSize) !important;
  background: var(--CSUISLBGColor) !important;
  border-radius: 0 !important;
  border: 0.02px solid rgba(79, 195, 247, 0.5) !important;
}

#BananaNavModule pane article ul li a {
  font-size: var(--CSUISmallFontSize);
  border-radius: 0;
  padding: 5px;
  background: var(--CSUISLBGColor);
  border: 1px solid rgba(79, 195, 247, 0.5);
  font-family: var(--CSUIHFF) !important;
}

#TopNav,
#SideNav,
#PageFooter {
  background: var(--CSUITopSideFooterColor);
}

#TopNav module.Selected icon,
#TopNav module.Selected widget,
#SideNav module.Selected icon,
#SideNav module.Selected widget {
  background: var(--CSUIPanesBGColor);
}

#PersonalNavModule pane .Column1 .Identity,
#PersonalNavModule pane column:nth-child(1) .Identity {
  background: rgba(158, 158, 158, 0.1);
  border: 1px solid rgba(158, 158, 158, 0.2);
}

#AlertsNavModule pane .Broadcasts .Unseen,
#ActivityNavModule pane .Broadcasts .Unseen,
#UnseenBroadcastsModule {
  color: var(--CSUIWhiteColor);
  background: var(--CSUINotCardBGColor);
  border: var(--CSUINotCardBorder) !important;
}

#SideNav > wrapper module.HasUpdates icon,
#TopNav #StatsNavModule.PointsGained widget,
#TopNav #StatsNavModule.PointsGained icon,
#SideNav #StatsNavModule.PointsGained widget,
#SideNav #StatsNavModule.PointsGained icon {
  background: var(--CSUIGreenColor);
  border-color: var(--CSUIGreenColor);
}

#TopNav #StatsNavModule.PointsLost widget,
#TopNav #StatsNavModule.PointsLost icon,
#SideNav #StatsNavModule.PointsLost widget,
#SideNav #StatsNavModule.PointsLost icon {
  background: var(--CSUIRedColor);
  border-color: var(--CSUIRedColor);
}

#AlertsNavModule pane .Controls .MarkAllAsSeen:hover span,
#ActivityNavModule pane .Controls .MarkAllAsSeen:hover span,
#AlertsNavModule pane .Broadcasts .Unseen .BroadcastStatusWrapper:hover span,
#ActivityNavModule pane .Broadcasts .Unseen .BroadcastStatusWrapper:hover span {
  background: var(--CSUIGreenColor);
}

#AlertsNavModule pane .Controls .MarkAllAsSeen span,
#ActivityNavModule pane .Controls .MarkAllAsSeen span,
#AlertsNavModule pane .Broadcasts .Unseen .BroadcastStatusWrapper span,
#ActivityNavModule pane .Broadcasts .Unseen .BroadcastStatusWrapper span {
  background: rgba(156, 204, 101, 0.4);
  border: 2px solid var(--CSUIGreenColor);
}

#TopNav #StatsNavModule pane column:first-child stat rank,
#TopNav #StatsNavModule pane column:first-child stat itemCount,
#SideNav #StatsNavModule pane column:first-child stat rank,
#SideNav #StatsNavModule pane column:first-child stat itemCount {
  font-size: var(--CSUIH4FontSize);
}

#AlertsNavModule pane .Controls .PageNumber,
#ActivityNavModule pane .Controls .PageNumber {
  padding: 5px;
  color: var(--CSUIGreyColor);
  font-size: var(--CSUISmallFontSize);
}

#AlertsNavModule pane .Broadcasts > li .Messages li,
#ActivityNavModule pane .Broadcasts > li .Messages li {
  padding: 5px;
  border-top: 1px solid rgba(158, 158, 158, 0.3);
  font-size: var(--CSUISmallFontSize);
}

#SearchNavModule #SearchForm input[type=text] {
  color: var(--CSUIWhiteColor);
  font-size: var(--CSUIFontSize);
  font-family: var(--CSUIMonoFF) !important;
}

#MessagesNavModule pane #BuddyChatPromoColumn {
  background: var(--CSUIDBGColor);
  border-radius: 0;
  font-size: var(--CSUISmallFontSize);
}

#ManageNavModule pane .PaneTabs .Selected, #ManageNavModule pane .Panes .Pane.Selected {
  background: #9e9e9e4d !important;
}

#ManageNavModule pane .Panes {
  background: 0;
  padding: 0;
}

#ManageNavModule ul.PaneTabs {
  padding: 0;
}

#MessagesNavModule pane #LatestPmsColumn li {
  border-bottom: 1px solid rgba(158, 158, 158, 0.3);
}

#BuddiesNavModule pane article .ChannelContents > .Messages > .Message small {
  color: var(--CSUIGreyColor);
  font-size: 10px;
}

#BuddiesNavModule pane article #BuddyChatInitiators li.Unseen:after {
  background: var(--CSUIGreenColor);
}

#TopNav module.HasUpdates widget {
  background: var(--CSUIGreenColor);
  border: 1px solid var(--CSUIGreenColor);
}

#TopNav module pane, #SideNav module pane {
  background: var(--CSUIPanesBGColor);
  border: var(--CSUIPanesBorder);
}

#SideNav > wrapper module pane header:after {
  bottom: 0px;
  background: none;
  border-bottom: 3px solid #000000;
}

#NavOptionsNavModule pane textarea {
  font-size: var(--CSUISmallFontSize);
  font-family: var(--CSUIMonoFF);
  color: var(--CSUIGreenColor);
}

#BuddiesNavModule pane header {
  background: initial;
  border: initial;
}

#BuddiesNavModule pane article .ChannelContents > .Messages {
  background: var(--CSUIDBGColor);
}

#BuddiesNavModule pane button:hover {
  color: var(--CSUIWhiteColor) !important;
  opacity: 1 !important;
}

#SearchNavModule pane #SearchOptionsForm form_extension label span {
  font-family: var(--CSUIMonoFF);
}

#SearchNavModule #SearchForm button {
  transition: opacity 0.15s ease-in-out !important;
  margin-left: 10px;
}

#BananaNavModule pane article ul li a:hover {
  background: var(--CSUISLBGColor);
}

body[data-_sSideNavMode=Collapsed] #SideNav.Expanded {
  width: 500px;
}

#SubNavigator,
.AdvancedElement_Tabs {
  background: var(--CSUIBlurBG);
  border: var(--CSUICardBorder) !important;
  text-align: center;
  font-family: var(--CSUIHFF) !important;
  justify-content: center;
  margin: 10px auto;
  width: fit-content;
}

#SubNavigator .BasicSubNavigator,
#SubNavigator .DropdownMenuSubNavigator,
#Breadcrumb {
  font-family: var(--CSUIHFF) !important;
  margin-right: 0;
}

#SubNavigator .ActiveEntry,
.MainForm .InputsWrapper .CategoryTabs li.Selected,
.AdvancedElement_Tabs li.Selected {
  border: 0 !important;
  background: var(--CSUIButtonSelectedBGColor) !important;
}

#SubNavigator .DropdownMenuSubNavigator > li:hover,
.AdvancedElement_Tabs li:hover,
.AdvancedElement_Tabs li.Selected,
.MainForm .InputsWrapper .CategoryTabs li:hover,
#SubNavigator .BasicSubNavigator li:hover,
.AdvancedElement_Tabs.Minimal li:hover {
  background: #9e9e9e4d;
  border: 0;
}

.AdvancedElement_Tabs li:hover,
.AdvancedElement_Tabs li.Selected,
#SubNavigator .ActiveEntry {
  margin-bottom: 0;
}

.MainForm .InputsWrapper .CategoryTabs li:hover,
.MainForm .InputsWrapper .CategoryTabs li.Selected {
  color: var(--CSUIWhiteColor);
}

#SubNavigator .DropdownMenuSubNavigator > li ul > li:last-child,
.AdvancedElement_Tabs.Minimal {
 

Updates

Version 1.0.2 2mo
  • BugFix Fixed master log background color.
  • BugFix Fixed hidden column toggle button (mobile device view) background color.
  • BugFix Fixed record padding.
  • - A few other tweaks.
Version 1.0.1 2mo BugFix

Description

Based off of the original Dark Theme (CSUI) UI theme, Dark Theme (CSUI) [Frost] primarily uses the blur filter (titled as Frost).

Details

Browsers Tested

  • Google Chrome (version 79.0.3945.88 (Official Build) (64-bit))
  • Mozilla Firefox (version 68.0 (64-bit))
  • Opera (version 62.0.3331.72)

Date released: 2019-12-06
Last updated: 2019-12-27
Current version: 1.0.2

On my portfolio
On GitHub
On GameBanana

Video

Watch on Streamable.

Danial Zahid
2019-12-06
Sign up to access this!

No comments yet

Embed

Andel banner
Billede URL
HTML indlejr kode
BB indlejr kode
Markdown indlejr kode

Credits

Original Author
Danial Zahid avatar
Danial Zahid username pic Joined 7y ago
Bug Zapper Ripe Supporter Baldi Manager GoldSrc Manager Moderator
Offline
3,851 points Ranked 2089th
62 medals 5 legendary 17 rare
  • Submitted 50 Gamefiles Medal icon
  • Submitted 15 Tools Medal icon
  • Submitted 60 Prefabs Medal icon
  • Returned 5000 times Medal icon
  • Became a Ripe Supporter Medal icon
  • 50 posts awarded Exemplary Feedback Medal icon
Code
Special Thanks
tom avatar
tom username pic Joined 19y ago
End Boss Ripe Supporter TBS2 Manager Super Admin
Offline
1,088 points Ranked 24165th
66 medals 13 legendary 10 rare
  • Achieved Super Admin clearance Medal icon
  • 10 years a member Medal icon
  • Thanked 500 submitters Medal icon
  • Submitted 200 Blogs Medal icon
  • Submitted 200 Threads Medal icon
  • Submitted 60 Polls Medal icon
QuickDL material icon class addition
Ring-A-Ding Rampage avatar
Ring-A-Ding Rampage username pic Joined 9y ago
(づ。◕‿‿◕。)づ Ripe Supporter Moderator
Offline
4,837 points Ranked 1418th
76 medals 11 legendary 20 rare
  • Submitted 60 Sprites Medal icon
  • Thanked 500 submitters Medal icon
  • 15+ Entries! GameBanana’s Christmas Giveaway 2015 Medal icon
  • Submitted 100 Skins Medal icon
  • Reached 100 subscribers Medal icon
  • 15+ Entries! GameBanana’s Christmas Giveaway 2016 Medal icon
Helped with a few issues
Daniil Silantev
Background image

Submitter

Danial Zahid avatar
Danial Zahid username pic Joined 7y ago
Bug Zapper Ripe Supporter Baldi Manager GoldSrc Manager Moderator
Offline
3,851 points Ranked 2089th
62 medals 5 legendary 17 rare
  • Submitted 50 Gamefiles Medal icon
  • Submitted 15 Tools Medal icon
  • Submitted 60 Prefabs Medal icon
  • Returned 5000 times Medal icon
  • Became a Ripe Supporter Medal icon
  • 50 posts awarded Exemplary Feedback Medal icon
Danial Zahid avatar
Danial Zahid

Creator
Sign up to access this!
Sign up to access this!
Sign up to access this!

Game

Sign up to access this!

Category

Sub-category
UI Themes
Super-category
Cascade Style Sheets

License

You are allowed to install this UI theme.

You are not allowed to:

  1. Redistribute this UI theme on the Internet.
  2. Use this UI theme in your own work (either, published or not).
  3. Modify and publish the modified version of this UI theme on the Internet.
  4. Take or use any components (either, modified or not) of this UI theme and use in your own work (either, published or not).
  5. Take or use any components (either, modified or not) of this UI theme and publish on the Internet.
  6. Use this UI theme or its components for commercial purposes.

Attributes

Share

  • Share on Reddit
  • Share on Twitter
  • Share on Facebook
  • 3
  • 406
  • 3mo
  • 2mo
  • 2mo

More from Submitter

More UI Themes Scripts