X-Git-Url: https://jfr.im/git/irc/quakenet/qwebirc.git/blobdiff_plain/ff1c78b303f411e5af07173b6154d458beabb3a0..684456be2e5f3cf7b7cdd4e784becb1ba78fb870:/css/qui.mcss

diff --git a/css/qui.mcss b/css/qui.mcss
index 8a6566b..a804b7c 100644
--- a/css/qui.mcss
+++ b/css/qui.mcss
@@ -1,24 +1,31 @@
-topic_background=f2f0ff
-lines_background=f2f0ff
-topic_border=c8d2dc
-tabbar_border=c3cee0
-tabbar_background=e2ecf9
-tabbar_text=000000
-tab_border=c8d2dc
-tab_text=000000
-tab_hover=ffffff
-tab_selected=ffffff
-tab_selected_border=c8d2dc
-tab_selected_text=333333
-input_border=c3cee0
-nicklist_border=c8d2dc
-nicklist_background=f2f0ff
-nicklist_text=000000
-nicklist_selected_border=c8d2dc
-menu_border=c8d2dc
-menu_background=f2f0ff
-menu_hover_background=FFFFFE
-lastpositionbar=C8D2DC
+topic_background=c,f2f0ff,back
+lines_background=c,f2f0ff,back
+topic_border=c,c8d2dc,front
+tabbar_border=c,c3cee0,front
+tabbar_background=c,e2ecf9,back
+tabbar_text=c,000000,front
+tab_border=c,c8d2dc,front
+tab_text=c,000000,front
+tab_hover=c,ffffff,back
+tab_selected=c,ffffff,back
+tab_selected_border=c,c8d2dc,back
+tab_selected_text=c,333333,front
+input_border=c,c3cee0,front
+nicklist_border=c,c8d2dc,front
+nicklist_background=c,f2f0ff,back
+nicklist_text=c,000000,front
+nicklist_selected_border=c,c8d2dc,front
+menu_border=c,c8d2dc,front
+menu_background=c,f2f0ff,back
+menu_hover_background=c,FFFFFE,back
+lastpositionbar=c,C8D2DC,front
+timestamp_display=o,SHOW_TIMESTAMPS,inline,none
+timestamp_padding_left=o,SHOW_TIMESTAMPS,7px,11px
+timestamp_text_indent=o,SHOW_TIMESTAMPS,-7px,-9px
+nicklist_text=c,000000,front
+lines_text=c,000000,front
+menu_text=c,000000,front
+nicklist_selected_background=c,ffffff,back
 
 body {
   margin: 0;
@@ -44,31 +51,43 @@ html {
 .qwebirc-qui .dynamicpanel {
   position: absolute;
 }
-.qwebirc-qui .widepanel, .leftboundpanel {
+.qwebirc-qui .leftboundpanel {
   left: 0px;
-}
-.qwebirc-qui .widepanel {
-  width: 100%;
+  width: 150px;
+  height: 100%;
 }
 .qwebirc-qui .topboundpanel {
   top: 0px;
+  width: 100%;
+}
+.qwebirc-qui .topicboundpanel {
+  width: 100%;
 }
 .qwebirc-qui .rightboundpanel {
-  /*right: 0px;*/
+  right: 0px;
+  width: 140px;
 }
 .qwebirc-qui .bottomboundpanel {
-  color: red;
+  bottom: 0px;
+  right: 0px;
 }
 
 .qwebirc-qui .lines {
-  color: black;
+  color: $(lines_text);
   overflow: auto;
-  font-size: 0.8em;
   background: $(lines_background);
+  font-size: 0.8em;
 }
 
-.qwebirc-qui .ircwindow {
-  font-family: Consolas, "Lucida Console", monospace, Verdana, sans-serif, "sans serif";
+.qwebirc-qui .lines .timestamp {
+  display: $(timestamp_display);
+}
+
+.qwebirc-qui .ircwindow div {
+  font-family: Consolas, "Lucida Console", monospace;
+  text-indent: $(timestamp_text_indent);
+  padding-left: $(timestamp_padding_left);
+  word-wrap: break-word;
 }
 
 .qwebirc-qui .tab-invisible {
@@ -77,10 +96,18 @@ html {
 
 .qwebirc-qui .input input.keyboard-input {
   border: 0px;
-  margin: 2px 0px 0px 0px;
+  margin: 0px 0px 0px 0px;
+  font-size: 1.2em;
+  padding-left: 4px;
+  padding-top: 3px;
+  padding-bottom: 3px;
   width: 99%;
 }
 
+.qwebirc-qui .input-flash {
+  background: #bbffbb;
+}
+
 .qwebirc-qui .input input.mobile-input {
   border: 0px;
   margin: 2px 0px 0px 0px;
@@ -103,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 {
@@ -112,19 +142,59 @@ html {
 .qwebirc-qui .topic {
   color: gray;
   padding-left: 5px;
-  font-size: 0.7em;
+  padding-bottom: 3px;
+  font-size: 1.1em;
   cursor: default;
 }
 
 .qwebirc-qui .outertabbar {
-  border-bottom: 1px solid $(tabbar_border);
   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;
+}
+
+.qwebirc-qui .outertabbar_left .tab {
+  display: block;
+  margin-right: 3px;
+  margin-top: 1px;
+  line-height: normal;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  min-height: 15px;
+}
+
+.qwebirc-qui .outertabbar_left .tabclose {
+  float: right;
+  padding-left: 5px;
+  margin-left: 0px;
+  margin-top: -2px;
+  position: relative;
+}
+
+.qwebirc-qui .outertabbar_left .tabbar {
+  margin-left: 2px;
+}
+
+.qwebirc-qui .outertabbar_top {
+  border-bottom: 1px solid $(tabbar_border);
+}
+
 .qwebirc-qui .tabbar {
   font-size: 0.8em;
   color: $(tabbar_text);
-  margin-left: 38px;
+  margin-left: 25px;
   line-height: 24px;
 }
 
@@ -134,6 +204,7 @@ html {
   cursor: default;
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
+  border-radius: 4px;
   margin-right: -2px;
   white-space: nowrap;
   text-decoration: none;
@@ -145,6 +216,7 @@ html {
   border: 1px solid #c8d2dc;
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
+  border-radius: 4px;
 }
 
 .qwebirc-qui .tab-selected {
@@ -152,6 +224,7 @@ html {
   border: 1px solid $(tab_selected_border);
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
+  border-radius: 4px;
   color: $(tab_selected_text);
 }
 
@@ -163,32 +236,33 @@ 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 {
   border-left: 1px solid $(nicklist_border);
-  position: absolute;
-  top: 0px;
-  right: 0px;
-  width: 140px;
   overflow: auto;
   background: $(nicklist_background);
   color: $(nicklist_text);
@@ -197,7 +271,7 @@ html {
 
 .qwebirc-qui .nicklist a {
   display: block;
-  color: black;
+  color: $(nicklist_text);
   text-decoration: none;
   cursor: default;
   border-top: 1px solid $(nicklist_background);
@@ -207,8 +281,8 @@ html {
 
 .qwebirc-qui .nicklist a.selected {
   display: block;
-  color: black;
-  background: white;
+  color: $(nicklist_text);
+  background: $(nicklist_selected_background);
   text-decoration: none;
   border-bottom: $(nicklist_selected_border) 1px solid;
   cursor: default;
@@ -245,8 +319,7 @@ div#noscript {
   cursor: pointer;
   cursor: hand;
   float: left;
-  padding: 4px;
-  width: 30px;
+  width: 17px;
 }
 
 .qwebirc-qui .dropdownmenu {
@@ -260,8 +333,8 @@ div#noscript {
 
 .qwebirc-qui .dropdownmenu a {
   display: block;
-  font-size: 0.7em;
-  color: black;
+  font-size: 0.8em;
+  color: $(menu_text);
   cursor: pointer;
   cursor: hand;  
   padding-top: 1px;
@@ -288,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;
+  }
+}