diff -r b0dd75e285d2 -r 0f2326c2a325 ginebra2/chrome/bedrockchrome/contextmenu.snippet/contextmenu.css --- a/ginebra2/chrome/bedrockchrome/contextmenu.snippet/contextmenu.css Fri May 14 15:40:36 2010 +0300 +++ b/ginebra2/chrome/bedrockchrome/contextmenu.snippet/contextmenu.css Wed Jun 23 17:59:43 2010 +0300 @@ -1,66 +1,196 @@ -.menuSnippet img { - padding-left: 20px; - padding-right: 15px; - vertical-align: middle; + +/* The entire snippet. */ +.ContextMenu +{ + color: #283f52; + -webkit-user-select: none; + margin: 0px; + padding: 0px; + font-weight:bold; + font-size: large; +} + +/* The main wrapper div. */ +.ContextMenuDiv +{ + color: #283f52; + background-color: transparent; + margin: 0px; + padding: 0px; + position: relative; + border: none; +} + +.TabsDiv +{ + margin-right: 1px; +} + +.TabsUl +{ + margin-top: 0px; + margin-left: 0px; + padding: 0px; +} + +.MenuDiv +{ + margin-left: -40px; + margin-right: 3px; + margin-top: -16px; + padding: 0px; } -.menuItemLabel { - vertical-align: center; - position: relative; - top: 3px; - font-size: 16px; - font-family: Verdana; - font-weight: bold; +.MenuUl +{ + margin-bottom: 0px; +} + +/* All list items, tabs and menu items. */ +.ContextMenu li +{ + list-style-type: none; } -.menuItemContents { - padding-top: 15px; +/* +.ContextMenu li:hover +{ + background: -webkit-gradient(linear, left top, left bottom, from(#677fa8), to(#7692c2), color-stop(0.0, #aab)); +} +*/ + +/* Tab items. */ +.ContextMenu .TabsDiv ul li +{ + display: inline-block; + color: #fff; + padding-top: 10px; + padding-bottom: 10px; + padding-left: 20px; + padding-right: 16px; + border-top: solid 3px #373f4f; + border-left: solid 3px #373f4f; + border-bottom: solid 3px #373f4f; + margin-bottom: -2px; +} + +/* The first tab item. */ +.ContextMenu .TabsDiv ul li:first-child +{ + -webkit-border-top-left-radius: 7px; +} + +/* The last tab item. */ +.ContextMenu .TabsDiv ul li:last-child +{ + -webkit-border-top-right-radius: 7px; + border-right: solid 3px #373f4f; +} + +/* Normal tabs, ie. not highlighted. */ +.ViewContext_NormalTab { + background: -webkit-gradient(linear, left top, left bottom, from(#a2acc5), to(#b5c0d8), color-stop(0.0, #aab)); } -.menuItem { - background-repeat: no-repeat; - background-position: top left; - width: 203px; - color: #ffffff; - vertical-align: center; - -webkit-user-select: none; +/* Hide the text in normal tabs. */ +.ViewContext_NormalTab * a { + display: none; +} + +.ViewContext_NormalTab div { + margin-top: 0px; +} + +/* Highlighted tab. */ +.ViewContext_HighlightedTab { + background: -webkit-gradient(linear, left top, left bottom, from(#43577c), to(#2f3c58), color-stop(0.0, #aab)); + -webkit-border-top-left-radius: 7px; + -webkit-border-top-right-radius: 7px; +} + +/* Make the highlighted tab slightly taller. */ +.ViewContext_HighlightedTab div { + margin-top: 6px; +} + +/* Show text in higlighted tab. */ +.ViewContext_HighlightedTab div * a { + display: block; } -.menuTop { - background-image: url(icons/menubg_fixed_top.png); - height: 65px; + +.ViewContext_DisabledTab { + color: #ddd; +} + +/* Menu items. */ +.ContextMenu .MenuDiv ul li +{ + border-color: #374358; + border-bottom: 1px solid #d0d5de; + background: #fff; } -.menuTop:active { - background-image: url(icons/menubg_fixed_top_pressed.png); - height: 65px; + +/* Special case for regular menu Li (not row) */ +.ContextMenu .MenuDiv ul li.RegularMenuLi +{ + padding: 10px; +} + +/* Special case for top-level menu Li (not row Li) */ +.ContextMenu .MenuDiv ul li.MenuLi +{ + border-right: 3px solid; + border-left: 3px solid; } -.menuMid { - background-image: url(icons/menubg_fixed_center.png); - height: 65px; +.ViewContext_DisabledMenuItem { + color: #888; } -.menuMid:active { - background-image: url(icons/menubg_fixed_center_pressed.png); - height: 65px; + +/* If menu item has a row */ +.ContextMenu .MenuDiv ul li ul.MenuRowUl +{ + padding: 0px; + margin: 0px; + background: #f00; + list-style-type: none; + display: table; + width: 100%; + border: none; +} + +.ContextMenu .MenuDiv ul li ul li.MenuRowLi +{ + border: none; + border-left: 1px solid #d0d5de; + padding: 10px; + margin: 0px; + display: table-cell; } -.menuBot { - background-image: url(icons/menubg_fixed_bottom.png); - height: 79px; -} -.menuBot:active { - background-image: url(icons/menubg_fixed_bottom_pressed.png); - height: 79px; +/* Any Menu items when clicked. */ +.ContextMenu .MenuDiv ul li.RegularMenuLi:active, .ContextMenu .MenuDiv ul li ul li.MenuRowLi:active +{ + background: #ddd; } -.loadImagesTop { - background-image: url(icons/menubg_fixed_top_pressed.png); - visibility: hidden; +/* Last top-level menu item. */ +.ContextMenu .MenuDiv ul li.MenuLi:last-child +{ + -webkit-border-bottom-right-radius: 7px; + -webkit-border-bottom-left-radius: 7px; + border-bottom: 3px solid #374358; } -.loadImagesCenter { - background-image: url(icons/menubg_fixed_center_pressed.png); - visibility: hidden; + +/* Item icons. */ +.ContextMenu ul li img +{ + vertical-align: middle; } -.loadImagesBottom { - background-image: url(icons/menubg_fixed_bottom_pressed.png); - visibility: hidden; + +/* Item text. */ +.ContextMenu ul li a +{ + vertical-align: middle; + margin-left: 10px; }