mobile stylesheet improvements

[irc/quakenet/qwebirc.git] / css / qui.mcss

diff --git a/css/qui.mcss b/css/qui.mcss
index ebbd2abb7a9db74947f0849eba7e9c3ef1e90a2c..a804b7c50cde0b170d4bb556e664042006241e83 100644 (file)
--- a/css/qui.mcss
+++ b/css/qui.mcss
@@ -75,8 +75,8 @@ html {
 .qwebirc-qui .lines {
   color: $(lines_text);
   overflow: auto;
-  font-size: 0.8em;
   background: $(lines_background);
+  font-size: 0.8em;
 }
 
 .qwebirc-qui .lines .timestamp {
@@ -130,6 +130,9 @@ html {
   right: 0px;
   background-color: $(topic_background);
   border-bottom: 1px dashed $(topic_border);
+/*  overflow: hidden;*/
+  text-overflow: ellipsis;
+/*  white-space: nowrap;*/
 }
 
 .qwebirc-qui .topic .emptytopic {
@@ -148,6 +151,15 @@ html {
   background: $(tabbar_background);
 }
 
+.qwebirc-qui .outertabbar_top .dropdown-tab {
+  padding: 4px 3px 0 3px;
+}
+
+.qwebirc-qui .outertabbar_left .dropdown-tab {
+  padding: 3px 3px 0 3px;
+  margin-right: 2px;
+}
+
 .qwebirc-qui .outertabbar_left {
   border-right: 1px solid $(tabbar_border);
   overflow: auto;
@@ -156,7 +168,7 @@ html {
 .qwebirc-qui .outertabbar_left .tab {
   display: block;
   margin-right: 3px;
-  margin-top: 3px;
+  margin-top: 1px;
   line-height: normal;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -165,8 +177,10 @@ html {
 
 .qwebirc-qui .outertabbar_left .tabclose {
   float: right;
-  padding-left: 0;
+  padding-left: 5px;
+  margin-left: 0px;
   margin-top: -2px;
+  position: relative;
 }
 
 .qwebirc-qui .outertabbar_left .tabbar {
@@ -222,25 +236,29 @@ html {
 
 .qwebirc-qui .tabclose {
   margin-left: 5px;
-  font-size: 0.7em;
   line-height: 150%;
   vertical-align: top;
   padding-left: 3px;
   -moz-border-radius: 2px;
   -webkit-border-radius: 2px;
   border-radius: 2px;
+  font-weight: normal;
+  color: $(tab_text);
 }
 
 .qwebirc-qui a.tab-hilight-activity {
-  color: #009900;
+  color: #22bb22;
+  font-weight: bold;
 }
 
 .qwebirc-qui a.tab-hilight-speech {
-  color: #0000ff;
+  color: #2222bb;
+  font-weight: bold;
 }
 
 .qwebirc-qui a.tab-hilight-us {
-  color: #ff0000;
+  color: #bb4444;
+  font-weight: bold;
 }
 
 .qwebirc-qui .nicklist {
@@ -301,7 +319,6 @@ div#noscript {
   cursor: pointer;
   cursor: hand;
   float: left;
-  padding: 3px;
   width: 17px;
 }
 
@@ -316,7 +333,7 @@ div#noscript {
 
 .qwebirc-qui .dropdownmenu a {
   display: block;
-  font-size: 0.7em;
+  font-size: 0.8em;
   color: $(menu_text);
   cursor: pointer;
   cursor: hand;  
@@ -344,3 +361,65 @@ div#noscript {
   margin-left: 3em;
   margin-right: 3em;
 }
+
+iframe {
+  border: none;
+}
+
+.qwebirc-qui .spinner {
+  background: url($(base_url)../images/spinner.png) no-repeat $(lines_background);
+  background-position: top 5px right 5px;
+}
+
+@media screen and (max-width:1024px) {
+  .qwebirc-qui .lines {
+    font-size: 1.2em;
+  }
+
+  .qwebirc-qui .ircwindow div {
+    font-size: 0.8em;
+  }
+
+  .qwebirc-qui .tabbar {
+    line-height: 35px;
+  }
+
+  .qwebirc-qui .tabbar, .qwebirc-qui .nicklist {
+    font-size: 1.3em;
+  }
+
+  .qwebirc-qui .topic, .qwebirc-qui .dropdownmenu a, .qwebirc-qui .dropdownhint {
+    font-size: 1.4em;
+  }
+
+  .qwebirc-qui .input input.keyboard-input {
+    font-size: 1.6em;
+  }
+
+  .qwebirc-qui input {
+    font-size: 1.6em;
+  }
+
+  .qwebirc-qui .tabclose {
+    color: maroon;
+  }
+
+  .qwebirc-qui .tabclose:before {
+    content: "(";
+  }
+  .qwebirc-qui .tabclose:after {
+    content: ")";
+  }
+
+  .qwebirc-qui .dropdown-tab img {
+    width: 160%;
+  }
+
+  .qwebirc-qui .outertabbar_top .dropdown-tab {
+    padding-right: 13px;
+  }
+
+  .qwebirc-qui .outertabbar_left .dropdown-tab {
+    padding-right: 13px;
+  }
+}