diff --git a/static/style.css b/static/style.css index 72d75fd..63c121e 100644 --- a/static/style.css +++ b/static/style.css @@ -1,23 +1,27 @@ -/* Chat archives */ +/* archive/style.css */ /* Page style */ html { overflow-y:scroll; } + html,body { margin:0;padding:0;border:0; font-family:"Segoe UI",Arial,sans-serif; font-size:12px; } + a { color: blue; cursor: pointer; } + ul { margin:0; padding-left:20px; } + .mini-separator { display: inline-block; zoom: 1; @@ -26,6 +30,7 @@ ul { border-left: 1px solid darkgrey; border-right: 1px solid #DDD; } + select { margin:0; } @@ -38,13 +43,15 @@ select { left: 0; right: 0; height: 22px; - padding: 3px; - margin-bottom: 8px; + padding: 3px; + margin-bottom: 8px; } + .layout-body { margin-top:40px; padding:3px; } + .layout-pushdown { position:relative; top:3px; @@ -56,42 +63,68 @@ select { word-break:break-word; } -.timestamp {color: #BBB;} -.chat { font-weight:bold; - color: darkblue;} -.sys { font-style:italic; - color: darkgreen;} -.logo { width: 102px; - height: 37px; - display: block; - border:0; - padding-bottom: 1.0em;} -.gt { color:#0A0;font-weight:bold;} +.timestamp { + color: #BBB; +} + +.chat { + font-weight:bold; + color: darkblue; +} + +.sys { + font-style:italic; + color: darkgreen; +} + +.logo { + width: 102px; + height: 37px; + display: block; + border:0; + padding-bottom: 1.0em; +} + +.gt { + color:#0A0; + font-weight:bold; +} + .line-highlighted { background:lightyellow; } /* Toolbar styling */ -.pad { display:inline; padding:0 8px;} +.pad { + display:inline; + padding:0 8px; +} .nav { - background: #DDD; - box-shadow: 0px 4px 24px #CCC; + background: #DDD; + box-shadow: 0px 4px 24px #CCC; +} +.nav form { + display: inline; } -.nav form { display: inline;} -.nav .btn { background: white; - color:black; - border: 1px solid lightgrey; - padding: 0 6px; - text-decoration:none; - } -.nav a:hover {border-color: grey black black grey;} +.nav .btn { + background: white; + color:black; + border: 1px solid lightgrey; + padding: 0 6px; + text-decoration:none; +} + +.nav a:hover { + border-color: grey black black grey; +} .area-search { float:right; } + #searchbox { width:170px; } @@ -106,6 +139,7 @@ select { } /* Dropdown */ + .ddmenu { display:block; position:absolute; @@ -116,6 +150,7 @@ select { box-shadow: 0px 4px 24px #CCC; z-index: 2; } + .ddmenu a { color:black; display:inline-block; @@ -127,45 +162,66 @@ select { text-decoration:none; } + .ddmenu a:hover { background:#FFF; -moz-transition:all 0.1s linear; -webkit-transition:all 0.1s linear; } + #tr1 { - width:0px;height:0px;border-bottom:10px solid #999; - border-right:10px solid transparent;border-left:10px solid transparent; - position:absolute;top:18px;left:3px;z-index:1; + width:0px; + height:0px; + border-bottom:10px solid #999; + border-right:10px solid transparent; + border-left:10px solid transparent; + position:absolute; + top:18px; + left:3px; + z-index:1; } + #tr2 { - width:0px;height:0px;border-bottom:10px solid #EEE; - border-right:10px solid transparent;border-left:10px solid transparent; - position:absolute;top:19px;left:3px;z-index:3; + width:0px; + height:0px; + border-bottom:10px solid #EEE; + border-right:10px solid transparent; + border-left:10px solid transparent; + position:absolute; + top:19px; + left:3px; + z-index:3; } /* Mobile view */ + @media (max-width: 600px) { .nav { height: 55px; text-align:center; } + .nav, .nav select { font-size: 16px; line-height:16px; } + .nav .btn { padding: 2px 12px; margin: 4px 0; } + .pad { display:block; padding:0; height:8px; } + .layout-body { margin-top:75px; } + .mini-separator { display:none; } @@ -178,10 +234,15 @@ select { width:auto; } } + @media (max-width: 400px) { + .area-nav select { max-width:60px; } - .ts_split_d, .ts_split_s { display:none; } + .ts_split_d, .ts_split_s { + display:none; + } + }