with a size and border */
border: 0 !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;
margin-right: 0 !important;
}
.dj_a11y .dijitTextBox input {
margin: 0 !important;
}
.dijitValidationTextBoxError input.dijitValidationInner,
.dijitSelect input,
.dijitTextBox input.dijitArrowButtonInner {
/* 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: -2em !important;
direction: ltr !important;
text-align: left !important;
height: auto !important;
}
.dj_ie .dijitSelect input,
.dj_ie .dijitTextBox input,
.dj_ie input.dijitTextBox {
overflow-y: visible; /* inputs need help expanding when padding is added or line-height is adjusted */
line-height: normal; /* strict mode */
}
.dijitSelect .dijitSelectLabel span {
line-height: 100%;
}
.dj_ie .dijitSelect .dijitSelectLabel {
line-height: normal;
}
.dj_ie6 .dijitSelect .dijitSelectLabel,
.dj_ie7 .dijitSelect .dijitSelectLabel,
.dj_ie8 .dijitSelect .dijitSelectLabel,
.dj_iequirks .dijitSelect .dijitSelectLabel,
.dijitSelect td,
.dj_ie6 .dijitSelect input,
.dj_iequirks .dijitSelect input,
.dj_ie6 .dijitSelect .dijitValidationContainer,
.dj_ie6 .dijitTextBox input,
.dj_ie6 input.dijitTextBox,
.dj_iequirks .dijitTextBox input.dijitValidationInner,
.dj_iequirks .dijitTextBox input.dijitArrowButtonInner,
.dj_iequirks .dijitTextBox input.dijitSpinnerButtonInner,
.dj_iequirks .dijitTextBox input.dijitInputInner,
.dj_iequirks input.dijitTextBox {
line-height: 100%; /* IE7 problem where the icon is vertically way too low w/o this */
}
.dj_a11y input.dijitValidationInner,
.dj_a11y input.dijitArrowButtonInner {
/* (in high contrast mode) revert rules from above so character displays */
text-indent: 0 !important;
width: 1em !important;
color: black !important;
}
.dijitValidationTextBoxError .dijitValidationContainer {
display: inline;
cursor: default;
}
/* ComboBox & Spinner */
.dijitSpinner .dijitSpinnerButtonContainer,
.dijitComboBox .dijitArrowButtonContainer {
/* 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 */
}
.dj_a11y .dijitSelect .dijitArrowButtonContainer,
.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
- ... 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 .dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitButtonNode {
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;
overflow: hidden;
}
.dijitSpinner .dijitSpinnerButtonInner {
width: 1em;
visibility: hidden !important; /* just a sizing element */
overflow-x: hidden;
}
.dijitComboBox .dijitButtonNode,
.dijitSpinnerButtonContainer .dijitButtonNode {
border-width: 0;
}
.dj_a11y .dijitSpinnerButtonContainer .dijitButtonNode {
border-width: 0px !important;
border-style: solid !important;
}
.dj_a11y .dijitTextBox .dijitSpinnerButtonContainer,
.dj_a11y .dijitSpinner .dijitArrowButtonInner,
.dj_a11y .dijitSpinnerButtonContainer input {
width: 1em !important;
}
.dj_a11y .dijitSpinner .dijitArrowButtonInner {
margin: 0 auto !important; /* should auto-center */
}
.dj_ie .dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
padding-left: 0.3em !important;
padding-right: 0.3em !important;
margin-left: 0.3em !important;
margin-right: 0.3em !important;
width: 1.4em !important;
}
.dj_ie7 .dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
padding-left: 0 !important; /* manually center INPUT: character is .5em and total width = 1em */
padding-right: 0 !important;
width: 1em !important;
}
.dj_ie6 .dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
margin-left: 0.1em !important;
margin-right: 0.1em !important;
width: 1em !important;
}
.dj_iequirks .dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
margin-left: 0 !important;
margin-right: 0 !important;
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;
float: none;
height: 50%;
width: 100%;
bottom: auto;
left: 0;
right: auto;
}
.dj_iequirks .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
width: auto;
}
.dj_a11y .dijitSpinnerButtonContainer .dijitArrowButton {
overflow: visible !important;
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitDownArrowButton {
top: 50%;
border-top-width: 1px !important;
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitUpArrowButton {
top: 0;
}
.dijitSpinner .dijitArrowButtonInner {
margin: auto;
overflow-x: hidden;
height: 100% !important;
}
.dj_iequirks .dijitSpinner .dijitArrowButtonInner {
height: auto !important;
}
.dijitSpinner .dijitArrowButtonInner .dijitInputField {
transform: scale(0.5);
transform-origin: left top;
padding-top: 0;
padding-bottom: 0;
padding-left: 0 !important;
padding-right: 0 !important;
width: 100%;
visibility: hidden;
}
.dj_ie .dijitSpinner .dijitArrowButtonInner .dijitInputField {
zoom: 50%; /* emulate transform: scale(0.5) */
}
.dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButtonInner {
overflow: hidden;
}
.dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
width: 100%;
}
.dj_iequirks .dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
width: 1em; /* matches .dj_a11y .dijitTextBox .dijitSpinnerButtonContainer rule - 100% is the whole screen width in quirks */
}
.dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
vertical-align: top;
visibility: visible;
}
.dj_a11y .dijitSpinnerButtonContainer {
width: 1em;
}
/****
dijit.form.CheckBox
&
dijit.form.RadioButton
****/
.dijitCheckBox,
.dijitRadio,
.dijitCheckBoxInput {
padding: 0;
border: 0;
width: 16px;
height: 16px;
background-position: center center;
background-repeat: no-repeat;
overflow: hidden;
}
.dijitCheckBox input,
.dijitRadio input {
margin: 0;
padding: 0;
display: block;
}
.dijitCheckBoxInput {
/* place the actual input on top, but invisible */
opacity: 0;
}
.dj_ie .dijitCheckBoxInput {
filter: alpha(opacity=0);
}
.dj_a11y .dijitCheckBox,
.dj_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;
}
.dj_a11y .dijitCheckBoxInput {
opacity: 1;
filter: none;
width: auto;
height: auto;
}
.dj_a11y .dijitFocusedLabel {
/* for checkboxes or radio buttons in high contrast mode, use border rather than outline to indicate focus (outline does not work in FF)*/
border: 1px dotted;
outline: 0px !important;
}
/****
dijit.ProgressBar
****/
.dijitProgressBar {
z-index: 0; /* so z-index settings below have no effect outside of the ProgressBar */
}
.dijitProgressBarEmpty {
/* outer container and background of the bar that's not finished yet*/
position: relative;
overflow: hidden;
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;
top: 0;
width: 100%;
}
.dj_ie6 .dijitProgressBarFull {
height: 1.6em;
}
.dijitProgressBarTile {
/* inner container for finished portion */
position: absolute;
overflow: hidden;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: 0;
padding: 0;
width: 100%; /* needed for IE/quirks */
height: auto;
background-color: #aaa;
background-attachment: fixed;
}
.dj_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 .dijitProgressBarTile {
/* animated gif for 'indeterminate' mode */
}
.dijitProgressBarIndeterminateHighContrastImage {
display: none;
}
.dj_a11y .dijitProgressBarIndeterminate .dijitProgressBarIndeterminateHighContrastImage {
display: block;
position: absolute;
top: 0;
bottom: 0;
margin: 0;
padding: 0;
width: 100%;
height: auto;
}
.dijitProgressBarLabel {
display: block;
position: static;
width: 100%;
text-align: center;
background-color: transparent !important;
}
/****
dijit.Tooltip
****/
.dijitTooltip {
position: absolute;
z-index: 2000;
display: block;
/* 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;
}
.dj_a11y .dijitTooltipConnector {
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;
}
.dijitAlignTop,
.dijitAlignBottom,
.dijitAlignLeft,
.dijitAlignRight {
position: absolute;
overflow: hidden;
}
body .dijitAlignClient {
position: absolute;
}
/*
* BorderContainer
*
* .dijitBorderContainer is a stylized layout where panes have border and margin.
* .dijitBorderContainerNoGutter is a raw layout.
*/
.dijitBorderContainer,
.dijitBorderContainerNoGutter {
position: relative;
overflow: hidden;
z-index: 0; /* so z-index settings below have no effect outside of the BorderContainer */
}
.dijitBorderContainerPane,
.dijitBorderContainerNoGutterPane {
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; /* 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; /* 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; /* 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;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.dijitSplitterCoverActive {
z-index: 3 !important;
}
/* #6945: stop mouse events */
.dj_ie .dijitSplitterCover {
background: white;
opacity: 0;
}
.dj_ie6 .dijitSplitterCover,
.dj_ie7 .dijitSplitterCover,
.dj_ie8 .dijitSplitterCover {
filter: alpha(opacity=0);
}
.dijitSplitterH {
height: 7px;
border-top: 1px;
border-bottom: 1px;
cursor: row-resize;
-webkit-tap-highlight-color: transparent;
}
.dijitSplitterV {
width: 7px;
border-left: 1px;
border-right: 1px;
cursor: col-resize;
-webkit-tap-highlight-color: transparent;
}
.dijitSplitContainer {
position: relative;
overflow: hidden;
display: block;
}
.dijitSplitPane {
position: absolute;
}
.dijitSplitContainerSizerH,
.dijitSplitContainerSizerV {
position: absolute;
font-size: 1px;
background-color: ThreeDFace;
border: 1px solid;
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 {
font-size: 1px;
background-color: ThreeDShadow;
opacity: 0.5;
margin: 0;
}
.dijitSplitContainerSizerH,
.dijitSplitContainerVirtualSizerH {
cursor: col-resize;
}
.dijitSplitContainerSizerV,
.dijitSplitContainerVirtualSizerV {
cursor: row-resize;
}
.dj_a11y .dijitSplitterH {
border-top: 1px solid #d3d3d3 !important;
border-bottom: 1px solid #d3d3d3 !important;
}
.dj_a11y .dijitSplitterV {
border-left: 1px solid #d3d3d3 !important;
border-right: 1px solid #d3d3d3 !important;
}
/* ContentPane */
.dijitContentPane {
display: block;
overflow: auto; /* if we don't have this (or overflow:hidden), then Widget.resizeTo() doesn't make sense for ContentPane */
-webkit-overflow-scrolling: touch;
}
.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;
}
.dijitContentPaneLoading .dijitIconLoading,
.dijitContentPaneError .dijitIconError {
margin-right: 9px;
}
/* TitlePane and Fieldset */
.dijitTitlePane {
display: block;
overflow: hidden;
}
.dijitFieldset {
border: 1px solid gray;
}
.dijitTitlePaneTitle,
.dijitFieldsetTitle {
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
.dijitTitlePaneTitleFixedOpen,
.dijitTitlePaneTitleFixedClosed,
.dijitFieldsetTitleFixedOpen,
.dijitFieldsetTitleFixedClosed {
/* TitlePane or Fieldset that cannot be toggled */
cursor: default;
}
.dijitTitlePaneTitle * {
vertical-align: middle;
}
.dijitTitlePane .dijitArrowNodeInner,
.dijitFieldset .dijitArrowNodeInner {
/* normally, hide arrow text in favor of icon */
display: none;
}
.dj_a11y .dijitTitlePane .dijitArrowNodeInner,
.dj_a11y .dijitFieldset .dijitArrowNodeInner {
/* ... except in a11y mode, then show text arrow */
display: inline;
font-family: monospace; /* because - and + are different widths */
}
.dj_a11y .dijitTitlePane .dijitArrowNode,
.dj_a11y .dijitFieldset .dijitArrowNode {
/* ... and hide icon (TODO: just point dijitIcon class on the icon, and it hides automatically) */
display: none;
}
.dijitTitlePaneTitleFixedOpen .dijitArrowNode,
.dijitTitlePaneTitleFixedOpen .dijitArrowNodeInner,
.dijitTitlePaneTitleFixedClosed .dijitArrowNode,
.dijitTitlePaneTitleFixedClosed .dijitArrowNodeInner,
.dijitFieldsetTitleFixedOpen .dijitArrowNode,
.dijitFieldsetTitleFixedOpen .dijitArrowNodeInner,
.dijitFieldsetTitleFixedClosed .dijitArrowNode,
.dijitFieldsetTitleFixedClosed .dijitArrowNodeInner {
/* don't show the open close icon or text arrow; it makes the user think the pane is closable */
display: none !important; /* !important to override above a11y rules to show text arrow */
}
.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;
}
.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;
outline: 0;
border-collapse: separate;
}
.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 {
/*