More tab fixes.

- Remove borders in Mercury - Make backgrounds into gradients in Selenium - Add borders and box shadows in dash.
cburschka · May 26, 2015 · 40a36c4 · 40a36c4
1 parent f1b02ca
commit 40a36c4
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 9 deletions.
diff --git a/css/alt/Mercury.css b/css/alt/Mercury.css
@@ -9,21 +9,22 @@
  * @author Sylae Corell @sylae 2013 https://github.com/calref/AJAX-Chat/blob/cd38e0aca4f86216cabd7bf94462d7891616213d/chat/css/Mercury.css
  * @author Philip Nicolcev @Frug 2012 https://github.com/Frug/AJAX-Chat/blob/9da21807c60679c6a511732bebebcf30b76c0106/chat/css/Mercury.css
  */
-body, .dialog { background-color: #2a2a2a }
+body, .dialog { background: #2a2a2a }
 body, input, select, button, textarea { color: #d4d4d4 }
 .box, input, select, button, #colorCodesContainer, textarea.form-field,
 .ui-tabs-nav li {
-  background-color: #383838;
+  background: #383838;
   border-radius: 5px;
-  border: 0;
+  border: none;
 }
-.ui-tabs-nav .ui-tabs-active { background: #484848 }
+.ui-tabs .ui-tabs-nav li { background: #2a2a2a; border: none }
+.ui-tabs-nav li.ui-tabs-active { background: #484848 }
 .ui-tabs-nav .ui-tabs-active a { color: #d4d4d4 }
 #colorCodesContainer {
   padding: 5px;
   box-shadow: 2px 2px 4px black;
 }
 #emoticonsContainer { border-radius: 3px }
-button:hover { background-color: #555 }
+button:hover { background: #555 }
 input[type=image], button { border: 0 }
 a, .user-role-bot { color: #f6b620 }
diff --git a/css/alt/Selenium.css b/css/alt/Selenium.css
@@ -23,8 +23,11 @@ h3 { background: linear-gradient(180deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%)
   background-color: rgba(0,0,0, 0.4);
   border: 1px solid rgba(256,256,256,0.3);
 }
-.ui-tabs .ui-tabs-nav li { border-bottom: none }
-.ui-tabs li.ui-tabs-active { background: rgba(255, 255, 255, 0.05) }
+.ui-tabs .ui-tabs-nav li {
+  background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
+  border-bottom: none
+}
+.ui-tabs li.ui-tabs-active { background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%, rgba(255,255,255,0.15) 100%) }
 .dialog, .dialog input, .dialog select, .dialog button, .dialog textarea { box-shadow: 0 0 4px white }
 .dialog input[type=checkbox] { box-shadow: none }
 select, button, input { background: rgba(0,0,0,0.4) }

diff --git a/css/alt/dash.css b/css/alt/dash.css
@@ -15,13 +15,16 @@ h3, .ui-tabs-nav li.ui-tabs-active {
   text-shadow: 1px 1px 3px white;
 }
 h3, li.ui-tabs-active a { color: #c6006f }
-.ui-tabs-nav li { background: rgba(0, 0, 0, 0.7) }
-.box, #emoticonsContainer, #trayContainer,
+.box, #emoticonsContainer, #trayContainer, .ui-tabs-nav li,
 input[type=text], input[type=password], textarea.form-field, select, button.button {
   background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
   box-shadow: 0 0 4px white;
   border: 1px solid #222;
 }
+.ui-tabs .ui-tabs-nav li {
+  border-color: #222;
+  box-shadow: 0 -1px 2px white;
+}
 .menuContainer { background: url("dash/cutie-dash.png") no-repeat bottom rgba(0, 0, 0, 0.6) }
 #headlineContainer label, #headlineContainer a {
   color: white;