diff options
Diffstat (limited to 'lib/dijit/themes/claro/TitlePane.css')
-rw-r--r-- | lib/dijit/themes/claro/TitlePane.css | 79 |
1 files changed, 49 insertions, 30 deletions
diff --git a/lib/dijit/themes/claro/TitlePane.css b/lib/dijit/themes/claro/TitlePane.css index a0191fc53..7f0cdbfb7 100644 --- a/lib/dijit/themes/claro/TitlePane.css +++ b/lib/dijit/themes/claro/TitlePane.css @@ -1,54 +1,73 @@ - +/* TitlePane + * + * Styling TitlePane means styling the TitlePane title and its content container (dijitTitlePane) + * + * TitlePane title: + * 1. TitlePane title (default styling): + * .dijitTitlePaneTitle - TitlePane's title div style: background-color, border + * + * 2. hovered TitlePane title (ie, mouse hover on a title bar) + * .dijitTitlePaneTitleHover - styles when mouse hover on the title div + * + * 3. active TitlePane title (ie, mouse down on a title bar) + * .dijitTitlePaneTitleActive - styles when mouse down on the title div + * + * + * TitlePane Content Container: + * 1. outer/inner container: + * .dijitTitlePaneContentOuter / dijitTitlePaneContentInner - styles for the content outer div + */ .claro .dijitTitlePaneTitle { - background-color: #e6e6e7; - background-image: url("images/titlebar.png"); - background-repeat:repeat-x; - border:1px solid #b5bcc7; - padding: 0px 7px 3px 7px; - min-height:17px; - color:#131313; + background-color: #efefef; + background-image: url("images/titlebar.png"); + background-repeat: repeat-x; + border: 1px solid #b5bcc7; + padding: 0 7px 3px 7px; + min-height: 17px; } .dj_ie6 .claro .dijitTitlePaneTitle { - background-image: none; + background-image: none; } .claro .dijitTitlePaneTitleHover { - background-color: #abd6ff; - border-color: #769dc0; + background-color: #abd6ff; + border-color: #769dc0; } .claro .dijitTitlePaneTitleActive { - background-color: #7dbefa; - border-color: #769dc0; - background-position:0px -136px; + background-color: #7dbefa; + border-color: #769dc0; + background-position: 0 -136px; } .claro .dijitTitlePaneTitleFocus { - margin-top:3px; - padding-bottom:2px; + margin-top: 3px; + padding-bottom: 2px; } .claro .dijitTitlePane .dijitArrowNode { - background-image: url('images/spriteArrows.png'); - background-repeat: no-repeat; - height: 8px; - width: 7px; + background-image: url('images/spriteArrows.png'); + background-repeat: no-repeat; + height: 8px; + width: 7px; } .claro .dijitTitlePane .dijitOpen .dijitArrowNode { - background-position: 0px 0px; + background-position: 0 0; } .claro .dijitTitlePane .dijitClosed .dijitArrowNode { - background-position: -14px 0px; + background-position: -14px 0; } .claro .dijitTitlePaneFocused .dijitTitlePaneTextNode { - color:#000; + color: #000000; + /* TODO: do we need this? we usually don't change text color on focus */ + } .claro .dijitTitlePaneContentOuter { - background: #ffffff; - border:1px solid #b5bcc7; - border-top:none; + background: #ffffff; + border: 1px solid #b5bcc7; + border-top: none; } .claro .dijitTitlePaneContentInner { - padding:10px; + padding: 10px; } .claro .dijitTitlePaneTextNode { - margin-left: 4px; - margin-right: 4px; - vertical-align:text-top; + margin-left: 4px; + margin-right: 4px; + vertical-align: text-top; } |