Further work on the iconbar menu: button images have a little more space to the left...

diff --git a/webcit/static/styles/border-radius.htc b/webcit/static/styles/border-radius.htc
new file mode 100644 (file)
index 0000000..c3ae104
--- /dev/null
+++ b/webcit/static/styles/border-radius.htc
@@ -0,0 +1,143 @@
+--Do not remove this if you are using--\r
+Original Author: Remiz Rahnas\r
+Original Author URL: http://www.htmlremix.com\r
+Published date: 2008/09/24\r
+\r
+Changes by Nick Fetchak:\r
+- IE8 standards mode compatibility\r
+- VML elements now positioned behind original box rather than inside of it - should be less prone to breakage\r
+Published date : 2009/11/18\r
+\r
+\r
+<public:attach event="oncontentready" onevent="oncontentready('v08vnSVo78t4JfjH')" />\r
+<script type="text/javascript">\r
+\r
+// findPos() borrowed from http://www.quirksmode.org/js/findpos.html\r
+function findPos(obj) {\r
+       var curleft = curtop = 0;\r
+\r
+       if (obj.offsetParent) {\r
+               do {\r
+                       curleft += obj.offsetLeft;\r
+                       curtop += obj.offsetTop;\r
+               } while (obj = obj.offsetParent);\r
+       }\r
+\r
+       return({\r
+               'x': curleft,\r
+               'y': curtop\r
+       });\r
+}\r
+\r
+function oncontentready(classID) {\r
+  if (this.className.match(classID)) { return(false); }\r
+\r
+       if (!document.namespaces.v) { document.namespaces.add("v", "urn:schemas-microsoft-com:vml"); }\r
+\r
+       this.className = this.className.concat(' ', classID);\r
+       var arcSize = Math.min(parseInt(this.currentStyle['-moz-border-radius'] ||\r
+                                       this.currentStyle['-webkit-border-radius'] ||\r
+                                       this.currentStyle['border-radius'] ||\r
+                                       this.currentStyle['-khtml-border-radius']) /\r
+                              Math.min(this.offsetWidth, this.offsetHeight), 1);\r
+       var fillColor = this.currentStyle.backgroundColor;\r
+       var fillSrc = this.currentStyle.backgroundImage.replace(/^url\("(.+)"\)$/, '$1');\r
+       var strokeColor = this.currentStyle.borderColor;\r
+       var strokeWeight = parseInt(this.currentStyle.borderWidth);\r
+       var stroked = 'true';\r
+       if (isNaN(strokeWeight)) {\r
+               strokeWeight = 0;\r
+               strokeColor = fillColor;\r
+               stroked = 'false';\r
+       }\r
+\r
+       this.style.background = 'transparent';\r
+       this.style.borderColor = 'transparent';\r
+\r
+       // Find which element provides position:relative for the target element (default to BODY)\r
+       var el = this;\r
+       var limit = 100, i = 0;\r
+       while ((typeof(el) != 'unknown') && (el.currentStyle.position != 'relative') && (el.tagName != 'BODY')) {\r
+               el = el.parentElement;\r
+               i++;\r
+               if (i >= limit) { return(false); }\r
+       }\r
+       var el_zindex = parseInt(el.currentStyle.zIndex);\r
+       if (isNaN(el_zindex)) { el_zindex = 0; }\r
+       //alert('got tag '+ el.tagName +' with pos '+ el.currentStyle.position);\r
+\r
+       var rect_size = {\r
+               'width': this.offsetWidth - strokeWeight,\r
+               'height': this.offsetHeight - strokeWeight\r
+       };\r
+       var el_pos = findPos(el);\r
+       var this_pos = findPos(this);\r
+       this_pos.y = this_pos.y + (0.5 * strokeWeight) - el_pos.y;\r
+       this_pos.x = this_pos.x + (0.5 * strokeWeight) - el_pos.x;\r
+\r
+       var rect = document.createElement('v:roundrect');\r
+       rect.arcsize = arcSize +'px';\r
+       rect.strokecolor = strokeColor;\r
+       rect.strokeWeight = strokeWeight +'px';\r
+       rect.stroked = stroked;\r
+       rect.style.display = 'block';\r
+       rect.style.position = 'absolute';\r
+       rect.style.top = this_pos.y +'px';\r
+       rect.style.left = this_pos.x +'px';\r
+       rect.style.width = rect_size.width +'px';\r
+       rect.style.height = rect_size.height +'px';\r
+       rect.style.antialias = true;\r
+       rect.style.zIndex = el_zindex - 1;\r
+\r
+       var fill = document.createElement('v:fill');\r
+       fill.color = fillColor;\r
+       fill.src = fillSrc;\r
+       fill.type = 'tile';\r
+\r
+       rect.appendChild(fill);\r
+       el.appendChild(rect);\r
+\r
+       var css = el.document.createStyleSheet();\r
+       css.addRule("v\\:roundrect", "behavior: url(#default#VML)");\r
+       css.addRule("v\\:fill", "behavior: url(#default#VML)");\r
+\r
+       isIE6 = /msie|MSIE 6/.test(navigator.userAgent);\r
+       // IE6 doesn't support transparent borders, use padding to offset original element\r
+       if (isIE6 && (strokeWeight > 0)) {\r
+               this.style.borderStyle = 'none';\r
+               this.style.paddingTop = parseInt(this.currentStyle.paddingTop || 0) + strokeWeight;\r
+               this.style.paddingBottom = parseInt(this.currentStyle.paddingBottom || 0) + strokeWeight;\r
+       }\r
+\r
+       if (typeof(window.rounded_elements) == 'undefined') {\r
+               window.rounded_elements = new Array();\r
+\r
+               if (typeof(window.onresize) == 'function') { window.previous_onresize = window.onresize; }\r
+               window.onresize = window_resize;\r
+       }\r
+       this.element.vml = rect;\r
+       window.rounded_elements.push(this.element);\r
+}\r
+\r
+function window_resize() {\r
+       if (typeof(window.rounded_elements) == 'undefined') { return(false); }\r
+\r
+       for (var i in window.rounded_elements) {\r
+               var el = window.rounded_elements[i];\r
+\r
+               var strokeWeight = parseInt(el.currentStyle.borderWidth);\r
+               if (isNaN(strokeWeight)) { strokeWeight = 0; }\r
+\r
+               var parent_pos = findPos(el.vml.parentNode);\r
+               var pos = findPos(el);\r
+               pos.y = pos.y + (0.5 * strokeWeight) - parent_pos.y;\r
+               pos.x = pos.x + (0.5 * strokeWeight) - parent_pos.x;\r
+\r
+               el.vml.style.top = pos.y +'px';\r
+               el.vml.style.left = pos.x +'px';\r
+       }\r
+\r
+       if (typeof(window.previous_onresize) == 'function') { window.previous_onresize(); }\r
+}\r
+</script>\r
+\r

diff --git a/webcit/static/styles/iconbar.css b/webcit/static/styles/iconbar.css
index dce5fd4abe24cc3f59b5a2c7007eb44d31fd2835..a9f1512e8999c066a15dada3c3bcf22584c4dd00 100644 (file)
--- a/webcit/static/styles/iconbar.css
+++ b/webcit/static/styles/iconbar.css
@@ -9,14 +9,9 @@
        overflow-x: hidden !important;
 }
 
-#iconbar_container {
-       background-color: #FFF;
-       color: #000;
-}
+#iconbar_container { background-color: #FFF; }
 
-#citlogo {
-       padding: 10px 0;
-}
+#citlogo { padding: 10px 0; }
 
 .logo_citadel a,.logo_citadel img {
        border: none;
@@ -29,7 +24,7 @@
 
 .ib_button, .iconbar_text{
        background-color: #4d555c;
-       color: #9c959d;
+       color: #F0FEFF;
        font-weight: bold;
 } 
 
@@ -39,8 +34,8 @@
 
 .ib_button_link, .ib_button_link:visited, .ib_button_link:link, #online_users a {
        display: block;
-       color: #F0FEFF;
        text-decoration: none;
+       color: #F0FEFF;
 }
 
 #iconbar #button {
@@ -49,7 +44,7 @@
        list-style: none;
 }
 
-.ib_button, #button li:hover{
+.ib_button {
        margin: 3px;
        padding: 0;
        display: block;
@@ -81,14 +76,28 @@
        max-height: 200px;
        overflow: auto;
        padding-left: 0;
+       padding-bottom: 5px;
 } 
+
 #online_users li {
        list-style: none;
        margin: 0;
        padding: 2px;
        white-space: nowrap;
+       border: none;
+       border-top: 1px solid #777277;
 }
 
+#online_users li a { font-size: 80% !important }
+
+#online_users li.inactiveuser { background-color: #9c959d; }
+ 
+#online_users li.activeuser { background-color: #4d555c; }
+ 
+#online_users li:hover { /* separate in order for override */ }
+
+
+
 .ib_roomlist_floor, .ib_roomlist_new, .ib_roomlist_old, .roomlist_floor, .roomlist_new, .roomlist_old {
        margin: 4px;
        padding: 0;
@@ -102,9 +111,7 @@
        font-weight: 700;
 }
 
-.ib_roomlist_floor {
-       color: #000;
-}
+.ib_roomlist_floor {}
 
 .roomlist_new, .ib_roomlist_new {
        color: #800;
@@ -117,3 +124,10 @@
 #button li:hover, #ib_logoff:hover {
         background-color: #5c646b;
 }
+
+#ib_users {
+       -khtml-border-radius: 5px;
+       -moz-border-radius: 5px;
+       border-radius: 5px;
+       behavior: url(border-radius.htc);
+}

diff --git a/webcit/static/styles/iconbaricns.css b/webcit/static/styles/iconbaricns.css
index 190409ee4e30344fc67acf6559d9129293e9fb7f..16d7097c335be16224248ab23a24b28ddf0493c5 100644 (file)
--- a/webcit/static/styles/iconbaricns.css
+++ b/webcit/static/styles/iconbaricns.css
@@ -8,11 +8,12 @@
 .ib_button {
     min-height: 32px;
     background-repeat: no-repeat !important;
+    background-position: 3px 0px;
     vertical-align: middle;
 }
 .ib_button_link {
-    padding-top: 6px;
-    padding-left: 35px;
+    padding-top: 8px;
+    padding-left: 37px;
     height: 100%;
     min-height: 25px; /* Makes all of the 'button' to be clickable */
 }

diff --git a/webcit/static/styles/webcit.css b/webcit/static/styles/webcit.css
index 1e9130c122c423b838f783bd25edc394893e0662..235c2331ec9de4a7c2a1fdd2b459845cec0ae2ce 100644 (file)
--- a/webcit/static/styles/webcit.css
+++ b/webcit/static/styles/webcit.css
@@ -60,26 +60,6 @@ body {
        background-color: #CCC;
 }
 
-#online_users li a { font-size: 80% !important }
-
-#online_users li.inactiveuser {
-       background-color: transparent;
-}
-
-#online_users li.activeuser {
-       background-color: #8B8B8B;
-}
-
-#online_users li hover { /* separate in order for override */
-       background-color: #AAAAAA !important;
-       color: #333 !important;
-}
-
-#online_users li {
-       border: none;
-       border-top: 1px solid #AAA;
-}
-
 #room_infos, #address_book_popup, .roomops_cell, .roomops_cell_edit, .mimepart {
        background-color: #F0FFFF;
        color: #333;