Leahnaya/pokemon-showdown-client
1
0
Fork 0
mirror of https://github.com/smogon/pokemon-showdown-client.git synced 2026-09-14 06:49:56 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

Improve Dark Mode

Browse Source 
- Popups are now dark
- Topbar username outline is now black
- Teams and team/format selects are now darker
- Code and spoiler blocks are now dark
This commit is contained in:
Guangcong Luo
2016-02-05 10:43:41 -05:00
parent 13cccf1c92
commit b5ac1f5892
2 changed files with 101 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
style/battle.css
View File

@@ -721,6 +721,29 @@ License: GPLv2
.spoiler-shown a {
color: #2288CC;
}
.dark .spoiler {
color: #777;
background: #777;
}
.dark .spoiler:hover,
.dark .spoiler:active,
.dark .spoiler-shown {
color: #DDD;
background: #444;
}
.dark .spoiler a {
color: #777;
}
.dark .spoiler:hover a,
.dark .spoiler:active a,
.dark .spoiler-shown a {
color: #4488EE;
}
.chat .spoiler code {
border-color: #BBBBBB;
background: #BBBBBB;
color: #BBBBBB;
}
.chat code,
.chat .spoiler:hover code,
.chat .spoiler:active code,
@@ -730,10 +753,18 @@ License: GPLv2
color: black;
padding: 0 2px;
}
.chat .spoiler code {
border: 1px solid #CCCCCC;
background: #CCCCCC;
color: #CCCCCC;
.dark .chat .spoiler code {
border-color: #777;
background: #777;
color: #777;
}
.dark .chat code,
.dark .chat .spoiler:hover code,
.dark .chat .spoiler:active code,
.dark .chat .spoiler-shown code {
border-color: #555;
background: #333;
color: #DDD;
}
.battle-log .rated {
padding: 3px 4px;
@@ -813,6 +844,9 @@ License: GPLv2
.message-error {
color: #992222;
}
.dark .message-error {
color: #EF4333;
}
.message-overflow,
.chat small.message-overflow {
font-size: 0pt;

70
style/client.css
View File

@@ -134,9 +134,6 @@ button:disabled {
box-shadow: 0px 0px 4px #88CCFF, 0px 0px 4px #88CCFF;
background: #111111;
}
.dark .message-error {
color: #FF5333;
}
/* .dark button {
background: #777777;
@@ -647,6 +644,7 @@ p.or:after {
.popupmenu button.sel:hover {
border-color: #888888;
background: #D5D5D5;
color: black;
}
.popupmenu button.button {
margin: 2px auto 5px;
@@ -659,6 +657,7 @@ p.or:after {
font-size: 9pt;
text-align: left;
font-family: Verdana, Helvetica, Arial, sans-serif;
cursor: pointer;
border-radius: 4px;
border: 1px solid #888888;
@@ -2965,7 +2964,7 @@ a.ilink.yours {
margin: 2px;
padding: 2px;
border: 1px solid #E1E8E8;
border: 1px solid transparent;
border-radius: 4px;
box-shadow: none;
background: transparent;
@@ -3072,6 +3071,66 @@ a.ilink.yours {
color: #DDD;
}
.dark .userbar .username {
color: #DDD;
text-shadow: 1px 1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000;
}
/* popups */
.dark .ps-popup {
background: #0D151E;
color: #DDD;
border-color: #888;
box-shadow: 2px 2px 3px rgba(0,0,0,.2);
}
.dark .popupmenu button,
.dark .bglist button,
.dark .avatarlist button {
color: #AAA;
box-shadow: none;
}
.dark .popupmenu button:hover,
.dark .popupmenu button.sel:hover,
.dark .bglist button:hover,
.dark .avatarlist button:hover {
border-color: #AAAAAA;
background-color: #AAAAAA;
color: black;
}
.dark .ps-overlay {
background: rgba(40, 40, 40, .5);
}
/* semi-generic */
.dark .select, .dark .team {
border-color: #888888;
box-shadow: inset 0 1px 0 #FFFFFF;
background: linear-gradient(to bottom, #ccd4dc, #96a3b0);
color: black;
}
.dark .select:hover, .dark .team.team-hover {
border-color: #555555;
background: #FFFFFF;
background: linear-gradient(to bottom, #edf2f8, #d7e3ec);
}
.dark .select:active, .dark .team:active {
border-color: #777777;
background: #DDDDDD;
box-shadow: none;
background: linear-gradient(to bottom, #d1dce6, #e7edf2);
}
.dark .select:disabled {
border-color: #999999;
background: rgba(200,200,200,.65);
color: #555555;
box-shadow: none;
}
/* main menu */
.dark .menugroup {
@@ -3183,9 +3242,6 @@ a.ilink.yours {
background: rgba(30, 40, 50, .5);
color: #7799BB;
}
.dark .ps-popup .roomlist a.ilink {
background: rgba(30, 40, 50, 1);
}
.dark .roomlist a.ilink:hover {
border-color: #AACCEE;
background: rgba(30, 40, 50, 1);