Client: Tab sizing when in narrow mode
[KiwiIRC.git] / client / assets / css / style.css
index af6008bed38b140b1174504a6aff0e09956ba527..8cc10c7a7ac1587549103491d464a16ecda59d77 100644 (file)
@@ -95,6 +95,7 @@ html, body { height:100%; }
 
 /* A member/nick list per channel */
 #kiwi #memberlists { border-left: 1px solid #8A8A8A; }
+#kiwi #memberlists.disabled { display:none; }
 #kiwi #memberlists ul { display:none; }
 
 /* The active channels nicklist */
@@ -158,12 +159,13 @@ html, body { height:100%; }
 #kiwi .server_select .more { display: none; }
 #kiwi .server_select button {  }
 #kiwi .server_select input { }
-#kiwi .server_select label { float:left; width:5em; }
+#kiwi .server_select label { }
 #kiwi .server_select br { clear:both; }
 #kiwi .server_select .basic input { }
 #kiwi .server_select .basic label { }
 #kiwi .server_select .basic { border-bottom: 1px solid gray; margin-bottom:1em; }
 #kiwi .server_select .basic .show_more { }
+#kiwi .server_select .basic tr.pass { display:none; }
 #kiwi .server_select.single_server .basic { border:none; }
 #kiwi .server_select .status {  }
 
@@ -317,6 +319,9 @@ html, body { height:100%; }
 #kiwi.theme_relaxed .messages .msg .nick { width:11em; float:left; font-size:12px; font-family:Arial; text-align:left; padding: 5px; overflow:hidden; }
 #kiwi.theme_relaxed .messages .msg .text { display:block; margin-left:12em; border-left: 1px solid #DEDEDE; white-space:pre-wrap; word-wrap:break-word; font-family:arial; padding:5px; }
 
+#kiwi.theme_relaxed.narrow .messages .msg .nick { width: auto; }
+#kiwi.theme_relaxed.narrow .messages .msg .text { margin-left: 1em; border:none; }
+
 #kiwi.theme_relaxed .messages .msg.action .nick { }
 #kiwi.theme_relaxed .messages .msg.action .text { margin-left:9em; color:#009900; border-left:none; font-style:italic; }
 #kiwi.theme_relaxed .messages .msg.action.join { color:#009900; }
@@ -329,7 +334,7 @@ html, body { height:100%; }
 #kiwi.theme_relaxed .messages .msg.topic .text { color:#009900; margin-left:9em; font-style: italic; border-left:none; }
 #kiwi.theme_relaxed .messages .msg.motd { border:none; }
 /*#kiwi.theme_relaxed .messages .msg.motd .nick { display:none; }*/
-#kiwi.theme_relaxed .messages .msg.motd .text { color:#666; }
+#kiwi.theme_relaxed .messages .msg.motd .text { color:#666; font-family:monospace; }
 #kiwi.theme_relaxed .messages .msg.whois .nick { font-weight:normal; }
 #kiwi.theme_relaxed .messages .msg.whois .text { margin-left:18em; padding-left:1em; border-left:1px dashed #999; }
 #kiwi.theme_relaxed .messages .msg.error .text {
@@ -340,6 +345,11 @@ html, body { height:100%; }
 #kiwi.theme_relaxed .messages .msg.global_nick_highlight,
 #kiwi.theme_relaxed .messages .msg.highlight { background:#D9D9D9; }
 
+/* Narrow styling (window width < 400px) */
+#kiwi.theme_relaxed.narrow .messages .msg .nick { width: auto; }
+#kiwi.theme_relaxed.narrow .messages .msg .text { margin-left: 1em; border:none; }
+#kiwi.theme_relaxed.narrow .messages .msg.action .text { margin-left: 1em; }
+
 
 #kiwi.theme_relaxed .messages .msg .media { margin-left:0.5em; }
 #kiwi.theme_relaxed .messages .msg .media .media_close { font-size:0.9em; }
@@ -377,6 +387,7 @@ html, body { height:100%; }
     background-color: #DADADA;
     border-left: 1px solid #8A8A8A;
 }
+#kiwi.theme_relaxed.narrow #memberlists { display:none; }
 #kiwi.theme_relaxed #memberlists ul { list-style: none; }
 #kiwi.theme_relaxed #memberlists ul.active { }
 #kiwi.theme_relaxed #memberlists ul li { padding: 0.2em 1em; }
@@ -405,6 +416,10 @@ html, body { height:100%; }
 }
 #kiwi.theme_relaxed #controlbox .input .nick { text-align: right; width:11em; left:0px; position:absolute; padding:2px; overflow:hidden; }
 #kiwi.theme_relaxed #controlbox .input .nick a { text-decoration:none; color:black; }
+
+#kiwi.theme_relaxed.narrow #controlbox .input .nick { display:none; }
+#kiwi.theme_relaxed.narrow #controlbox .input .input_wrap { left:7px; }
+
 #kiwi.theme_relaxed #controlbox .input .input_wrap {
     position:absolute;
     right:7px; left: 12.2em;
@@ -456,6 +471,8 @@ html, body { height:100%; }
 
 
 #kiwi.theme_relaxed #toolbar .app_tools { width:200px; padding-left:10px; color:#D4D4D4; }
+#kiwi.theme_relaxed.narrow #toolbar #tabs { margin-right:0; }
+#kiwi.theme_relaxed.narrow #toolbar .app_tools { width:auto; }
 #kiwi.theme_relaxed #toolbar .app_tools ul li {
     font-size:26px;
     -webkit-transition: all .3s ease;
@@ -470,15 +487,18 @@ html, body { height:100%; }
 /* The server select dialog */
 #kiwi.theme_relaxed .server_select { width:730px;  padding:3em 0 2em 0; margin: 0 auto; }
 #kiwi.theme_relaxed .server_select .more { display: none; width:270px; margin:0 auto; }
-#kiwi.theme_relaxed .server_select button { float:right; padding:3px 7px; margin-top:10px; }
-#kiwi.theme_relaxed .server_select input { float:right; margin-bottom:5px; padding:3px 7px; width:150px; }
-#kiwi.theme_relaxed .server_select label { float:left; width:5em; padding-top:3px }
+#kiwi.theme_relaxed .server_select table tr td { padding:5px; }
+#kiwi.theme_relaxed .server_select button { float:right; padding:3px 7px; }
+#kiwi.theme_relaxed .server_select input { padding:3px 7px; width:150px; }
+#kiwi.theme_relaxed .server_select label { }
 #kiwi.theme_relaxed .server_select br { clear:both; }
 #kiwi.theme_relaxed .server_select .basic input, .server_select .basic button { font-size:1em; padding:0.5em 1em; }
 #kiwi.theme_relaxed .server_select .basic input { width:170px; }
 #kiwi.theme_relaxed .server_select .basic label { font-size:1.3em; margin-top:4px; }
+#kiwi.theme_relaxed .server_select .basic tr.have_pass { font-size:0.8em; }
+#kiwi.theme_relaxed .server_select .basic tr.channel td { padding-top:1em; }
 #kiwi.theme_relaxed .server_select .basic { border-bottom: 1px dashed gray; margin-bottom:1em; }
-#kiwi.theme_relaxed .server_select .basic .show_more { display: block; width:40px; margin:10px 0 0 0; font-size:0.8em; background: url(../img/more.png) no-repeat right 7px; }
+#kiwi.theme_relaxed .server_select .basic .show_more { display: block; width:110px; margin:10px 0 0 0; font-size:0.8em; background: url(../img/more.png) no-repeat right 7px; }
 #kiwi.theme_relaxed .server_select.single_server .basic { border:none; }
 #kiwi.theme_relaxed .server_select .status { text-align: center; font-weight: bold; padding:1em; }
 #kiwi.theme_relaxed .server_select .status.ok { }
@@ -695,6 +715,10 @@ html, body { height:100%; }
 #kiwi.theme_mini .server_select label { display:none; }
 #kiwi.theme_mini .server_select br { clear:both; }
 #kiwi.theme_mini .server_select .basic { border:none; }
+#kiwi.theme_mini .server_select .basic table { width:100%; }
+#kiwi.theme_mini .server_select .basic table tr.channel,
+#kiwi.theme_mini .server_select .basic table tr.pass,
+#kiwi.theme_mini .server_select .basic table tr.have_pass { display:none; }
 #kiwi.theme_mini .server_select .basic .show_more { display:none !important; }
 #kiwi.theme_mini .server_select.single_server .basic { border:none; }
 #kiwi.theme_mini .server_select .status { text-align: center; font-weight: bold; padding:1em; }
@@ -918,15 +942,18 @@ html, body { height:100%; }
 /* The server select dialog */
 #kiwi.theme_cli .server_select { width:730px;  padding:3em 0 2em 0; margin: 0 auto; }
 #kiwi.theme_cli .server_select .more { display: none; width:270px; margin:0 auto; }
+#kiwi.theme_cli .server_select table tr td { padding:5px; }
 #kiwi.theme_cli .server_select button { float:right; padding:3px 7px; margin-top:10px; }
-#kiwi.theme_cli .server_select input { float:right; margin-bottom:5px; padding:3px 7px; width:150px; }
-#kiwi.theme_cli .server_select label { float:left; width:5em; padding-top:3px }
+#kiwi.theme_cli .server_select input { padding:3px 7px; width:150px; }
+#kiwi.theme_cli .server_select label { width:5em; padding-top:3px }
 #kiwi.theme_cli .server_select br { clear:both; }
 #kiwi.theme_cli .server_select .basic input, .server_select .basic button { font-size:1em; padding:0.5em 1em; }
 #kiwi.theme_cli .server_select .basic input { width:170px; }
 #kiwi.theme_cli .server_select .basic label { font-size:1.3em; margin-top:4px; }
+#kiwi.theme_cli .server_select .basic tr.have_pass { font-size:0.8em; }
+#kiwi.theme_cli .server_select .basic tr.channel td { padding-top:1em; }
 #kiwi.theme_cli .server_select .basic { border-bottom: 1px dashed gray; margin-bottom:1em; }
-#kiwi.theme_cli .server_select .basic .show_more { display: block; width:40px; margin:10px 0 0 0; font-size:0.8em; background: url(../img/more.png) no-repeat right 7px; }
+#kiwi.theme_cli .server_select .basic .show_more { display: block; width:116px; margin:10px 0 0 0; font-size:0.8em; background: url(../img/more.png) no-repeat right 7px; }
 #kiwi.theme_cli .server_select.single_server .basic { border:none; }
 #kiwi.theme_cli .server_select .status { text-align: center; font-weight: bold; padding:1em; }
 #kiwi.theme_cli .server_select .status.ok { }
@@ -942,4 +969,15 @@ html, body { height:100%; }
     line-height:48px; vertical-align: middle;
     color: #555555;
 }
-#kiwi.theme_cli .server_select .kiwi_logo img { }
\ No newline at end of file
+#kiwi.theme_cli .server_select .kiwi_logo img { }
+
+
+#kiwi.theme_cli .divider-verticle {
+    border-left: 1px solid #303030;
+    border-right: 1px solid #1B1B1B;
+}
+
+#kiwi.theme_cli .divider-horizontal {
+    border-top: 1px solid #303030;
+    border-bottom: 1px solid #1B1B1B;
+}
\ No newline at end of file