summaryrefslogtreecommitdiff
path: root/lib/dijit/themes/dijit.css
diff options
context:
space:
mode:
Diffstat (limited to 'lib/dijit/themes/dijit.css')
-rw-r--r--lib/dijit/themes/dijit.css880
1 files changed, 629 insertions, 251 deletions
diff --git a/lib/dijit/themes/dijit.css b/lib/dijit/themes/dijit.css
index 0d8302344..b6d57dca1 100644
--- a/lib/dijit/themes/dijit.css
+++ b/lib/dijit/themes/dijit.css
@@ -1,6 +1,19 @@
+/*
+ Essential styles that themes can inherit.
+ In other words, works but doesn't look great.
+*/
+
+
+
+/****
+ GENERIC PIECES
+ ****/
.dijitReset {
-
+ /* Use this style to null out padding, margin, border in your template elements
+ so that page specific styles don't break them.
+ - Use in all TABLE, TR and TD tags.
+ */
margin:0;
border:0;
padding:0;
@@ -9,34 +22,44 @@
color: inherit;
}
.dijit_a11y .dijitReset {
- -moz-appearance: none;
+ -moz-appearance: none; /* remove predefined high-contrast styling in Firefox */
}
+
.dijitInline {
-
- display:inline-block;
- #zoom: 1;
- #display:inline;
+ /* To inline block elements.
+ Similar to InlineBox below, but this has fewer side-effects in Moz.
+ Also, apparently works on a DIV as well as a FIELDSET.
+ */
+ display:inline-block; /* webkit and FF3 */
+ #zoom: 1; /* set hasLayout:true to mimic inline-block */
+ #display:inline; /* don't use .dj_ie since that increases the priority */
border:0;
padding:0;
vertical-align:middle;
- #vertical-align: auto;
+ #vertical-align: auto; /* makes TextBox,Button line up w/native counterparts on IE6 */
}
+
.dijitHidden {
-
+ /* To hide unselected panes in StackContainer etc. */
display: none !important;
}
+
.dijitVisible {
-
- display: block !important;
- position: relative;
+ /* To show selected pane in StackContainer etc. */
+ display: block !important; /* override user's display:none setting via style setting or indirectly via class */
+ position: relative; /* to support setting width/height, see #2033 */
}
+
.dijitInputContainer {
-
+ /* for positioning of placeHolder */
#zoom: 1;
overflow: hidden;
- float: none !important;
- position:relative;
+ float: none !important; /* needed by FF to squeeze the INPUT in */
+ position: relative;
+ vertical-align: middle;
+ #display: inline;
}
+
.dj_ie INPUT.dijitTextBox,
.dj_ie .dijitTextBox INPUT {
font-size: 100%;
@@ -48,7 +71,7 @@
text-align: center;
}
.dijitTextBox INPUT.dijitInputField {
-
+ /* override unreasonable user styling of buttons and icons */
padding-left: 0 !important;
padding-right: 0 !important;
}
@@ -56,25 +79,31 @@
display: none;
}
.dijitInlineTable {
-
+ /* To inline tables with a given width set (otherwise, use dijitInline above) */
display:inline-table;
- display:inline-block;
- #zoom: 1;
- #display:inline;
+ display:inline-block; /* webkit and FF3 */
+ #zoom: 1; /* set hasLayout:true to mimic inline-block */
+ #display:inline; /* don't use .dj_ie since that increases the priority */
box-sizing: content-box; -moz-box-sizing: content-box;
border:0;
padding:0;
}
+
.dijitTeeny {
font-size:1px;
line-height:1px;
}
+
.dijitOffScreen {
position: absolute;
- visibility: hidden;
left: 50%;
top: -10000px;
}
+
+/*
+ * Popup items have a wrapper div (dijitPopup)
+ * with the real popup inside, and maybe an iframe too
+ */
.dijitPopup {
position: absolute;
background-color: transparent;
@@ -82,14 +111,9 @@
border: 0;
padding: 0;
}
-.dijit_a11y .dijitPopup,
-.dijit_ally .dijitPopup DIV,
-.dijit_a11y .dijitPopup TABLE,
-.dijit_a11y .dijitTooltipContainer {
- background-color: white !important;
-}
+
.dijitPositionOnly {
-
+ /* Null out all position-related properties */
padding: 0 !important;
border: 0 !important;
background-color: transparent !important;
@@ -97,15 +121,17 @@
height: auto !important;
width: auto !important;
}
+
.dijitNonPositionOnly {
-
+ /* Null position-related properties */
float: none !important;
position: static !important;
margin: 0 0 0 0 !important;
vertical-align: middle !important;
}
+
.dijitBackgroundIframe {
-
+ /* iframe used to prevent problems with PDF or other applets overlaying menus etc */
position: absolute;
left: 0;
top: 0;
@@ -116,52 +142,65 @@
padding: 0;
margin: 0;
}
+
.dijitDisplayNone {
-
+ /* hide something. Use this as a class rather than element.style so another class can override */
display:none !important;
}
+
.dijitContainer {
-
- overflow: hidden;
-}
-.dijit_a11y * {
- background-image:none !important;
+ /* for all layout containers */
+ overflow: hidden; /* need on IE so something can be reduced in size, and so scrollbars aren't temporarily displayed when resizing */
}
+
+/****
+ A11Y
+ ****/
.dijit_a11y .dijitIcon,
-.dijit_a11y DIV.dijitArrowButtonInner,
+.dijit_a11y DIV.dijitArrowButtonInner, /* is this only for Spinner? if so, it should be deleted */
.dijit_a11y SPAN.dijitArrowButtonInner,
.dijit_a11y IMG.dijitArrowButtonInner,
-.dijit_a11y .dijitCalendarIncrementControl {
-
+.dijit_a11y .dijitCalendarIncrementControl,
+.dijit_a11y .dijitTreeExpando {
+ /* hide icon nodes in high contrast mode; when necessary they will be replaced by character equivalents
+ * exception for INPUT.dijitArrowButtonInner, because the icon and character are controlled by the same node */
display: none;
}
.dijitSpinner DIV.dijitArrowButtonInner {
- display: block;
+ display: block; /* override previous rule */
}
+
.dijit_a11y .dijitA11ySideArrow {
- display: inline !important;
+ display: inline !important; /* display text instead */
cursor: pointer;
}
+
+/*
+ * Since we can't use shading in a11y mode, and since the underline indicates today's date,
+ * use a border to show the selected date.
+ * Avoid screen jitter when switching selected date by compensating for the selected node's
+ * border w/padding on other nodes.
+ */
.dijit_a11y .dijitCalendarDateLabel {
padding: 1px;
}
.dijit_a11y .dijitCalendarSelectedDate .dijitCalendarDateLabel {
border-style: dotted !important;
border-width: 1px;
- padding: 0px;
+ padding: 0;
}
.dijit_a11y .dijitCalendarDateTemplate {
- padding-bottom: 0.1em !important;
-}
-.dijit_a11y .dijit * {
- background:white !important;
- color:black !important;
+ padding-bottom: 0.1em !important; /* otherwise bottom border doesn't appear on IE */
}
.dijit_a11y .dijitButtonNode {
- border-color: black!important;
- border-style: outset!important;
- border-width: medium!important;
+ border: black outset medium !important;
+
+ /* In claro, hovering a toolbar button reduces padding and adds a border.
+ * Not needed in a11y mode since Toolbar buttons always have a border.
+ */
+ padding: 0 !important;
}
+
.dijit_a11y .dijitTextBoxReadOnly .dijitInputField,
.dijit_a11y .dijitTextBoxReadOnly .dijitButtonNode {
border-style: outset!important;
@@ -169,83 +208,94 @@
border-color: #999 !important;
color:#999 !important;
}
+
+/* button inner contents - labels, icons etc. */
.dijitButtonNode * {
vertical-align: middle;
}
.dijitButtonNode .dijitArrowButtonInner {
-
+ /* the arrow icon node */
background: no-repeat center;
width: 12px;
height: 12px;
- direction: ltr;
+ direction: ltr; /* needed by IE/RTL */
}
+
+/****
+ 3-element borders: ( dijitLeft + dijitStretch + dijitRight )
+ These were added for rounded corners on dijit.form.*Button but never actually used.
+ ****/
+
.dijitLeft {
-
+ /* Left part of a 3-element border */
background-position:left top;
background-repeat:no-repeat;
}
+
.dijitStretch {
-
- white-space:nowrap;
+ /* Middle (stretchy) part of a 3-element border */
+ white-space:nowrap; /* MOW: move somewhere else */
background-repeat:repeat-x;
}
+
.dijitRight {
-
- #display:inline;
+ /* Right part of a 3-element border */
+ #display:inline; /* IE7 sizes to outer size w/o this */
background-position:right top;
background-repeat:no-repeat;
}
+
+/* Buttons */
+
.dijitToggleButton,
.dijitButton,
.dijitDropDownButton,
.dijitComboButton {
-
+ /* outside of button */
margin: 0.2em;
+ vertical-align: middle;
}
+
.dijitButtonContents {
- display: block;
+ display: block; /* to make focus border rectangular */
}
td.dijitButtonContents {
- display: table-cell;
+ display: table-cell; /* but don't affect Select, ComboButton */
}
+
.dijitButtonNode IMG {
-
+ /* make text and images line up cleanly */
vertical-align:middle;
-
-}
-TABLE.dijitComboButton {
-
- border-collapse: collapse;
- border:0;
- padding:0;
- margin:0;
+ /*margin-bottom:.2em;*/
}
+
.dijitToolbar .dijitComboButton {
-
+ /* because Toolbar only draws a border around the hovered thing */
border-collapse: separate;
}
+
.dijitToolbar .dijitToggleButton,
.dijitToolbar .dijitButton,
.dijitToolbar .dijitDropDownButton,
.dijitToolbar .dijitComboButton {
margin: 0;
}
+
.dijitToolbar .dijitButtonContents {
-
+ /* just because it used to be this way */
padding: 1px 2px;
}
-.dj_ie .dijitComboButton {
-
- margin-bottom: -3px;
-}
+
+
.dj_webkit .dijitToolbar .dijitDropDownButton {
padding-left: 0.3em;
}
.dj_gecko .dijitToolbar .dijitButtonNode::-moz-focus-inner {
padding:0;
}
+
.dijitButtonNode {
-
+ /* Node that is acting as a button -- may or may not be a BUTTON element */
border:1px solid gray;
margin:0;
line-height:normal;
@@ -255,76 +305,95 @@ TABLE.dijitComboButton {
white-space: nowrap;
}
.dj_webkit .dijitSpinner .dijitSpinnerButtonContainer {
-
+ /* apparent WebKit bug where messing with the font coupled with line-height:normal X 2 (dijitReset & dijitButtonNode)
+ can be different than just a single line-height:normal, visible in InlineEditBox/Spinner */
line-height:inherit;
}
.dijitTextBox .dijitButtonNode {
border-width: 0;
}
+
.dijitButtonNode,
.dijitButtonNode * {
cursor: pointer;
}
+
.dj_ie .dijitButtonNode {
-
+ /* ensure hasLayout */
zoom: 1;
}
+
.dj_ie .dijitButtonNode button {
-
+ /*
+ disgusting hack to get rid of spurious padding around button elements
+ on IE. MSIE is truly the web's boat anchor.
+ */
overflow: visible;
}
+
DIV.dijitArrowButton {
float: right;
}
+
+/******
+ TextBox related.
+ Everything that has an <input>
+*******/
+
.dijitTextBox {
border: solid black 1px;
- #overflow: hidden;
- width: 15em;
+ #overflow: hidden; /* #6027, #6067 */
+ width: 15em; /* need to set default size on outer node since inner nodes say <input style="width:100%"> and <td width=100%>. user can override */
vertical-align: middle;
- #vertical-align: auto;
}
+
.dijitTextBoxReadOnly,
.dijitTextBoxDisabled {
color: gray;
}
.dj_webkit .dijitTextBoxDisabled INPUT {
- color: #eee;
+ color: #eee; /* because WebKit lightens disabled input/textarea no matter what color you specify */
}
.dj_webkit TEXTAREA.dijitTextAreaDisabled {
- color: #333;
+ color: #333; /* because WebKit lightens disabled input/textarea no matter what color you specify */
}
-.dj_gecko .dijitTextBoxReadOnly INPUT,
+.dj_gecko .dijitTextBoxReadOnly INPUT.dijitInputField, /* disable arrow and validation presentation INPUTs but allow real INPUT for text selection */
.dj_gecko .dijitTextBoxDisabled INPUT {
- -moz-user-input: none;
+ -moz-user-input: none; /* prevent focus of disabled textbox buttons */
}
+
.dijitPlaceHolder {
-
+ /* hint text that appears in a textbox until user starts typing */
color: #AAAAAA;
font-style: italic;
position: absolute;
top: 0;
left: 0;
- #filter: "";
+ #filter: ""; /* make this showup in IE6 after the rendering of the widget */
}
+
.dijitTimeTextBox {
width: 8em;
}
+
+/* rules for webkit to deal with fuzzy blue focus border */
.dijitTextBox INPUT:focus {
- outline: none;
+ outline: none; /* blue fuzzy line looks wrong on combobox or something w/validation icon showing */
}
.dijitTextBoxFocused {
outline: auto 5px -webkit-focus-ring-color;
}
+
.dijitTextBox INPUT {
- float: left;
+ float: left; /* needed by IE to remove secret margin */
}
.dijitInputInner {
-
+ /* for when an <input> is embedded inside an inline-block <div> with a size and border */
border:0 !important;
vertical-align:middle !important;
background-color:transparent !important;
width:100% !important;
-
+ /* IE dislikes horizontal tweaking combined with width:100% so punish everyone for consistency */
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: 0 !important;
@@ -335,7 +404,9 @@ DIV.dijitArrowButton {
}
.dijitTextBoxError INPUT.dijitValidationInner,
.dijitTextBox INPUT.dijitArrowButtonInner {
-
+ /* <input> used to display arrow icon/validation icon, or in arrow character in high contrast mode.
+ * The css below is a trick to hide the character in non-high-contrast mode
+ */
text-indent: -1em !important;
direction: ltr !important;
text-align: left !important;
@@ -346,12 +417,12 @@ DIV.dijitArrowButton {
}
.dj_ie .dijitTextBox INPUT,
.dj_ie INPUT.dijitTextBox {
- overflow-y: visible;
- line-height: normal;
+ overflow-y: visible; /* INPUTs need help expanding when padding is added or line-height is adjusted */
+ line-height: normal; /* strict mode */
}
.dj_ie7 .dijitTextBox INPUT.dijitValidationInner,
.dj_ie7 .dijitTextBox INPUT.dijitArrowButtonInner {
- line-height: 86%;
+ line-height: 86%; /* IE7 problem where the icon is vertically too low w/o this - real input stays at normal */
}
.dj_ie6 .dijitTextBox INPUT,
.dj_ie6 INPUT.dijitTextBox,
@@ -360,11 +431,11 @@ DIV.dijitArrowButton {
.dj_iequirks .dijitTextBox INPUT.dijitSpinnerButtonInner,
.dj_iequirks .dijitTextBox INPUT.dijitInputInner,
.dj_iequirks INPUT.dijitTextBox {
- line-height: 100%;
+ line-height: 100%; /* IE7 problem where the icon is vertically way too low w/o this */
}
.dijit_a11y INPUT.dijitValidationInner,
.dijit_a11y INPUT.dijitArrowButtonInner {
-
+ /* (in high contrast mode) revert rules from above so character displays */
text-indent: 0 !important;
width: 1em !important;
#text-align: left !important;
@@ -373,29 +444,38 @@ DIV.dijitArrowButton {
display: inline;
cursor: default;
}
+
+/* ComboBox & Spinner */
+
.dijitSpinner .dijitSpinnerButtonContainer,
.dijitComboBox .dijitArrowButtonContainer {
-
- border-width: 0 0 0 1px !important;
+ /* dividing line between input area and up/down button(s) for ComboBox and Spinner */
+ border-width: 0 0 0 1px !important; /* !important needed due to wayward ".theme .dijitButtonNode" rules */
+}
+.dijitToolbar .dijitComboBox .dijitArrowButtonContainer {
+ /* overrides above rule plus mirror-image rule in dijit_rtl.css to have no divider when ComboBox in Toolbar */
+ border-width: 0 !important;
+}
+
+.dijitComboBoxMenu {
+ /* Drop down menu is implemented as <ul> <li/> <li/> ... but we don't want circles before each item */
+ list-style-type: none;
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitButtonNode {
-
+ /* dividing line between input area and up/down button(s) for ComboBox and Spinner */
border-width: 0;
}
.dj_ie .dijit_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitButtonNode {
- clear: both;
-}
-.dijit_a11y .dijitTextBox .dijitValidationContainer,
-.dijit_a11y .dijitTextBox .dijitSpinnerButtonContainer,
-.dijit_a11y .dijitComboBox .dijitArrowButtonContainer {
-
- border: solid black !important;
- border-width: 0 0 0 1px !important;
+ clear: both; /* IE workaround */
}
+
.dj_ie .dijitToolbar .dijitComboBox {
-
+ /* make combobox buttons align properly with other buttons in a toolbar */
vertical-align: middle;
}
+
+/* Spinner */
+
.dijitTextBox .dijitSpinnerButtonContainer {
width: 1em;
position: relative !important;
@@ -403,7 +483,7 @@ DIV.dijitArrowButton {
}
.dijitSpinner .dijitSpinnerButtonInner {
width:1em;
- visibility:hidden !important;
+ visibility:hidden !important; /* just a sizing element */
overflow-x:hidden;
}
.dijitComboBox .dijitButtonNode,
@@ -419,7 +499,7 @@ DIV.dijitArrowButton {
width: 1em !important;
}
.dijit_a11y .dijitSpinner .dijitArrowButtonInner {
- margin: 0 auto !important;
+ margin: 0 auto !important; /* should auto-center */
}
.dj_ie .dijit_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
padding-left: 0.3em !important;
@@ -429,8 +509,8 @@ DIV.dijitArrowButton {
width: 1.4em !important;
}
.dj_ie7 .dijit_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
- padding-left: 0.0em !important;
- padding-right: 0.0em !important;
+ padding-left: 0 !important; /* manually center INPUT: character is .5em and total width = 1em */
+ padding-right: 0 !important;
width: 1em !important;
}
.dj_ie6 .dijit_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
@@ -444,7 +524,9 @@ DIV.dijitArrowButton {
width: 2em !important;
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
-
+ /* note: .dijitInputLayoutContainer makes this rule override .dijitArrowButton settings
+ * for dijit.form.Button
+ */
padding: 0;
position: absolute !important;
right: 0;
@@ -466,7 +548,7 @@ DIV.dijitArrowButton {
border-top-width: 1px !important;
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitUpArrowButton {
- #bottom: 50%;
+ #bottom: 50%; /* otherwise (on some machines) top arrow icon too close to splitter border (IE6/7) */
top: 0;
}
.dijitSpinner .dijitArrowButtonInner {
@@ -493,16 +575,17 @@ DIV.dijitArrowButton {
width: 100%;
}
.dj_ie .dijitSpinner .dijitArrowButtonInner .dijitInputField {
- zoom: 50%;
+ zoom: 50%; /* emulate transform: scale(0.5) */
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButtonInner {
overflow: hidden;
}
+
.dijit_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
width: 100%;
}
.dj_iequirks .dijit_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
- width: 1em;
+ width: 1em; /* matches .dijit_a11y .dijitTextBox .dijitSpinnerButtonContainer rule - 100% is the whole screen width in quirks */
}
.dijitSpinner .dijitArrowButtonInner .dijitInputField {
visibility: hidden;
@@ -515,9 +598,16 @@ DIV.dijitArrowButton {
width: 1em;
}
.dijit_a11y .dijitSpinnerButtonContainer .dijitButtonNode {
- border-width: 1px 0px 0px 0px;
+ border-width: 1px 0 0 0;
border-style: solid !important;
}
+
+/****
+ dijit.form.CheckBox
+ &
+ dijit.form.RadioButton
+ ****/
+
.dijitCheckBox,
.dijitRadio,
.dijitCheckBoxInput {
@@ -529,22 +619,26 @@ DIV.dijitArrowButton {
background-repeat:no-repeat;
overflow: hidden;
}
+
.dijitCheckBox INPUT,
.dijitRadio INPUT {
margin: 0;
padding: 0;
display: block;
}
+
.dijitCheckBoxInput {
-
+ /* place the actual input on top, but all-but-invisible */
opacity: 0.01;
}
+
.dj_ie .dijitCheckBoxInput {
filter: alpha(opacity=0);
}
+
.dijit_a11y .dijitCheckBox,
.dijit_a11y .dijitRadio {
-
+ /* in a11y mode we display the native checkbox (not the icon), so don't restrict the size */
width: auto !important;
height: auto !important;
}
@@ -554,14 +648,21 @@ DIV.dijitArrowButton {
width: auto;
height: auto;
}
+
+
+/****
+ dijit.ProgressBar
+ ****/
+
.dijitProgressBarEmpty {
-
+ /* outer container and background of the bar that's not finished yet*/
position:relative;overflow:hidden;
- border:1px solid black;
- z-index:0;
+ border:1px solid black; /* a11y: border necessary for high-contrast mode */
+ z-index:0; /* establish a stacking context for this progress bar */
}
+
.dijitProgressBarFull {
-
+ /* outer container for background of bar that is finished */
position:absolute;
overflow:hidden;
z-index:-1;
@@ -571,8 +672,9 @@ DIV.dijitArrowButton {
.dj_ie6 .dijitProgressBarFull {
height:1.6em;
}
+
.dijitProgressBarTile {
-
+ /* inner container for finished portion */
position:absolute;
overflow:hidden;
top:0;
@@ -586,27 +688,29 @@ DIV.dijitArrowButton {
background-color:#aaa;
background-attachment: fixed;
}
+
.dijit_a11y .dijitProgressBarTile {
-
+ /* a11y: The border provides visibility in high-contrast mode */
border-width:2px;
border-style:solid;
background-color:transparent !important;
}
+
.dj_ie6 .dijitProgressBarTile {
-
+ /* width:auto works in IE6 with position:static but not position:absolute */
position:static;
-
+ /* height:auto or 100% does not work in IE6 */
height:1.6em;
}
-.dijitProgressBarIndeterminate .dijitProgressBarLabel {
- visibility:hidden;
-}
+
.dijitProgressBarIndeterminate .dijitProgressBarTile {
-
+ /* animated gif for 'indeterminate' mode */
}
+
.dijitProgressBarIndeterminateHighContrastImage {
display:none;
}
+
.dijit_a11y .dijitProgressBarIndeterminate .dijitProgressBarIndeterminateHighContrastImage {
display:block;
position:absolute;
@@ -617,6 +721,7 @@ DIV.dijitArrowButton {
width:100%;
height:auto;
}
+
.dijitProgressBarLabel {
display:block;
position:static;
@@ -624,38 +729,52 @@ DIV.dijitArrowButton {
text-align:center;
background-color:transparent !important;
}
+
+/****
+ dijit.Tooltip
+ ****/
+
.dijitTooltip {
position: absolute;
z-index: 2000;
display: block;
-
- left: 50%;
+ /* make visible but off screen */
+ left: 0;
top: -10000px;
overflow: visible;
}
+
.dijitTooltipContainer {
border: solid black 2px;
background: #b8b5b5;
color: black;
font-size: small;
}
+
.dijitTooltipFocusNode {
padding: 2px 2px 2px 2px;
}
+
.dijitTooltipConnector {
position: absolute;
}
.dijit_a11y .dijitTooltipConnector {
- display: none;
+ display: none; /* won't show b/c it's background-image; hide to avoid border gap */
}
+
.dijitTooltipData {
display:none;
}
+
+/* Layout widgets. This is essential CSS to make layout work (it isn't "styling" CSS)
+ make sure that the position:absolute in dijitAlign* overrides other classes */
+
.dijitLayoutContainer {
position: relative;
display: block;
overflow: hidden;
}
+
body .dijitAlignTop,
body .dijitAlignBottom,
body .dijitAlignLeft,
@@ -663,40 +782,61 @@ body .dijitAlignRight {
position: absolute;
overflow: hidden;
}
+
body .dijitAlignClient { position: absolute; }
+
+/*
+ * BorderContaienr
+ *
+ * .dijitBorderContainer is a stylized layout where panes have border and margin.
+ * .dijitBorderContainerNoGutter is a raw layout.
+ */
.dijitBorderContainer, .dijitBorderContainerNoGutter {
position:relative;
overflow: hidden;
}
+
.dijitBorderContainerPane,
.dijitBorderContainerNoGutterPane {
- position: absolute !important;
- z-index: 2;
+ position: absolute !important; /* !important to override position:relative in dijitTabContainer etc. */
+ z-index: 2; /* above the splitters so that off-by-one browser errors don't cover up border of pane */
}
+
.dijitBorderContainer > .dijitTextArea {
-
+ /* On Safari, for SimpleTextArea inside a BorderContainer,
+ don't want to display the grip to resize */
resize: none;
}
+
.dijitGutter {
-
+ /* gutter is just a place holder for empty space between panes in BorderContainer */
position: absolute;
- font-size: 1px;
+ font-size: 1px; /* needed by IE6 even though div is empty, otherwise goes to 15px */
}
+
+/* SplitContainer
+
+ 'V' == container that splits vertically (up/down)
+ 'H' = horizontal (left/right)
+*/
+
.dijitSplitter {
position: absolute;
overflow: hidden;
- z-index: 10;
+ z-index: 10; /* above the panes so that splitter focus is visible on FF, see #7583*/
background-color: #fff;
border-color: gray;
border-style: solid;
border-width: 0;
}
.dj_ie .dijitSplitter {
- z-index: 1;
+ z-index: 1; /* behind the panes so that pane borders aren't obscured see test_Gui.html/[14392] */
}
+
.dijitSplitterActive {
z-index: 11 !important;
}
+
.dijitSplitterCover {
position:absolute;
z-index:-1;
@@ -705,13 +845,17 @@ body .dijitAlignClient { position: absolute; }
width:100%;
height:100%;
}
+
.dijitSplitterCoverActive {
z-index:3 !important;
}
+
+/* #6945: stop mouse events */
.dj_ie .dijitSplitterCover {
background: white;
filter: alpha(opacity=0);
}
+
.dijitSplitterH {
height: 7px;
border-top:1px;
@@ -733,9 +877,11 @@ body .dijitAlignClient { position: absolute; }
outline-style:dotted;
outline-width: 2px;
}
+
.dijitSplitPane {
position: absolute;
}
+
.dijitSplitContainerSizerH,
.dijitSplitContainerSizerV {
position:absolute;
@@ -747,15 +893,18 @@ body .dijitAlignClient { position: absolute; }
border-color: ThreeDHighlight ThreeDShadow ThreeDShadow ThreeDHighlight;
margin: 0;
}
+
.dijitSplitContainerSizerH .thumb, .dijitSplitterV .dijitSplitterThumb {
overflow:hidden;
position:absolute;
top:49%;
}
+
.dijitSplitContainerSizerV .thumb, .dijitSplitterH .dijitSplitterThumb {
position:absolute;
left:49%;
}
+
.dijitSplitterShadow,
.dijitSplitContainerVirtualSizerH,
.dijitSplitContainerVirtualSizerV {
@@ -766,12 +915,14 @@ body .dijitAlignClient { position: absolute; }
filter: Alpha(Opacity=50);
margin: 0;
}
+
.dj_ie .dijitSplitterV, .dijitSplitContainerVirtualSizerH {
cursor: w-resize;
}
.dj_ie .dijitSplitterH, .dijitSplitContainerSizerV, .dijitSplitContainerVirtualSizerV {
cursor: n-resize;
}
+
.dijit_a11y .dijitSplitterH {
border-top:1px solid #d3d3d3 !important;
border-bottom:1px solid #d3d3d3 !important;
@@ -780,14 +931,24 @@ body .dijitAlignClient { position: absolute; }
border-left:1px solid #d3d3d3 !important;
border-right:1px solid #d3d3d3 !important;
}
+
+/* ContentPane */
+
.dijitContentPane {
display: block;
- overflow: auto;
+ overflow: auto; /* if we don't have this (or overflow:hidden), then Widget.resizeTo() doesn't make sense for ContentPane */
}
+
.dijitContentPaneSingleChild {
-
+ /*
+ * if the ContentPane holds a single layout widget child which is being sized to match the content pane,
+ * then the ContentPane should never get a scrollbar (but it does due to browser bugs, see #9449
+ */
overflow: hidden;
}
+
+/* TitlePane */
+
.dijitTitlePane {
display: block;
overflow: hidden;
@@ -795,45 +956,48 @@ body .dijitAlignClient { position: absolute; }
.dijitTitlePaneTitle {
cursor: pointer;
}
-.dijitFixedOpen {
-
+.dijitFixedOpen, .dijitFixedClosed {
+ /* TitlePane that cannot be toggled */
cursor: default;
}
.dijitTitlePaneTitle * {
vertical-align: middle;
}
.dijitTitlePane .dijitArrowNodeInner {
-
+ /* normally, hide arrow text in favor of icon */
display: none;
}
.dijit_a11y .dijitTitlePane .dijitArrowNodeInner {
-
+ /* ... except in a11y mode, then show text arrow */
display:inline !important;
- font-family: monospace;
+ font-family: monospace; /* because - and + are different widths */
}
.dijit_a11y .dijitTitlePane .dijitArrowNode {
-
+ /* ... and hide icon */
display:none;
}
+
.dj_ie6 .dijitTitlePaneContentOuter,
.dj_ie6 .dijitTitlePane .dijitTitlePaneTitle {
-
+ /* force hasLayout to ensure borders etc, show up */
zoom: 1;
}
+
+/* Color Palette
+ * Sizes designed so that table cell positions match icons in underlying image,
+ * which appear at 20x20 intervals.
+ */
+
.dijitColorPalette {
border: 1px solid #999;
background: #fff;
position: relative;
}
-img.dijitColorPaletteUnder {
-
- border-style: none;
- position: absolute;
- left: 0;
- top: 0;
-}
+
.dijitColorPalette .dijitPaletteTable {
-
+ /* Table that holds the palette cells, and overlays image file with color swatches.
+ * padding/margin to align table with image.
+ */
padding: 2px 3px 3px 3px;
position: relative;
overflow: hidden;
@@ -843,52 +1007,59 @@ img.dijitColorPaletteUnder {
.dj_ie6 .dijitColorPalette .dijitPaletteTable,
.dj_ie7 .dijitColorPalette .dijitPaletteTable,
.dj_iequirks .dijitColorPalette .dijitPaletteTable {
-
+ /* using padding above so that focus border isn't cutoff on moz/webkit,
+ * but using margin on IE because padding doesn't seem to work
+ */
padding: 0;
margin: 2px 3px 3px 3px;
}
+
.dijitColorPalette .dijitPaletteCell {
-
- height: 20px;
- width: 20px;
+ /* <td> in the <table> */
font-size: 1px;
vertical-align: middle;
text-align: center;
+ background: none;
}
.dijitColorPalette .dijitPaletteImg {
-
- width: 16px;
- height: 14px;
+ /* Called dijitPaletteImg for back-compat, this actually wraps the color swatch with a border and padding */
+ padding: 1px; /* white area between gray border and color swatch */
border: 1px solid #999;
+ margin: 2px 1px;
cursor: default;
- vertical-align: middle;
+ font-size: 1px; /* prevent <span> from getting bigger just to hold a character */
}
-.dj_iequirks .dijitColorPalette .dijitPaletteImg {
- margin: 1px;
+.dj_gecko .dijitColorPalette .dijitPaletteImg {
+ padding-bottom: 0; /* workaround rendering glitch on FF, it adds an extra pixel at the bottom */
+}
+.dijitColorPalette .dijitColorPaletteSwatch {
+ /* the actual part where the color is */
+ width: 14px;
+ height: 12px;
}
.dijitPaletteTable td {
- padding: 0px;
+ padding: 0;
}
.dijitColorPalette .dijitPaletteCellHover .dijitPaletteImg {
-
+ /* hovered color swatch */
border: 1px solid #000;
}
+
.dijitColorPalette .dijitPaletteCellActive .dijitPaletteImg,
.dijitColorPalette .dijitPaletteCellSelected .dijitPaletteImg {
border: 2px solid #000;
+ margin: 1px 0; /* reduce margin to compensate for increased border */
}
+
+
.dijit_a11y .dijitColorPalette .dijitPaletteTable,
.dijit_a11y .dijitColorPalette .dijitPaletteTable * {
-
+ /* table cells are to catch events, but the swatches are in the PaletteImg behind the table */
background-color: transparent !important;
}
-.dj_gecko .dijit_a11y .dijitColorPalette .dijitPaletteCellFocused .dijitPaletteImg {
- border: 3px dotted #000;
- margin: -1px;
-}
-.dijit_a11y .dijitColorPalette .dijitPaletteCellHover .dijitPaletteImg {
- border: 2px solid #000 !important;
-}
+
+/* AccordionContainer */
+
.dijitAccordionContainer {
border:1px solid #b7b7b7;
border-top:0 !important;
@@ -899,39 +1070,51 @@ img.dijitColorPaletteUnder {
.dijitAccordionTitleSelected {
cursor: default;
}
+
+/* images off, high-contrast mode styles */
.dijitAccordionTitle .arrowTextUp,
.dijitAccordionTitle .arrowTextDown {
display: none;
font-size: 0.65em;
font-weight: normal !important;
}
+
.dijit_a11y .dijitAccordionTitle .arrowTextUp,
.dijit_a11y .dijitAccordionTitleSelected .arrowTextDown {
display: inline;
}
+
.dijit_a11y .dijitAccordionTitleSelected .arrowTextUp {
display: none;
}
-.dj_ie6 .dijitAccordionTitle,
-.dj_iequirks .dijitAccordionTitle {
-
- zoom: 1;
+
+.dijitAccordionChildWrapper {
+ /* this is the node whose height is adjusted */
+ overflow: hidden;
}
+
+/* Calendar */
+
.dijitCalendarContainer {
- width: auto;
+ width: auto; /* in case user has specified a width for the TABLE nodes, see #10553 */
}
.dijitCalendarContainer th, .dijitCalendarContainer td {
padding: 0;
+ vertical-align: middle;
}
+
.dijitCalendarNextYear {
margin:0 0 0 0.55em;
}
+
.dijitCalendarPreviousYear {
margin:0 0.55em 0 0;
}
+
.dijitCalendarIncrementControl {
vertical-align: middle;
}
+
.dijitCalendarIncrementControl,
.dijitCalendarDateTemplate,
.dijitCalendarMonthLabel,
@@ -939,18 +1122,29 @@ img.dijitColorPaletteUnder {
.dijitCalendarNextYear {
cursor: pointer;
}
+
.dijitCalendarDisabledDate {
color: gray;
text-decoration: line-through;
cursor: default;
}
+
.dijitSpacer {
-
+ /* don't display it, but make it affect the width */
position: relative;
height: 1px;
overflow: hidden;
visibility: hidden;
}
+
+/* Styling for month drop down list */
+
+.dijitCalendarMonthMenu .dijitCalendarMonthLabel {
+ text-align:center;
+}
+
+/* Menu */
+
.dijitMenu {
border:1px solid black;
background-color:white;
@@ -960,26 +1154,38 @@ img.dijitColorPaletteUnder {
border-width:0;
background-color:white;
}
+
+/* workaround for webkit bug #8427, remove this when it is fixed upstream */
.dj_webkit .dijitMenuTable td[colspan="2"]{
border-right:hidden;
}
+
.dijitMenuItem {
text-align: left;
white-space: nowrap;
padding:.1em .2em;
cursor:pointer;
}
+
.dijitMenuPassive .dijitMenuItemHover,
.dijitMenuItemSelected {
-
+ /*
+ * dijitMenuItemHover refers to actual mouse over
+ * dijitMenuItemSelected is used after a menu has been "activated" by
+ * clicking it, tabbing into it, or being opened from a parent menu,
+ * and denotes that the menu item has focus or that focus is on a child
+ * menu
+ */
background-color:black;
color:white;
}
+
.dijitMenuItemIcon, .dijitMenuExpand {
background-repeat: no-repeat;
}
+
.dijitMenuItemDisabled * {
-
+ /* for a disabled menu item, just set it to mostly transparent */
opacity:0.5;
cursor:default;
}
@@ -990,10 +1196,12 @@ img.dijitColorPaletteUnder {
color:gray !important;
filter: alpha(opacity=35);
}
+
.dijitMenuItemLabel {
position: relative;
vertical-align: middle;
}
+
.dijit_a11y .dijitMenuItemSelected {
border: 1px dotted black !important;
}
@@ -1008,28 +1216,35 @@ img.dijitColorPaletteUnder {
.dj_ie8 .dijit_a11y .dijitMenuItemLabel {
position:static;
}
+
.dijitMenuExpandA11y {
display: none;
}
.dijit_a11y .dijitMenuExpandA11y {
display: inline;
}
+
.dijitMenuSeparator td {
border: 0;
padding: 0;
}
+
+/* separator can be two pixels -- set border of either one to 0 to have only one */
.dijitMenuSeparatorTop {
height: 50%;
margin: 0;
margin-top:3px;
font-size: 1px;
}
+
.dijitMenuSeparatorBottom {
height: 50%;
margin: 0;
margin-bottom:3px;
font-size: 1px;
}
+
+/* the checked menu item */
.dijitCheckedMenuItemIconChar {
vertical-align: middle;
visibility:hidden;
@@ -1044,21 +1259,29 @@ img.dijitColorPaletteUnder {
display: none;
}
.dj_ie .dijit_a11y .dijitMenuBar .dijitMenuItem {
-
- margin: 0px;
+ /* so bottom border of MenuBar appears on IE7 in high-contrast mode */
+ margin: 0;
}
+
+/* StackContainer */
+
.dijitStackController .dijitToggleButtonChecked * {
- cursor: default;
+ cursor: default; /* because pressing it has no effect */
}
+
+/* TabContainer */
+
.dijitTabContainerNoLayout {
- width: 100%;
+ width: 100%; /* otherwise ScrollingTabController goes to 50K pixels wide */
}
+
.dijitTabContainerBottom-tabs,
.dijitTabContainerTop-tabs,
.dijitTabContainerLeft-tabs,
.dijitTabContainerRight-tabs {
- overflow: visible !important;
+ overflow: visible !important; /* so tabs can cover up border adjacent to container */
}
+
.dijitTabContainerBottom-container,
.dijitTabContainerTop-container,
.dijitTabContainerLeft-container,
@@ -1075,39 +1298,46 @@ img.dijitColorPaletteUnder {
.dijitTabListWrapper {
overflow: hidden;
}
+
.dijit_a11y .tabStripButton img {
-
+ /* hide the icons (or rather the empty space where they normally appear) because text will appear instead */
display: none;
}
+
.dijitTabContainerTop-tabs {
border-bottom: 1px solid black;
}
.dijitTabContainerTop-container {
- border-top: 0px;
+ border-top: 0;
}
+
.dijitTabContainerLeft-tabs {
border-right: 1px solid black;
float: left;
}
.dijitTabContainerLeft-container {
- border-left: 0px;
+ border-left: 0;
}
+
.dijitTabContainerBottom-tabs {
border-top: 1px solid black;
}
.dijitTabContainerBottom-container {
- border-bottom: 0px;
+ border-bottom: 0;
}
+
.dijitTabContainerRight-tabs {
border-left: 1px solid black;
float: left;
}
.dijitTabContainerRight-container {
- border-right: 0px;
+ border-right: 0;
}
+
DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
cursor: auto;
}
+
.dijitTab {
position:relative;
cursor:pointer;
@@ -1115,107 +1345,147 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
z-index:3;
}
.dijitTab * {
-
+ /* make tab icons and close icon line up w/text */
vertical-align: middle;
}
.dijitTabChecked {
- cursor: default;
+ cursor: default; /* because clicking will have no effect */
}
+
.dijitTabContainerTop-tabs .dijitTab {
- top: 1px;
+ top: 1px; /* to overlap border on .dijitTabContainerTop-tabs */
}
.dijitTabContainerBottom-tabs .dijitTab {
- top: -1px;
+ top: -1px; /* to overlap border on .dijitTabContainerBottom-tabs */
}
.dijitTabContainerLeft-tabs .dijitTab {
- left: 1px;
+ left: 1px; /* to overlap border on .dijitTabContainerLeft-tabs */
}
.dijitTabContainerRight-tabs .dijitTab {
- left: -1px;
+ left: -1px; /* to overlap border on .dijitTabContainerRight-tabs */
}
+
+
.dijitTabContainerTop-tabs .dijitTab,
.dijitTabContainerBottom-tabs .dijitTab {
-
- display:inline-block;
- #zoom: 1;
- #display:inline;
+ /* Inline-block */
+ display:inline-block; /* webkit and FF3 */
+ #zoom: 1; /* set hasLayout:true to mimic inline-block */
+ #display:inline; /* don't use .dj_ie since that increases the priority */
}
+
.dijitTabInnerDiv {
position:relative;
}
+
+
.tabStripButton {
z-index: 12;
}
+
.dijitTabButtonDisabled .tabStripButton {
display: none;
}
+
+
.dijitTabCloseButton {
margin-left: 1em;
}
+
.dijitTabCloseText {
display:none;
}
+
+.dijitTab .tabLabel {
+ /* make sure tabs w/close button and w/out close button are same height, even w/small (<15px) font.
+ * assumes <=15px height for close button icon.
+ */
+ min-height: 15px;
+ display: inline-block;
+}
+.dijitNoIcon {
+ /* applied to <img>/<span> node when there is no icon specified */
+ display: none;
+}
+.dj_ie6 .dijitTab .dijitNoIcon {
+ /* because min-height (on .tabLabel, above) doesn't work on IE6 */
+ display: inline;
+ height: 15px;
+ width: 1px;
+}
+
+/* images off, high-contrast mode styles */
+
.dijit_a11y .dijitTabCloseButton {
background-image: none !important;
width: auto !important;
height: auto !important;
- border: thin dotted;
-}
-.dijit_a11y .dijitTabCloseButtonHover {
- border:thin solid;
}
+
.dijit_a11y .dijitTabCloseText {
display: inline;
}
-.dijit_a11y .dijitTabChecked {
-
- border-style:dashed !important;
-}
-.dijit_a11y .dijitTabInnerDiv {
- border-left:none !important;
- }
+
.dijitTabPane,
.dijitStackContainer-child,
.dijitAccordionContainer-child {
-
+ /* children of TabContainer, StackContainer, and AccordionContainer shouldn't have borders
+ * b/c a border is already there from the TabContainer/StackContainer/AccordionContainer itself.
+ */
border: none !important;
}
+
+/* InlineEditBox */
.dijitInlineEditBoxDisplayMode {
- border: 1px solid transparent;
+ border: 1px solid transparent; /* so keyline (border) on hover can appear without screen jump */
cursor: text;
}
+
.dijit_a11y .dijitInlineEditBoxDisplayMode,
.dj_ie6 .dijitInlineEditBoxDisplayMode {
-
+ /* except that IE6 doesn't support transparent borders, nor does high contrast mode */
border: none;
}
+
.dijitInlineEditBoxDisplayModeHover,
.dijit_a11y .dijitInlineEditBoxDisplayModeHover,
.dj_ie6 .dijitInlineEditBoxDisplayModeHover {
-
+ /* An InlineEditBox in view mode (click this to edit the text) */
background-color: #e2ebf2;
border: solid 1px black;
}
+
.dijitInlineEditBoxDisplayModeDisabled {
cursor: default;
}
+
+/* Tree */
+.dijitTree {
+ overflow: auto; /* for scrollbars when Tree has a height setting, and to prevent wrapping around float elements, see #11491 */
+}
+
.dijitTreeIndent {
-
+ /* amount to indent each tree node (relative to parent node) */
width: 19px;
}
+
.dijitTreeRow, .dijitTreeContent {
white-space: nowrap;
}
+
.dijitTreeRow img {
-
+ /* make the expando and folder icons line up with the label */
vertical-align: middle;
}
+
.dijitTreeContent {
cursor: default;
}
+
.dijitExpandoText {
display: none;
}
+
.dijit_a11y .dijitExpandoText {
display: inline;
padding-left: 10px;
@@ -1225,14 +1495,19 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
border-width: thin;
cursor: pointer;
}
+
.dijitTreeLabel {
- margin: 0px 4px;
+ margin: 0 4px;
}
+
+/* Dialog */
+
.dijitDialog {
position: absolute;
z-index: 999;
- overflow: hidden;
+ overflow: hidden; /* override overflow: auto; from ContentPane to make dragging smoother */
}
+
.dijitDialogTitleBar {
cursor: move;
}
@@ -1250,38 +1525,49 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
display: none;
background: transparent !important;
}
+
.dijitDialogUnderlay {
background: #eee;
opacity: 0.5;
}
+
.dj_ie .dijitDialogUnderlay {
filter: alpha(opacity=50);
}
+
+/* images off, high-contrast mode styles */
.dijit_a11y .dijitSpinnerButtonContainer,
.dijit_a11y .dijitDialog {
opacity: 1 !important;
background-color: white !important;
}
+
.dijitDialog .closeText {
display:none;
-
+ /* for the onhover border in high contrast on IE: */
position:absolute;
}
+
.dijit_a11y .dijitDialog .closeText {
display:inline;
}
+
+/* Slider */
+
.dijitSliderMoveable {
z-index:99;
position:absolute !important;
display:block;
vertical-align:middle;
}
+
.dijitSliderMoveableH {
right:0;
}
.dijitSliderMoveableV {
right:50%;
}
+
.dijit_a11y DIV.dijitSliderImageHandle,
.dijitSliderImageHandle {
margin:0;
@@ -1296,177 +1582,217 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
font-size: 0;
}
.dj_ie7 .dijitSliderImageHandle {
- overflow: hidden;
+ overflow: hidden; /* IE7 workaround to make slider handle VISIBLE in non-a11y mode */
}
.dj_ie7 .dijit_a11y .dijitSliderImageHandle {
- overflow: visible;
+ overflow: visible; /* IE7 workaround to make slider handle VISIBLE in a11y mode */
}
.dijit_a11y .dijitSliderFocused .dijitSliderImageHandle {
border:4px solid #000;
height:8px;
width:8px;
}
+
.dijitSliderImageHandleV {
top:-8px;
right: -50%;
}
+
.dijitSliderImageHandleH {
left:50%;
top:-5px;
vertical-align:top;
}
+
.dijitSliderBar {
border-style:solid;
border-color:black;
cursor: pointer;
}
+
.dijitSliderBarContainerV {
position:relative;
height:100%;
z-index:1;
}
+
.dijitSliderBarContainerH {
position:relative;
z-index:1;
}
+
.dijitSliderBarH {
height:4px;
border-width:1px 0;
}
+
.dijitSliderBarV {
width:4px;
border-width:0 1px;
}
+
.dijitSliderProgressBar {
background-color:red;
z-index:1;
}
+
.dijitSliderProgressBarV {
position:static !important;
- height:0%;
+ height:0;
vertical-align:top;
text-align:left;
}
+
.dijitSliderProgressBarH {
position:absolute !important;
- width:0%;
+ width:0;
vertical-align:middle;
overflow:visible;
}
+
.dijitSliderRemainingBar {
overflow:hidden;
background-color:transparent;
z-index:1;
}
+
.dijitSliderRemainingBarV {
height:100%;
text-align:left;
}
+
.dijitSliderRemainingBarH {
width:100% !important;
}
+
+/* the slider bumper is the space consumed by the slider handle when it hangs over an edge */
.dijitSliderBumper {
overflow:hidden;
z-index:1;
}
+
.dijitSliderBumperV {
width:4px;
height:8px;
border-width:0 1px;
}
+
.dijitSliderBumperH {
width:8px;
height:4px;
border-width:1px 0;
}
+
.dijitSliderBottomBumper,
.dijitSliderLeftBumper {
background-color:red;
}
+
.dijitSliderTopBumper,
.dijitSliderRightBumper {
background-color:transparent;
}
+
.dijitSliderDecoration {
text-align:center;
}
-.dijitSliderV TD {
- position: relative;
+
+.dijitSliderDecorationC,
+.dijitSliderDecorationV {
+ position: relative; /* needed for IE+quirks+RTL+vertical (rendering bug) but add everywhere for custom styling consistency but this messes up IE horizontal sliders */
}
+
.dijitSliderDecorationH {
width: 100%;
}
+
.dijitSliderDecorationV {
height: 100%;
}
+
.dijitSliderButton {
font-family:monospace;
margin:0;
padding:0;
display:block;
}
+
.dijit_a11y .dijitSliderButtonInner {
visibility:visible !important;
}
+
.dijitSliderButtonContainer {
text-align:center;
- height:0;
+ height:0; /* ??? */
}
.dijitSliderButtonContainer * {
cursor: pointer;
}
+
.dijitSlider .dijitButtonNode {
padding:0;
display:block;
}
+
.dijitRuleContainer {
position:relative;
overflow:visible;
}
+
.dijitRuleContainerV {
height:100%;
line-height:0;
float:left;
text-align:left;
}
+
.dj_opera .dijitRuleContainerV {
line-height:2%;
}
+
.dj_ie .dijitRuleContainerV {
line-height:normal;
}
+
.dj_gecko .dijitRuleContainerV {
- margin:0 0 1px 0;
+ margin:0 0 1px 0; /* mozilla bug workaround for float:left,height:100% block elements */
}
+
.dijitRuleMark {
position:absolute;
border:1px solid black;
line-height:0;
height:100%;
}
+
.dijitRuleMarkH {
width:0;
border-top-width:0 !important;
border-bottom-width:0 !important;
border-left-width:0 !important;
}
+
.dijitRuleLabelContainer {
position:absolute;
}
+
.dijitRuleLabelContainerH {
text-align:center;
display:inline-block;
}
+
.dijitRuleLabelH {
position:relative;
left:-50%;
}
+
.dijitRuleLabelV {
-
+ /* so that long labels don't overflow to multiple rows, or overwrite slider itself */
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
+
.dijitRuleMarkV {
height:0;
border-right-width:0 !important;
@@ -1475,9 +1801,11 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
width:100%;
left:0;
}
+
.dj_ie .dijitRuleLabelContainerV {
margin-top:-.55em;
}
+
.dijit_a11y .dijitSliderReadOnly,
.dijit_a11y .dijitSliderDisabled {
opacity:0.6;
@@ -1486,70 +1814,100 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
.dj_ie .dijit_a11y .dijitSliderDisabled .dijitSliderBar {
filter: alpha(opacity=40);
}
+
+/* + and - Slider buttons: override theme settings to display icons */
.dijit_a11y .dijitSlider .dijitSliderButtonContainer DIV {
- font-family: monospace;
+ font-family: monospace; /* otherwise hyphen is larger and more vertically centered */
font-size: 1em;
line-height: 1em;
height: auto;
width: auto;
- margin: 0px 4px;
+ margin: 0 4px;
}
+
+/* Icon-only buttons (often in toolbars) still display the text in high-contrast mode */
.dijit_a11y .dijitButtonContents .dijitButtonText,
.dijit_a11y .dijitTab .tabLabel {
display: inline !important;
}
+
+/* TextArea, SimpleTextArea */
.dijitTextArea {
width:100%;
- overflow-y: auto;
+ overflow-y: auto; /* w/out this IE's SimpleTextArea goes to overflow: scroll */
}
.dijitTextArea[cols] {
- width:auto;
+ width:auto; /* SimpleTextArea cols */
}
.dj_ie .dijitTextAreaCols {
width:auto;
}
+
+.dijitExpandingTextArea {
+ /* for auto exanding textarea (called Textarea currently, rename for 2.0) don't want to display the grip to resize */
+ resize: none;
+}
+
+
+/* Toolbar
+ * Note that other toolbar rules (for objects in toolbars) are scattered throughout this file.
+ */
+
.dijitToolbarSeparator {
height: 18px;
width: 5px;
padding: 0 1px;
margin: 0;
}
+
+/* Editor */
.dijitIEFixedToolbar {
position:absolute;
-
+ /* top:0; */
top: expression(eval((document.documentElement||document.body).scrollTop));
}
+
.dijitEditor {
- display: block;
+ display: block; /* prevents glitch on FF with InlineEditBox, see #8404 */
}
+
.dijitEditorDisabled,
.dijitEditorReadOnly {
color: gray;
}
+
+/* TimePicker */
+
.dijitTimePickerItemInner {
text-align:center;
border:0;
padding:2px 8px 2px 8px;
}
+
.dijitTimePickerTick,
.dijitTimePickerMarker {
border-bottom:1px solid gray;
}
+
.dijitTimePicker .dijitDownArrowButton {
border-top: none !important;
}
+
.dijitTimePickerTick {
color:#CCC;
}
+
.dijitTimePickerMarker {
color:black;
background-color:#CCC;
}
+
.dijitTimePickerItemSelected {
font-weight:bold;
color:#333;
background-color:#b7cdee;
}
+
.dijitTimePickerItemHover {
background-color:gray;
color:white;
@@ -1561,8 +1919,10 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
.dijit_a11y .dijitTimePickerItemHover .dijitTimePickerItemInner {
border: dashed 4px black;
}
+
+
.dijitToggleButtonIconChar {
-
+ /* character (instead of icon) to show that ToggleButton is checked */
display:none !important;
}
.dijit_a11y .dijitToggleButton .dijitToggleButtonIconChar {
@@ -1570,22 +1930,26 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
visibility:hidden;
}
.dj_ie6 .dijitToggleButtonIconChar, .dj_ie6 .tabStripButton .dijitButtonText {
- font-family: "Arial Unicode MS";
+ font-family: "Arial Unicode MS"; /* otherwise the a11y character (checkmark, arrow, etc.) appears as a box */
}
.dijit_a11y .dijitToggleButtonChecked .dijitToggleButtonIconChar {
- display: inline !important;
+ display: inline !important; /* In high contrast mode, display the check symbol */
visibility:visible !important;
}
+
.dijitArrowButtonChar {
display:none !important;
}
.dijit_a11y .dijitArrowButtonChar {
display:inline !important;
}
+
.dijit_a11y .dijitDropDownButton .dijitArrowButtonInner,
.dijit_a11y .dijitComboButton .dijitArrowButtonInner {
display:none !important;
}
+
+/* Select */
.dijitSelect {
margin: 0.2em;
border-collapse: collapse;
@@ -1593,7 +1957,7 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
.dj_ie .dijitSelect,
.dj_ie7 .dijitSelect,
.dj_iequirks .dijitSelect {
- vertical-align: middle;
+ vertical-align: middle; /* Set this back for what we hack in dijit inline */
}
.dj_ie8 .dijitSelect .dijitButtonText {
vertical-align: top;
@@ -1611,7 +1975,7 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
color:#999 !important;
}
.dijitSelect .dijitButtonContents {
- padding: 0px;
+ padding: 0;
background: transparent none;
white-space: nowrap;
text-align: left;
@@ -1619,36 +1983,50 @@ DIV.dijitTabDisabled, .dj_ie DIV.dijitTabDisabled {
.dijitSelectFixedWidth .dijitButtonContents {
width: 100%;
}
+
.dijitSelectMenu .dijitMenuItemIcon {
-
+ /* avoid blank area in left side of menu (since we have no icons) */
display:none;
}
.dj_ie6 .dijitSelectMenu .dijitMenuItemLabel,
.dj_ie7 .dijitSelectMenu .dijitMenuItemLabel {
-
+ /* Set back to static due to bug in ie6/ie7 - See Bug #9651 */
position: static;
}
+
+/* Fix the baseline of our label (for multi-size font elements) */
.dijitSelectLabel *
{
vertical-align: baseline;
}
+
+/* Styling for the currently-selected option (rich text can mess this up) */
.dijitSelectSelectedOption * {
font-weight: bold;
}
+
+/* Fix the styling of the dropdown menu to be more combobox-like */
.dijitSelectMenu {
border-width: 1px;
}
+
+/* Style the different areas of the button to look like a "real" dropdown */
+/* Remove margins on the sub-table */
.dijitSelectMenu .dijitMenuTable {
- margin: 0px;
+ margin: 0;
background-color: transparent;
}
+
+/* Used in cases, such as FullScreen plugin, when we need to force stuff to static positioning. */
.dijitForceStatic {
position: static !important;
}
+
+/**** Disabled cursor *****/
.dijitReadOnly *,
.dijitDisabled *,
.dijitReadOnly,
.dijitDisabled {
-
+ /* a region the user would be able to click on, but it's disabled */
cursor: default;
}
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-02 08:15:54 +0000