You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
13257 lines
341 KiB
CSS
13257 lines
341 KiB
CSS
/* RTL files */
|
|
|
|
/* dijit */
|
|
|
|
/* layout */
|
|
|
|
/* dijit */
|
|
|
|
/* not in flat theme */
|
|
/* dijit base */
|
|
|
|
/* dijit */
|
|
|
|
/* layout */
|
|
|
|
/* form */
|
|
|
|
/* icons */
|
|
|
|
/* rtl */
|
|
.flat .dijitToolbar .dijitToggleButtonRtl,
|
|
.flat .dijitToolbar .dijitButtonRtl,
|
|
.flat .dijitToolbar .dijitDropDownButtonRtl,
|
|
.flat .dijitToolbar .dijitComboButtonRtl {
|
|
margin-left: 4px;
|
|
margin-right: auto;
|
|
}
|
|
.flat .dijitToolbar .dijitDropDownButtonRtl .dijitArrowButtonInner {
|
|
margin-left: auto;
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs .dijitTabRtl,
|
|
.flat .dijitTabContainerBottom-tabs .dijitTabRtl {
|
|
margin-right: 0;
|
|
margin-left: -1px;
|
|
}
|
|
.flat .dijitTabControllerRtl,
|
|
.flat .dijitTabControllerRtl .nowrapTabStrip {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitTabRtl .dijitTabCloseButton {
|
|
margin-left: 0;
|
|
margin-right: 4px;
|
|
}
|
|
/* BorderContainer
|
|
|
|
Splitters and gutters separate panes within a BorderContainer. Splitters can be moved up and down (horizonal splitters) or left and right (vertical splitters), while Gutters are static. A "thumb" is the slit on a Splitter that indicates it is movable.
|
|
|
|
Styling the BorderContainer widget consists of the following:
|
|
|
|
.dijitBorderContainer - for border and padding of the entire border container
|
|
|
|
.dijitSplitContainer-child, .dijitBorderContainer-child - for border or child panes of the border container. By default borders are put on all children of BorderContainer.
|
|
|
|
.dijitBorderContainer-dijitTabContainerTop,
|
|
.dijitBorderContainer-dijitTabContainerBottom,
|
|
.dijitBorderContainer-dijitTabContainerLeft,
|
|
.dijitBorderContainer-dijitTabContainerRight,
|
|
.dijitBorderContainer-dijitAccordionContainer -for border of the border containers within TabContainer or AccordionContainer widget
|
|
|
|
.dijitBorderContainer-dijitBorderContainer - for border and padding of nested BorderContainers
|
|
|
|
Splitters and gutters:
|
|
|
|
.dijitSplitterH, .dijitGutterH - for height, background, and border of a horizontal splitter and gutter
|
|
.dijitSplitterH .dijitSplitterThumb - for color, height/width of the thumb on a horizontal splitter
|
|
.dijitSplitterV, .dijitGutterV - - for height, background, and border of a vertical splitter and gutter
|
|
.dijitSplitterV .dijitSplitterThumb - for color, height/width of the thumb on a vertical splitter
|
|
.dijitSplitterHHover - for background-color of a hovered horizontal splitter
|
|
.dijitSplitterHHover .dijitSplitterThumb - for background-color of a hovered thumb on a horizontal splitter
|
|
.dijitSplitterVHover - for background-color of a hovered vertical splitter
|
|
.dijitSplitterVHover .dijitSplitterThumb - for background-color of a hovered thumb on a vertical splitter
|
|
.dijitSplitterHActive - for background-color of an active horizontal splitter
|
|
.dijitSplitterVActive - for background-color of an active horizontal splitter
|
|
*/
|
|
.flat .dijitBorderContainer {
|
|
/* matches the width of the splitters between panes */
|
|
padding: 5px;
|
|
}
|
|
.flat .dijitSplitContainer-child,
|
|
.flat .dijitBorderContainer-child {
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitBorderContainer-dijitTabContainerTop,
|
|
.flat .dijitBorderContainer-dijitTabContainerBottom,
|
|
.flat .dijitBorderContainer-dijitTabContainerLeft,
|
|
.flat .dijitBorderContainer-dijitTabContainerRight,
|
|
.flat .dijitBorderContainer-dijitAccordionContainer {
|
|
/* except that TabContainer defines borders on it's sub-nodes (tablist and dijitTabPaneWrapper),
|
|
* so override rule setting border on domNode
|
|
*/
|
|
border: none;
|
|
}
|
|
.flat .dijitBorderContainer-dijitBorderContainer {
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSplitterH,
|
|
.flat .dijitGutterH {
|
|
background: none;
|
|
border: 0;
|
|
height: 5px;
|
|
}
|
|
.flat .dijitSplitterH .dijitSplitterThumb {
|
|
background: #ccc;
|
|
height: 1px;
|
|
top: 2px;
|
|
width: 19px;
|
|
}
|
|
.flat .dijitSplitterV,
|
|
.flat .dijitGutterV {
|
|
background: none;
|
|
border: 0;
|
|
width: 5px;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitSplitterV .dijitSplitterThumb {
|
|
background: #ccc;
|
|
height: 19px;
|
|
left: 2px;
|
|
width: 1px;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitSplitterHHover,
|
|
.flat .dijitSplitterVHover {
|
|
font-size: 1px;
|
|
background: #f2f2f2;
|
|
}
|
|
.flat .dijitSplitterHHover .dijitSplitterThumb,
|
|
.flat .dijitSplitterVHover .dijitSplitterThumb {
|
|
background: #999;
|
|
}
|
|
.flat .dijitSplitterHActive,
|
|
.flat .dijitSplitterVActive {
|
|
font-size: 1px;
|
|
background: #f2f2f2;
|
|
}
|
|
.flat .dijitSplitterHActive .dijitSplitterThumb,
|
|
.flat .dijitSplitterVActive .dijitSplitterThumb {
|
|
background: #999;
|
|
}
|
|
/* TabContainer
|
|
*
|
|
* Styling TabContainer means styling the TabList and Its content container (dijitTitlePane)
|
|
*
|
|
* Tab List: (including 4 kinds of tab location)
|
|
* .dijitTabContainerTop-tabs - tablist container at top
|
|
* .dijitTabContainerBottom-tabs - tablist container at bottom
|
|
* .dijitTabContainerLeft-tabs - tablist container at left
|
|
* .dijitTabContainerRight-tabs - tablist container at right
|
|
*
|
|
* Tab Strip Button:
|
|
* .dijitTabStripIcon - tab strip button icon
|
|
* .dijitTabStripMenuIcon - down arrow icon position
|
|
* .dijitTabStripSlideLeftIcon - left arrow icon position
|
|
* .dijitTabStripSlideRightIcon - right arrow icon position
|
|
*
|
|
* .tabStripButtonDisabled - styles for disabled tab strip buttons
|
|
*
|
|
* Tab Button:
|
|
* .dijitTabContainerTop-tabs .dijitTab - styles for top tab button container
|
|
* .dijitTabContainerBottom-tabs .dijitTab - styles for bottom tab button container
|
|
* .dijitTabContainerLeft-tabs .dijitTab - styles for left tab button container
|
|
* .dijitTabContainerRight-tabs .dijitTab - styles for right tab button container
|
|
*
|
|
* .dijitTabContainerTop-tabs .dijitTabChecked .dijitTab
|
|
* - styles for selected status of top tab button
|
|
* same to Bottom, Left, Right Tabs
|
|
*
|
|
* .dijitTabHover .dijitTab - styles when mouse hover on tab buttons
|
|
* .dijitTabActive .dijitTab - styles when mouse down on tab buttons
|
|
* .dijitTabChecked .dijitTab - styles when on buttons of selected tab
|
|
*
|
|
* .dijitTabCloseButton - the close action buttons lie at the right top of each tab button on closable tabs
|
|
* .dijitTabCloseButtonHover - styles when mouse hover on close action button
|
|
* .dijitTabCloseButtonActive - styles when mouse down on close action button
|
|
*
|
|
* Tab Button: (checked status)
|
|
*
|
|
* Tab Content Container:
|
|
* .dijitTabContainerTop-dijitContentPane
|
|
* .dijitTabContainerBottom-dijitContentPane
|
|
* .dijitTabContainerLeft-dijitContentPane
|
|
* .dijitTabContainerRight-dijitContentPane - for background and padding
|
|
*
|
|
* Nested Tabs:
|
|
* .dijitTabContainerNested - Container for nested tabs
|
|
* .dijitTabContainerTabListNested - tab list container for nested tabs
|
|
*/
|
|
.flat .dijitTabContainer {
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitTabPaneWrapper {
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
margin: 0;
|
|
padding: 0;
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs,
|
|
.flat .dijitTabContainerBottom-tabs,
|
|
.flat .dijitTabContainerLeft-tabs,
|
|
.flat .dijitTabContainerRight-tabs {
|
|
border: none;
|
|
}
|
|
.flat .dijitTabSpacer {
|
|
display: none;
|
|
}
|
|
.flat .dijitTab {
|
|
border: 1px solid transparent;
|
|
background-color: #fff;
|
|
text-align: center;
|
|
-webkit-transition-property: background, padding, margin;
|
|
-moz-transition-property: background, padding, margin;
|
|
-o-transition-property: background, padding, margin;
|
|
-ms-transition-property: background, padding, margin;
|
|
transition-property: background, padding, margin;
|
|
-webkit-transition-duration: 0.2s;
|
|
-moz-transition-duration: 0.2s;
|
|
-o-transition-duration: 0.2s;
|
|
-ms-transition-duration: 0.2s;
|
|
transition-duration: 0.2s;
|
|
-webkit-transition-timing-function: ease;
|
|
-moz-transition-timing-function: ease;
|
|
-o-transition-timing-function: ease;
|
|
-ms-transition-timing-function: ease;
|
|
transition-timing-function: ease;
|
|
position: relative;
|
|
z-index: 0;
|
|
}
|
|
.flat .dijitTab:before {
|
|
content: "";
|
|
display: block;
|
|
position: absolute;
|
|
}
|
|
.flat .dijitTabHover {
|
|
background-color: #f2f2f2;
|
|
}
|
|
.flat .dijitTabActive {
|
|
background-color: #e6e6e6;
|
|
}
|
|
.flat .dijitTabChecked {
|
|
border: 1px solid #ccc;
|
|
z-index: 1;
|
|
}
|
|
.flat .dijitTabChecked.dijitTabHover,
|
|
.flat .dijitTabChecked.dijitTabActive {
|
|
border: 1px solid #ccc;
|
|
background-color: #fff;
|
|
color: #424242;
|
|
}
|
|
.flat .dijitTabDisabled {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .tabStripButton {
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
.flat .dijitTabCloseButton {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
line-height: 1;
|
|
font-size: 1em;
|
|
vertical-align: middle;
|
|
margin-left: 4px;
|
|
opacity: 0.35;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=35)";
|
|
filter: alpha(opacity=35);
|
|
}
|
|
.flat .dijitTabCloseButton:before {
|
|
content: "\f00e";
|
|
}
|
|
.flat .dijitTabCloseButtonHover {
|
|
opacity: 0.75;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
|
|
filter: alpha(opacity=75);
|
|
}
|
|
.flat .dijitTabCloseButtonActive {
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs .dijitTab {
|
|
margin-right: 0;
|
|
padding: 6px 16px;
|
|
border-bottom-color: #ccc;
|
|
border-left: none;
|
|
border-right: none;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs .dijitTabChecked {
|
|
border-bottom: 1px solid #fff;
|
|
border-left: 1px solid #ccc;
|
|
border-right: 1px solid #ccc;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs .dijitTabChecked:before {
|
|
height: 3px;
|
|
background: #257aa7;
|
|
top: -1px;
|
|
left: -1px;
|
|
right: -1px;
|
|
}
|
|
.flat .dijitTabListContainer-top {
|
|
margin-top: 1px;
|
|
}
|
|
.flat .dijitTabListContainer-top .dijitTab {
|
|
top: 0;
|
|
}
|
|
.flat .dijitTabPaneWrapper.dijitTabContainerBottom-container {
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitTabContainerBottom-tabs .dijitTab {
|
|
margin-right: 0;
|
|
padding: 6px 16px;
|
|
border-top-color: #ccc;
|
|
border-left: none;
|
|
border-right: none;
|
|
}
|
|
.flat .dijitTabContainerBottom-tabs .dijitTabChecked {
|
|
border-top: 1px solid #fff;
|
|
border-left: 1px solid #ccc;
|
|
border-right: 1px solid #ccc;
|
|
}
|
|
.flat .dijitTabContainerBottom-tabs .dijitTabChecked:before {
|
|
height: 3px;
|
|
background: #257aa7;
|
|
bottom: -1px;
|
|
left: -1px;
|
|
right: -1px;
|
|
}
|
|
.flat .dijitTabListContainer-bottom {
|
|
margin-top: -1px;
|
|
}
|
|
.flat .dijitTabListContainer-bottom .dijitTab {
|
|
top: 0;
|
|
}
|
|
.flat .dijitTabPaneWrapper.dijitTabContainerLeft-container {
|
|
border-radius: 0 4px 4px 0;
|
|
}
|
|
.flat .dijitTabContainerLeft-tabs .dijitTab {
|
|
margin-bottom: 0;
|
|
padding: 8px 12px;
|
|
border-right-color: #ccc;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
.flat .dijitTabContainerLeft-tabs .dijitTabChecked {
|
|
border-right: 1px solid #fff;
|
|
border-top: 1px solid #ccc;
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
.flat .dijitTabContainerLeft-tabs .dijitTabChecked:before {
|
|
width: 3px;
|
|
background: #257aa7;
|
|
bottom: -1px;
|
|
left: -1px;
|
|
top: -1px;
|
|
}
|
|
.flat .dijitTabPaneWrapper.dijitTabContainerRight-container {
|
|
border-radius: 4px 0 0 4px;
|
|
}
|
|
.flat .dijitTabContainerRight-tabs .dijitTab {
|
|
margin-bottom: 0;
|
|
padding: 8px 12px;
|
|
border-left-color: #ccc;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
.flat .dijitTabContainerRight-tabs .dijitTabChecked {
|
|
border-left: 1px solid #fff;
|
|
border-top: 1px solid #ccc;
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
.flat .dijitTabContainerRight-tabs .dijitTabChecked:before {
|
|
width: 3px;
|
|
background: #257aa7;
|
|
bottom: -1px;
|
|
right: -1px;
|
|
top: -1px;
|
|
}
|
|
.flat .tabStripButton {
|
|
background-color: #fff;
|
|
border: 1px solid transparent;
|
|
-webkit-transition-property: background-color;
|
|
-moz-transition-property: background-color;
|
|
-o-transition-property: background-color;
|
|
-ms-transition-property: background-color;
|
|
transition-property: background-color;
|
|
}
|
|
.flat .dijitTabListContainer-top .tabStripButton,
|
|
.flat .dijitTabListContainer-bottom .tabStripButton {
|
|
padding: 4px 8px;
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
.flat .dijitTabListContainer-top .tabStripButton {
|
|
margin-bottom: 1px;
|
|
}
|
|
.flat .dijitTabListContainer-bottom .tabStripButton {
|
|
margin-top: 1px;
|
|
}
|
|
.flat .tabStripButtonHover {
|
|
background-color: #f2f2f2;
|
|
}
|
|
.flat .tabStripButtonActive {
|
|
background-color: #e6e6e6;
|
|
}
|
|
.flat .dijitTabStripIcon {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
color: #257aa7;
|
|
vertical-align: middle;
|
|
}
|
|
.flat .dijitTabStripIcon:before {
|
|
content: "\f004";
|
|
}
|
|
.flat .dijitTabStripSlideRightIcon:before {
|
|
content: "\f005";
|
|
}
|
|
.flat .dijitTabStripMenuIcon:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitTabListContainer-top .tabStripButtonDisabled,
|
|
.flat .dijitTabListContainer-bottom .tabStripButtonDisabled {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitTabContainerNested .dijitTabListWrapper {
|
|
height: auto;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTab {
|
|
color: #257aa7;
|
|
margin: 4px;
|
|
padding: 4px 8px;
|
|
border: 1px solid transparent;
|
|
border-radius: 4px;
|
|
-webkit-transition-property: background-color, border-color;
|
|
-moz-transition-property: background-color, border-color;
|
|
-o-transition-property: background-color, border-color;
|
|
-ms-transition-property: background-color, border-color;
|
|
transition-property: background-color, border-color;
|
|
-webkit-transition-duration: 0.3s;
|
|
-moz-transition-duration: 0.3s;
|
|
-o-transition-duration: 0.3s;
|
|
-ms-transition-duration: 0.3s;
|
|
transition-duration: 0.3s;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTabHover {
|
|
background-color: #f2f2f2;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTabActive {
|
|
color: #257aa7;
|
|
background-color: #e6e6e6;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked,
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked.dijitTabHover,
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked.dijitTabActive {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked:before,
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked.dijitTabHover:before,
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked.dijitTabActive:before {
|
|
display: none;
|
|
}
|
|
.flat .dijitTabContainerTabListNested.dijitTabContainerTop-tabs .dijitTab {
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitTabContainerTabListNested.dijitTabContainerBottom-tabs .dijitTab {
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitTabContainerTabListNested.dijitTabContainerLeft-tabs .dijitTab {
|
|
margin-bottom: 4px;
|
|
}
|
|
.flat .dijitTabContainerTabListNested.dijitTabContainerRight-tabs .dijitTab {
|
|
margin-bottom: 4px;
|
|
}
|
|
.flat .dijitTabPaneWrapperNested {
|
|
border: none; /* prevent double border */
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* ContentPane
|
|
*
|
|
* .dijitContentPane
|
|
* set padding for basic content pane
|
|
*
|
|
* Nested layouts:
|
|
*
|
|
* .dijitTabContainerTop-dijitContentPane,
|
|
* .dijitTabContainerLeft-dijitContentPane,
|
|
* .dijitTabContainerBottom-dijitContentPane,
|
|
* .dijitTabContainerRight-dijitContentPane
|
|
* set background-color and padding of ContentPanes nested within TabContainer (can do top, left, bottom, or right) or Accordion Container
|
|
*
|
|
* .dijitAccordionContainer-dijitContentPane
|
|
* set background-color and padding of ContentPane nested within Accordion
|
|
*
|
|
* .dijitSplitContainer-dijitContentPane,
|
|
* set background-color and padding of ContentPane nested within a SplitContainer
|
|
*
|
|
* .dijitBorderContainer-dijitContentPane
|
|
* set background-color and padding of ContentPane nested within a BorderContainer
|
|
*/
|
|
.flat .dijitContentPane {
|
|
background-color: #fff;
|
|
padding: 8px;
|
|
}
|
|
.flat .dijitTabContainerTop-dijitContentPane,
|
|
.flat .dijitTabContainerLeft-dijitContentPane,
|
|
.flat .dijitTabContainerBottom-dijitContentPane,
|
|
.flat .dijitTabContainerRight-dijitContentPane,
|
|
.flat .dijitAccordionContainer-dijitContentPane {
|
|
background-color: #fff;
|
|
padding: 8px;
|
|
left: 0 !important;
|
|
top: 0 !important;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp,
|
|
.flat .dijitAccordionTitle .arrowTextDown {
|
|
float: left;
|
|
}
|
|
/* Accordion
|
|
*
|
|
* Styling AccordionContainer basically means styling the accordion pane (dijitAccordionInnerContainer)
|
|
* and the title inside of it (dijitAccordionTitle). There are 4 basic states to style:
|
|
*
|
|
* 1. closed pane (and default styling):
|
|
* .dijitAccordionInnerContainer - container for each accordion child
|
|
* .dijitAccordionTitle - title for each accordion child
|
|
*
|
|
* 2. active closed pane (ie, mouse down on a title bar)
|
|
* .dijitAccordionInnerContainerActive - for background-color, border
|
|
* .dijitAccordionInnerContainerActive dijitAccordionTitle - for text color
|
|
*
|
|
* 3. open pane (expanded child)
|
|
* .dijitAccordionChildWrapper - wraps around the child widget (typically ContentPane)
|
|
* setting a margin so that there's blue trim all the way around the child
|
|
*
|
|
* These rules need to override the closed pane active:
|
|
*
|
|
* .dijitAccordionInnerContainerSelected - for background-color, border
|
|
* .dijitAccordionInnerContainerSelected .dijitAccordionTitle - for text color
|
|
*
|
|
* 4. hovered pane, open or closed
|
|
* The selectors below affect hovering over both a closed pane (ie, hovering a title bar),
|
|
* and hovering over an open pane. Also, treat mouse down on an open pane as a hover:
|
|
*
|
|
* .dijitAccordionInnerContainerHover, .dijitAccordionInnerContainerSelectedActive - for background-color, border
|
|
* .dijitAccordionInnerContainerHover .dijitAccordionTitle - for text color
|
|
*/
|
|
.flat .dijitAccordionContainer {
|
|
border: 0 none;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitAccordionInnerContainer {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
-webkit-transition-property: background-color, border;
|
|
-moz-transition-property: background-color, border;
|
|
-o-transition-property: background-color, border;
|
|
-ms-transition-property: background-color, border;
|
|
transition-property: background-color, border;
|
|
-webkit-transition-duration: 0.3s;
|
|
-moz-transition-duration: 0.3s;
|
|
-o-transition-duration: 0.3s;
|
|
-ms-transition-duration: 0.3s;
|
|
transition-duration: 0.3s;
|
|
-webkit-transition-timing-function: linear;
|
|
-moz-transition-timing-function: linear;
|
|
-o-transition-timing-function: linear;
|
|
-ms-transition-timing-function: linear;
|
|
transition-timing-function: linear;
|
|
}
|
|
.flat .dijitAccordionInnerContainer +.dijitAccordionInnerContainer {
|
|
margin-top: 0;
|
|
position: relative;
|
|
}
|
|
.flat .dijitAccordionTitle {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
border: 0 none;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp,
|
|
.flat .dijitAccordionTitle .arrowTextDown {
|
|
display: none;
|
|
float: right;
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
text-align: center;
|
|
font-size: 0px;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp:before,
|
|
.flat .dijitAccordionTitle .arrowTextDown:before {
|
|
content: "\f007";
|
|
font-size: 18px;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp {
|
|
display: block;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitAccordionInnerContainerHover .dijitAccordionTitle {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitAccordionInnerContainerActive .dijitAccordionTitle {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitAccordionInnerContainerSelected {
|
|
border: 0 none;
|
|
}
|
|
.flat .dijitAccordionInnerContainerSelected .dijitAccordionTitle {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainerSelected .dijitAccordionTitle .arrowTextUp {
|
|
display: none;
|
|
}
|
|
.flat .dijitAccordionInnerContainerSelected .dijitAccordionTitle .arrowTextDown {
|
|
display: block;
|
|
}
|
|
.flat .dijitAccordionContainer .dijitAccordionChildWrapper {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-top: 0 none;
|
|
position: relative;
|
|
z-index: 1;
|
|
clear: both;
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
.flat .dijitAccordionInnerContainer {
|
|
border-radius: 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer .dijitAccordionTitle {
|
|
border-radius: 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer:not(:last-child) .dijitAccordionChildWrapper {
|
|
border-radius: 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer +.dijitAccordionInnerContainer {
|
|
border-top: 0 none;
|
|
}
|
|
.flat .dijitAccordionInnerContainer +.dijitAccordionInnerContainerSelected:last-child .dijitAccordionTitle {
|
|
border-radius: 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer:first-child,
|
|
.flat .dijitAccordionInnerContainer:first-child .dijitAccordionTitle {
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer:last-child,
|
|
.flat .dijitAccordionInnerContainer:last-child .dijitAccordionTitle {
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
/* TitlePane */
|
|
.flat .dijitTitlePaneRtl .dijitTitlePaneTitle {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitTitlePaneRtl .dijitClosed .dijitArrowNode:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitColorPaletteRtl .dijitColorPaletteUnder {
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
.dijitPopup {
|
|
border-radius: 4px;
|
|
}
|
|
/* ----- Drag and Drop ----- */
|
|
.dojoDndItem {
|
|
border: 1px solid transparent;
|
|
cursor: pointer;
|
|
-webkit-transition-duration: 0.25s;
|
|
-moz-transition-duration: 0.25s;
|
|
-o-transition-duration: 0.25s;
|
|
-ms-transition-duration: 0.25s;
|
|
transition-duration: 0.25s;
|
|
-webkit-transition-property: background-color, border-color, opacity;
|
|
-moz-transition-property: background-color, border-color, opacity;
|
|
-o-transition-property: background-color, border-color, opacity;
|
|
-ms-transition-property: background-color, border-color, opacity;
|
|
transition-property: background-color, border-color, opacity;
|
|
}
|
|
/* hover */
|
|
.dojoDndItemOver {
|
|
background-color: #f5f5f5;
|
|
border-radius: 4px;
|
|
}
|
|
.dojoDndItemAnchor {
|
|
background-color: transparent;
|
|
border: 1px dashed #257aa7;
|
|
border-radius: 4px;
|
|
}
|
|
/* selected */
|
|
.dojoDndItemBefore {
|
|
background: transparent;
|
|
padding-top: 2px;
|
|
border-top: 1px solid #257aa7;
|
|
}
|
|
.dojoDndItemAfter {
|
|
background: transparent;
|
|
padding-bottom: 2px;
|
|
border-bottom: 1px solid #257aa7;
|
|
}
|
|
/* Avatar */
|
|
table.dojoDndAvatar {
|
|
display: block;
|
|
}
|
|
.dojoDndAvatarHeader td {
|
|
display: none;
|
|
}
|
|
.dojoDndAvatarHeader:before {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
display: table-cell;
|
|
}
|
|
/* cannot drop */
|
|
.dojoDndMove .dojoDndAvatarHeader:before {
|
|
color: #dd2c00;
|
|
content: "\f01c";
|
|
}
|
|
.dojoDndCopy .dojoDndAvatarHeader:before {
|
|
color: #dd2c00;
|
|
content: "\f01c";
|
|
}
|
|
/* can drop */
|
|
.dojoDndMove .dojoDndAvatarCanDrop .dojoDndAvatarHeader:before {
|
|
color: #43a047;
|
|
content: "\f008";
|
|
}
|
|
.dojoDndCopy .dojoDndAvatarCanDrop .dojoDndAvatarHeader:before {
|
|
color: #43a047;
|
|
content: "\f008";
|
|
}
|
|
.dojoDndAvatarItem {
|
|
border-radius: 4px;
|
|
}
|
|
.dojoDndAvatarItem td > * {
|
|
padding: 4px 8px;
|
|
list-style-type: none;
|
|
background-color: #fff;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
}
|
|
/* Calendar
|
|
*
|
|
* Styling Calendar mainly includes:
|
|
*
|
|
* 1. Calendar container
|
|
* .dijitCalendar - main container
|
|
* .dijitCalendarHover / .dijitCalendarActive - states e.g. hover,active
|
|
*
|
|
* 2. Month
|
|
* .dijitCalendarMonthContainer
|
|
* .dijitCalendarMonthLabel
|
|
* .dijitCalendarDecrease / .dijitCalendarDecrease - icons for switching to previous/next month
|
|
* .dijitCalendarArrowActive .dijitCalendarDecrease - states e.g. hover,active
|
|
*
|
|
* 3. Date
|
|
* .dijitCalendarDayLabelTemplate - week day column header e.g. S M T W T F S
|
|
* .dijitCalendarDateTemplate - date label wrapper
|
|
* .dijitCalendarPreviousMonth .dijitCalendarDateLabel - special labels for previous or next month
|
|
* .dijitCalendarSelectedDate .dijitCalendarDateLabel - styles for selected date
|
|
* .dijitCalendarDisabledDate .dijitCalendarDateLabel - styles for disabled date
|
|
* .dijitCalendarActiveDate .dijitCalendarDateLabel - states e.g. hover,active
|
|
*
|
|
* 4. Year
|
|
* .dijitCalendarYearContainer
|
|
* .dijitCalendarYearLabel
|
|
* .dijitCalendarPreviousYear /.dijitCalendarNextYear
|
|
* .dijitCalendarNextYearHover / .dijitCalendarPreviousYearHover - states e.g. hover,active
|
|
*
|
|
* 5. Dropdown Month Menu
|
|
* .dijitCalendarMonthMenu - menu container
|
|
* .dijitCalendarMonthMenu .dijitCalendarMonthLabel - month label in menu item
|
|
* .dijitCalendarMonthMenu .dijitCalendarMonthLabelHover - menu item hover state
|
|
*/
|
|
.flat .dijitCalendar {
|
|
background-color: #fff;
|
|
text-align: center;
|
|
padding: 4px;
|
|
border: 1px solid #ccc;
|
|
border-collapse: separate;
|
|
border-radius: 4px;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
}
|
|
.flat .dijitCalendarMonthContainer th {
|
|
text-align: center;
|
|
line-height: 20px;
|
|
vertical-align: middle;
|
|
margin: 4px 0;
|
|
}
|
|
.flat .dijitCalendarArrow {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
cursor: pointer;
|
|
font-size: 24px;
|
|
border: 1px solid transparent;
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarDecrease,
|
|
.flat .dijitCalendarIncrease {
|
|
display: none;
|
|
}
|
|
.flat .dijitCalendarDecrementArrow {
|
|
float: left;
|
|
padding-left: 2px;
|
|
}
|
|
.flat .dijitCalendarDecrementArrow:before {
|
|
content: "\f000";
|
|
}
|
|
.flat .dijitCalendarIncrementArrow {
|
|
float: right;
|
|
padding-right: 2px;
|
|
}
|
|
.flat .dijitCalendarIncrementArrow:before {
|
|
content: "\f001";
|
|
}
|
|
.flat .dijitCalendarArrowHover .dijitCalendarIncrementControl,
|
|
.flat .dijitCalendarArrow:hover .dijitCalendarIncrementControl,
|
|
.flat .dijitCalendarNextYearHover,
|
|
.flat .dijitCalendarNextYear:hover,
|
|
.flat .dijitCalendarPreviousYearHover,
|
|
.flat .dijitCalendarPreviousYear:hover {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarArrowActive .dijitCalendarIncrementControl,
|
|
.flat .dijitCalendarArrow:active .dijitCalendarIncrementControl,
|
|
.flat .dijitCalendarNextYearActive,
|
|
.flat .dijitCalendarNextYear:active,
|
|
.flat .dijitCalendarPreviousYearActive,
|
|
.flat .dijitCalendarPreviousYear:active {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitA11ySideArrow {
|
|
/* text +/- labels instead of arrow icons, for high contrast mode */
|
|
display: none;
|
|
}
|
|
.flat .dijitCalendarContainer th,
|
|
.flat .dijitCalendarContainer td {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarDayLabelTemplate {
|
|
text-align: center;
|
|
border-bottom: #ccc;
|
|
}
|
|
.flat .dijitCalendarDayLabel {
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitCalendarDateTemplate {
|
|
font-size: 0.9em;
|
|
letter-spacing: 0.05em;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitCalendarDateTemplate .dijitCalendarDateLabel {
|
|
text-decoration: none;
|
|
display: block;
|
|
padding: 2px 4px;
|
|
border: 0 none;
|
|
border-radius: 50%;
|
|
}
|
|
.flat .dijitCalendarPreviousMonth .dijitCalendarDateLabel,
|
|
.flat .dijitCalendarNextMonth .dijitCalendarDateLabel {
|
|
color: #c2c2c2;
|
|
}
|
|
.flat .dijitCalendarCurrentDate .dijitCalendarDateLabel {
|
|
border-color: #257aa7;
|
|
}
|
|
.flat .dijitCalendarHoveredDate .dijitCalendarDateLabel,
|
|
.flat .dijitCalendarEnabledDate:hover .dijitCalendarDateLabel {
|
|
background-color: #f2f2f2;
|
|
}
|
|
.flat .dijitCalendarActiveDate .dijitCalendarDateLabel,
|
|
.flat .dijitCalendarEnabledDate:active .dijitCalendarDateLabel {
|
|
background-color: #e6e6e6;
|
|
}
|
|
.flat .dijitCalendarSelectedDate .dijitCalendarDateLabel,
|
|
.flat .dijitCalendarSelectedDate.dijitCalendarHoveredDate .dijitCalendarDateLabel {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitCalendarDisabledDate .dijitCalendarDateLabel {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitCalendarYearContainer {
|
|
vertical-align: middle;
|
|
}
|
|
.flat .dijitCalendarYearLabel {
|
|
padding: 4px 0 0 0;
|
|
margin: 0;
|
|
font-size: 1.15em;
|
|
}
|
|
.flat .dijitCalendarYearLabel span {
|
|
vertical-align: middle;
|
|
}
|
|
.flat .dijitCalendarSelectedYear,
|
|
.flat .dijitCalendarNextYear,
|
|
.flat .dijitCalendarPreviousYear {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarSelectedYear {
|
|
color: #257aa7;
|
|
}
|
|
.flat .dijitCalendarNextYear,
|
|
.flat .dijitCalendarPreviousYear {
|
|
color: #257aa7;
|
|
font-size: 0.9em;
|
|
line-height: 20px;
|
|
border: 1px solid transparent;
|
|
}
|
|
.flat .dijitCalendarSelectedYear {
|
|
padding: 0 4px;
|
|
}
|
|
.flat .dijitCalendar .dijitDropDownButton {
|
|
margin: 0;
|
|
}
|
|
.flat .dijitCalendarMonthMenu {
|
|
padding: 8px 0;
|
|
}
|
|
.flat .dijitCalendarMonthMenu .dijitCalendarMonthLabel {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarMonthMenu .dijitCalendarMonthLabelHover {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
/* Menu
|
|
|
|
There are three areas of styling for the Menu:
|
|
|
|
1. The menu
|
|
There are three types of menus:
|
|
i) Context Menu
|
|
ii) Drop down Menu
|
|
iii) Navigation Menu
|
|
All three types of menus are affected by the .dijitMenu class in which you can set the background-color, padding and border
|
|
.dijitMenu affects the drop down menu in TimeTextBox, Calendar, ComboBox and FilteringSelect
|
|
.dijitMenuTable - for padding - also affects Select widget
|
|
|
|
2. The menu bar
|
|
.dijitMenuBar - for border, margins, padding, background-color of the menu bar
|
|
.dijitMenuBar .dijitMenuItem - for padding, text color of menu items in the menu bar (overrides .dijitMenuItem)
|
|
|
|
3. Menu items - items in the menu.
|
|
.dijitMenuItem - for color
|
|
.dijitMenuItemHover, .dijitMenuItemSelected - for background-color, border, text color, padding of a menu item or menubar item that has been hovered over or selected
|
|
.dijitMenuItemActive - for background-color of an active (mousedown) menu item
|
|
td.dijitMenuItemIconCell - for padding around a menu item's icon
|
|
td.dijitMenuItemLabel - for padding around a menu item's label
|
|
.dijitMenuSeparatorTop - for border, top border, of the separator
|
|
.dijitMenuSeparatorBottom - for bottom margin of the separator
|
|
|
|
Styles specific to ComboBox and FilteringSelect widgets:
|
|
.dijitComboBoxMenu .dijitMenuItem - for padding and border of a menu item in a ComboBox or FilteringSelect widget's menu
|
|
.dijitComboBoxMenu .dijitMenuItemSelected- for text color, background-color and border of a menu item in a ComboBox or FilteringSelect widget's menu
|
|
|
|
*/
|
|
.flat .dijitMenu {
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
margin: 0;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
}
|
|
.flat .dijitMenuTable,
|
|
.flat .dijitComboBoxMenu {
|
|
padding: 8px 0;
|
|
}
|
|
.flat .dijitComboBoxMenu {
|
|
margin-left: 0;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitMenuTable {
|
|
/* this prevents jiggling upon hover of a menu item */
|
|
border-collapse: separate;
|
|
border-spacing: 0 0;
|
|
}
|
|
.flat .dijitMenuItem,
|
|
.flat .dijitMenuItem td {
|
|
line-height: 20px;
|
|
padding: 8px;
|
|
white-space: nowrap;
|
|
}
|
|
.flat .dijitMenuItemHover td,
|
|
.flat .dijitMenuItemHover {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuItemActive td,
|
|
.flat .dijitMenuItemActive {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuItemSelected td,
|
|
.flat .dijitMenuItemSelected {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuItemDisabled {
|
|
color: #9e9e9e;
|
|
}
|
|
.flat .dijitMenuItemDisabled.dijitMenuItemSelected td,
|
|
.flat .dijitMenuItemDisabled.dijitMenuItemSelected {
|
|
color: #f2f2f2;
|
|
background: #5cafdb;
|
|
}
|
|
.flat .dijitMenuSeparatorTop {
|
|
height: auto;
|
|
margin-top: 1px; /* prevents spacing above/below separator */
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
.flat .dijitMenuSeparatorBottom {
|
|
height: auto;
|
|
margin-bottom: 1px;
|
|
border-top: 1px solid transparent;
|
|
}
|
|
.flat td.dijitMenuItemIconCell {
|
|
padding: 4px;
|
|
margin: 0 0 0 4px;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitMenuExpand {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.flat .dijitMenuExpand:before {
|
|
content: "\f001";
|
|
}
|
|
.flat .dijitCheckedMenuItemIconChar {
|
|
display: none;
|
|
}
|
|
.flat .dijitMenuPreviousButton,
|
|
.flat .dijitMenuNextButton {
|
|
font-style: italic;
|
|
}
|
|
.flat .dijitMenuBar {
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: #f5f5f5;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItem {
|
|
padding: 8px 12px;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItemHover {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItemActive {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItemSelected,
|
|
.flat .dijitMenuBar .dijitMenuItemHover.dijitMenuItemSelected,
|
|
.flat .dijitMenuBar .dijitMenuItemActive.dijitMenuItemSelected {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItemDisabled.dijitMenuItemSelected {
|
|
color: #f2f2f2;
|
|
background: #5cafdb;
|
|
}
|
|
.flat .dijitMenuPopup {
|
|
border-top-left-radius: 0;
|
|
border-top-right-radius: 0;
|
|
}
|
|
.flat .dijitMenuPopup .dijitMenu {
|
|
border-top-left-radius: 0;
|
|
border-top-right-radius: 0;
|
|
}
|
|
.flat .dijitMenuPopup .dijitMenuItem,
|
|
.flat .dijitMenuPopup .dijitMenuItem td {
|
|
padding: 8px;
|
|
}
|
|
.flat .dijitDialogRtl .dijitDialogCloseIcon {
|
|
right: auto;
|
|
left: 12px;
|
|
}
|
|
.flat .dijitDialogRtl .dijitDialogPaneActionBar,
|
|
.flat .dijitTooltipDialogRtl .dijitDialogPaneActionBar {
|
|
text-align: left;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderProgressBarH {
|
|
float: right;
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderLeftBumper {
|
|
border-left-width: 0;
|
|
border-right-width: 1px;
|
|
margin-left: 0;
|
|
margin-right: 4px;
|
|
border-radius: 0 1.5px 1.5px 0;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderRightBumper {
|
|
border-left-width: 1px;
|
|
border-right-width: 0;
|
|
margin-left: 4px;
|
|
margin-right: -2px;
|
|
border-radius: 1.5px 0 0 1.5px;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderMoveableH {
|
|
right: auto;
|
|
left: 0;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderImageHandleV {
|
|
left: auto;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderImageHandleH {
|
|
left: -50%;
|
|
}
|
|
.flat .dijitSliderRtl .dijitRuleContainerV {
|
|
float: right;
|
|
}
|
|
/* Slider
|
|
*
|
|
* Styling Slider mainly includes styling the Slider progress bar (dijitSliderProgressBar)
|
|
*
|
|
* Slider progress bar:
|
|
* 1. Slider progress bar (default styling):
|
|
* .dijitSliderProgressBarH - progress bar at the middle of horizontal slider
|
|
* .dijitSliderLeftBumper - bar at the left of horizontal slider
|
|
* .dijitSliderRightBumper - bar at the right of horizontal slider
|
|
* .dijitSliderProgressBarV - progress bar at the middle of vertical slider
|
|
* .dijitSliderTopBumper - bar at the top of vertical slider
|
|
* .dijitSliderBottomtBumper - bar at the bottom of vertical slider
|
|
*
|
|
* 2. hovered Slider progress bar (ie, mouse hover on progress bar)
|
|
* .dijitSliderHover .dijitSliderProgressBarH(horizontal) - hovered bar style: background, border
|
|
*
|
|
* 3. focused Slider progress bar (ie, mouse focused on progress bar)
|
|
* .dijitSliderFocused .dijitSliderProgressBarH(horizontal) - focus bar style: background, border
|
|
*
|
|
* 4. disabled/read-only Slider progress bar
|
|
* .dijitSliderDisabled .dijitSliderProgressBarH(horizontal) - bar styles when slider is disabled
|
|
*
|
|
*
|
|
* Slider Thumbs:
|
|
* 1. Slider Thumbs (default styling):
|
|
* .dijitSliderImageHandleH / .dijitSliderImageHandleV - styles for the controller on the progress bar
|
|
*
|
|
* 2. hovered Slider Thumbs (ie, mouse hover on slider thumbs)
|
|
* .dijitSliderHover .dijitSliderImageHandleH - hovered controller style
|
|
*
|
|
* 3. focused Slider progress bar (ie, mouse focused on slider thumbs)
|
|
* .dijitSliderFocused .dijitSliderImageHandleV - focused controller style
|
|
*
|
|
*
|
|
* Slider Increment/Decrement Buttons:
|
|
* 1. Slider Increment/Decrement Buttons (default styling):
|
|
* .dijitSliderDecrementIconH - decrement icon which lies at the left of horizontal slider
|
|
* .dijitSliderIncrementIconH - increment icon which lies at the right of horizontal slider
|
|
* .dijitSliderDecrementIconV - decrement icon which lies at the bottom of vertical slider
|
|
* .dijitSliderIncrementIconV - increment icon which lies at the top of vertical slider
|
|
*
|
|
* 2. hovered Slider Increment/Decrement Buttons (mouse hover on the icons)
|
|
* .dijitSliderHover .dijitSliderDecrementIconH - for background, border
|
|
*
|
|
* 3. active Slider Increment/Decrement Buttons (mouse down on the icons)
|
|
* .dijitSliderActive .dijitSliderIncrementIconV - for background, border
|
|
*
|
|
* 4. disabled/read-only Slider Increment/Decrement Buttons
|
|
* .dijitSliderDisabled .dijitSliderDecrementIconH - styles for the icons in disabled slider
|
|
* .dijitSliderReadOnly .dijitSliderIncrementIconV - styles for the icons in read-only slider
|
|
*/
|
|
.flat .dijitSliderBar {
|
|
border-style: solid;
|
|
outline: 1px;
|
|
}
|
|
.flat .dijitRuleLabelsContainer {
|
|
color: #424242;
|
|
font-size: smaller;
|
|
}
|
|
.flat .dijitSliderDisabled {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitRuleLabelsContainerH {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSliderBarH,
|
|
.flat .dijitSliderBumperH {
|
|
height: 3px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderLeftBumper {
|
|
border-radius: 1.5px 0 0 1.5px;
|
|
border: 0 none;
|
|
margin-left: 4px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderRightBumper {
|
|
border-radius: 0 1.5px 1.5px 0;
|
|
border: 0 none;
|
|
margin-left: -2px;
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderProgressBarH,
|
|
.flat .dijitSlider .dijitSliderLeftBumper {
|
|
border: 0 none;
|
|
background-color: #257aa7;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitSlider .dijitSliderRemainingBarH,
|
|
.flat .dijitSlider .dijitSliderRightBumper {
|
|
border: 0 none;
|
|
background-color: #ccc;
|
|
}
|
|
.flat .dijitSliderHover .dijitSliderProgressBarH,
|
|
.flat .dijitSliderHover .dijitSliderLeftBumper {
|
|
background-color: #22709a;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitSliderFocused .dijitSliderProgressBarH,
|
|
.flat .dijitSliderFocused .dijitSliderLeftBumper {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitSliderFocused .dijitSliderRemainingBarH,
|
|
.flat .dijitSliderFocused .dijitSliderRightBumper {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitRuleLabelsContainerV {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSliderBarV,
|
|
.flat .dijitSliderBumperV {
|
|
width: 3px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderTopBumper {
|
|
border-radius: 1.5px 1.5px 0 0;
|
|
border: 0 none;
|
|
margin-top: 4px;
|
|
margin-bottom: -2px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderBottomBumper {
|
|
border-radius: 0 0 1.5px 1.5px;
|
|
border: 0 none;
|
|
margin-bottom: 4px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderProgressBarV,
|
|
.flat .dijitSlider .dijitSliderBottomBumper {
|
|
border: 0 none;
|
|
background-color: #257aa7;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitSlider .dijitSliderRemainingBarV,
|
|
.flat .dijitSlider .dijitSliderTopBumper {
|
|
border: 0 none;
|
|
background-color: #ccc;
|
|
}
|
|
.flat .dijitSliderHover .dijitSliderProgressBarV,
|
|
.flat .dijitSliderHover .dijitSliderBottomBumper {
|
|
background-color: #22709a;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitSliderFocused .dijitSliderProgressBarV,
|
|
.flat .dijitSliderFocused .dijitSliderBottomBumper {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitSliderFocused .dijitSliderRemainingBarV,
|
|
.flat .dijitSliderFocused .dijitSliderTopBumper {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitSliderImageHandle {
|
|
background: #fff;
|
|
-webkit-box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
border-radius: 50%;
|
|
border: 1px solid #257aa7;
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-top: -2px;
|
|
position: absolute;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
.flat .dijitSliderImageHandle:after {
|
|
content: "";
|
|
display: block;
|
|
background: #257aa7;
|
|
border-radius: 50%;
|
|
height: 10px;
|
|
width: 10px;
|
|
left: 2px;
|
|
top: 2px;
|
|
position: absolute;
|
|
}
|
|
.flat .dijitSliderImageHandleV {
|
|
margin-top: 0;
|
|
}
|
|
.flat .dijitSliderHover .dijitSliderImageHandle,
|
|
.flat .dijitSliderFocused .dijitSliderImageHandle {
|
|
-webkit-box-shadow: 0 4px 2px -2px rgba(0,0,0,0.3), 0 4px 6px rgba(0,0,0,0.2);
|
|
box-shadow: 0 4px 2px -2px rgba(0,0,0,0.3), 0 4px 6px rgba(0,0,0,0.2);
|
|
}
|
|
.flat .dijitSliderDisabled.dijitSliderFocused .dijitSliderImageHandle:after {
|
|
display: none;
|
|
}
|
|
.flat .dijitSliderDecrementIconH,
|
|
.flat .dijitSliderIncrementIconH,
|
|
.flat .dijitSliderDecrementIconV,
|
|
.flat .dijitSliderIncrementIconV {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
height: 20px;
|
|
width: 20px;
|
|
cursor: pointer;
|
|
color: #257aa7;
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSliderDecrementIconH:hover,
|
|
.flat .dijitSliderIncrementIconH:hover,
|
|
.flat .dijitSliderDecrementIconV:hover,
|
|
.flat .dijitSliderIncrementIconV:hover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitSliderDecrementIconH:active,
|
|
.flat .dijitSliderIncrementIconH:active,
|
|
.flat .dijitSliderDecrementIconV:active,
|
|
.flat .dijitSliderIncrementIconV:active {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitSliderReadOnly .dijitSliderDecrementIconH,
|
|
.flat .dijitSliderDisabled .dijitSliderDecrementIconH,
|
|
.flat .dijitSliderReadOnly .dijitSliderDecrementIconV,
|
|
.flat .dijitSliderDisabled .dijitSliderDecrementIconV,
|
|
.flat .dijitSliderReadOnly .dijitSliderIncrementIconH,
|
|
.flat .dijitSliderDisabled .dijitSliderIncrementIconH,
|
|
.flat .dijitSliderReadOnly .dijitSliderIncrementIconV,
|
|
.flat .dijitSliderDisabled .dijitSliderIncrementIconV {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitSliderIncrementIconH,
|
|
.flat .dijitSliderIncrementIconV,
|
|
.flat .dijitSliderDecrementIconH,
|
|
.flat .dijitSliderDecrementIconV {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.flat .dijitSliderIncrementIconH:before,
|
|
.flat .dijitSliderIncrementIconV:before,
|
|
.flat .dijitSliderDecrementIconH:before,
|
|
.flat .dijitSliderDecrementIconV:before {
|
|
content: "\f011";
|
|
top: 0;
|
|
line-height: 20px;
|
|
}
|
|
.flat .dijitSliderIncrementIconH .dijitSliderButtonInner,
|
|
.flat .dijitSliderIncrementIconV .dijitSliderButtonInner,
|
|
.flat .dijitSliderDecrementIconH .dijitSliderButtonInner,
|
|
.flat .dijitSliderDecrementIconV .dijitSliderButtonInner {
|
|
display: none;
|
|
}
|
|
.flat .dijitSliderDecrementIconH:before,
|
|
.flat .dijitSliderDecrementIconV:before {
|
|
content: "\f012";
|
|
}
|
|
.flat .dijitRuleMark {
|
|
border: 0 none;
|
|
}
|
|
.flat .dijitRuleMarkH {
|
|
border-right: 1px solid #e0e0e0;
|
|
}
|
|
.flat .dijitRuleMarkV {
|
|
border-bottom: 1px solid #e0e0e0;
|
|
}
|
|
.flat .dijitRuleLabelContainerH {
|
|
margin-top: 2px;
|
|
margin-bottom: 2px;
|
|
}
|
|
.flat .dijitRuleLabelContainerV {
|
|
margin-left: 2px;
|
|
margin-right: 2px;
|
|
}
|
|
.flat .dijitSelectRtl .dijitButtonText {
|
|
float: right;
|
|
padding: 0 12px 0 0;
|
|
}
|
|
.flat .dijitSelectRtl .dijitButtonContents {
|
|
border-style: none none none solid;
|
|
text-align: right;
|
|
}
|
|
.flat .dijitComboBoxRtl .dijitButtonNode.dijitArrowButtonContainer {
|
|
border-radius: 4px 0 0 4px;
|
|
}
|
|
.flat .dijitComboBoxRtl .dijitArrowButtonContainer {
|
|
border-right-width: 1px !important;
|
|
border-left-width: 0 !important;
|
|
}
|
|
.flat .dijitTextBoxRtl .dijitValidationContainer,
|
|
.flat .dijitTextBoxRtl .dijitSpinnerButtonContainer {
|
|
border-right-width: 1px !important;
|
|
border-left-width: 0 !important;
|
|
}
|
|
.flat .dijitTextBoxRtlError .dijitValidationContainer {
|
|
border-left-width: 0;
|
|
border-right-width: 1px;
|
|
}
|
|
.flat .dijitRtl .dijitPlaceHolder {
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
.flat .dijitTextBoxRtl .dijitSpinnerButtonContainer,
|
|
.flat .dijitValidationTextBoxRtl .dijitValidationContainer,
|
|
.flat .dijitTextBoxRtl .dijitArrowButtonContainer {
|
|
float: left;
|
|
}
|
|
.flat div.dijitNumberTextBoxRtl {
|
|
text-align: right;
|
|
}
|
|
/* RadioButton
|
|
*
|
|
* Styling RadioButton mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* .dijitRadio|.dijitRadioIcon
|
|
*
|
|
* 2. RadioButton within ToggleButton
|
|
* .dijitToggleButton|.dijitToggleButtonChecked
|
|
*
|
|
* 3. Checked state
|
|
* .dijitRadioChecked
|
|
* .dijitToggleButtonChecked
|
|
*
|
|
* 4. Hover state
|
|
* .dijitRadioHover|.dijitRadioCheckedHover
|
|
*
|
|
* 5. Disabled state
|
|
* .dijitRadioDisabled|.dijitRadioCheckedDisabled
|
|
*/
|
|
.flat .dijitRadio,
|
|
.flat .dijitRadioIcon {
|
|
/* inside a toggle button */
|
|
width: 16px;
|
|
height: 16px;
|
|
background: #fff;
|
|
border: 1px solid #257aa7;
|
|
border-radius: 50%;
|
|
position: relative;
|
|
overflow: visible;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
.flat .dijitRadio:after,
|
|
.flat .dijitRadioIcon:after {
|
|
content: " ";
|
|
display: block;
|
|
width: 0;
|
|
height: 0;
|
|
background-color: #257aa7;
|
|
border-radius: 50%;
|
|
opacity: 0;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
|
filter: alpha(opacity=0);
|
|
margin: 8px;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
-webkit-transition: all 0.15s ease-in-out;
|
|
-moz-transition: all 0.15s ease-in-out;
|
|
-o-transition: all 0.15s ease-in-out;
|
|
-ms-transition: all 0.15s ease-in-out;
|
|
transition: all 0.15s ease-in-out;
|
|
}
|
|
.flat .dijitRadioHover {
|
|
border-color: #43a3d5;
|
|
}
|
|
.flat .dijitRadioChecked:after,
|
|
.flat .dijitChecked .dijitRadioIcon:after {
|
|
width: 8px;
|
|
height: 8px;
|
|
margin: 3px;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .alt-primary .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-primary .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-success .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-success .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-info .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-info .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-warning .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-warning .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-danger .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-danger .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-inverse .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-inverse .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .dijitRadioDisabled {
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitRadioCheckedDisabled {
|
|
background-color: #f5f5f5;
|
|
border-color: #5cafdb;
|
|
}
|
|
.flat .dijitRadioCheckedDisabled:after {
|
|
background-color: #5cafdb;
|
|
}
|
|
.flat .dijitRadioMenuItem .dijitCheckedMenuItemIcon {
|
|
width: 16px;
|
|
height: 16px;
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 50%;
|
|
position: relative;
|
|
overflow: visible;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
.flat .dijitRadioMenuItem .dijitCheckedMenuItemIcon:after {
|
|
content: " ";
|
|
display: block;
|
|
width: 0;
|
|
height: 0;
|
|
background-color: #257aa7;
|
|
border-radius: 50%;
|
|
opacity: 0;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
|
filter: alpha(opacity=0);
|
|
margin: 8px;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
-webkit-transition: all 0.15s ease-in-out;
|
|
-moz-transition: all 0.15s ease-in-out;
|
|
-o-transition: all 0.15s ease-in-out;
|
|
-ms-transition: all 0.15s ease-in-out;
|
|
transition: all 0.15s ease-in-out;
|
|
}
|
|
.flat .dijitRadioMenuItemChecked .dijitCheckedMenuItemIcon {
|
|
border-color: #ccc;
|
|
}
|
|
.flat .dijitRadioMenuItemChecked .dijitCheckedMenuItemIcon:after {
|
|
width: 8px;
|
|
height: 8px;
|
|
margin: 3px;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
/* CheckBox
|
|
*
|
|
* Styling CheckBox mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* .dijitCheckBox
|
|
*
|
|
* 2. CheckBox within ToggleButton
|
|
* .dijitCheckBoxIcon
|
|
*
|
|
* 3. States - Checked, Hover, Disabled.
|
|
* .dijitCheckBoxChecked
|
|
* .dijitCheckBoxHover
|
|
* .dijitCheckBoxCheckedHover
|
|
* .dijitCheckBoxDisabled
|
|
* .dijitCheckBoxCheckedDisabled
|
|
*/
|
|
.flat .dijitCheckBox {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
width: 16px;
|
|
height: 16px;
|
|
line-height: 1;
|
|
padding: 0;
|
|
border-radius: 2px;
|
|
text-align: center;
|
|
position: relative;
|
|
overflow: visible;
|
|
-webkit-transition: all 0.1s linear;
|
|
-moz-transition: all 0.1s linear;
|
|
-o-transition: all 0.1s linear;
|
|
-ms-transition: all 0.1s linear;
|
|
transition: all 0.1s linear;
|
|
}
|
|
.flat .dijitCheckBox input {
|
|
position: absolute;
|
|
top: 0;
|
|
}
|
|
.flat .dijitCheckBoxIcon:before,
|
|
.flat .dijitCheckBoxChecked:before,
|
|
.flat .dijitCheckBoxCheckedDisabled:before {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
content: "\f00c";
|
|
color: #fff;
|
|
}
|
|
.flat .dijitCheckBoxIcon {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitCheckBoxIcon:before {
|
|
color: #257aa7;
|
|
}
|
|
.flat .alt-primary .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-success .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-info .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-warning .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-danger .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-inverse .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .dijitCheckBoxChecked {
|
|
background-color: #257aa7;
|
|
border-color: #257aa7;
|
|
}
|
|
.flat .dijitCheckBoxHover {
|
|
background-color: #fff;
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitCheckBoxCheckedHover {
|
|
background-color: #2d95cd;
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitCheckBoxDisabled {
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitCheckBoxCheckedDisabled {
|
|
color: #a6a6a6;
|
|
background-color: #5cafdb;
|
|
border-color: #5cafdb;
|
|
}
|
|
.flat .dijitCheckedMenuItem .dijitCheckedMenuItemIcon {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
width: 16px;
|
|
height: 16px;
|
|
line-height: 1;
|
|
padding: 0;
|
|
border-radius: 2px;
|
|
text-align: center;
|
|
position: relative;
|
|
overflow: visible;
|
|
-webkit-transition: all 0.1s linear;
|
|
-moz-transition: all 0.1s linear;
|
|
-o-transition: all 0.1s linear;
|
|
-ms-transition: all 0.1s linear;
|
|
transition: all 0.1s linear;
|
|
}
|
|
.flat .dijitCheckedMenuItemChecked .dijitCheckedMenuItemIcon:before {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
content: "\f00c";
|
|
color: #257aa7;
|
|
}
|
|
/* Text Inputs: [TextBox | DateTextBox | CurrencyTextBox | ValidationTextBox | ...] | TextArea
|
|
* Mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* .dijitTextBox
|
|
* .dijitInputField - container that wraps "dijitInputInner" or "dijitPlaceHolder"
|
|
*
|
|
* 2. Textbox input
|
|
* .dijitInputInner
|
|
* .dijitPlaceHolder
|
|
*
|
|
* 3. States - Hover, Focused, Disabled, Error, Error while Focused e.g.
|
|
* .dijitTextBoxHover
|
|
* .dijitTextBoxFocused
|
|
* .dijitTextBoxDisabled
|
|
* .dijitTextBoxError
|
|
* .dijitTextBoxErrorFocused
|
|
*
|
|
*/
|
|
.flat .dijitTextBox,
|
|
.flat .dijitInputInner {
|
|
line-height: 20px;
|
|
}
|
|
.flat .dijitTextBox {
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
-webkit-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
-moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
-o-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
-ms-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
}
|
|
.flat .dijitTextArea {
|
|
padding: 4px 6px;
|
|
}
|
|
.flat .dijitTextBox .dijitInputField {
|
|
padding: 0 4px;
|
|
margin: 0 2px;
|
|
}
|
|
.flat .dijitSelect.alt-primary,
|
|
.flat .dijitComboBox.alt-primary,
|
|
.flat .dijitSpinner.alt-primary {
|
|
border-color: #1e88e5;
|
|
}
|
|
.flat .dijitSelect.alt-success,
|
|
.flat .dijitComboBox.alt-success,
|
|
.flat .dijitSpinner.alt-success {
|
|
border-color: #43a047;
|
|
}
|
|
.flat .dijitSelect.alt-info,
|
|
.flat .dijitComboBox.alt-info,
|
|
.flat .dijitSpinner.alt-info {
|
|
border-color: #03a9f4;
|
|
}
|
|
.flat .dijitSelect.alt-warning,
|
|
.flat .dijitComboBox.alt-warning,
|
|
.flat .dijitSpinner.alt-warning {
|
|
border-color: #fb8c00;
|
|
}
|
|
.flat .dijitSelect.alt-danger,
|
|
.flat .dijitComboBox.alt-danger,
|
|
.flat .dijitSpinner.alt-danger {
|
|
border-color: #e53935;
|
|
}
|
|
.flat .dijitSelect.alt-inverse,
|
|
.flat .dijitComboBox.alt-inverse,
|
|
.flat .dijitSpinner.alt-inverse {
|
|
border-color: #616161;
|
|
}
|
|
.flat .dijitTextBox .dijitInputInner,
|
|
.flat .dijitValidationTextBox .dijitValidationContainer,
|
|
.flat .dijitTextBox .dijitInputField .dijitPlaceHolder {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitTextBoxHover {
|
|
border-color: #257aa7;
|
|
-webkit-transition-duration: 0.25s;
|
|
-moz-transition-duration: 0.25s;
|
|
-o-transition-duration: 0.25s;
|
|
-ms-transition-duration: 0.25s;
|
|
transition-duration: 0.25s;
|
|
}
|
|
.flat .dijitTextBoxFocused {
|
|
border-color: #257aa7;
|
|
-webkit-transition-duration: 0.1s;
|
|
-moz-transition-duration: 0.1s;
|
|
-o-transition-duration: 0.1s;
|
|
-ms-transition-duration: 0.1s;
|
|
transition-duration: 0.1s;
|
|
}
|
|
.flat .dijitTextBoxDisabled {
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-primary,
|
|
.flat .dijitSpinnerDisabled.alt-primary {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #6db2ee;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-primary .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-primary .dijitButtonNode {
|
|
background: #6db2ee;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-primary .dijitSpinnerButtonContainer {
|
|
border-left-color: #6db2ee;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-primary .dijitSpinnerButtonContainer {
|
|
border-right-color: #6db2ee;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-primary {
|
|
border-color: #6db2ee;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-primary .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-primary .dijitButtonNode {
|
|
background: #6db2ee;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-success,
|
|
.flat .dijitSpinnerDisabled.alt-success {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #7dc981;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-success .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-success .dijitButtonNode {
|
|
background: #7dc981;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-success .dijitSpinnerButtonContainer {
|
|
border-left-color: #7dc981;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-success .dijitSpinnerButtonContainer {
|
|
border-right-color: #7dc981;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-success {
|
|
border-color: #7dc981;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-success .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-success .dijitButtonNode {
|
|
background: #7dc981;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-info,
|
|
.flat .dijitSpinnerDisabled.alt-info {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #56c9fd;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-info .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-info .dijitButtonNode {
|
|
background: #56c9fd;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-info .dijitSpinnerButtonContainer {
|
|
border-left-color: #56c9fd;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-info .dijitSpinnerButtonContainer {
|
|
border-right-color: #56c9fd;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-info {
|
|
border-color: #56c9fd;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-info .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-info .dijitButtonNode {
|
|
background: #56c9fd;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-warning,
|
|
.flat .dijitSpinnerDisabled.alt-warning {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #ffb557;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-warning .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-warning .dijitButtonNode {
|
|
background: #ffb557;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-warning .dijitSpinnerButtonContainer {
|
|
border-left-color: #ffb557;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-warning .dijitSpinnerButtonContainer {
|
|
border-right-color: #ffb557;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-warning {
|
|
border-color: #ffb557;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-warning .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-warning .dijitButtonNode {
|
|
background: #ffb557;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-danger,
|
|
.flat .dijitSpinnerDisabled.alt-danger {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #ee7e7c;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-danger .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-danger .dijitButtonNode {
|
|
background: #ee7e7c;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-danger .dijitSpinnerButtonContainer {
|
|
border-left-color: #ee7e7c;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-danger .dijitSpinnerButtonContainer {
|
|
border-right-color: #ee7e7c;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-danger {
|
|
border-color: #ee7e7c;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-danger .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-danger .dijitButtonNode {
|
|
background: #ee7e7c;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-inverse,
|
|
.flat .dijitSpinnerDisabled.alt-inverse {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #989898;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-inverse .dijitButtonNode {
|
|
background: #989898;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-inverse .dijitSpinnerButtonContainer {
|
|
border-left-color: #989898;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-inverse .dijitSpinnerButtonContainer {
|
|
border-right-color: #989898;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-inverse {
|
|
border-color: #989898;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-inverse .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-inverse .dijitButtonNode {
|
|
background: #989898;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitTextBoxError,
|
|
.flat .dijitTextBoxError .dijitButtonNode {
|
|
border-color: #dd2c00;
|
|
}
|
|
.flat .dijitTextBoxErrorFocused,
|
|
.flat .dijitTextBoxErrorFocused .dijitButtonNode {
|
|
border: 1px solid #bc2500;
|
|
}
|
|
.flat .dijitValidationTextBoxError .dijitValidationContainer {
|
|
color: #dd2c00;
|
|
width: 18px;
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
font-size: 18px;
|
|
}
|
|
.flat .dijitValidationTextBoxError .dijitValidationContainer:before {
|
|
content: "\f017";
|
|
}
|
|
.flat .dijitValidationTextBoxError .dijitValidationIcon {
|
|
display: none;
|
|
}
|
|
.flat table.dijitComboButtonRtl .dijitStretch {
|
|
border-radius: 0 4px 4px 0;
|
|
}
|
|
.flat table.dijitComboButtonRtl .dijitArrowButton {
|
|
border-radius: 4px 0 0 4px;
|
|
border-left-width: 1px;
|
|
border-right-width: 0;
|
|
}
|
|
.flat .dijitDropDownButtonRtl .dijitButtonNode {
|
|
padding-left: 8px;
|
|
}
|
|
.flat .dijitDropDownButtonRtl .dijitArrowButtonInner {
|
|
margin-left: 0;
|
|
margin-right: 12px;
|
|
}
|
|
/* Select | Combobox
|
|
* And minor style for DateTextBox | MultiSelect
|
|
*
|
|
* Styling Select mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* Select:
|
|
* .dijitSelect
|
|
* .dijitButtonContents
|
|
* Combobox:
|
|
* .dijitComboBox
|
|
*
|
|
* 2. Arrow Button
|
|
* .dijitArrowButton
|
|
* .dijitArrowButtonInner
|
|
* .dijitComboBox .dijitButtonNode
|
|
*
|
|
* 3. Menu
|
|
* .dijitSelectMenu
|
|
*
|
|
* 4. States - Hover, Active, Focused, Disabled, e.g.
|
|
*
|
|
* Select: Hover, Active, Focused, Disabled
|
|
* .dijitSelectHover
|
|
* .dijitSelectFocused
|
|
* .dijitSelectDisabled
|
|
*
|
|
* Combobox: Hover, Focused (Open), Disabled
|
|
* .dijitComboBox .dijitDownArrowButtonHover
|
|
* .dijitComboBoxOpenHover .dijitButtonNode
|
|
* .dijitComboBoxDisabled .dijitButtonNode
|
|
*
|
|
*/
|
|
.flat .dijitSelect .dijitArrowButtonInner,
|
|
.flat .dijitComboBox .dijitArrowButtonInner {
|
|
margin: 0;
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
.flat .dijitSelect {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
table-layout: fixed;
|
|
}
|
|
.flat .dijitSelect .dijitButtonContents,
|
|
.flat .dijitSelect .dijitArrowButton {
|
|
line-height: 20px;
|
|
padding: 4px 12px;
|
|
border: 0;
|
|
border-radius: 0 2.666666666666668px 2.666666666666668px 0;
|
|
}
|
|
.flat .dijitSelect .dijitButtonContents {
|
|
padding: 0;
|
|
overflow: hidden;
|
|
-o-text-overflow: ellipsis;
|
|
text-overflow: ellipsis;
|
|
border-radius: 2.666666666666668px 0 0 2.666666666666668px;
|
|
}
|
|
.flat .dijitSelect .dijitInputField {
|
|
padding: 0 0 0 12px;
|
|
}
|
|
.flat .dijitSelect .dijitArrowButton {
|
|
width: 20px;
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitSelectHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitSelectActive {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitSelectFocused {
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitSelectDisabled {
|
|
cursor: default;
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitComboBox .dijitButtonNode {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
border-radius: 0 2.666666666666668px 2.666666666666668px 0;
|
|
}
|
|
.flat .dijitComboBoxOpenHover .dijitButtonNode,
|
|
.flat .dijitComboBox .dijitDownArrowButtonHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitComboBoxDisabled .dijitButtonNode {
|
|
cursor: default;
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitComboBox .dijitArrowButton {
|
|
width: 20px;
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitToolbar .dijitComboBox .dijitArrowButtonInner {
|
|
border: none;
|
|
}
|
|
.flat .dijitDateTextBox .dijitArrowButton:before {
|
|
content: "\f01e";
|
|
}
|
|
.flat .dijitTimeTextBox .dijitArrowButton:before {
|
|
content: "\f01f";
|
|
}
|
|
.flat select {
|
|
padding: 4px 0;
|
|
border: 1px solid #ccc;
|
|
-webkit-box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
}
|
|
.flat select option {
|
|
padding: 4px 8px;
|
|
}
|
|
.flat .dijitSelectMenu td.dijitMenuItemIconCell,
|
|
.flat .dijitSelectMenu td.dijitMenuArrowCell {
|
|
/* so that arrow and icon cells from MenuItem are not displayed */
|
|
display: none;
|
|
}
|
|
.flat .dijitSpinnerRtl .dijitSpinnerButtonContainer .dijitArrowButton {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
/* NumberSpinner - namespace "dijitSpinner"
|
|
*
|
|
* Styling NumberSpinner mainly includes:
|
|
*
|
|
* 1. Arrows
|
|
* Outer containers: .dijitSpinnerButtonContainer|.dijitSpinnerButtonInner - for border, padding and position
|
|
* Arrows: .dijitArrowButton|.dijitUpArrowButton.|dijitDownArrowButton
|
|
* Inner container: .dijitArrowButtonInner - for border, padding, width|height and background image
|
|
*
|
|
* 2. Hover state
|
|
* .dijitUpArrowButtonHover|.dijitDownArrowButtonHover .* - for background color|image
|
|
*
|
|
* 3. Active state
|
|
* .dijitUpArrowButtonActive|.dijitDownArrowButtonActive .* - for border, padding, margin and background color|image
|
|
*
|
|
* 4. Focused state
|
|
* .dijitSpinnerFocused .* - for background color|image
|
|
*
|
|
* 5. Disabled state
|
|
* .dijitSpinnerDisabled .* - for background color|image
|
|
*/
|
|
.flat .dijitSpinner .dijitSpinnerButtonContainer {
|
|
overflow: hidden;
|
|
position: relative;
|
|
width: auto;
|
|
padding: 0;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitSpinner .dijitSpinnerButtonInner {
|
|
width: 30px;
|
|
padding: 4px 0 !important;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButton {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
border-radius: 0;
|
|
border: 0;
|
|
width: auto;
|
|
overflow: hidden;
|
|
left: 0;
|
|
right: 0;
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButton:before {
|
|
content: none;
|
|
}
|
|
.flat .dijitSpinner .dijitUpArrowButton {
|
|
border-top-right-radius: 2.666666666666668px;
|
|
}
|
|
.flat .dijitSpinner .dijitDownArrowButton {
|
|
border-bottom-right-radius: 2.666666666666668px;
|
|
}
|
|
.flat .dijitSpinner .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner .dijitDownArrowButtonHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitSpinner .dijitDownArrowButtonActive,
|
|
.flat .dijitSpinner .dijitUpArrowButtonActive {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButtonInner {
|
|
line-height: 14px;
|
|
display: block;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButtonInner .dijitInputField {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButtonInner:before {
|
|
content: "\f003";
|
|
}
|
|
.flat .dijitSpinner .dijitDownArrowButton .dijitArrowButtonInner:before {
|
|
content: "\f002";
|
|
}
|
|
.flat .dijitSpinnerDisabled .dijitDownArrowButton,
|
|
.flat .dijitSpinnerDisabled .dijitUpArrowButton {
|
|
cursor: default;
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .alt-primary .dijitSpinnerButtonContainer {
|
|
border-color: #1e88e5;
|
|
}
|
|
.flat .alt-success .dijitSpinnerButtonContainer {
|
|
border-color: #43a047;
|
|
}
|
|
.flat .alt-info .dijitSpinnerButtonContainer {
|
|
border-color: #03a9f4;
|
|
}
|
|
.flat .alt-warning .dijitSpinnerButtonContainer {
|
|
border-color: #fb8c00;
|
|
}
|
|
.flat .alt-danger .dijitSpinnerButtonContainer {
|
|
border-color: #e53935;
|
|
}
|
|
.flat .alt-inverse .dijitSpinnerButtonContainer {
|
|
border-color: #616161;
|
|
}
|
|
/* Button | DropDownButton | ComboButton | ToggleButton
|
|
*
|
|
* Styling Buttons mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* .dijitButton
|
|
* .dijitDropDownButton
|
|
* .dijitComboButton
|
|
* .dijitButtonNode - common button/arrow wrapper shared across all three button types
|
|
*
|
|
* 2. Button text
|
|
* .dijitButtonText
|
|
*
|
|
* 3. Arrows - only for DropDownButton and ComboButton
|
|
* There are total four directions arrows - down, left, right, up:
|
|
* .dijitArrowButtonInner - down arrow by default
|
|
* .dijitLeftArrowButton .dijitArrowButtonInner - left arrow
|
|
* .dijitRightArrowButton .dijitArrowButtonInner - right arrow
|
|
* .dijitUpArrowButton .dijitArrowButtonInner - up arrow
|
|
*
|
|
* 4. States - Hover, Active, Disabled, e.g.
|
|
* .dijitButtonHover .dijitButtonNode
|
|
* .dijitButtonActive .dijitButtonNode
|
|
* .dijitButtonDisabled .dijitButtonNode
|
|
*
|
|
* .dijitDisabled .dijitArrowButtonInner - disabled arrow states
|
|
*/
|
|
.flat .dijitButtonText {
|
|
padding: 0 4px;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitButton .dijitButtonNode,
|
|
.flat .dijitDropDownButton .dijitButtonNode,
|
|
.flat .dijitComboButton .dijitButtonNode,
|
|
.flat .dijitToggleButton .dijitButtonNode {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
}
|
|
.flat .dijitButton.alt-primary .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-primary .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-primary .dijitButtonNode,
|
|
.flat .dijitSelect.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelect.alt-primary .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-primary .dijitArrowButton {
|
|
background: #1e88e5;
|
|
color: #fff;
|
|
border-color: #166fbd;
|
|
}
|
|
.flat .dijitComboButton.alt-primary .dijitStretch {
|
|
border-right-color: #166fbd;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-primary .dijitStretch {
|
|
border-left-color: #166fbd;
|
|
}
|
|
.flat .dijitButton.alt-success .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-success .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-success .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-success .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-success .dijitButtonNode,
|
|
.flat .dijitSelect.alt-success .dijitButtonContents,
|
|
.flat .dijitSelect.alt-success .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-success .dijitArrowButton {
|
|
background: #43a047;
|
|
color: #fff;
|
|
border-color: #37823a;
|
|
}
|
|
.flat .dijitComboButton.alt-success .dijitStretch {
|
|
border-right-color: #37823a;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-success .dijitStretch {
|
|
border-left-color: #37823a;
|
|
}
|
|
.flat .dijitButton.alt-info .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-info .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-info .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-info .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-info .dijitButtonNode,
|
|
.flat .dijitSelect.alt-info .dijitButtonContents,
|
|
.flat .dijitSelect.alt-info .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-info .dijitArrowButton {
|
|
background: #03a9f4;
|
|
color: #fff;
|
|
border-color: #028ac7;
|
|
}
|
|
.flat .dijitComboButton.alt-info .dijitStretch {
|
|
border-right-color: #028ac7;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-info .dijitStretch {
|
|
border-left-color: #028ac7;
|
|
}
|
|
.flat .dijitButton.alt-warning .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-warning .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-warning .dijitButtonNode,
|
|
.flat .dijitSelect.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelect.alt-warning .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-warning .dijitArrowButton {
|
|
background: #fb8c00;
|
|
color: #fff;
|
|
border-color: #cd7200;
|
|
}
|
|
.flat .dijitComboButton.alt-warning .dijitStretch {
|
|
border-right-color: #cd7200;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-warning .dijitStretch {
|
|
border-left-color: #cd7200;
|
|
}
|
|
.flat .dijitButton.alt-danger .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-danger .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-danger .dijitButtonNode,
|
|
.flat .dijitSelect.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelect.alt-danger .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-danger .dijitArrowButton {
|
|
background: #e53935;
|
|
color: #fff;
|
|
border-color: #cc1e1a;
|
|
}
|
|
.flat .dijitComboButton.alt-danger .dijitStretch {
|
|
border-right-color: #cc1e1a;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-danger .dijitStretch {
|
|
border-left-color: #cc1e1a;
|
|
}
|
|
.flat .dijitButton.alt-inverse .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-inverse .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSelect.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelect.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-inverse .dijitArrowButton {
|
|
background: #616161;
|
|
color: #fff;
|
|
border-color: #4f4f4f;
|
|
}
|
|
.flat .dijitComboButton.alt-inverse .dijitStretch {
|
|
border-right-color: #4f4f4f;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-inverse .dijitStretch {
|
|
border-left-color: #4f4f4f;
|
|
}
|
|
.flat .dijitButtonHover .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover .dijitButtonNode,
|
|
.flat .dijitToggleButtonHover .dijitButtonNode {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitComboButton .dijitButtonNodeHover,
|
|
.flat .dijitComboButton .dijitDownArrowButtonHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitButtonHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-primary .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-primary .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-primary .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-primary .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-primary .dijitDownArrowButtonHover {
|
|
background: #1981dd;
|
|
border-color: #1774c5;
|
|
}
|
|
.flat .dijitButtonHover.alt-success .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-success .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-success .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-success .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-success .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-success .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-success .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-success .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-success .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-success .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-success .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-success .dijitDownArrowButtonHover {
|
|
background: #409843;
|
|
border-color: #39883c;
|
|
}
|
|
.flat .dijitButtonHover.alt-info .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-info .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-info .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-info .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-info .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-info .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-info .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-info .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-info .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-info .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-info .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-info .dijitDownArrowButtonHover {
|
|
background: #03a1e8;
|
|
border-color: #0390cf;
|
|
}
|
|
.flat .dijitButtonHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-warning .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-warning .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-warning .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-warning .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-warning .dijitDownArrowButtonHover {
|
|
background: #ee8500;
|
|
border-color: #d57700;
|
|
}
|
|
.flat .dijitButtonHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-danger .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-danger .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-danger .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-danger .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-danger .dijitDownArrowButtonHover {
|
|
background: #e32d29;
|
|
border-color: #d4201b;
|
|
}
|
|
.flat .dijitButtonHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-inverse .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-inverse .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-inverse .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-inverse .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-inverse .dijitDownArrowButtonHover {
|
|
background: #5c5c5c;
|
|
border-color: #525252;
|
|
}
|
|
.flat .dijitButtonActive .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive .dijitButtonNode,
|
|
.flat .dijitToggleButtonActive .dijitButtonNode,
|
|
.flat .dijitToggleButtonChecked .dijitButtonNode {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitComboButton .dijitButtonNodeActive,
|
|
.flat .dijitComboButton .dijitDownArrowButtonActive {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitButtonActive.alt-primary .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-primary .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-primary .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-primary .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-primary .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-primary .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-primary .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-primary .dijitDownArrowButtonActive {
|
|
background: #1878cc;
|
|
border-color: #135fa3;
|
|
}
|
|
.flat .dijitButtonActive.alt-success .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-success .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-success .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-success .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-success .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-success .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-success .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-success .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-success .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-success .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-success .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-success .dijitDownArrowButtonActive {
|
|
background: #3b8d3e;
|
|
border-color: #2f7032;
|
|
}
|
|
.flat .dijitButtonActive.alt-info .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-info .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-info .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-info .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-info .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-info .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-info .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-info .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-info .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-info .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-info .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-info .dijitDownArrowButtonActive {
|
|
background: #0395d7;
|
|
border-color: #0276ab;
|
|
}
|
|
.flat .dijitButtonActive.alt-warning .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-warning .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-warning .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-warning .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-warning .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-warning .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-warning .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-warning .dijitDownArrowButtonActive {
|
|
background: #dd7b00;
|
|
border-color: #b06200;
|
|
}
|
|
.flat .dijitButtonActive.alt-danger .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-danger .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-danger .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-danger .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-danger .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-danger .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-danger .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-danger .dijitDownArrowButtonActive {
|
|
background: #dc211c;
|
|
border-color: #af1a17;
|
|
}
|
|
.flat .dijitButtonActive.alt-inverse .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-inverse .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-inverse .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-inverse .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-inverse .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-inverse .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-inverse .dijitDownArrowButtonActive {
|
|
background: #555;
|
|
border-color: #444;
|
|
}
|
|
.flat .dijitButtonDisabled,
|
|
.flat .dijitDropDownButtonDisabled,
|
|
.flat .dijitComboButtonDisabled,
|
|
.flat .dijitToggleButtonDisabled {
|
|
outline: none;
|
|
}
|
|
.flat .dijitButtonDisabled .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled .dijitButtonNode {
|
|
cursor: default;
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-primary .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-primary .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-primary .dijitButtonNode {
|
|
background: #6db2ee;
|
|
border-color: #50a2eb;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-primary .dijitStretch {
|
|
border-right-color: #50a2eb;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-primary .dijitStretch {
|
|
border-left-color: #50a2eb;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-primary .dijitButtonNode {
|
|
border-left-color: #50a2eb;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-primary .dijitButtonNode {
|
|
border-right-color: #50a2eb;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-primary .dijitButtonNode {
|
|
border-left-color: #50a2eb;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-primary .dijitButtonNode {
|
|
border-right-color: #50a2eb;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-primary .dijitButtonNode {
|
|
border-left-color: #50a2eb;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-primary .dijitButtonNode {
|
|
border-right-color: #50a2eb;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-success .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-success .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-success .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-success .dijitButtonNode {
|
|
background: #7dc981;
|
|
border-color: #63be67;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-success .dijitStretch {
|
|
border-right-color: #63be67;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-success .dijitStretch {
|
|
border-left-color: #63be67;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-success .dijitButtonNode {
|
|
border-left-color: #63be67;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-success .dijitButtonNode {
|
|
border-right-color: #63be67;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-success .dijitButtonNode {
|
|
border-left-color: #63be67;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-success .dijitButtonNode {
|
|
border-right-color: #63be67;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-success .dijitButtonNode {
|
|
border-left-color: #63be67;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-success .dijitButtonNode {
|
|
border-right-color: #63be67;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-info .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-info .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-info .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-info .dijitButtonNode {
|
|
background: #56c9fd;
|
|
border-color: #34befd;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-info .dijitStretch {
|
|
border-right-color: #34befd;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-info .dijitStretch {
|
|
border-left-color: #34befd;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-info .dijitButtonNode {
|
|
border-left-color: #34befd;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-info .dijitButtonNode {
|
|
border-right-color: #34befd;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-info .dijitButtonNode {
|
|
border-left-color: #34befd;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-info .dijitButtonNode {
|
|
border-right-color: #34befd;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-info .dijitButtonNode {
|
|
border-left-color: #34befd;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-info .dijitButtonNode {
|
|
border-right-color: #34befd;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-warning .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-warning .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-warning .dijitButtonNode {
|
|
background: #ffb557;
|
|
border-color: #ffa635;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-warning .dijitStretch {
|
|
border-right-color: #ffa635;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-warning .dijitStretch {
|
|
border-left-color: #ffa635;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-warning .dijitButtonNode {
|
|
border-left-color: #ffa635;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-warning .dijitButtonNode {
|
|
border-right-color: #ffa635;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-warning .dijitButtonNode {
|
|
border-left-color: #ffa635;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-warning .dijitButtonNode {
|
|
border-right-color: #ffa635;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-warning .dijitButtonNode {
|
|
border-left-color: #ffa635;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-warning .dijitButtonNode {
|
|
border-right-color: #ffa635;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-danger .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-danger .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-danger .dijitButtonNode {
|
|
background: #ee7e7c;
|
|
border-color: #eb6561;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-danger .dijitStretch {
|
|
border-right-color: #eb6561;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-danger .dijitStretch {
|
|
border-left-color: #eb6561;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-danger .dijitButtonNode {
|
|
border-left-color: #eb6561;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-danger .dijitButtonNode {
|
|
border-right-color: #eb6561;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-danger .dijitButtonNode {
|
|
border-left-color: #eb6561;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-danger .dijitButtonNode {
|
|
border-right-color: #eb6561;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-danger .dijitButtonNode {
|
|
border-left-color: #eb6561;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-danger .dijitButtonNode {
|
|
border-right-color: #eb6561;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-inverse .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-inverse .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-inverse .dijitButtonNode {
|
|
background: #989898;
|
|
border-color: #848484;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-inverse .dijitStretch {
|
|
border-right-color: #848484;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-inverse .dijitStretch {
|
|
border-left-color: #848484;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-inverse .dijitButtonNode {
|
|
border-left-color: #848484;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-inverse .dijitButtonNode {
|
|
border-right-color: #848484;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-inverse .dijitButtonNode {
|
|
border-left-color: #848484;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-inverse .dijitButtonNode {
|
|
border-right-color: #848484;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-inverse .dijitButtonNode {
|
|
border-left-color: #848484;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-inverse .dijitButtonNode {
|
|
border-right-color: #848484;
|
|
}
|
|
.flat .dijitComboButtonDisabled .dijitArrowButton {
|
|
border-left-width: 0;
|
|
}
|
|
.flat .dijitDropDownButton .dijitButtonNode {
|
|
padding-right: 8px;
|
|
}
|
|
.flat table.dijitComboButton {
|
|
border-collapse: separate; /* override dijit.css so that ComboBox rounded corners work */
|
|
}
|
|
.flat table.dijitComboButton .dijitStretch {
|
|
border-radius: 4px 0 0 4px;
|
|
}
|
|
.flat table.dijitComboButton .dijitArrowButton {
|
|
padding: 4px;
|
|
width: 20px;
|
|
border-radius: 0 4px 4px 0;
|
|
border-left-width: 0;
|
|
}
|
|
.flat .dijitToggleButton .dijitCheckBoxIcon {
|
|
display: none;
|
|
}
|
|
.flat .dijitToggleButtonChecked .dijitIcon {
|
|
display: inline-block;
|
|
}
|
|
.flat .dijitDropDownButton .dijitArrowButtonInner {
|
|
margin-left: 3px;
|
|
}
|
|
.flat .dijitDropDownButton .dijitArrowButtonInner,
|
|
.flat .dijitArrowButton {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.flat .dijitDropDownButton .dijitArrowButtonInner:before,
|
|
.flat .dijitArrowButton:before {
|
|
content: "\f002";
|
|
}
|
|
.flat .dijitLeftArrowButton:before {
|
|
content: "\f000";
|
|
}
|
|
.flat .dijitRightArrowButton:before {
|
|
content: "\f001";
|
|
}
|
|
.flat .dijitUpArrowButton:before {
|
|
content: "\f003";
|
|
}
|
|
/* Toolbar
|
|
*
|
|
* Styling Toolbar means styling the toolbar container and the widget inside toolbar (dijitToolbar)
|
|
*
|
|
* 1. toolbar (default styling):
|
|
* .dijitToolbar - styles for outer container
|
|
*
|
|
* 2. widget inside toolbar
|
|
* .dijitToolbar .dijitButtonNode - Button widget
|
|
* .dijitComboButton - ComboButton widget
|
|
* .dijitDropDownButton - DropDownButton widget
|
|
* .dijitToggleButton - ToggleButton widget
|
|
*
|
|
* 3. hovered widget inside toolbar (ie, mouse hover on the widget inside)
|
|
* .dijitToolbar .dijitButtonNodeHover - styles for hovered Button widget
|
|
*
|
|
* 4. actived widget inside toolbar (ie, mouse down on the widget inside)
|
|
* .dijitToolbar .dijitButtonNodeActive - mouse down on Button widget
|
|
*/
|
|
.flat .dijitToolbar {
|
|
background-color: #f5f5f5;
|
|
padding: 4px;
|
|
zoom: 1;
|
|
/* Override default button styles */
|
|
/* Hover */
|
|
/*
|
|
.dijitComboButtonHover {
|
|
.dijitButtonNode,
|
|
.dijitDownArrowButton {
|
|
}
|
|
|
|
.dijitButtonNodeHover,
|
|
.dijitDownArrowButtonHover {
|
|
}
|
|
}
|
|
*/
|
|
/* Active */
|
|
/* Toggle button checked status */
|
|
}
|
|
.flat .dijitToolbar label {
|
|
padding: 8px;
|
|
}
|
|
.flat .dijitToolbar .dijitToggleButton,
|
|
.flat .dijitToolbar .dijitButton,
|
|
.flat .dijitToolbar .dijitDropDownButton,
|
|
.flat .dijitToolbar .dijitComboButton {
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitToolbar .dijitButton .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitDropDownButton .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitComboButton .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitToggleButton .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitComboBox .dijitButtonNode {
|
|
border-color: transparent;
|
|
padding: 4px;
|
|
background-color: transparent;
|
|
border-radius: 4px;
|
|
-webkit-transition-property: background-color;
|
|
-moz-transition-property: background-color;
|
|
-o-transition-property: background-color;
|
|
-ms-transition-property: background-color;
|
|
transition-property: background-color;
|
|
-webkit-transition-duration: 0.3s;
|
|
-moz-transition-duration: 0.3s;
|
|
-o-transition-duration: 0.3s;
|
|
-ms-transition-duration: 0.3s;
|
|
transition-duration: 0.3s;
|
|
}
|
|
.flat .dijitToolbar .dijitComboButton .dijitStretch {
|
|
/* no rounded border on side adjacent to arrow */
|
|
border-radius: 4px 0 0 4px;
|
|
}
|
|
.flat .dijitToolbar .dijitComboButton .dijitArrowButton {
|
|
/* no rounded border on side adjacent to button */
|
|
border-radius: 0 4px 4px 0;
|
|
}
|
|
.flat .dijitToolbar .dijitComboBox .dijitButtonNode {
|
|
padding: 0 8px;
|
|
}
|
|
.flat .dijitToolbar .dijitComboBox .dijitInputInner {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitToolbar .dijitDropDownButton .dijitArrowButtonInner {
|
|
margin-left: 4px;
|
|
}
|
|
.flat .dijitToolbar .dijitButtonHover .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitDropDownButtonHover .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitToggleButtonHover .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitComboButtonHover .dijitButtonNode {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitToolbar .dijitButtonActive .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitDropDownButtonActive .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitToggleButtonActive .dijitButtonNode {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitToolbar .dijitToggleButtonChecked .dijitButtonNode {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitToolbarSeparator {
|
|
width: 1px;
|
|
height: 20px;
|
|
background-color: #ccc;
|
|
padding: 0;
|
|
margin: 0 4px;
|
|
}
|
|
.flat .dijitDisabled .dijitToolbar {
|
|
background-color: #f5f5f5;
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
/* ProgressBar
|
|
*
|
|
* Styling of the ProgressBar consists of the following:
|
|
*
|
|
* 1. the base progress bar
|
|
* .dijitProgressBar - sets margins for the progress bar
|
|
*
|
|
* 2. the empty bar
|
|
* .dijitProgressBarEmpty - sets background img and color for bar or parts of bar that are not finished yet
|
|
* Also sets border color for whole bar
|
|
*
|
|
* 3. tile mode
|
|
* .dijitProgressBarTile
|
|
* inner container for finished portion when in 'tile' (image) mode
|
|
*
|
|
* 4. full bar mode
|
|
* .dijitProgressBarFull
|
|
* adds border to right side of the filled portion of bar
|
|
*
|
|
* 5. text for label of bar
|
|
* .dijitProgressBarLabel - sets text color, which must contrast with both the "Empty" and "Full" parts.
|
|
*
|
|
* 6. indeterminate mode
|
|
* .dijitProgressBarIndeterminate .dijitProgressBarTile
|
|
* sets animated gif for the progress bar in 'indeterminate' mode
|
|
*/
|
|
.flat .dijitProgressBar {
|
|
background-color: #e0e0e0;
|
|
border: 0 none;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitProgressBarTile {
|
|
background: url("images/progressBarStrips.png") repeat-x top;
|
|
-webkit-animation: progress-bar-stripes 2s linear infinite;
|
|
-moz-animation: progress-bar-stripes 2s linear infinite;
|
|
-o-animation: progress-bar-stripes 2s linear infinite;
|
|
-ms-animation: progress-bar-stripes 2s linear infinite;
|
|
animation: progress-bar-stripes 2s linear infinite;
|
|
}
|
|
.flat .dijitProgressBarFull {
|
|
background-color: #257aa7;
|
|
-webkit-transition-property: width;
|
|
-moz-transition-property: width;
|
|
-o-transition-property: width;
|
|
-ms-transition-property: width;
|
|
transition-property: width;
|
|
-webkit-transition-duration: 0.25s;
|
|
-moz-transition-duration: 0.25s;
|
|
-o-transition-duration: 0.25s;
|
|
-ms-transition-duration: 0.25s;
|
|
transition-duration: 0.25s;
|
|
height: 100%;
|
|
}
|
|
.flat .dijitProgressBar.alt-primary .dijitProgressBarFull {
|
|
background-color: #1e88e5;
|
|
}
|
|
.flat .dijitProgressBar.alt-success .dijitProgressBarFull {
|
|
background-color: #43a047;
|
|
}
|
|
.flat .dijitProgressBar.alt-info .dijitProgressBarFull {
|
|
background-color: #03a9f4;
|
|
}
|
|
.flat .dijitProgressBar.alt-warning .dijitProgressBarFull {
|
|
background-color: #fb8c00;
|
|
}
|
|
.flat .dijitProgressBar.alt-danger .dijitProgressBarFull {
|
|
background-color: #e53935;
|
|
}
|
|
.flat .dijitProgressBar.alt-inverse .dijitProgressBarFull {
|
|
background-color: #616161;
|
|
}
|
|
.flat .dijitProgressBarLabel {
|
|
margin-top: 0.2em;
|
|
margin-bottom: 0.2em;
|
|
color: #fff;
|
|
font-size: 1em;
|
|
text-shadow: 0.1em 0.1em 1px #424242;
|
|
}
|
|
@-moz-keyframes progress-bar-stripes {
|
|
from {
|
|
background-position: 75px 0;
|
|
}
|
|
to {
|
|
background-position: 0 0;
|
|
}
|
|
}
|
|
@-webkit-keyframes progress-bar-stripes {
|
|
from {
|
|
background-position: 75px 0;
|
|
}
|
|
to {
|
|
background-position: 0 0;
|
|
}
|
|
}
|
|
@-o-keyframes progress-bar-stripes {
|
|
from {
|
|
background-position: 75px 0;
|
|
}
|
|
to {
|
|
background-position: 0 0;
|
|
}
|
|
}
|
|
@keyframes progress-bar-stripes {
|
|
from {
|
|
background-position: 75px 0;
|
|
}
|
|
to {
|
|
background-position: 0 0;
|
|
}
|
|
}
|
|
.flat .dijitTreeRtl {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitTreeRtl .dijitTreeContainer {
|
|
float: right;
|
|
}
|
|
.flat .dijitTreeRtl .dijitTreeExpandoClosed:before {
|
|
content: "\e60b";
|
|
}
|
|
/* TitlePane and Fieldset
|
|
*
|
|
* 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
|
|
*/
|
|
.flat .dijitTitlePaneTitle {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitTitlePaneTitleHover,
|
|
.flat .dijitFieldsetTitleHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitTitlePaneTitleActive,
|
|
.flat .dijitFieldsetTitleActive {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitFieldset {
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitFieldset .dijitArrowNodeInner {
|
|
display: none;
|
|
}
|
|
.flat .dijitFieldset .dijitFieldsetTitleClosed .dijitArrowNode:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitTitlePane .dijitArrowNode,
|
|
.flat .dijitFieldset .dijitArrowNode {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
font-size: 18px;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitTitlePane .dijitArrowNode:before,
|
|
.flat .dijitFieldset .dijitArrowNode:before {
|
|
content: "\f007";
|
|
}
|
|
.flat .dijitTitlePane .dijitClosed,
|
|
.flat .dijitFieldset .dijitClosed {
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitTitlePane .dijitClosed .dijitArrowNode:before,
|
|
.flat .dijitFieldset .dijitClosed .dijitArrowNode:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitTitlePaneContentOuter {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-top: none;
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
.flat .dijitFieldset {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitTitlePaneContentInner,
|
|
.flat .dijitFieldsetContentInner {
|
|
padding: 8px;
|
|
}
|
|
.flat .dijitTitlePaneTextNode,
|
|
.flat .dijitFieldsetLegendNode {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
vertical-align: text-top;
|
|
}
|
|
.flat .dijitFieldsetLegendNode {
|
|
cursor: default;
|
|
}
|
|
/* Time Picker
|
|
*
|
|
* Styling the Time Picker consists of the following:
|
|
*
|
|
* 1. minor time values
|
|
* .dijitTimePickerTick - set text color, size, background color of minor values
|
|
* .dijitTimePickerTickHover - set hover style of minor time values
|
|
* dijitTimePickerTickSelected - set selected style of minor time values
|
|
*
|
|
* 2. major time values - 1:00, 2:00, times on the hour
|
|
* set text color, size, background color, left/right margins for "zoom" affect
|
|
* .dijitTimePickerMarkerHover - to set hover style of major time values
|
|
* .dijitTimePickerMarkerSelected - set selected style of major time values
|
|
*
|
|
* 3. up and down arrow buttons
|
|
* .dijitTimePicker .dijitButtonNode - background-color, border
|
|
* .dijitTimePicker .dijitUpArrowHover, .dijitTimePicker .dijitDownArrowHover - set background-color for hover state
|
|
*
|
|
* Other classes provide the fundamental structure of the TimePicker and should not be modified.
|
|
*/
|
|
.dijitTimePickerPopup {
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
height: 200px;
|
|
}
|
|
.dijitTimePicker {
|
|
background-color: #fff;
|
|
padding: 4px 0;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
}
|
|
.dijitTimePickerItem {
|
|
margin: 0;
|
|
}
|
|
.dijitTimePickerTick {
|
|
/* minor value */
|
|
color: #9e9e9e;
|
|
border: 0 none;
|
|
}
|
|
.dijitTimePickerMarker {
|
|
/* major value - 1:00, 2:00, times on the hour */
|
|
background-color: transparent;
|
|
white-space: nowrap;
|
|
border: 0 none;
|
|
}
|
|
.dijitTimePickerTickHover,
|
|
.dijitTimePickerMarkerHover {
|
|
background: #f2f2f2;
|
|
color: #424242;
|
|
}
|
|
.dijitTimePickerMarkerSelected,
|
|
.dijitTimePickerTickSelected {
|
|
background: #f2f2f2;
|
|
color: #424242;
|
|
}
|
|
.dijitTimePickerTick .dijitTimePickerItemInner,
|
|
.dijitTimePickerMarker .dijitTimePickerItemInner {
|
|
padding: 8px;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitCalendarRtl .dijitCalendarDecrease:before {
|
|
content: "\f001";
|
|
}
|
|
.flat .dijitCalendarRtl .dijitCalendarIncrease:before {
|
|
content: "\f000";
|
|
}
|
|
/* InlineEditBox
|
|
*
|
|
* Styling InlineEditBox mainly includes:
|
|
*
|
|
* 1. Normal state
|
|
* .dijitInlineEditBoxDisplayMode - for border
|
|
*
|
|
* 2. Hover state
|
|
* .dijitInlineEditBoxDisplayModeHover - for border and background color
|
|
*/
|
|
.flat .dijitInlineEditBoxDisplayMode {
|
|
border: 1px dashed transparent;
|
|
padding: 4px 6px;
|
|
}
|
|
.flat .dijitInlineEditBoxDisplayModeHover {
|
|
background-color: transparent;
|
|
border: 1px dashed #257aa7;
|
|
}
|
|
.flat .dijitInlineEditBoxDisplayModeDisabled {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitMenuBarRtl {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitMenuItemRtl {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitMenuItemRtl .dijitMenuExpand:before {
|
|
content: "\f000";
|
|
}
|
|
/* Dialog
|
|
*
|
|
* Styling Dialog includes two sections: Dialog and Tooltip & TooltipDialog
|
|
*
|
|
* Dialog:
|
|
* 1. Dialog (default styling):
|
|
* .dijitDialog - styles for dialog's bounding box
|
|
*
|
|
* 2. Dialog title
|
|
* .dijitDialogTitleBar - styles for the title container at the top of dialog
|
|
* .dijitDialogTitle - the text container in dialog title
|
|
*
|
|
* 3. Dialog content
|
|
* .dijitDialogPaneContent - main container for content area and action bar
|
|
* .dijitDialogPaneContentArea - styles for content container
|
|
*
|
|
* 4. Dialog action bar
|
|
* .dijitDialogPaneActionBar - styles for action buttons lie at the bottom of dialog pane content
|
|
*
|
|
* 5. Dialog underlay
|
|
* .dijitDialogUnderlay - div under the dialog which used for separate dialog and page content
|
|
*
|
|
*
|
|
* Tooltip & TooltipDialog:
|
|
* 1. tooltip content container:
|
|
* .dijitTooltipContainer - tooltip content container
|
|
*
|
|
* 2. tooltip connector:
|
|
* .dijitTooltipConnector - tooltip anchor includes 4 direction(up, down, left, right)
|
|
*/
|
|
.flat .dijitDialog {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
}
|
|
.flat .dijitDialogPaneContent {
|
|
background-color: #fff;
|
|
border-radius: 0 0 4px 4px;
|
|
padding: 8px;
|
|
position: relative;
|
|
}
|
|
.flat .dijitDialogPaneActionBar {
|
|
/* the bar at bottom with OK/Cancel buttons */
|
|
padding-top: 8px;
|
|
text-align: right;
|
|
position: relative;
|
|
}
|
|
.flat .dijitDialogPaneActionBar .dijitButton {
|
|
float: none;
|
|
}
|
|
.flat .dijitTooltipDialog .dijitDialogPaneActionBar {
|
|
border-radius: 0 0 4px 4px;
|
|
margin: 8px 0 0;
|
|
}
|
|
.flat .dijitDialogTitleBar {
|
|
/* outer container for the titlebar of the dialog */
|
|
line-height: 20px;
|
|
border-bottom: 1px solid #e0e0e0;
|
|
padding: 8px 12px;
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitDialogTitle {
|
|
/* typography and styling of the dialog title */
|
|
font-size: 1.1em;
|
|
font-weight: bold;
|
|
}
|
|
.flat .dijitDialogCloseIcon {
|
|
/* the default close icon for the dialog */
|
|
width: 20px;
|
|
height: 20px;
|
|
line-height: 20px;
|
|
text-align: center;
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 12px;
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitDialogCloseIcon:before {
|
|
content: "\f00e";
|
|
font-size: 20px;
|
|
}
|
|
.flat .dijitDialogCloseIcon .closeText {
|
|
display: none;
|
|
}
|
|
.flat .dijitDialogCloseIconHover,
|
|
.flat .dijitDialogCloseIconActive {
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitDialogUnderlay {
|
|
background: #000;
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitTooltip,
|
|
.flat .dijitTooltipDialog {
|
|
/* the outermost dom node, holding the connector and container */
|
|
background: transparent; /* make the area on the sides of the arrow transparent */
|
|
}
|
|
.flat .dijitTooltipContainer {
|
|
background-color: #424242;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
padding: 4px 8px;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitTooltip .dijitTooltipContainer {
|
|
color: #fff;
|
|
border: 0 none;
|
|
}
|
|
.flat .dijitTooltipConnector {
|
|
/* the arrow */
|
|
z-index: 2;
|
|
width: auto;
|
|
height: auto;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitTooltipABRight .dijitTooltipConnector {
|
|
/* above or below tooltip, but the arrow appears on the right,
|
|
and the right edges of target and tooltip are aligned rather than the left */
|
|
left: auto !important;
|
|
right: 8px;
|
|
}
|
|
.flat .dijitTooltipBelow {
|
|
/* leave room for arrow above content */
|
|
padding-top: 4px;
|
|
}
|
|
.flat .dijitTooltipBelow .dijitTooltipConnector {
|
|
/* the arrow piece for tooltips below an element */
|
|
top: 0;
|
|
left: 8px;
|
|
border-bottom: 4px solid #424242;
|
|
border-left: 4px solid transparent;
|
|
border-right: 4px solid transparent;
|
|
border-top: 0;
|
|
}
|
|
.flat .dijitTooltipAbove {
|
|
/* leave room for arrow below content */
|
|
padding-bottom: 4px;
|
|
}
|
|
.flat .dijitTooltipAbove .dijitTooltipConnector {
|
|
/* the arrow piece for tooltips above an element */
|
|
bottom: 0;
|
|
left: 8px;
|
|
border-top: 4px solid #424242;
|
|
border-left: 4px solid transparent;
|
|
border-right: 4px solid transparent;
|
|
border-bottom: 0;
|
|
}
|
|
.flat .dijitTooltipLeft {
|
|
padding-right: 4px;
|
|
}
|
|
.flat .dijitTooltipLeft .dijitTooltipConnector {
|
|
/* the arrow piece for tooltips to the left of an element, bottom borders aligned */
|
|
right: 0;
|
|
border-left: 4px solid #424242;
|
|
border-bottom: 4px solid transparent;
|
|
border-top: 4px solid transparent;
|
|
border-right: 0;
|
|
}
|
|
.flat .dijitTooltipRight {
|
|
padding-left: 4px;
|
|
}
|
|
.flat .dijitTooltipRight .dijitTooltipConnector {
|
|
/* the arrow piece for tooltips to the right of an element, bottom borders aligned */
|
|
left: 0;
|
|
border-bottom: 4px solid transparent;
|
|
border-top: 4px solid transparent;
|
|
border-right: 4px solid #424242;
|
|
}
|
|
.flat .dijitTooltipDialog .dijitTooltipContainer {
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipBelow {
|
|
padding-top: 6px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipAbove {
|
|
padding-bottom: 6px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipLeft {
|
|
padding-right: 6px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipRight {
|
|
padding-left: 6px;
|
|
}
|
|
.flat .dijitTooltipDialog .dijitTooltipConnector {
|
|
height: 0;
|
|
width: 0;
|
|
position: absolute;
|
|
z-index: 2;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitTooltipDialog .dijitTooltipConnector:after {
|
|
content: "";
|
|
height: 0;
|
|
width: 0;
|
|
position: absolute;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipAbove .dijitTooltipConnector {
|
|
border-color: #ccc transparent transparent;
|
|
border-width: 7px 7px 0; /* one extra pixel is added as the border of the arrows */
|
|
border-style: solid;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipAbove .dijitTooltipConnector:after {
|
|
border-color: #fff transparent transparent;
|
|
border-width: 6px 6px 0;
|
|
border-style: solid;
|
|
left: -6px;
|
|
top: -7px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipBelow .dijitTooltipConnector {
|
|
border-color: transparent transparent #ccc;
|
|
border-width: 0 7px 7px;
|
|
border-style: solid;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipBelow .dijitTooltipConnector:after {
|
|
border-color: transparent transparent #fff;
|
|
border-width: 0 6px 6px;
|
|
border-style: solid;
|
|
left: -6px;
|
|
bottom: -7px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipLeft .dijitTooltipConnector {
|
|
border-color: transparent transparent transparent #ccc;
|
|
border-width: 7px 0 7px 7px;
|
|
border-style: solid;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipLeft .dijitTooltipConnector:after {
|
|
border-color: transparent transparent transparent #fff;
|
|
border-width: 6px 0 6px 6px;
|
|
border-style: solid;
|
|
top: -6px;
|
|
left: -7px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipRight .dijitTooltipConnector {
|
|
border-color: transparent #ccc transparent transparent;
|
|
border-width: 7px 7px 7px 0;
|
|
border-style: solid;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipRight .dijitTooltipConnector:after {
|
|
border-color: transparent #fff transparent transparent;
|
|
border-width: 6px 6px 6px 0;
|
|
border-style: solid;
|
|
top: -6px;
|
|
right: -7px;
|
|
}
|
|
/* Tree
|
|
*
|
|
* Styling Tree mostly means styling the TreeRow (dijitTreeRow)
|
|
* There are 4 basic states to style:
|
|
*
|
|
* Tree Row:
|
|
* 1. tree row (default styling):
|
|
* .dijitTreeRow - styles for each row of the tree
|
|
*
|
|
* 2. hovered tree row (mouse hover on a tree row)
|
|
* .dijitTreeRowHover - styles when mouse over on one row
|
|
*
|
|
* 3. active tree row (mouse down on a tree row)
|
|
* .dijitTreeRowActive - styles when mouse down on one row
|
|
*
|
|
* 4. selected tree row
|
|
* dijitTreeRowSelected - style when the row has been selected
|
|
*
|
|
* Tree Expando:
|
|
* dijitTreeExpando - the expando at the left of the text of each tree row
|
|
*
|
|
*/
|
|
.flat .dijitTreeIsRoot {
|
|
background-color: transparent;
|
|
}
|
|
.flat .dijitTreeRow,
|
|
.flat .dijitTreeNode .dojoDndItemBefore,
|
|
.flat .dijitTreeNode .dojoDndItemAfter {
|
|
padding: 8px 0;
|
|
border: 0 transparent;
|
|
line-height: 20px;
|
|
-webkit-transition-property: background-color;
|
|
-moz-transition-property: background-color;
|
|
-o-transition-property: background-color;
|
|
-ms-transition-property: background-color;
|
|
transition-property: background-color;
|
|
-webkit-transition-duration: 0.15s;
|
|
-moz-transition-duration: 0.15s;
|
|
-o-transition-duration: 0.15s;
|
|
-ms-transition-duration: 0.15s;
|
|
transition-duration: 0.15s;
|
|
-webkit-transition-timing-function: ease-out;
|
|
-moz-transition-timing-function: ease-out;
|
|
-o-transition-timing-function: ease-out;
|
|
-ms-transition-timing-function: ease-out;
|
|
transition-timing-function: ease-out;
|
|
}
|
|
.flat .dijitTreeRowHover {
|
|
background-color: #f2f2f2;
|
|
border-color: transparent;
|
|
-webkit-transition-duration: 0.15s;
|
|
-moz-transition-duration: 0.15s;
|
|
-o-transition-duration: 0.15s;
|
|
-ms-transition-duration: 0.15s;
|
|
transition-duration: 0.15s;
|
|
}
|
|
.flat .dijitTreeRowActive {
|
|
background-color: #f2f2f2;
|
|
border-color: transparent;
|
|
}
|
|
.flat .dijitTreeRowSelected,
|
|
.flat .dijitTreeRowHover.dijitTreeRowSelected,
|
|
.flat .dijitTreeRowActive.dijitTreeRowSelected {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
border-color: transparent;
|
|
}
|
|
.flat .dijitTreeRowSelected .dijitTreeExpando,
|
|
.flat .dijitTreeRowHover.dijitTreeRowSelected .dijitTreeExpando,
|
|
.flat .dijitTreeRowActive.dijitTreeRowSelected .dijitTreeExpando {
|
|
color: #fff;
|
|
}
|
|
.flat .dijitTreeExpando {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
width: 14px;
|
|
height: 14px;
|
|
line-height: 14px;
|
|
text-align: center;
|
|
margin-left: 4px;
|
|
margin-right: 4px;
|
|
color: #257aa7;
|
|
vertical-align: middle;
|
|
}
|
|
.flat .dijitTreeExpandoOpened:before {
|
|
content: "\f012";
|
|
cursor: pointer;
|
|
}
|
|
.flat .dijitTreeExpandoClosed:before {
|
|
content: "\f011";
|
|
}
|
|
.flat .dijitTreeExpandoLoading {
|
|
-webkit-animation: spinning 2s linear infinite;
|
|
-moz-animation: spinning 2s linear infinite;
|
|
-o-animation: spinning 2s linear infinite;
|
|
-ms-animation: spinning 2s linear infinite;
|
|
animation: spinning 2s linear infinite;
|
|
}
|
|
.flat .dijitTreeExpandoLoading:before {
|
|
content: "\f01d";
|
|
}
|
|
.dj_ie8 .dijitTreeExpandoLoading,
|
|
.dj_ie9 .dijitTreeExpandoLoading {
|
|
background: url("images/loadingAnimation.gif") no-repeat;
|
|
}
|
|
.dj_ie8 .dijitTreeExpandoLoading:before,
|
|
.dj_ie9 .dijitTreeExpandoLoading:before {
|
|
content: "";
|
|
}
|
|
@-moz-keyframes spinning {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(-360deg);
|
|
-moz-transform: rotate(-360deg);
|
|
-o-transform: rotate(-360deg);
|
|
-ms-transform: rotate(-360deg);
|
|
transform: rotate(-360deg);
|
|
}
|
|
}
|
|
@-webkit-keyframes spinning {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(-360deg);
|
|
-moz-transform: rotate(-360deg);
|
|
-o-transform: rotate(-360deg);
|
|
-ms-transform: rotate(-360deg);
|
|
transform: rotate(-360deg);
|
|
}
|
|
}
|
|
@-o-keyframes spinning {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(-360deg);
|
|
-moz-transform: rotate(-360deg);
|
|
-o-transform: rotate(-360deg);
|
|
-ms-transform: rotate(-360deg);
|
|
transform: rotate(-360deg);
|
|
}
|
|
}
|
|
@keyframes spinning {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(-360deg);
|
|
-moz-transform: rotate(-360deg);
|
|
-o-transform: rotate(-360deg);
|
|
-ms-transform: rotate(-360deg);
|
|
transform: rotate(-360deg);
|
|
}
|
|
}
|
|
/* ColorPalette
|
|
*
|
|
* Styling of the ColorPalette consists of the following:
|
|
*
|
|
* 1. the whole color palette
|
|
* .dijitColorPalette - for outline, border, and background color of the whole color palette
|
|
* Note: outline does not work for IE
|
|
*
|
|
* 2. the color swatch
|
|
* .dijitColorPalette .dijitPaletteImg
|
|
* transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
|
|
* displays border around a color swatch
|
|
*
|
|
* 3. hovered swatch
|
|
* .dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg
|
|
* the hovered state of the color swatch - adds border
|
|
*
|
|
* 4. active and selected swatch
|
|
* .dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg
|
|
* .dijitColorPalette .dijitPaletteCellSelected .dijitPaletteImg
|
|
* adds border for active or selected state
|
|
*/
|
|
.flat .dijitColorPalette {
|
|
border: 1px solid #ccc;
|
|
background-color: #fff;
|
|
border-radius: 4px;
|
|
/* swatch */
|
|
}
|
|
.flat .dijitColorPalette .dijitPaletteTable {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitColorPalette .dijitColorPaletteSwatch {
|
|
height: 15px;
|
|
width: 15px;
|
|
border-radius: 2px;
|
|
}
|
|
.flat .dijitColorPalette .dijitPaletteImg {
|
|
/* transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
|
|
* displays border around a color swatch
|
|
* overrides border color in dijit.css */
|
|
border: 1px solid transparent;
|
|
line-height: normal;
|
|
}
|
|
.flat .dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg {
|
|
border-color: #ccc;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-radius: 2px;
|
|
-webkit-transform: scale(1.2);
|
|
-moz-transform: scale(1.2);
|
|
-o-transform: scale(1.2);
|
|
-ms-transform: scale(1.2);
|
|
transform: scale(1.2);
|
|
}
|
|
.flat .dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg,
|
|
.flat .dijitColorPalette .dijitPaletteTable .dijitPaletteCellSelected .dijitPaletteImg {
|
|
border: 1px solid #257aa7;
|
|
-webkit-box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
border-radius: 2px;
|
|
-webkit-transform: scale(1.2);
|
|
-moz-transform: scale(1.2);
|
|
-o-transform: scale(1.2);
|
|
-ms-transform: scale(1.2);
|
|
transform: scale(1.2);
|
|
}
|
|
/* Editor
|
|
*
|
|
* Styling Editor means styling the Editor inside iframe container (dijitEditorIFrameContainer)
|
|
*
|
|
* 1. Editor iframe container (default styling):
|
|
* .dijitEditorIFrameContainer - normal state styles: background-color, border, padding
|
|
*
|
|
* 2. hovered Editor iframe container (ie, mouse hover on editor)
|
|
* .dijitEditorHover .dijitEditorIFrameContainer/dijitEditorIFrame - styles when mouse hover on the container
|
|
*
|
|
* 3. focused Editor iframe container (ie, mouse focus on the editor pane)
|
|
* .dijitEditorFocused .dijitEditorIFrameContainer/dijitEditorIFrame - styles when container focused
|
|
*
|
|
* 3. disabled Editor iframe container
|
|
* .dijitEditorDisabled - editor's inner iframe container disable status styles: background, border
|
|
*/
|
|
.flat .dijitEditor {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitEditor .dijitEditorIFrameContainer {
|
|
border: 1px solid transparent;
|
|
border-top: 1px solid #ccc;
|
|
padding: 4px 8px;
|
|
-webkit-transition: border 0.2s linear 0s;
|
|
-moz-transition: border 0.2s linear 0s;
|
|
-o-transition: border 0.2s linear 0s;
|
|
-ms-transition: border 0.2s linear 0s;
|
|
transition: border 0.2s linear 0s;
|
|
}
|
|
.flat .dijitEditorHover .dijitEditorIFrameContainer,
|
|
.flat .dijitEditorHover .dijitEditorIFrameContainer .dijitEditorIFrame {
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitEditorFocused .dijitEditorIFrameContainer {
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitEditorFocused .dijitEditorIFrameContainer .dijitEditorIFrame {
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitEditorDisabled {
|
|
border: 1px solid #ccc;
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitEditorDisabled .dijitEditorIFrame,
|
|
.flat .dijitEditorDisabled .dijitEditorIFrameContainer,
|
|
.flat .dijitEditorDisabled .dijitEditorIFrameContainer .dijitEditorIFrame {
|
|
background-color: #f5f5f5;
|
|
border: 1px solid transparent;
|
|
}
|
|
/*
|
|
* font generated with https://icomoon.io/app
|
|
*
|
|
* all icons are Material Design icons by Google
|
|
* https://github.com/google/material-design-icons/blob/master/LICENSE
|
|
*
|
|
* see README for more about flat theme icons
|
|
*/
|
|
@font-face {
|
|
font-family: 'flat-icon';
|
|
src: url("fonts/flat-icon.eot?90nq1s");
|
|
src: url("fonts/flat-icon.eot?#iefix90nq1s") format('embedded-opentype'), url("fonts/flat-icon.ttf?90nq1s") format('truetype'), url("fonts/flat-icon.woff?90nq1s") format('woff'), url("fonts/flat-icon.svg?90nq1s#flat-icon") format('svg');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
[class^="flat-"],
|
|
[class*=" flat-"] {
|
|
font-family: 'flat-icon';
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.dijitIcon,
|
|
.dijitEditorIcon {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
font-size: 16px;
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
.flat-drop-left:before {
|
|
content: "\f000";
|
|
}
|
|
.flat-drop-right:before {
|
|
content: "\f001";
|
|
}
|
|
.flat-drop-down:before {
|
|
content: "\f002";
|
|
}
|
|
.flat-drop-up:before {
|
|
content: "\f003";
|
|
}
|
|
.flat-chevron-left:before {
|
|
content: "\f004";
|
|
}
|
|
.flat-chevron-right:before {
|
|
content: "\f005";
|
|
}
|
|
.flat-chevron-down:before {
|
|
content: "\f006";
|
|
}
|
|
.flat-chevron-up:before {
|
|
content: "\f007";
|
|
}
|
|
.flat-arrow-left:before {
|
|
content: "\f008";
|
|
}
|
|
.flat-arrow-right:before {
|
|
content: "\f009";
|
|
}
|
|
.flat-arrow-down:before {
|
|
content: "\f00a";
|
|
}
|
|
.flat-arrow-up:before {
|
|
content: "\f00b";
|
|
}
|
|
.flat-check:before {
|
|
content: "\f00c";
|
|
}
|
|
.flat-check-circle:before {
|
|
content: "\f00d";
|
|
}
|
|
.flat-close:before {
|
|
content: "\f00e";
|
|
}
|
|
.dijitIconClear:before,
|
|
.flat-close-circle:before {
|
|
content: "\f00f";
|
|
}
|
|
.dijitEditorIconCancel:before,
|
|
.flat-close-circle-o:before {
|
|
content: "\f010";
|
|
}
|
|
.flat-add:before {
|
|
content: "\f011";
|
|
}
|
|
.flat-remove:before {
|
|
content: "\f012";
|
|
}
|
|
.flat-add-circle:before {
|
|
content: "\f013";
|
|
}
|
|
.flat-remove-circle:before {
|
|
content: "\f014";
|
|
}
|
|
.flat-add-circle-o:before {
|
|
content: "\f015";
|
|
}
|
|
.flat-remove-circle-o:before {
|
|
content: "\f016";
|
|
}
|
|
.dijitIconError:before,
|
|
.flat-error:before {
|
|
content: "\f017";
|
|
}
|
|
.flat-error-o:before {
|
|
content: "\f018";
|
|
}
|
|
.flat-warning:before {
|
|
content: "\f019";
|
|
}
|
|
.flat-report:before {
|
|
content: "\f01a";
|
|
}
|
|
.flat-help:before {
|
|
content: "\f01b";
|
|
}
|
|
.flat-no-symbol:before {
|
|
content: "\f01c";
|
|
}
|
|
.flat-update:before {
|
|
content: "\f01d";
|
|
}
|
|
.flat-calendar:before {
|
|
content: "\f01e";
|
|
}
|
|
.flat-clock:before {
|
|
content: "\f01f";
|
|
}
|
|
.dijitFolderClosed:before,
|
|
.dijitIconFolderClosed:before,
|
|
.flat-folder:before {
|
|
content: "\f020";
|
|
}
|
|
.dijitFolderOpened:before,
|
|
.dijitIconFolderOpen:before,
|
|
.flat-folder-open:before {
|
|
content: "\f021";
|
|
}
|
|
.dijitIconEdit:before,
|
|
.flat-edit:before {
|
|
content: "\f022";
|
|
}
|
|
.dijitIconSave:before,
|
|
.dijitEditorIconSave:before,
|
|
.flat-save:before {
|
|
content: "\f023";
|
|
}
|
|
.dijitIconPrint:before,
|
|
.dijitEditorIconPrint:before,
|
|
.flat-print:before {
|
|
content: "\f024";
|
|
}
|
|
.dijitIconDelete:before,
|
|
.dijitEditorIconDelete:before,
|
|
.flat-delete:before {
|
|
content: "\f025";
|
|
}
|
|
.dijitLeaf:before,
|
|
.flat-page:before {
|
|
content: "\f026";
|
|
}
|
|
.flat-page-o:before {
|
|
content: "\f027";
|
|
}
|
|
.flat-page-add:before {
|
|
content: "\f028";
|
|
}
|
|
.flat-page-remove:before {
|
|
content: "\f029";
|
|
}
|
|
.flat-page-add-o:before {
|
|
content: "\f02a";
|
|
}
|
|
.flat-page-remove-o:before {
|
|
content: "\f02b";
|
|
}
|
|
.dijitIconFile:before,
|
|
.flat-file:before {
|
|
content: "\f02c";
|
|
}
|
|
.dijitIconMail:before,
|
|
.flat-mail:before {
|
|
content: "\f02d";
|
|
}
|
|
.dijitIconDatabase:before,
|
|
.flat-storage:before {
|
|
content: "\f02e";
|
|
}
|
|
.dijitIconConfigure:before,
|
|
.flat-settings:before {
|
|
content: "\f02f";
|
|
}
|
|
.dijitIconSearch:before,
|
|
.flat-search:before {
|
|
content: "\f030";
|
|
}
|
|
.dijitIconBookmark:before,
|
|
.flat-bookmark:before {
|
|
content: "\f031";
|
|
}
|
|
.flat-menu:before {
|
|
content: "\f032";
|
|
}
|
|
.dijitIconApplication:before,
|
|
.flat-application:before {
|
|
content: "\f033";
|
|
}
|
|
.dijitIconKey:before,
|
|
.flat-key:before {
|
|
content: "\f034";
|
|
}
|
|
.dijitIconTable:before,
|
|
.dijitEditorIconInsertTable:before,
|
|
.flat-table:before {
|
|
content: "\f035";
|
|
}
|
|
.flat-grid:before {
|
|
content: "\f036";
|
|
}
|
|
.dijitIconChart:before,
|
|
.flat-chart:before {
|
|
content: "\f037";
|
|
}
|
|
.dijitIconFilter:before,
|
|
.flat-filter:before {
|
|
content: "\f038";
|
|
}
|
|
.dijitIconFunction:before,
|
|
.flat-function:before {
|
|
content: "\f039";
|
|
}
|
|
.flat-user:before {
|
|
content: "\f03a";
|
|
}
|
|
.dijitIconUsers:before,
|
|
.flat-users:before {
|
|
content: "\f03b";
|
|
}
|
|
.dijitIconConnector:before,
|
|
.flat-connector:before {
|
|
content: "\f03c";
|
|
}
|
|
.dijitIconDocuments:before,
|
|
.flat-documents:before {
|
|
content: "\f03d";
|
|
}
|
|
.dijitIconEditProperty:before,
|
|
.flat-edit-property:before {
|
|
content: "\f03e";
|
|
}
|
|
.dijitIconTask:before,
|
|
.flat-task:before {
|
|
content: "\f03f";
|
|
}
|
|
.dijitIconNewTask:before,
|
|
.flat-task-new:before {
|
|
content: "\f040";
|
|
}
|
|
.dijitIconEditTask:before,
|
|
.flat-task-edit:before {
|
|
content: "\f041";
|
|
}
|
|
.dijitIconSample:before,
|
|
.flat-sample:before {
|
|
content: "\f042";
|
|
}
|
|
.dijitIconPackage:before,
|
|
.flat-package:before {
|
|
content: "\f043";
|
|
}
|
|
.dijitEditorIconUndo:before,
|
|
.flat-undo:before {
|
|
content: "\f044";
|
|
}
|
|
.dijitEditorIconRedo:before,
|
|
.flat-redo:before {
|
|
content: "\f045";
|
|
}
|
|
.dijitIconCopy:before,
|
|
.dijitEditorIconCopy:before,
|
|
.flat-copy:before {
|
|
content: "\f046";
|
|
}
|
|
.dijitIconCut:before,
|
|
.dijitEditorIconCut:before,
|
|
.flat-cut:before {
|
|
content: "\f047";
|
|
}
|
|
.dijitEditorIconPaste:before,
|
|
.flat-paste:before {
|
|
content: "\f048";
|
|
}
|
|
.dijitEditorIconBold:before,
|
|
.flat-bold:before {
|
|
content: "\f049";
|
|
}
|
|
.dijitEditorIconItalic:before,
|
|
.flat-italic:before {
|
|
content: "\f04a";
|
|
}
|
|
.dijitEditorIconUnderline:before,
|
|
.flat-underline:before {
|
|
content: "\f04b";
|
|
}
|
|
.dijitEditorIconStrikethrough:before,
|
|
.flat-strikethrough:before {
|
|
content: "\f04c";
|
|
}
|
|
.dijitEditorIconRemoveFormat:before,
|
|
.flat-clear-format:before {
|
|
content: "\f04d";
|
|
}
|
|
.flat-quote:before {
|
|
content: "\f04e";
|
|
}
|
|
.dijitEditorIconSuperscript:before,
|
|
.flat-superscript:before {
|
|
content: "\f04f";
|
|
}
|
|
.dijitEditorIconSubscript:before,
|
|
.flat-subscript:before {
|
|
content: "\f050";
|
|
}
|
|
.dijitEditorIconForeColor:before,
|
|
.flat-color-text:before {
|
|
content: "\f051";
|
|
}
|
|
.dijitEditorIconBackColor:before,
|
|
.flat-color-fill:before {
|
|
content: "\f052";
|
|
}
|
|
.dijitEditorIconHiliteColor:before,
|
|
.flat-color-highlight:before {
|
|
content: "\f053";
|
|
}
|
|
.flat-font-size:before {
|
|
content: "\f054";
|
|
}
|
|
.dijitEditorIconJustifyCenter:before,
|
|
.flat-align-center:before {
|
|
content: "\f055";
|
|
}
|
|
.dijitEditorIconJustifyFull:before,
|
|
.flat-align-justify:before {
|
|
content: "\f056";
|
|
}
|
|
.dijitEditorIconJustifyLeft:before,
|
|
.flat-align-left:before {
|
|
content: "\f057";
|
|
}
|
|
.dijitEditorIconJustifyRight:before,
|
|
.flat-align-right:before {
|
|
content: "\f058";
|
|
}
|
|
.dijitEditorIconIndent:before,
|
|
.flat-indent:before {
|
|
content: "\f059";
|
|
}
|
|
.dijitEditorIconOutdent:before,
|
|
.flat-outdent:before {
|
|
content: "\f05a";
|
|
}
|
|
.flat-sort:before {
|
|
content: "\f05b";
|
|
}
|
|
.dijitEditorIconSpace:before,
|
|
.flat-keyboard-space:before {
|
|
content: "\f05c";
|
|
}
|
|
.dijitEditorIconTabIndent:before,
|
|
.flat-keyboard-tab:before {
|
|
content: "\f05d";
|
|
}
|
|
.dijitEditorIconInsertUnorderedList:before,
|
|
.flat-list-bullet:before {
|
|
content: "\f05e";
|
|
}
|
|
.dijitEditorIconInsertOrderedList:before,
|
|
.flat-list-number:before {
|
|
content: "\f05f";
|
|
}
|
|
.dijitEditorIconListBulletIndent:before,
|
|
.flat-list-bullet-indent:before {
|
|
content: "\f060";
|
|
}
|
|
.dijitEditorIconListBulletOutdent:before,
|
|
.flat-list-bullet-outdent:before {
|
|
content: "\f061";
|
|
}
|
|
.dijitEditorIconListNumIndent:before,
|
|
.flat-list-number-indent:before {
|
|
content: "\f062";
|
|
}
|
|
.dijitEditorIconListNumOutdent:before,
|
|
.flat-list-number-outdent:before {
|
|
content: "\f063";
|
|
}
|
|
.dijitEditorIconViewSource:before,
|
|
.flat-code:before {
|
|
content: "\f064";
|
|
}
|
|
.dijitEditorIconCreateLink:before,
|
|
.flat-link:before {
|
|
content: "\f065";
|
|
}
|
|
.dijitEditorIconUnlink:before,
|
|
.flat-unlink:before {
|
|
content: "\f066";
|
|
}
|
|
.dijitEditorIconFullScreen:before,
|
|
.flat-fullscreen:before {
|
|
content: "\f067";
|
|
}
|
|
.flat-fullscreen-exit:before {
|
|
content: "\f068";
|
|
}
|
|
.dijitEditorIconInsertImage:before,
|
|
.flat-image:before {
|
|
content: "\f069";
|
|
}
|
|
.dijitEditorIconNewPage:before,
|
|
.flat-page-new:before {
|
|
content: "\f06a";
|
|
}
|
|
.dijitEditorIconToggleDir:before,
|
|
.flat-toggle-dir:before {
|
|
content: "\f06b";
|
|
}
|
|
.dijitEditorIconLeftToRight:before,
|
|
.flat-left-to-right:before {
|
|
content: "\f06c";
|
|
}
|
|
.dijitEditorIconRightToLeft:before,
|
|
.flat-right-to-left:before {
|
|
content: "\f06d";
|
|
}
|
|
.dijitEditorIconSelectAll:before,
|
|
.flat-select-all:before {
|
|
content: "\f06e";
|
|
}
|
|
.dijitEditorIconWikiword:before,
|
|
.flat-wikiword:before {
|
|
content: "\f06f";
|
|
}
|
|
.icon-spin {
|
|
-webkit-animation: spin-right 2s infinite linear;
|
|
-moz-animation: spin-right 2s infinite linear;
|
|
-o-animation: spin-right 2s infinite linear;
|
|
-ms-animation: spin-right 2s infinite linear;
|
|
animation: spin-right 2s infinite linear;
|
|
}
|
|
.dijitIconLoading {
|
|
font-size: 24px;
|
|
}
|
|
.dijitIconLoading:before {
|
|
content: "\f01d";
|
|
-webkit-animation: spin-left 2s linear infinite;
|
|
-moz-animation: spin-left 2s linear infinite;
|
|
-o-animation: spin-left 2s linear infinite;
|
|
-ms-animation: spin-left 2s linear infinite;
|
|
animation: spin-left 2s linear infinite;
|
|
}
|
|
.dj_ie8 .dijitIconLoading,
|
|
.dj_ie9 .dijitIconLoading {
|
|
background: url("images/loadingAnimation.gif") no-repeat;
|
|
height: 20px;
|
|
width: 20px;
|
|
}
|
|
.dj_ie8 .dijitIconLoading:before,
|
|
.dj_ie9 .dijitIconLoading:before {
|
|
content: "";
|
|
}
|
|
.dijitRtl .dijitEditorIconUndo:before {
|
|
content: "\f044";
|
|
}
|
|
.dijitRtl .dijitEditorIconRedo:before {
|
|
content: "\f044";
|
|
}
|
|
.dijitRtl .dijitEditorIconTabIndent:before {
|
|
-webkit-transform: rotate(180deg);
|
|
-moz-transform: rotate(180deg);
|
|
-o-transform: rotate(180deg);
|
|
-ms-transform: rotate(180deg);
|
|
transform: rotate(180deg);
|
|
}
|
|
.dijitRtl .dijitEditorIconInsertUnorderedList,
|
|
.dijitRtl .dijitEditorIconInsertOrderedList {
|
|
-webkit-transform: scale(-1, 1);
|
|
-moz-transform: scale(-1, 1);
|
|
-o-transform: scale(-1, 1);
|
|
-ms-transform: scale(-1, 1);
|
|
transform: scale(-1, 1);
|
|
}
|
|
:root .dijitRtl .dijitEditorIconInsertUnorderedList,
|
|
:root .dijitRtl .dijitEditorIconInsertOrderedList {
|
|
filter: none;
|
|
}
|
|
@-moz-keyframes spin-right {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@-webkit-keyframes spin-right {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@-o-keyframes spin-right {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes spin-right {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@-moz-keyframes spin-left {
|
|
from {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
}
|
|
@-webkit-keyframes spin-left {
|
|
from {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
}
|
|
@-o-keyframes spin-left {
|
|
from {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
}
|
|
@keyframes spin-left {
|
|
from {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
}
|
|
/* RTL files */
|
|
|
|
/* dijit */
|
|
|
|
/* layout */
|
|
|
|
/* dijit */
|
|
|
|
/* not in flat theme */
|
|
/* dijit base */
|
|
|
|
/* dijit */
|
|
|
|
/* layout */
|
|
|
|
/* form */
|
|
|
|
/* icons */
|
|
|
|
/* rtl */
|
|
.flat .dijitToolbar .dijitToggleButtonRtl,
|
|
.flat .dijitToolbar .dijitButtonRtl,
|
|
.flat .dijitToolbar .dijitDropDownButtonRtl,
|
|
.flat .dijitToolbar .dijitComboButtonRtl {
|
|
margin-left: 4px;
|
|
margin-right: auto;
|
|
}
|
|
.flat .dijitToolbar .dijitDropDownButtonRtl .dijitArrowButtonInner {
|
|
margin-left: auto;
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs .dijitTabRtl,
|
|
.flat .dijitTabContainerBottom-tabs .dijitTabRtl {
|
|
margin-right: 0;
|
|
margin-left: -1px;
|
|
}
|
|
.flat .dijitTabControllerRtl,
|
|
.flat .dijitTabControllerRtl .nowrapTabStrip {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitTabRtl .dijitTabCloseButton {
|
|
margin-left: 0;
|
|
margin-right: 4px;
|
|
}
|
|
/* BorderContainer
|
|
|
|
Splitters and gutters separate panes within a BorderContainer. Splitters can be moved up and down (horizonal splitters) or left and right (vertical splitters), while Gutters are static. A "thumb" is the slit on a Splitter that indicates it is movable.
|
|
|
|
Styling the BorderContainer widget consists of the following:
|
|
|
|
.dijitBorderContainer - for border and padding of the entire border container
|
|
|
|
.dijitSplitContainer-child, .dijitBorderContainer-child - for border or child panes of the border container. By default borders are put on all children of BorderContainer.
|
|
|
|
.dijitBorderContainer-dijitTabContainerTop,
|
|
.dijitBorderContainer-dijitTabContainerBottom,
|
|
.dijitBorderContainer-dijitTabContainerLeft,
|
|
.dijitBorderContainer-dijitTabContainerRight,
|
|
.dijitBorderContainer-dijitAccordionContainer -for border of the border containers within TabContainer or AccordionContainer widget
|
|
|
|
.dijitBorderContainer-dijitBorderContainer - for border and padding of nested BorderContainers
|
|
|
|
Splitters and gutters:
|
|
|
|
.dijitSplitterH, .dijitGutterH - for height, background, and border of a horizontal splitter and gutter
|
|
.dijitSplitterH .dijitSplitterThumb - for color, height/width of the thumb on a horizontal splitter
|
|
.dijitSplitterV, .dijitGutterV - - for height, background, and border of a vertical splitter and gutter
|
|
.dijitSplitterV .dijitSplitterThumb - for color, height/width of the thumb on a vertical splitter
|
|
.dijitSplitterHHover - for background-color of a hovered horizontal splitter
|
|
.dijitSplitterHHover .dijitSplitterThumb - for background-color of a hovered thumb on a horizontal splitter
|
|
.dijitSplitterVHover - for background-color of a hovered vertical splitter
|
|
.dijitSplitterVHover .dijitSplitterThumb - for background-color of a hovered thumb on a vertical splitter
|
|
.dijitSplitterHActive - for background-color of an active horizontal splitter
|
|
.dijitSplitterVActive - for background-color of an active horizontal splitter
|
|
*/
|
|
.flat .dijitBorderContainer {
|
|
/* matches the width of the splitters between panes */
|
|
padding: 5px;
|
|
}
|
|
.flat .dijitSplitContainer-child,
|
|
.flat .dijitBorderContainer-child {
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitBorderContainer-dijitTabContainerTop,
|
|
.flat .dijitBorderContainer-dijitTabContainerBottom,
|
|
.flat .dijitBorderContainer-dijitTabContainerLeft,
|
|
.flat .dijitBorderContainer-dijitTabContainerRight,
|
|
.flat .dijitBorderContainer-dijitAccordionContainer {
|
|
/* except that TabContainer defines borders on it's sub-nodes (tablist and dijitTabPaneWrapper),
|
|
* so override rule setting border on domNode
|
|
*/
|
|
border: none;
|
|
}
|
|
.flat .dijitBorderContainer-dijitBorderContainer {
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSplitterH,
|
|
.flat .dijitGutterH {
|
|
background: none;
|
|
border: 0;
|
|
height: 5px;
|
|
}
|
|
.flat .dijitSplitterH .dijitSplitterThumb {
|
|
background: #ccc;
|
|
height: 1px;
|
|
top: 2px;
|
|
width: 19px;
|
|
}
|
|
.flat .dijitSplitterV,
|
|
.flat .dijitGutterV {
|
|
background: none;
|
|
border: 0;
|
|
width: 5px;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitSplitterV .dijitSplitterThumb {
|
|
background: #ccc;
|
|
height: 19px;
|
|
left: 2px;
|
|
width: 1px;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitSplitterHHover,
|
|
.flat .dijitSplitterVHover {
|
|
font-size: 1px;
|
|
background: #f2f2f2;
|
|
}
|
|
.flat .dijitSplitterHHover .dijitSplitterThumb,
|
|
.flat .dijitSplitterVHover .dijitSplitterThumb {
|
|
background: #999;
|
|
}
|
|
.flat .dijitSplitterHActive,
|
|
.flat .dijitSplitterVActive {
|
|
font-size: 1px;
|
|
background: #f2f2f2;
|
|
}
|
|
.flat .dijitSplitterHActive .dijitSplitterThumb,
|
|
.flat .dijitSplitterVActive .dijitSplitterThumb {
|
|
background: #999;
|
|
}
|
|
/* TabContainer
|
|
*
|
|
* Styling TabContainer means styling the TabList and Its content container (dijitTitlePane)
|
|
*
|
|
* Tab List: (including 4 kinds of tab location)
|
|
* .dijitTabContainerTop-tabs - tablist container at top
|
|
* .dijitTabContainerBottom-tabs - tablist container at bottom
|
|
* .dijitTabContainerLeft-tabs - tablist container at left
|
|
* .dijitTabContainerRight-tabs - tablist container at right
|
|
*
|
|
* Tab Strip Button:
|
|
* .dijitTabStripIcon - tab strip button icon
|
|
* .dijitTabStripMenuIcon - down arrow icon position
|
|
* .dijitTabStripSlideLeftIcon - left arrow icon position
|
|
* .dijitTabStripSlideRightIcon - right arrow icon position
|
|
*
|
|
* .tabStripButtonDisabled - styles for disabled tab strip buttons
|
|
*
|
|
* Tab Button:
|
|
* .dijitTabContainerTop-tabs .dijitTab - styles for top tab button container
|
|
* .dijitTabContainerBottom-tabs .dijitTab - styles for bottom tab button container
|
|
* .dijitTabContainerLeft-tabs .dijitTab - styles for left tab button container
|
|
* .dijitTabContainerRight-tabs .dijitTab - styles for right tab button container
|
|
*
|
|
* .dijitTabContainerTop-tabs .dijitTabChecked .dijitTab
|
|
* - styles for selected status of top tab button
|
|
* same to Bottom, Left, Right Tabs
|
|
*
|
|
* .dijitTabHover .dijitTab - styles when mouse hover on tab buttons
|
|
* .dijitTabActive .dijitTab - styles when mouse down on tab buttons
|
|
* .dijitTabChecked .dijitTab - styles when on buttons of selected tab
|
|
*
|
|
* .dijitTabCloseButton - the close action buttons lie at the right top of each tab button on closable tabs
|
|
* .dijitTabCloseButtonHover - styles when mouse hover on close action button
|
|
* .dijitTabCloseButtonActive - styles when mouse down on close action button
|
|
*
|
|
* Tab Button: (checked status)
|
|
*
|
|
* Tab Content Container:
|
|
* .dijitTabContainerTop-dijitContentPane
|
|
* .dijitTabContainerBottom-dijitContentPane
|
|
* .dijitTabContainerLeft-dijitContentPane
|
|
* .dijitTabContainerRight-dijitContentPane - for background and padding
|
|
*
|
|
* Nested Tabs:
|
|
* .dijitTabContainerNested - Container for nested tabs
|
|
* .dijitTabContainerTabListNested - tab list container for nested tabs
|
|
*/
|
|
.flat .dijitTabContainer {
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitTabPaneWrapper {
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
margin: 0;
|
|
padding: 0;
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs,
|
|
.flat .dijitTabContainerBottom-tabs,
|
|
.flat .dijitTabContainerLeft-tabs,
|
|
.flat .dijitTabContainerRight-tabs {
|
|
border: none;
|
|
}
|
|
.flat .dijitTabSpacer {
|
|
display: none;
|
|
}
|
|
.flat .dijitTab {
|
|
border: 1px solid transparent;
|
|
background-color: #fff;
|
|
text-align: center;
|
|
-webkit-transition-property: background, padding, margin;
|
|
-moz-transition-property: background, padding, margin;
|
|
-o-transition-property: background, padding, margin;
|
|
-ms-transition-property: background, padding, margin;
|
|
transition-property: background, padding, margin;
|
|
-webkit-transition-duration: 0.2s;
|
|
-moz-transition-duration: 0.2s;
|
|
-o-transition-duration: 0.2s;
|
|
-ms-transition-duration: 0.2s;
|
|
transition-duration: 0.2s;
|
|
-webkit-transition-timing-function: ease;
|
|
-moz-transition-timing-function: ease;
|
|
-o-transition-timing-function: ease;
|
|
-ms-transition-timing-function: ease;
|
|
transition-timing-function: ease;
|
|
position: relative;
|
|
z-index: 0;
|
|
}
|
|
.flat .dijitTab:before {
|
|
content: "";
|
|
display: block;
|
|
position: absolute;
|
|
}
|
|
.flat .dijitTabHover {
|
|
background-color: #f2f2f2;
|
|
}
|
|
.flat .dijitTabActive {
|
|
background-color: #e6e6e6;
|
|
}
|
|
.flat .dijitTabChecked {
|
|
border: 1px solid #ccc;
|
|
z-index: 1;
|
|
}
|
|
.flat .dijitTabChecked.dijitTabHover,
|
|
.flat .dijitTabChecked.dijitTabActive {
|
|
border: 1px solid #ccc;
|
|
background-color: #fff;
|
|
color: #424242;
|
|
}
|
|
.flat .dijitTabDisabled {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .tabStripButton {
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
.flat .dijitTabCloseButton {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
line-height: 1;
|
|
font-size: 1em;
|
|
vertical-align: middle;
|
|
margin-left: 4px;
|
|
opacity: 0.35;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=35)";
|
|
filter: alpha(opacity=35);
|
|
}
|
|
.flat .dijitTabCloseButton:before {
|
|
content: "\f00e";
|
|
}
|
|
.flat .dijitTabCloseButtonHover {
|
|
opacity: 0.75;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
|
|
filter: alpha(opacity=75);
|
|
}
|
|
.flat .dijitTabCloseButtonActive {
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs .dijitTab {
|
|
margin-right: 0;
|
|
padding: 6px 16px;
|
|
border-bottom-color: #ccc;
|
|
border-left: none;
|
|
border-right: none;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs .dijitTabChecked {
|
|
border-bottom: 1px solid #fff;
|
|
border-left: 1px solid #ccc;
|
|
border-right: 1px solid #ccc;
|
|
}
|
|
.flat .dijitTabContainerTop-tabs .dijitTabChecked:before {
|
|
height: 3px;
|
|
background: #257aa7;
|
|
top: -1px;
|
|
left: -1px;
|
|
right: -1px;
|
|
}
|
|
.flat .dijitTabListContainer-top {
|
|
margin-top: 1px;
|
|
}
|
|
.flat .dijitTabListContainer-top .dijitTab {
|
|
top: 0;
|
|
}
|
|
.flat .dijitTabPaneWrapper.dijitTabContainerBottom-container {
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitTabContainerBottom-tabs .dijitTab {
|
|
margin-right: 0;
|
|
padding: 6px 16px;
|
|
border-top-color: #ccc;
|
|
border-left: none;
|
|
border-right: none;
|
|
}
|
|
.flat .dijitTabContainerBottom-tabs .dijitTabChecked {
|
|
border-top: 1px solid #fff;
|
|
border-left: 1px solid #ccc;
|
|
border-right: 1px solid #ccc;
|
|
}
|
|
.flat .dijitTabContainerBottom-tabs .dijitTabChecked:before {
|
|
height: 3px;
|
|
background: #257aa7;
|
|
bottom: -1px;
|
|
left: -1px;
|
|
right: -1px;
|
|
}
|
|
.flat .dijitTabListContainer-bottom {
|
|
margin-top: -1px;
|
|
}
|
|
.flat .dijitTabListContainer-bottom .dijitTab {
|
|
top: 0;
|
|
}
|
|
.flat .dijitTabPaneWrapper.dijitTabContainerLeft-container {
|
|
border-radius: 0 4px 4px 0;
|
|
}
|
|
.flat .dijitTabContainerLeft-tabs .dijitTab {
|
|
margin-bottom: 0;
|
|
padding: 8px 12px;
|
|
border-right-color: #ccc;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
.flat .dijitTabContainerLeft-tabs .dijitTabChecked {
|
|
border-right: 1px solid #fff;
|
|
border-top: 1px solid #ccc;
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
.flat .dijitTabContainerLeft-tabs .dijitTabChecked:before {
|
|
width: 3px;
|
|
background: #257aa7;
|
|
bottom: -1px;
|
|
left: -1px;
|
|
top: -1px;
|
|
}
|
|
.flat .dijitTabPaneWrapper.dijitTabContainerRight-container {
|
|
border-radius: 4px 0 0 4px;
|
|
}
|
|
.flat .dijitTabContainerRight-tabs .dijitTab {
|
|
margin-bottom: 0;
|
|
padding: 8px 12px;
|
|
border-left-color: #ccc;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
.flat .dijitTabContainerRight-tabs .dijitTabChecked {
|
|
border-left: 1px solid #fff;
|
|
border-top: 1px solid #ccc;
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
.flat .dijitTabContainerRight-tabs .dijitTabChecked:before {
|
|
width: 3px;
|
|
background: #257aa7;
|
|
bottom: -1px;
|
|
right: -1px;
|
|
top: -1px;
|
|
}
|
|
.flat .tabStripButton {
|
|
background-color: #fff;
|
|
border: 1px solid transparent;
|
|
-webkit-transition-property: background-color;
|
|
-moz-transition-property: background-color;
|
|
-o-transition-property: background-color;
|
|
-ms-transition-property: background-color;
|
|
transition-property: background-color;
|
|
}
|
|
.flat .dijitTabListContainer-top .tabStripButton,
|
|
.flat .dijitTabListContainer-bottom .tabStripButton {
|
|
padding: 4px 8px;
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
.flat .dijitTabListContainer-top .tabStripButton {
|
|
margin-bottom: 1px;
|
|
}
|
|
.flat .dijitTabListContainer-bottom .tabStripButton {
|
|
margin-top: 1px;
|
|
}
|
|
.flat .tabStripButtonHover {
|
|
background-color: #f2f2f2;
|
|
}
|
|
.flat .tabStripButtonActive {
|
|
background-color: #e6e6e6;
|
|
}
|
|
.flat .dijitTabStripIcon {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
color: #257aa7;
|
|
vertical-align: middle;
|
|
}
|
|
.flat .dijitTabStripIcon:before {
|
|
content: "\f004";
|
|
}
|
|
.flat .dijitTabStripSlideRightIcon:before {
|
|
content: "\f005";
|
|
}
|
|
.flat .dijitTabStripMenuIcon:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitTabListContainer-top .tabStripButtonDisabled,
|
|
.flat .dijitTabListContainer-bottom .tabStripButtonDisabled {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitTabContainerNested .dijitTabListWrapper {
|
|
height: auto;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTab {
|
|
color: #257aa7;
|
|
margin: 4px;
|
|
padding: 4px 8px;
|
|
border: 1px solid transparent;
|
|
border-radius: 4px;
|
|
-webkit-transition-property: background-color, border-color;
|
|
-moz-transition-property: background-color, border-color;
|
|
-o-transition-property: background-color, border-color;
|
|
-ms-transition-property: background-color, border-color;
|
|
transition-property: background-color, border-color;
|
|
-webkit-transition-duration: 0.3s;
|
|
-moz-transition-duration: 0.3s;
|
|
-o-transition-duration: 0.3s;
|
|
-ms-transition-duration: 0.3s;
|
|
transition-duration: 0.3s;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTabHover {
|
|
background-color: #f2f2f2;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTabActive {
|
|
color: #257aa7;
|
|
background-color: #e6e6e6;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked,
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked.dijitTabHover,
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked.dijitTabActive {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked:before,
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked.dijitTabHover:before,
|
|
.flat .dijitTabContainerTabListNested .dijitTabChecked.dijitTabActive:before {
|
|
display: none;
|
|
}
|
|
.flat .dijitTabContainerTabListNested.dijitTabContainerTop-tabs .dijitTab {
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitTabContainerTabListNested.dijitTabContainerBottom-tabs .dijitTab {
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitTabContainerTabListNested.dijitTabContainerLeft-tabs .dijitTab {
|
|
margin-bottom: 4px;
|
|
}
|
|
.flat .dijitTabContainerTabListNested.dijitTabContainerRight-tabs .dijitTab {
|
|
margin-bottom: 4px;
|
|
}
|
|
.flat .dijitTabPaneWrapperNested {
|
|
border: none; /* prevent double border */
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* ContentPane
|
|
*
|
|
* .dijitContentPane
|
|
* set padding for basic content pane
|
|
*
|
|
* Nested layouts:
|
|
*
|
|
* .dijitTabContainerTop-dijitContentPane,
|
|
* .dijitTabContainerLeft-dijitContentPane,
|
|
* .dijitTabContainerBottom-dijitContentPane,
|
|
* .dijitTabContainerRight-dijitContentPane
|
|
* set background-color and padding of ContentPanes nested within TabContainer (can do top, left, bottom, or right) or Accordion Container
|
|
*
|
|
* .dijitAccordionContainer-dijitContentPane
|
|
* set background-color and padding of ContentPane nested within Accordion
|
|
*
|
|
* .dijitSplitContainer-dijitContentPane,
|
|
* set background-color and padding of ContentPane nested within a SplitContainer
|
|
*
|
|
* .dijitBorderContainer-dijitContentPane
|
|
* set background-color and padding of ContentPane nested within a BorderContainer
|
|
*/
|
|
.flat .dijitContentPane {
|
|
background-color: #fff;
|
|
padding: 8px;
|
|
}
|
|
.flat .dijitTabContainerTop-dijitContentPane,
|
|
.flat .dijitTabContainerLeft-dijitContentPane,
|
|
.flat .dijitTabContainerBottom-dijitContentPane,
|
|
.flat .dijitTabContainerRight-dijitContentPane,
|
|
.flat .dijitAccordionContainer-dijitContentPane {
|
|
background-color: #fff;
|
|
padding: 8px;
|
|
left: 0 !important;
|
|
top: 0 !important;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp,
|
|
.flat .dijitAccordionTitle .arrowTextDown {
|
|
float: left;
|
|
}
|
|
/* Accordion
|
|
*
|
|
* Styling AccordionContainer basically means styling the accordion pane (dijitAccordionInnerContainer)
|
|
* and the title inside of it (dijitAccordionTitle). There are 4 basic states to style:
|
|
*
|
|
* 1. closed pane (and default styling):
|
|
* .dijitAccordionInnerContainer - container for each accordion child
|
|
* .dijitAccordionTitle - title for each accordion child
|
|
*
|
|
* 2. active closed pane (ie, mouse down on a title bar)
|
|
* .dijitAccordionInnerContainerActive - for background-color, border
|
|
* .dijitAccordionInnerContainerActive dijitAccordionTitle - for text color
|
|
*
|
|
* 3. open pane (expanded child)
|
|
* .dijitAccordionChildWrapper - wraps around the child widget (typically ContentPane)
|
|
* setting a margin so that there's blue trim all the way around the child
|
|
*
|
|
* These rules need to override the closed pane active:
|
|
*
|
|
* .dijitAccordionInnerContainerSelected - for background-color, border
|
|
* .dijitAccordionInnerContainerSelected .dijitAccordionTitle - for text color
|
|
*
|
|
* 4. hovered pane, open or closed
|
|
* The selectors below affect hovering over both a closed pane (ie, hovering a title bar),
|
|
* and hovering over an open pane. Also, treat mouse down on an open pane as a hover:
|
|
*
|
|
* .dijitAccordionInnerContainerHover, .dijitAccordionInnerContainerSelectedActive - for background-color, border
|
|
* .dijitAccordionInnerContainerHover .dijitAccordionTitle - for text color
|
|
*/
|
|
.flat .dijitAccordionContainer {
|
|
border: 0 none;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitAccordionInnerContainer {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
-webkit-transition-property: background-color, border;
|
|
-moz-transition-property: background-color, border;
|
|
-o-transition-property: background-color, border;
|
|
-ms-transition-property: background-color, border;
|
|
transition-property: background-color, border;
|
|
-webkit-transition-duration: 0.3s;
|
|
-moz-transition-duration: 0.3s;
|
|
-o-transition-duration: 0.3s;
|
|
-ms-transition-duration: 0.3s;
|
|
transition-duration: 0.3s;
|
|
-webkit-transition-timing-function: linear;
|
|
-moz-transition-timing-function: linear;
|
|
-o-transition-timing-function: linear;
|
|
-ms-transition-timing-function: linear;
|
|
transition-timing-function: linear;
|
|
}
|
|
.flat .dijitAccordionInnerContainer +.dijitAccordionInnerContainer {
|
|
margin-top: 0;
|
|
position: relative;
|
|
}
|
|
.flat .dijitAccordionTitle {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
border: 0 none;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp,
|
|
.flat .dijitAccordionTitle .arrowTextDown {
|
|
display: none;
|
|
float: right;
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
text-align: center;
|
|
font-size: 0px;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp:before,
|
|
.flat .dijitAccordionTitle .arrowTextDown:before {
|
|
content: "\f007";
|
|
font-size: 18px;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp {
|
|
display: block;
|
|
}
|
|
.flat .dijitAccordionTitle .arrowTextUp:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitAccordionInnerContainerHover .dijitAccordionTitle {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitAccordionInnerContainerActive .dijitAccordionTitle {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitAccordionInnerContainerSelected {
|
|
border: 0 none;
|
|
}
|
|
.flat .dijitAccordionInnerContainerSelected .dijitAccordionTitle {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainerSelected .dijitAccordionTitle .arrowTextUp {
|
|
display: none;
|
|
}
|
|
.flat .dijitAccordionInnerContainerSelected .dijitAccordionTitle .arrowTextDown {
|
|
display: block;
|
|
}
|
|
.flat .dijitAccordionContainer .dijitAccordionChildWrapper {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-top: 0 none;
|
|
position: relative;
|
|
z-index: 1;
|
|
clear: both;
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
.flat .dijitAccordionInnerContainer {
|
|
border-radius: 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer .dijitAccordionTitle {
|
|
border-radius: 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer:not(:last-child) .dijitAccordionChildWrapper {
|
|
border-radius: 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer +.dijitAccordionInnerContainer {
|
|
border-top: 0 none;
|
|
}
|
|
.flat .dijitAccordionInnerContainer +.dijitAccordionInnerContainerSelected:last-child .dijitAccordionTitle {
|
|
border-radius: 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer:first-child,
|
|
.flat .dijitAccordionInnerContainer:first-child .dijitAccordionTitle {
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitAccordionInnerContainer:last-child,
|
|
.flat .dijitAccordionInnerContainer:last-child .dijitAccordionTitle {
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
/* TitlePane */
|
|
.flat .dijitTitlePaneRtl .dijitTitlePaneTitle {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitTitlePaneRtl .dijitClosed .dijitArrowNode:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitColorPaletteRtl .dijitColorPaletteUnder {
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
.dijitPopup {
|
|
border-radius: 4px;
|
|
}
|
|
/* ----- Drag and Drop ----- */
|
|
.dojoDndItem {
|
|
border: 1px solid transparent;
|
|
cursor: pointer;
|
|
-webkit-transition-duration: 0.25s;
|
|
-moz-transition-duration: 0.25s;
|
|
-o-transition-duration: 0.25s;
|
|
-ms-transition-duration: 0.25s;
|
|
transition-duration: 0.25s;
|
|
-webkit-transition-property: background-color, border-color, opacity;
|
|
-moz-transition-property: background-color, border-color, opacity;
|
|
-o-transition-property: background-color, border-color, opacity;
|
|
-ms-transition-property: background-color, border-color, opacity;
|
|
transition-property: background-color, border-color, opacity;
|
|
}
|
|
/* hover */
|
|
.dojoDndItemOver {
|
|
background-color: #f5f5f5;
|
|
border-radius: 4px;
|
|
}
|
|
.dojoDndItemAnchor {
|
|
background-color: transparent;
|
|
border: 1px dashed #257aa7;
|
|
border-radius: 4px;
|
|
}
|
|
/* selected */
|
|
.dojoDndItemBefore {
|
|
background: transparent;
|
|
padding-top: 2px;
|
|
border-top: 1px solid #257aa7;
|
|
}
|
|
.dojoDndItemAfter {
|
|
background: transparent;
|
|
padding-bottom: 2px;
|
|
border-bottom: 1px solid #257aa7;
|
|
}
|
|
/* Avatar */
|
|
table.dojoDndAvatar {
|
|
display: block;
|
|
}
|
|
.dojoDndAvatarHeader td {
|
|
display: none;
|
|
}
|
|
.dojoDndAvatarHeader:before {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
display: table-cell;
|
|
}
|
|
/* cannot drop */
|
|
.dojoDndMove .dojoDndAvatarHeader:before {
|
|
color: #dd2c00;
|
|
content: "\f01c";
|
|
}
|
|
.dojoDndCopy .dojoDndAvatarHeader:before {
|
|
color: #dd2c00;
|
|
content: "\f01c";
|
|
}
|
|
/* can drop */
|
|
.dojoDndMove .dojoDndAvatarCanDrop .dojoDndAvatarHeader:before {
|
|
color: #43a047;
|
|
content: "\f008";
|
|
}
|
|
.dojoDndCopy .dojoDndAvatarCanDrop .dojoDndAvatarHeader:before {
|
|
color: #43a047;
|
|
content: "\f008";
|
|
}
|
|
.dojoDndAvatarItem {
|
|
border-radius: 4px;
|
|
}
|
|
.dojoDndAvatarItem td > * {
|
|
padding: 4px 8px;
|
|
list-style-type: none;
|
|
background-color: #fff;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
}
|
|
/* Calendar
|
|
*
|
|
* Styling Calendar mainly includes:
|
|
*
|
|
* 1. Calendar container
|
|
* .dijitCalendar - main container
|
|
* .dijitCalendarHover / .dijitCalendarActive - states e.g. hover,active
|
|
*
|
|
* 2. Month
|
|
* .dijitCalendarMonthContainer
|
|
* .dijitCalendarMonthLabel
|
|
* .dijitCalendarDecrease / .dijitCalendarDecrease - icons for switching to previous/next month
|
|
* .dijitCalendarArrowActive .dijitCalendarDecrease - states e.g. hover,active
|
|
*
|
|
* 3. Date
|
|
* .dijitCalendarDayLabelTemplate - week day column header e.g. S M T W T F S
|
|
* .dijitCalendarDateTemplate - date label wrapper
|
|
* .dijitCalendarPreviousMonth .dijitCalendarDateLabel - special labels for previous or next month
|
|
* .dijitCalendarSelectedDate .dijitCalendarDateLabel - styles for selected date
|
|
* .dijitCalendarDisabledDate .dijitCalendarDateLabel - styles for disabled date
|
|
* .dijitCalendarActiveDate .dijitCalendarDateLabel - states e.g. hover,active
|
|
*
|
|
* 4. Year
|
|
* .dijitCalendarYearContainer
|
|
* .dijitCalendarYearLabel
|
|
* .dijitCalendarPreviousYear /.dijitCalendarNextYear
|
|
* .dijitCalendarNextYearHover / .dijitCalendarPreviousYearHover - states e.g. hover,active
|
|
*
|
|
* 5. Dropdown Month Menu
|
|
* .dijitCalendarMonthMenu - menu container
|
|
* .dijitCalendarMonthMenu .dijitCalendarMonthLabel - month label in menu item
|
|
* .dijitCalendarMonthMenu .dijitCalendarMonthLabelHover - menu item hover state
|
|
*/
|
|
.flat .dijitCalendar {
|
|
background-color: #fff;
|
|
text-align: center;
|
|
padding: 4px;
|
|
border: 1px solid #ccc;
|
|
border-collapse: separate;
|
|
border-radius: 4px;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
}
|
|
.flat .dijitCalendarMonthContainer th {
|
|
text-align: center;
|
|
line-height: 20px;
|
|
vertical-align: middle;
|
|
margin: 4px 0;
|
|
}
|
|
.flat .dijitCalendarArrow {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
cursor: pointer;
|
|
font-size: 24px;
|
|
border: 1px solid transparent;
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarDecrease,
|
|
.flat .dijitCalendarIncrease {
|
|
display: none;
|
|
}
|
|
.flat .dijitCalendarDecrementArrow {
|
|
float: left;
|
|
padding-left: 2px;
|
|
}
|
|
.flat .dijitCalendarDecrementArrow:before {
|
|
content: "\f000";
|
|
}
|
|
.flat .dijitCalendarIncrementArrow {
|
|
float: right;
|
|
padding-right: 2px;
|
|
}
|
|
.flat .dijitCalendarIncrementArrow:before {
|
|
content: "\f001";
|
|
}
|
|
.flat .dijitCalendarArrowHover .dijitCalendarIncrementControl,
|
|
.flat .dijitCalendarArrow:hover .dijitCalendarIncrementControl,
|
|
.flat .dijitCalendarNextYearHover,
|
|
.flat .dijitCalendarNextYear:hover,
|
|
.flat .dijitCalendarPreviousYearHover,
|
|
.flat .dijitCalendarPreviousYear:hover {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarArrowActive .dijitCalendarIncrementControl,
|
|
.flat .dijitCalendarArrow:active .dijitCalendarIncrementControl,
|
|
.flat .dijitCalendarNextYearActive,
|
|
.flat .dijitCalendarNextYear:active,
|
|
.flat .dijitCalendarPreviousYearActive,
|
|
.flat .dijitCalendarPreviousYear:active {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitA11ySideArrow {
|
|
/* text +/- labels instead of arrow icons, for high contrast mode */
|
|
display: none;
|
|
}
|
|
.flat .dijitCalendarContainer th,
|
|
.flat .dijitCalendarContainer td {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarDayLabelTemplate {
|
|
text-align: center;
|
|
border-bottom: #ccc;
|
|
}
|
|
.flat .dijitCalendarDayLabel {
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitCalendarDateTemplate {
|
|
font-size: 0.9em;
|
|
letter-spacing: 0.05em;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitCalendarDateTemplate .dijitCalendarDateLabel {
|
|
text-decoration: none;
|
|
display: block;
|
|
padding: 2px 4px;
|
|
border: 0 none;
|
|
border-radius: 50%;
|
|
}
|
|
.flat .dijitCalendarPreviousMonth .dijitCalendarDateLabel,
|
|
.flat .dijitCalendarNextMonth .dijitCalendarDateLabel {
|
|
color: #c2c2c2;
|
|
}
|
|
.flat .dijitCalendarCurrentDate .dijitCalendarDateLabel {
|
|
border-color: #257aa7;
|
|
}
|
|
.flat .dijitCalendarHoveredDate .dijitCalendarDateLabel,
|
|
.flat .dijitCalendarEnabledDate:hover .dijitCalendarDateLabel {
|
|
background-color: #f2f2f2;
|
|
}
|
|
.flat .dijitCalendarActiveDate .dijitCalendarDateLabel,
|
|
.flat .dijitCalendarEnabledDate:active .dijitCalendarDateLabel {
|
|
background-color: #e6e6e6;
|
|
}
|
|
.flat .dijitCalendarSelectedDate .dijitCalendarDateLabel,
|
|
.flat .dijitCalendarSelectedDate.dijitCalendarHoveredDate .dijitCalendarDateLabel {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitCalendarDisabledDate .dijitCalendarDateLabel {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitCalendarYearContainer {
|
|
vertical-align: middle;
|
|
}
|
|
.flat .dijitCalendarYearLabel {
|
|
padding: 4px 0 0 0;
|
|
margin: 0;
|
|
font-size: 1.15em;
|
|
}
|
|
.flat .dijitCalendarYearLabel span {
|
|
vertical-align: middle;
|
|
}
|
|
.flat .dijitCalendarSelectedYear,
|
|
.flat .dijitCalendarNextYear,
|
|
.flat .dijitCalendarPreviousYear {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarSelectedYear {
|
|
color: #257aa7;
|
|
}
|
|
.flat .dijitCalendarNextYear,
|
|
.flat .dijitCalendarPreviousYear {
|
|
color: #257aa7;
|
|
font-size: 0.9em;
|
|
line-height: 20px;
|
|
border: 1px solid transparent;
|
|
}
|
|
.flat .dijitCalendarSelectedYear {
|
|
padding: 0 4px;
|
|
}
|
|
.flat .dijitCalendar .dijitDropDownButton {
|
|
margin: 0;
|
|
}
|
|
.flat .dijitCalendarMonthMenu {
|
|
padding: 8px 0;
|
|
}
|
|
.flat .dijitCalendarMonthMenu .dijitCalendarMonthLabel {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitCalendarMonthMenu .dijitCalendarMonthLabelHover {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
/* Menu
|
|
|
|
There are three areas of styling for the Menu:
|
|
|
|
1. The menu
|
|
There are three types of menus:
|
|
i) Context Menu
|
|
ii) Drop down Menu
|
|
iii) Navigation Menu
|
|
All three types of menus are affected by the .dijitMenu class in which you can set the background-color, padding and border
|
|
.dijitMenu affects the drop down menu in TimeTextBox, Calendar, ComboBox and FilteringSelect
|
|
.dijitMenuTable - for padding - also affects Select widget
|
|
|
|
2. The menu bar
|
|
.dijitMenuBar - for border, margins, padding, background-color of the menu bar
|
|
.dijitMenuBar .dijitMenuItem - for padding, text color of menu items in the menu bar (overrides .dijitMenuItem)
|
|
|
|
3. Menu items - items in the menu.
|
|
.dijitMenuItem - for color
|
|
.dijitMenuItemHover, .dijitMenuItemSelected - for background-color, border, text color, padding of a menu item or menubar item that has been hovered over or selected
|
|
.dijitMenuItemActive - for background-color of an active (mousedown) menu item
|
|
td.dijitMenuItemIconCell - for padding around a menu item's icon
|
|
td.dijitMenuItemLabel - for padding around a menu item's label
|
|
.dijitMenuSeparatorTop - for border, top border, of the separator
|
|
.dijitMenuSeparatorBottom - for bottom margin of the separator
|
|
|
|
Styles specific to ComboBox and FilteringSelect widgets:
|
|
.dijitComboBoxMenu .dijitMenuItem - for padding and border of a menu item in a ComboBox or FilteringSelect widget's menu
|
|
.dijitComboBoxMenu .dijitMenuItemSelected- for text color, background-color and border of a menu item in a ComboBox or FilteringSelect widget's menu
|
|
|
|
*/
|
|
.flat .dijitMenu {
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
margin: 0;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
}
|
|
.flat .dijitMenuTable,
|
|
.flat .dijitComboBoxMenu {
|
|
padding: 8px 0;
|
|
}
|
|
.flat .dijitComboBoxMenu {
|
|
margin-left: 0;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitMenuTable {
|
|
/* this prevents jiggling upon hover of a menu item */
|
|
border-collapse: separate;
|
|
border-spacing: 0 0;
|
|
}
|
|
.flat .dijitMenuItem,
|
|
.flat .dijitMenuItem td {
|
|
line-height: 20px;
|
|
padding: 8px;
|
|
white-space: nowrap;
|
|
}
|
|
.flat .dijitMenuItemHover td,
|
|
.flat .dijitMenuItemHover {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuItemActive td,
|
|
.flat .dijitMenuItemActive {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuItemSelected td,
|
|
.flat .dijitMenuItemSelected {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuItemDisabled {
|
|
color: #9e9e9e;
|
|
}
|
|
.flat .dijitMenuItemDisabled.dijitMenuItemSelected td,
|
|
.flat .dijitMenuItemDisabled.dijitMenuItemSelected {
|
|
color: #f2f2f2;
|
|
background: #5cafdb;
|
|
}
|
|
.flat .dijitMenuSeparatorTop {
|
|
height: auto;
|
|
margin-top: 1px; /* prevents spacing above/below separator */
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
.flat .dijitMenuSeparatorBottom {
|
|
height: auto;
|
|
margin-bottom: 1px;
|
|
border-top: 1px solid transparent;
|
|
}
|
|
.flat td.dijitMenuItemIconCell {
|
|
padding: 4px;
|
|
margin: 0 0 0 4px;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitMenuExpand {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.flat .dijitMenuExpand:before {
|
|
content: "\f001";
|
|
}
|
|
.flat .dijitCheckedMenuItemIconChar {
|
|
display: none;
|
|
}
|
|
.flat .dijitMenuPreviousButton,
|
|
.flat .dijitMenuNextButton {
|
|
font-style: italic;
|
|
}
|
|
.flat .dijitMenuBar {
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: #f5f5f5;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItem {
|
|
padding: 8px 12px;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItemHover {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItemActive {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItemSelected,
|
|
.flat .dijitMenuBar .dijitMenuItemHover.dijitMenuItemSelected,
|
|
.flat .dijitMenuBar .dijitMenuItemActive.dijitMenuItemSelected {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
}
|
|
.flat .dijitMenuBar .dijitMenuItemDisabled.dijitMenuItemSelected {
|
|
color: #f2f2f2;
|
|
background: #5cafdb;
|
|
}
|
|
.flat .dijitMenuPopup {
|
|
border-top-left-radius: 0;
|
|
border-top-right-radius: 0;
|
|
}
|
|
.flat .dijitMenuPopup .dijitMenu {
|
|
border-top-left-radius: 0;
|
|
border-top-right-radius: 0;
|
|
}
|
|
.flat .dijitMenuPopup .dijitMenuItem,
|
|
.flat .dijitMenuPopup .dijitMenuItem td {
|
|
padding: 8px;
|
|
}
|
|
.flat .dijitDialogRtl .dijitDialogCloseIcon {
|
|
right: auto;
|
|
left: 12px;
|
|
}
|
|
.flat .dijitDialogRtl .dijitDialogPaneActionBar,
|
|
.flat .dijitTooltipDialogRtl .dijitDialogPaneActionBar {
|
|
text-align: left;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderProgressBarH {
|
|
float: right;
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderLeftBumper {
|
|
border-left-width: 0;
|
|
border-right-width: 1px;
|
|
margin-left: 0;
|
|
margin-right: 4px;
|
|
border-radius: 0 1.5px 1.5px 0;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderRightBumper {
|
|
border-left-width: 1px;
|
|
border-right-width: 0;
|
|
margin-left: 4px;
|
|
margin-right: -2px;
|
|
border-radius: 1.5px 0 0 1.5px;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderMoveableH {
|
|
right: auto;
|
|
left: 0;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderImageHandleV {
|
|
left: auto;
|
|
}
|
|
.flat .dijitSliderRtl .dijitSliderImageHandleH {
|
|
left: -50%;
|
|
}
|
|
.flat .dijitSliderRtl .dijitRuleContainerV {
|
|
float: right;
|
|
}
|
|
/* Slider
|
|
*
|
|
* Styling Slider mainly includes styling the Slider progress bar (dijitSliderProgressBar)
|
|
*
|
|
* Slider progress bar:
|
|
* 1. Slider progress bar (default styling):
|
|
* .dijitSliderProgressBarH - progress bar at the middle of horizontal slider
|
|
* .dijitSliderLeftBumper - bar at the left of horizontal slider
|
|
* .dijitSliderRightBumper - bar at the right of horizontal slider
|
|
* .dijitSliderProgressBarV - progress bar at the middle of vertical slider
|
|
* .dijitSliderTopBumper - bar at the top of vertical slider
|
|
* .dijitSliderBottomtBumper - bar at the bottom of vertical slider
|
|
*
|
|
* 2. hovered Slider progress bar (ie, mouse hover on progress bar)
|
|
* .dijitSliderHover .dijitSliderProgressBarH(horizontal) - hovered bar style: background, border
|
|
*
|
|
* 3. focused Slider progress bar (ie, mouse focused on progress bar)
|
|
* .dijitSliderFocused .dijitSliderProgressBarH(horizontal) - focus bar style: background, border
|
|
*
|
|
* 4. disabled/read-only Slider progress bar
|
|
* .dijitSliderDisabled .dijitSliderProgressBarH(horizontal) - bar styles when slider is disabled
|
|
*
|
|
*
|
|
* Slider Thumbs:
|
|
* 1. Slider Thumbs (default styling):
|
|
* .dijitSliderImageHandleH / .dijitSliderImageHandleV - styles for the controller on the progress bar
|
|
*
|
|
* 2. hovered Slider Thumbs (ie, mouse hover on slider thumbs)
|
|
* .dijitSliderHover .dijitSliderImageHandleH - hovered controller style
|
|
*
|
|
* 3. focused Slider progress bar (ie, mouse focused on slider thumbs)
|
|
* .dijitSliderFocused .dijitSliderImageHandleV - focused controller style
|
|
*
|
|
*
|
|
* Slider Increment/Decrement Buttons:
|
|
* 1. Slider Increment/Decrement Buttons (default styling):
|
|
* .dijitSliderDecrementIconH - decrement icon which lies at the left of horizontal slider
|
|
* .dijitSliderIncrementIconH - increment icon which lies at the right of horizontal slider
|
|
* .dijitSliderDecrementIconV - decrement icon which lies at the bottom of vertical slider
|
|
* .dijitSliderIncrementIconV - increment icon which lies at the top of vertical slider
|
|
*
|
|
* 2. hovered Slider Increment/Decrement Buttons (mouse hover on the icons)
|
|
* .dijitSliderHover .dijitSliderDecrementIconH - for background, border
|
|
*
|
|
* 3. active Slider Increment/Decrement Buttons (mouse down on the icons)
|
|
* .dijitSliderActive .dijitSliderIncrementIconV - for background, border
|
|
*
|
|
* 4. disabled/read-only Slider Increment/Decrement Buttons
|
|
* .dijitSliderDisabled .dijitSliderDecrementIconH - styles for the icons in disabled slider
|
|
* .dijitSliderReadOnly .dijitSliderIncrementIconV - styles for the icons in read-only slider
|
|
*/
|
|
.flat .dijitSliderBar {
|
|
border-style: solid;
|
|
outline: 1px;
|
|
}
|
|
.flat .dijitRuleLabelsContainer {
|
|
color: #424242;
|
|
font-size: smaller;
|
|
}
|
|
.flat .dijitSliderDisabled {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitRuleLabelsContainerH {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSliderBarH,
|
|
.flat .dijitSliderBumperH {
|
|
height: 3px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderLeftBumper {
|
|
border-radius: 1.5px 0 0 1.5px;
|
|
border: 0 none;
|
|
margin-left: 4px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderRightBumper {
|
|
border-radius: 0 1.5px 1.5px 0;
|
|
border: 0 none;
|
|
margin-left: -2px;
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderProgressBarH,
|
|
.flat .dijitSlider .dijitSliderLeftBumper {
|
|
border: 0 none;
|
|
background-color: #257aa7;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitSlider .dijitSliderRemainingBarH,
|
|
.flat .dijitSlider .dijitSliderRightBumper {
|
|
border: 0 none;
|
|
background-color: #ccc;
|
|
}
|
|
.flat .dijitSliderHover .dijitSliderProgressBarH,
|
|
.flat .dijitSliderHover .dijitSliderLeftBumper {
|
|
background-color: #22709a;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitSliderFocused .dijitSliderProgressBarH,
|
|
.flat .dijitSliderFocused .dijitSliderLeftBumper {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitSliderFocused .dijitSliderRemainingBarH,
|
|
.flat .dijitSliderFocused .dijitSliderRightBumper {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitRuleLabelsContainerV {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSliderBarV,
|
|
.flat .dijitSliderBumperV {
|
|
width: 3px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderTopBumper {
|
|
border-radius: 1.5px 1.5px 0 0;
|
|
border: 0 none;
|
|
margin-top: 4px;
|
|
margin-bottom: -2px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderBottomBumper {
|
|
border-radius: 0 0 1.5px 1.5px;
|
|
border: 0 none;
|
|
margin-bottom: 4px;
|
|
}
|
|
.flat .dijitSlider .dijitSliderProgressBarV,
|
|
.flat .dijitSlider .dijitSliderBottomBumper {
|
|
border: 0 none;
|
|
background-color: #257aa7;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitSlider .dijitSliderRemainingBarV,
|
|
.flat .dijitSlider .dijitSliderTopBumper {
|
|
border: 0 none;
|
|
background-color: #ccc;
|
|
}
|
|
.flat .dijitSliderHover .dijitSliderProgressBarV,
|
|
.flat .dijitSliderHover .dijitSliderBottomBumper {
|
|
background-color: #22709a;
|
|
background-image: none;
|
|
}
|
|
.flat .dijitSliderFocused .dijitSliderProgressBarV,
|
|
.flat .dijitSliderFocused .dijitSliderBottomBumper {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitSliderFocused .dijitSliderRemainingBarV,
|
|
.flat .dijitSliderFocused .dijitSliderTopBumper {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitSliderImageHandle {
|
|
background: #fff;
|
|
-webkit-box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
border-radius: 50%;
|
|
border: 1px solid #257aa7;
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-top: -2px;
|
|
position: absolute;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
.flat .dijitSliderImageHandle:after {
|
|
content: "";
|
|
display: block;
|
|
background: #257aa7;
|
|
border-radius: 50%;
|
|
height: 10px;
|
|
width: 10px;
|
|
left: 2px;
|
|
top: 2px;
|
|
position: absolute;
|
|
}
|
|
.flat .dijitSliderImageHandleV {
|
|
margin-top: 0;
|
|
}
|
|
.flat .dijitSliderHover .dijitSliderImageHandle,
|
|
.flat .dijitSliderFocused .dijitSliderImageHandle {
|
|
-webkit-box-shadow: 0 4px 2px -2px rgba(0,0,0,0.3), 0 4px 6px rgba(0,0,0,0.2);
|
|
box-shadow: 0 4px 2px -2px rgba(0,0,0,0.3), 0 4px 6px rgba(0,0,0,0.2);
|
|
}
|
|
.flat .dijitSliderDisabled.dijitSliderFocused .dijitSliderImageHandle:after {
|
|
display: none;
|
|
}
|
|
.flat .dijitSliderDecrementIconH,
|
|
.flat .dijitSliderIncrementIconH,
|
|
.flat .dijitSliderDecrementIconV,
|
|
.flat .dijitSliderIncrementIconV {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
height: 20px;
|
|
width: 20px;
|
|
cursor: pointer;
|
|
color: #257aa7;
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSliderDecrementIconH:hover,
|
|
.flat .dijitSliderIncrementIconH:hover,
|
|
.flat .dijitSliderDecrementIconV:hover,
|
|
.flat .dijitSliderIncrementIconV:hover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitSliderDecrementIconH:active,
|
|
.flat .dijitSliderIncrementIconH:active,
|
|
.flat .dijitSliderDecrementIconV:active,
|
|
.flat .dijitSliderIncrementIconV:active {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitSliderReadOnly .dijitSliderDecrementIconH,
|
|
.flat .dijitSliderDisabled .dijitSliderDecrementIconH,
|
|
.flat .dijitSliderReadOnly .dijitSliderDecrementIconV,
|
|
.flat .dijitSliderDisabled .dijitSliderDecrementIconV,
|
|
.flat .dijitSliderReadOnly .dijitSliderIncrementIconH,
|
|
.flat .dijitSliderDisabled .dijitSliderIncrementIconH,
|
|
.flat .dijitSliderReadOnly .dijitSliderIncrementIconV,
|
|
.flat .dijitSliderDisabled .dijitSliderIncrementIconV {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitSliderIncrementIconH,
|
|
.flat .dijitSliderIncrementIconV,
|
|
.flat .dijitSliderDecrementIconH,
|
|
.flat .dijitSliderDecrementIconV {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.flat .dijitSliderIncrementIconH:before,
|
|
.flat .dijitSliderIncrementIconV:before,
|
|
.flat .dijitSliderDecrementIconH:before,
|
|
.flat .dijitSliderDecrementIconV:before {
|
|
content: "\f011";
|
|
top: 0;
|
|
line-height: 20px;
|
|
}
|
|
.flat .dijitSliderIncrementIconH .dijitSliderButtonInner,
|
|
.flat .dijitSliderIncrementIconV .dijitSliderButtonInner,
|
|
.flat .dijitSliderDecrementIconH .dijitSliderButtonInner,
|
|
.flat .dijitSliderDecrementIconV .dijitSliderButtonInner {
|
|
display: none;
|
|
}
|
|
.flat .dijitSliderDecrementIconH:before,
|
|
.flat .dijitSliderDecrementIconV:before {
|
|
content: "\f012";
|
|
}
|
|
.flat .dijitRuleMark {
|
|
border: 0 none;
|
|
}
|
|
.flat .dijitRuleMarkH {
|
|
border-right: 1px solid #e0e0e0;
|
|
}
|
|
.flat .dijitRuleMarkV {
|
|
border-bottom: 1px solid #e0e0e0;
|
|
}
|
|
.flat .dijitRuleLabelContainerH {
|
|
margin-top: 2px;
|
|
margin-bottom: 2px;
|
|
}
|
|
.flat .dijitRuleLabelContainerV {
|
|
margin-left: 2px;
|
|
margin-right: 2px;
|
|
}
|
|
.flat .dijitSelectRtl .dijitButtonText {
|
|
float: right;
|
|
padding: 0 12px 0 0;
|
|
}
|
|
.flat .dijitSelectRtl .dijitButtonContents {
|
|
border-style: none none none solid;
|
|
text-align: right;
|
|
}
|
|
.flat .dijitComboBoxRtl .dijitButtonNode.dijitArrowButtonContainer {
|
|
border-radius: 4px 0 0 4px;
|
|
}
|
|
.flat .dijitComboBoxRtl .dijitArrowButtonContainer {
|
|
border-right-width: 1px !important;
|
|
border-left-width: 0 !important;
|
|
}
|
|
.flat .dijitTextBoxRtl .dijitValidationContainer,
|
|
.flat .dijitTextBoxRtl .dijitSpinnerButtonContainer {
|
|
border-right-width: 1px !important;
|
|
border-left-width: 0 !important;
|
|
}
|
|
.flat .dijitTextBoxRtlError .dijitValidationContainer {
|
|
border-left-width: 0;
|
|
border-right-width: 1px;
|
|
}
|
|
.flat .dijitRtl .dijitPlaceHolder {
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
.flat .dijitTextBoxRtl .dijitSpinnerButtonContainer,
|
|
.flat .dijitValidationTextBoxRtl .dijitValidationContainer,
|
|
.flat .dijitTextBoxRtl .dijitArrowButtonContainer {
|
|
float: left;
|
|
}
|
|
.flat div.dijitNumberTextBoxRtl {
|
|
text-align: right;
|
|
}
|
|
/* RadioButton
|
|
*
|
|
* Styling RadioButton mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* .dijitRadio|.dijitRadioIcon
|
|
*
|
|
* 2. RadioButton within ToggleButton
|
|
* .dijitToggleButton|.dijitToggleButtonChecked
|
|
*
|
|
* 3. Checked state
|
|
* .dijitRadioChecked
|
|
* .dijitToggleButtonChecked
|
|
*
|
|
* 4. Hover state
|
|
* .dijitRadioHover|.dijitRadioCheckedHover
|
|
*
|
|
* 5. Disabled state
|
|
* .dijitRadioDisabled|.dijitRadioCheckedDisabled
|
|
*/
|
|
.flat .dijitRadio,
|
|
.flat .dijitRadioIcon {
|
|
/* inside a toggle button */
|
|
width: 16px;
|
|
height: 16px;
|
|
background: #fff;
|
|
border: 1px solid #257aa7;
|
|
border-radius: 50%;
|
|
position: relative;
|
|
overflow: visible;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
.flat .dijitRadio:after,
|
|
.flat .dijitRadioIcon:after {
|
|
content: " ";
|
|
display: block;
|
|
width: 0;
|
|
height: 0;
|
|
background-color: #257aa7;
|
|
border-radius: 50%;
|
|
opacity: 0;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
|
filter: alpha(opacity=0);
|
|
margin: 8px;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
-webkit-transition: all 0.15s ease-in-out;
|
|
-moz-transition: all 0.15s ease-in-out;
|
|
-o-transition: all 0.15s ease-in-out;
|
|
-ms-transition: all 0.15s ease-in-out;
|
|
transition: all 0.15s ease-in-out;
|
|
}
|
|
.flat .dijitRadioHover {
|
|
border-color: #43a3d5;
|
|
}
|
|
.flat .dijitRadioChecked:after,
|
|
.flat .dijitChecked .dijitRadioIcon:after {
|
|
width: 8px;
|
|
height: 8px;
|
|
margin: 3px;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .alt-primary .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-primary .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-success .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-success .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-info .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-info .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-warning .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-warning .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-danger .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-danger .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .alt-inverse .dijitRadioIcon {
|
|
border-color: #fff;
|
|
}
|
|
.flat .alt-inverse .dijitRadioIcon:after {
|
|
background-color: #fff;
|
|
}
|
|
.flat .dijitRadioDisabled {
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitRadioCheckedDisabled {
|
|
background-color: #f5f5f5;
|
|
border-color: #5cafdb;
|
|
}
|
|
.flat .dijitRadioCheckedDisabled:after {
|
|
background-color: #5cafdb;
|
|
}
|
|
.flat .dijitRadioMenuItem .dijitCheckedMenuItemIcon {
|
|
width: 16px;
|
|
height: 16px;
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 50%;
|
|
position: relative;
|
|
overflow: visible;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
.flat .dijitRadioMenuItem .dijitCheckedMenuItemIcon:after {
|
|
content: " ";
|
|
display: block;
|
|
width: 0;
|
|
height: 0;
|
|
background-color: #257aa7;
|
|
border-radius: 50%;
|
|
opacity: 0;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
|
filter: alpha(opacity=0);
|
|
margin: 8px;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
-webkit-transition: all 0.15s ease-in-out;
|
|
-moz-transition: all 0.15s ease-in-out;
|
|
-o-transition: all 0.15s ease-in-out;
|
|
-ms-transition: all 0.15s ease-in-out;
|
|
transition: all 0.15s ease-in-out;
|
|
}
|
|
.flat .dijitRadioMenuItemChecked .dijitCheckedMenuItemIcon {
|
|
border-color: #ccc;
|
|
}
|
|
.flat .dijitRadioMenuItemChecked .dijitCheckedMenuItemIcon:after {
|
|
width: 8px;
|
|
height: 8px;
|
|
margin: 3px;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
/* CheckBox
|
|
*
|
|
* Styling CheckBox mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* .dijitCheckBox
|
|
*
|
|
* 2. CheckBox within ToggleButton
|
|
* .dijitCheckBoxIcon
|
|
*
|
|
* 3. States - Checked, Hover, Disabled.
|
|
* .dijitCheckBoxChecked
|
|
* .dijitCheckBoxHover
|
|
* .dijitCheckBoxCheckedHover
|
|
* .dijitCheckBoxDisabled
|
|
* .dijitCheckBoxCheckedDisabled
|
|
*/
|
|
.flat .dijitCheckBox {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
width: 16px;
|
|
height: 16px;
|
|
line-height: 1;
|
|
padding: 0;
|
|
border-radius: 2px;
|
|
text-align: center;
|
|
position: relative;
|
|
overflow: visible;
|
|
-webkit-transition: all 0.1s linear;
|
|
-moz-transition: all 0.1s linear;
|
|
-o-transition: all 0.1s linear;
|
|
-ms-transition: all 0.1s linear;
|
|
transition: all 0.1s linear;
|
|
}
|
|
.flat .dijitCheckBox input {
|
|
position: absolute;
|
|
top: 0;
|
|
}
|
|
.flat .dijitCheckBoxIcon:before,
|
|
.flat .dijitCheckBoxChecked:before,
|
|
.flat .dijitCheckBoxCheckedDisabled:before {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
content: "\f00c";
|
|
color: #fff;
|
|
}
|
|
.flat .dijitCheckBoxIcon {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitCheckBoxIcon:before {
|
|
color: #257aa7;
|
|
}
|
|
.flat .alt-primary .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-success .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-info .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-warning .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-danger .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .alt-inverse .dijitCheckBoxIcon:before {
|
|
color: #fff;
|
|
}
|
|
.flat .dijitCheckBoxChecked {
|
|
background-color: #257aa7;
|
|
border-color: #257aa7;
|
|
}
|
|
.flat .dijitCheckBoxHover {
|
|
background-color: #fff;
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitCheckBoxCheckedHover {
|
|
background-color: #2d95cd;
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitCheckBoxDisabled {
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitCheckBoxCheckedDisabled {
|
|
color: #a6a6a6;
|
|
background-color: #5cafdb;
|
|
border-color: #5cafdb;
|
|
}
|
|
.flat .dijitCheckedMenuItem .dijitCheckedMenuItemIcon {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
width: 16px;
|
|
height: 16px;
|
|
line-height: 1;
|
|
padding: 0;
|
|
border-radius: 2px;
|
|
text-align: center;
|
|
position: relative;
|
|
overflow: visible;
|
|
-webkit-transition: all 0.1s linear;
|
|
-moz-transition: all 0.1s linear;
|
|
-o-transition: all 0.1s linear;
|
|
-ms-transition: all 0.1s linear;
|
|
transition: all 0.1s linear;
|
|
}
|
|
.flat .dijitCheckedMenuItemChecked .dijitCheckedMenuItemIcon:before {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
content: "\f00c";
|
|
color: #257aa7;
|
|
}
|
|
/* Text Inputs: [TextBox | DateTextBox | CurrencyTextBox | ValidationTextBox | ...] | TextArea
|
|
* Mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* .dijitTextBox
|
|
* .dijitInputField - container that wraps "dijitInputInner" or "dijitPlaceHolder"
|
|
*
|
|
* 2. Textbox input
|
|
* .dijitInputInner
|
|
* .dijitPlaceHolder
|
|
*
|
|
* 3. States - Hover, Focused, Disabled, Error, Error while Focused e.g.
|
|
* .dijitTextBoxHover
|
|
* .dijitTextBoxFocused
|
|
* .dijitTextBoxDisabled
|
|
* .dijitTextBoxError
|
|
* .dijitTextBoxErrorFocused
|
|
*
|
|
*/
|
|
.flat .dijitTextBox,
|
|
.flat .dijitInputInner {
|
|
line-height: 20px;
|
|
}
|
|
.flat .dijitTextBox {
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
-webkit-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
-moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
-o-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
-ms-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
|
|
}
|
|
.flat .dijitTextArea {
|
|
padding: 4px 6px;
|
|
}
|
|
.flat .dijitTextBox .dijitInputField {
|
|
padding: 0 4px;
|
|
margin: 0 2px;
|
|
}
|
|
.flat .dijitSelect.alt-primary,
|
|
.flat .dijitComboBox.alt-primary,
|
|
.flat .dijitSpinner.alt-primary {
|
|
border-color: #1e88e5;
|
|
}
|
|
.flat .dijitSelect.alt-success,
|
|
.flat .dijitComboBox.alt-success,
|
|
.flat .dijitSpinner.alt-success {
|
|
border-color: #43a047;
|
|
}
|
|
.flat .dijitSelect.alt-info,
|
|
.flat .dijitComboBox.alt-info,
|
|
.flat .dijitSpinner.alt-info {
|
|
border-color: #03a9f4;
|
|
}
|
|
.flat .dijitSelect.alt-warning,
|
|
.flat .dijitComboBox.alt-warning,
|
|
.flat .dijitSpinner.alt-warning {
|
|
border-color: #fb8c00;
|
|
}
|
|
.flat .dijitSelect.alt-danger,
|
|
.flat .dijitComboBox.alt-danger,
|
|
.flat .dijitSpinner.alt-danger {
|
|
border-color: #e53935;
|
|
}
|
|
.flat .dijitSelect.alt-inverse,
|
|
.flat .dijitComboBox.alt-inverse,
|
|
.flat .dijitSpinner.alt-inverse {
|
|
border-color: #616161;
|
|
}
|
|
.flat .dijitTextBox .dijitInputInner,
|
|
.flat .dijitValidationTextBox .dijitValidationContainer,
|
|
.flat .dijitTextBox .dijitInputField .dijitPlaceHolder {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitTextBoxHover {
|
|
border-color: #257aa7;
|
|
-webkit-transition-duration: 0.25s;
|
|
-moz-transition-duration: 0.25s;
|
|
-o-transition-duration: 0.25s;
|
|
-ms-transition-duration: 0.25s;
|
|
transition-duration: 0.25s;
|
|
}
|
|
.flat .dijitTextBoxFocused {
|
|
border-color: #257aa7;
|
|
-webkit-transition-duration: 0.1s;
|
|
-moz-transition-duration: 0.1s;
|
|
-o-transition-duration: 0.1s;
|
|
-ms-transition-duration: 0.1s;
|
|
transition-duration: 0.1s;
|
|
}
|
|
.flat .dijitTextBoxDisabled {
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-primary,
|
|
.flat .dijitSpinnerDisabled.alt-primary {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #6db2ee;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-primary .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-primary .dijitButtonNode {
|
|
background: #6db2ee;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-primary .dijitSpinnerButtonContainer {
|
|
border-left-color: #6db2ee;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-primary .dijitSpinnerButtonContainer {
|
|
border-right-color: #6db2ee;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-primary {
|
|
border-color: #6db2ee;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-primary .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-primary .dijitButtonNode {
|
|
background: #6db2ee;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-success,
|
|
.flat .dijitSpinnerDisabled.alt-success {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #7dc981;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-success .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-success .dijitButtonNode {
|
|
background: #7dc981;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-success .dijitSpinnerButtonContainer {
|
|
border-left-color: #7dc981;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-success .dijitSpinnerButtonContainer {
|
|
border-right-color: #7dc981;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-success {
|
|
border-color: #7dc981;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-success .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-success .dijitButtonNode {
|
|
background: #7dc981;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-info,
|
|
.flat .dijitSpinnerDisabled.alt-info {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #56c9fd;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-info .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-info .dijitButtonNode {
|
|
background: #56c9fd;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-info .dijitSpinnerButtonContainer {
|
|
border-left-color: #56c9fd;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-info .dijitSpinnerButtonContainer {
|
|
border-right-color: #56c9fd;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-info {
|
|
border-color: #56c9fd;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-info .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-info .dijitButtonNode {
|
|
background: #56c9fd;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-warning,
|
|
.flat .dijitSpinnerDisabled.alt-warning {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #ffb557;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-warning .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-warning .dijitButtonNode {
|
|
background: #ffb557;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-warning .dijitSpinnerButtonContainer {
|
|
border-left-color: #ffb557;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-warning .dijitSpinnerButtonContainer {
|
|
border-right-color: #ffb557;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-warning {
|
|
border-color: #ffb557;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-warning .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-warning .dijitButtonNode {
|
|
background: #ffb557;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-danger,
|
|
.flat .dijitSpinnerDisabled.alt-danger {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #ee7e7c;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-danger .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-danger .dijitButtonNode {
|
|
background: #ee7e7c;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-danger .dijitSpinnerButtonContainer {
|
|
border-left-color: #ee7e7c;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-danger .dijitSpinnerButtonContainer {
|
|
border-right-color: #ee7e7c;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-danger {
|
|
border-color: #ee7e7c;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-danger .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-danger .dijitButtonNode {
|
|
background: #ee7e7c;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-inverse,
|
|
.flat .dijitSpinnerDisabled.alt-inverse {
|
|
background: #f5f5f5;
|
|
color: #9e9e9e;
|
|
border: 1px solid #989898;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSpinnerDisabled.alt-inverse .dijitButtonNode {
|
|
background: #989898;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitSpinnerDisabled.alt-inverse .dijitSpinnerButtonContainer {
|
|
border-left-color: #989898;
|
|
}
|
|
.flat .dijitSpinnerRtlDisabled.alt-inverse .dijitSpinnerButtonContainer {
|
|
border-right-color: #989898;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-inverse {
|
|
border-color: #989898;
|
|
}
|
|
.flat .dijitSelectDisabled.alt-inverse .dijitStretch,
|
|
.flat .dijitSelectDisabled.alt-inverse .dijitButtonNode {
|
|
background: #989898;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitTextBoxError,
|
|
.flat .dijitTextBoxError .dijitButtonNode {
|
|
border-color: #dd2c00;
|
|
}
|
|
.flat .dijitTextBoxErrorFocused,
|
|
.flat .dijitTextBoxErrorFocused .dijitButtonNode {
|
|
border: 1px solid #bc2500;
|
|
}
|
|
.flat .dijitValidationTextBoxError .dijitValidationContainer {
|
|
color: #dd2c00;
|
|
width: 18px;
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
font-size: 18px;
|
|
}
|
|
.flat .dijitValidationTextBoxError .dijitValidationContainer:before {
|
|
content: "\f017";
|
|
}
|
|
.flat .dijitValidationTextBoxError .dijitValidationIcon {
|
|
display: none;
|
|
}
|
|
.flat table.dijitComboButtonRtl .dijitStretch {
|
|
border-radius: 0 4px 4px 0;
|
|
}
|
|
.flat table.dijitComboButtonRtl .dijitArrowButton {
|
|
border-radius: 4px 0 0 4px;
|
|
border-left-width: 1px;
|
|
border-right-width: 0;
|
|
}
|
|
.flat .dijitDropDownButtonRtl .dijitButtonNode {
|
|
padding-left: 8px;
|
|
}
|
|
.flat .dijitDropDownButtonRtl .dijitArrowButtonInner {
|
|
margin-left: 0;
|
|
margin-right: 12px;
|
|
}
|
|
/* Select | Combobox
|
|
* And minor style for DateTextBox | MultiSelect
|
|
*
|
|
* Styling Select mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* Select:
|
|
* .dijitSelect
|
|
* .dijitButtonContents
|
|
* Combobox:
|
|
* .dijitComboBox
|
|
*
|
|
* 2. Arrow Button
|
|
* .dijitArrowButton
|
|
* .dijitArrowButtonInner
|
|
* .dijitComboBox .dijitButtonNode
|
|
*
|
|
* 3. Menu
|
|
* .dijitSelectMenu
|
|
*
|
|
* 4. States - Hover, Active, Focused, Disabled, e.g.
|
|
*
|
|
* Select: Hover, Active, Focused, Disabled
|
|
* .dijitSelectHover
|
|
* .dijitSelectFocused
|
|
* .dijitSelectDisabled
|
|
*
|
|
* Combobox: Hover, Focused (Open), Disabled
|
|
* .dijitComboBox .dijitDownArrowButtonHover
|
|
* .dijitComboBoxOpenHover .dijitButtonNode
|
|
* .dijitComboBoxDisabled .dijitButtonNode
|
|
*
|
|
*/
|
|
.flat .dijitSelect .dijitArrowButtonInner,
|
|
.flat .dijitComboBox .dijitArrowButtonInner {
|
|
margin: 0;
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
.flat .dijitSelect {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
table-layout: fixed;
|
|
}
|
|
.flat .dijitSelect .dijitButtonContents,
|
|
.flat .dijitSelect .dijitArrowButton {
|
|
line-height: 20px;
|
|
padding: 4px 12px;
|
|
border: 0;
|
|
border-radius: 0 2.666666666666668px 2.666666666666668px 0;
|
|
}
|
|
.flat .dijitSelect .dijitButtonContents {
|
|
padding: 0;
|
|
overflow: hidden;
|
|
-o-text-overflow: ellipsis;
|
|
text-overflow: ellipsis;
|
|
border-radius: 2.666666666666668px 0 0 2.666666666666668px;
|
|
}
|
|
.flat .dijitSelect .dijitInputField {
|
|
padding: 0 0 0 12px;
|
|
}
|
|
.flat .dijitSelect .dijitArrowButton {
|
|
width: 20px;
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitSelectHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitSelectActive {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitSelectFocused {
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitSelectDisabled {
|
|
cursor: default;
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitComboBox .dijitButtonNode {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
border-radius: 0 2.666666666666668px 2.666666666666668px 0;
|
|
}
|
|
.flat .dijitComboBoxOpenHover .dijitButtonNode,
|
|
.flat .dijitComboBox .dijitDownArrowButtonHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.flat .dijitComboBoxDisabled .dijitButtonNode {
|
|
cursor: default;
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitComboBox .dijitArrowButton {
|
|
width: 20px;
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitToolbar .dijitComboBox .dijitArrowButtonInner {
|
|
border: none;
|
|
}
|
|
.flat .dijitDateTextBox .dijitArrowButton:before {
|
|
content: "\f01e";
|
|
}
|
|
.flat .dijitTimeTextBox .dijitArrowButton:before {
|
|
content: "\f01f";
|
|
}
|
|
.flat select {
|
|
padding: 4px 0;
|
|
border: 1px solid #ccc;
|
|
-webkit-box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
}
|
|
.flat select option {
|
|
padding: 4px 8px;
|
|
}
|
|
.flat .dijitSelectMenu td.dijitMenuItemIconCell,
|
|
.flat .dijitSelectMenu td.dijitMenuArrowCell {
|
|
/* so that arrow and icon cells from MenuItem are not displayed */
|
|
display: none;
|
|
}
|
|
.flat .dijitSpinnerRtl .dijitSpinnerButtonContainer .dijitArrowButton {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
/* NumberSpinner - namespace "dijitSpinner"
|
|
*
|
|
* Styling NumberSpinner mainly includes:
|
|
*
|
|
* 1. Arrows
|
|
* Outer containers: .dijitSpinnerButtonContainer|.dijitSpinnerButtonInner - for border, padding and position
|
|
* Arrows: .dijitArrowButton|.dijitUpArrowButton.|dijitDownArrowButton
|
|
* Inner container: .dijitArrowButtonInner - for border, padding, width|height and background image
|
|
*
|
|
* 2. Hover state
|
|
* .dijitUpArrowButtonHover|.dijitDownArrowButtonHover .* - for background color|image
|
|
*
|
|
* 3. Active state
|
|
* .dijitUpArrowButtonActive|.dijitDownArrowButtonActive .* - for border, padding, margin and background color|image
|
|
*
|
|
* 4. Focused state
|
|
* .dijitSpinnerFocused .* - for background color|image
|
|
*
|
|
* 5. Disabled state
|
|
* .dijitSpinnerDisabled .* - for background color|image
|
|
*/
|
|
.flat .dijitSpinner .dijitSpinnerButtonContainer {
|
|
overflow: hidden;
|
|
position: relative;
|
|
width: auto;
|
|
padding: 0;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitSpinner .dijitSpinnerButtonInner {
|
|
width: 30px;
|
|
padding: 4px 0 !important;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButton {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
border-radius: 0;
|
|
border: 0;
|
|
width: auto;
|
|
overflow: hidden;
|
|
left: 0;
|
|
right: 0;
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButton:before {
|
|
content: none;
|
|
}
|
|
.flat .dijitSpinner .dijitUpArrowButton {
|
|
border-top-right-radius: 2.666666666666668px;
|
|
}
|
|
.flat .dijitSpinner .dijitDownArrowButton {
|
|
border-bottom-right-radius: 2.666666666666668px;
|
|
}
|
|
.flat .dijitSpinner .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner .dijitDownArrowButtonHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitSpinner .dijitDownArrowButtonActive,
|
|
.flat .dijitSpinner .dijitUpArrowButtonActive {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButtonInner {
|
|
line-height: 14px;
|
|
display: block;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButtonInner .dijitInputField {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitSpinner .dijitArrowButtonInner:before {
|
|
content: "\f003";
|
|
}
|
|
.flat .dijitSpinner .dijitDownArrowButton .dijitArrowButtonInner:before {
|
|
content: "\f002";
|
|
}
|
|
.flat .dijitSpinnerDisabled .dijitDownArrowButton,
|
|
.flat .dijitSpinnerDisabled .dijitUpArrowButton {
|
|
cursor: default;
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .alt-primary .dijitSpinnerButtonContainer {
|
|
border-color: #1e88e5;
|
|
}
|
|
.flat .alt-success .dijitSpinnerButtonContainer {
|
|
border-color: #43a047;
|
|
}
|
|
.flat .alt-info .dijitSpinnerButtonContainer {
|
|
border-color: #03a9f4;
|
|
}
|
|
.flat .alt-warning .dijitSpinnerButtonContainer {
|
|
border-color: #fb8c00;
|
|
}
|
|
.flat .alt-danger .dijitSpinnerButtonContainer {
|
|
border-color: #e53935;
|
|
}
|
|
.flat .alt-inverse .dijitSpinnerButtonContainer {
|
|
border-color: #616161;
|
|
}
|
|
/* Button | DropDownButton | ComboButton | ToggleButton
|
|
*
|
|
* Styling Buttons mainly includes:
|
|
*
|
|
* 1. Containers
|
|
* .dijitButton
|
|
* .dijitDropDownButton
|
|
* .dijitComboButton
|
|
* .dijitButtonNode - common button/arrow wrapper shared across all three button types
|
|
*
|
|
* 2. Button text
|
|
* .dijitButtonText
|
|
*
|
|
* 3. Arrows - only for DropDownButton and ComboButton
|
|
* There are total four directions arrows - down, left, right, up:
|
|
* .dijitArrowButtonInner - down arrow by default
|
|
* .dijitLeftArrowButton .dijitArrowButtonInner - left arrow
|
|
* .dijitRightArrowButton .dijitArrowButtonInner - right arrow
|
|
* .dijitUpArrowButton .dijitArrowButtonInner - up arrow
|
|
*
|
|
* 4. States - Hover, Active, Disabled, e.g.
|
|
* .dijitButtonHover .dijitButtonNode
|
|
* .dijitButtonActive .dijitButtonNode
|
|
* .dijitButtonDisabled .dijitButtonNode
|
|
*
|
|
* .dijitDisabled .dijitArrowButtonInner - disabled arrow states
|
|
*/
|
|
.flat .dijitButtonText {
|
|
padding: 0 4px;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitButton .dijitButtonNode,
|
|
.flat .dijitDropDownButton .dijitButtonNode,
|
|
.flat .dijitComboButton .dijitButtonNode,
|
|
.flat .dijitToggleButton .dijitButtonNode {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
}
|
|
.flat .dijitButton.alt-primary .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-primary .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-primary .dijitButtonNode,
|
|
.flat .dijitSelect.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelect.alt-primary .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-primary .dijitArrowButton {
|
|
background: #1e88e5;
|
|
color: #fff;
|
|
border-color: #166fbd;
|
|
}
|
|
.flat .dijitComboButton.alt-primary .dijitStretch {
|
|
border-right-color: #166fbd;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-primary .dijitStretch {
|
|
border-left-color: #166fbd;
|
|
}
|
|
.flat .dijitButton.alt-success .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-success .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-success .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-success .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-success .dijitButtonNode,
|
|
.flat .dijitSelect.alt-success .dijitButtonContents,
|
|
.flat .dijitSelect.alt-success .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-success .dijitArrowButton {
|
|
background: #43a047;
|
|
color: #fff;
|
|
border-color: #37823a;
|
|
}
|
|
.flat .dijitComboButton.alt-success .dijitStretch {
|
|
border-right-color: #37823a;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-success .dijitStretch {
|
|
border-left-color: #37823a;
|
|
}
|
|
.flat .dijitButton.alt-info .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-info .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-info .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-info .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-info .dijitButtonNode,
|
|
.flat .dijitSelect.alt-info .dijitButtonContents,
|
|
.flat .dijitSelect.alt-info .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-info .dijitArrowButton {
|
|
background: #03a9f4;
|
|
color: #fff;
|
|
border-color: #028ac7;
|
|
}
|
|
.flat .dijitComboButton.alt-info .dijitStretch {
|
|
border-right-color: #028ac7;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-info .dijitStretch {
|
|
border-left-color: #028ac7;
|
|
}
|
|
.flat .dijitButton.alt-warning .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-warning .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-warning .dijitButtonNode,
|
|
.flat .dijitSelect.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelect.alt-warning .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-warning .dijitArrowButton {
|
|
background: #fb8c00;
|
|
color: #fff;
|
|
border-color: #cd7200;
|
|
}
|
|
.flat .dijitComboButton.alt-warning .dijitStretch {
|
|
border-right-color: #cd7200;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-warning .dijitStretch {
|
|
border-left-color: #cd7200;
|
|
}
|
|
.flat .dijitButton.alt-danger .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-danger .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-danger .dijitButtonNode,
|
|
.flat .dijitSelect.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelect.alt-danger .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-danger .dijitArrowButton {
|
|
background: #e53935;
|
|
color: #fff;
|
|
border-color: #cc1e1a;
|
|
}
|
|
.flat .dijitComboButton.alt-danger .dijitStretch {
|
|
border-right-color: #cc1e1a;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-danger .dijitStretch {
|
|
border-left-color: #cc1e1a;
|
|
}
|
|
.flat .dijitButton.alt-inverse .dijitButtonNode,
|
|
.flat .dijitDropDownButton.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-inverse .dijitButtonNode,
|
|
.flat .dijitToggleButton.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboBox.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSelect.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelect.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSpinner.alt-inverse .dijitArrowButton {
|
|
background: #616161;
|
|
color: #fff;
|
|
border-color: #4f4f4f;
|
|
}
|
|
.flat .dijitComboButton.alt-inverse .dijitStretch {
|
|
border-right-color: #4f4f4f;
|
|
}
|
|
.flat .dijitComboButtonRtl.alt-inverse .dijitStretch {
|
|
border-left-color: #4f4f4f;
|
|
}
|
|
.flat .dijitButtonHover .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover .dijitButtonNode,
|
|
.flat .dijitToggleButtonHover .dijitButtonNode {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitComboButton .dijitButtonNodeHover,
|
|
.flat .dijitComboButton .dijitDownArrowButtonHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitButtonHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-primary .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-primary .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-primary .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-primary .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-primary .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-primary .dijitDownArrowButtonHover {
|
|
background: #1981dd;
|
|
border-color: #1774c5;
|
|
}
|
|
.flat .dijitButtonHover.alt-success .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-success .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-success .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-success .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-success .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-success .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-success .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-success .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-success .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-success .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-success .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-success .dijitDownArrowButtonHover {
|
|
background: #409843;
|
|
border-color: #39883c;
|
|
}
|
|
.flat .dijitButtonHover.alt-info .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-info .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-info .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-info .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-info .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-info .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-info .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-info .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-info .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-info .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-info .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-info .dijitDownArrowButtonHover {
|
|
background: #03a1e8;
|
|
border-color: #0390cf;
|
|
}
|
|
.flat .dijitButtonHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-warning .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-warning .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-warning .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-warning .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-warning .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-warning .dijitDownArrowButtonHover {
|
|
background: #ee8500;
|
|
border-color: #d57700;
|
|
}
|
|
.flat .dijitButtonHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-danger .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-danger .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-danger .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-danger .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-danger .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-danger .dijitDownArrowButtonHover {
|
|
background: #e32d29;
|
|
border-color: #d4201b;
|
|
}
|
|
.flat .dijitButtonHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitDropDownButtonHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-inverse .dijitButtonNodeHover,
|
|
.flat .dijitComboButton.alt-inverse .dijitDownArrowButtonHover,
|
|
.flat .dijitToggleButtonHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboBoxHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSelectHover.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelectHover.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-inverse .dijitArrowButton,
|
|
.flat .dijitSpinner.alt-inverse .dijitUpArrowButtonHover,
|
|
.flat .dijitSpinner.alt-inverse .dijitDownArrowButtonHover {
|
|
background: #5c5c5c;
|
|
border-color: #525252;
|
|
}
|
|
.flat .dijitButtonActive .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive .dijitButtonNode,
|
|
.flat .dijitToggleButtonActive .dijitButtonNode,
|
|
.flat .dijitToggleButtonChecked .dijitButtonNode {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitComboButton .dijitButtonNodeActive,
|
|
.flat .dijitComboButton .dijitDownArrowButtonActive {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitButtonActive.alt-primary .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-primary .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-primary .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-primary .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-primary .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-primary .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-primary .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-primary .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-primary .dijitDownArrowButtonActive {
|
|
background: #1878cc;
|
|
border-color: #135fa3;
|
|
}
|
|
.flat .dijitButtonActive.alt-success .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-success .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-success .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-success .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-success .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-success .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-success .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-success .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-success .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-success .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-success .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-success .dijitDownArrowButtonActive {
|
|
background: #3b8d3e;
|
|
border-color: #2f7032;
|
|
}
|
|
.flat .dijitButtonActive.alt-info .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-info .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-info .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-info .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-info .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-info .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-info .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-info .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-info .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-info .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-info .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-info .dijitDownArrowButtonActive {
|
|
background: #0395d7;
|
|
border-color: #0276ab;
|
|
}
|
|
.flat .dijitButtonActive.alt-warning .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-warning .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-warning .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-warning .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-warning .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-warning .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-warning .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-warning .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-warning .dijitDownArrowButtonActive {
|
|
background: #dd7b00;
|
|
border-color: #b06200;
|
|
}
|
|
.flat .dijitButtonActive.alt-danger .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-danger .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-danger .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-danger .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-danger .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-danger .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-danger .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-danger .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-danger .dijitDownArrowButtonActive {
|
|
background: #dc211c;
|
|
border-color: #af1a17;
|
|
}
|
|
.flat .dijitButtonActive.alt-inverse .dijitButtonNode,
|
|
.flat .dijitDropDownButtonActive.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboButton.alt-inverse .dijitButtonNodeActive,
|
|
.flat .dijitToggleButtonActive.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboBoxActive.alt-inverse .dijitButtonNode,
|
|
.flat .dijitSelectActive.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelectActive.alt-inverse .dijitArrowButton,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-inverse .dijitButtonContents,
|
|
.flat .dijitSelect.dijitSelectOpened.alt-inverse .dijitArrowButton,
|
|
.flat .dijitComboBox.alt-inverse .dijitButtonNode.dijitHasDropDownOpen,
|
|
.flat .dijitSpinner.alt-inverse .dijitUpArrowButtonActive,
|
|
.flat .dijitSpinner.alt-inverse .dijitDownArrowButtonActive {
|
|
background: #555;
|
|
border-color: #444;
|
|
}
|
|
.flat .dijitButtonDisabled,
|
|
.flat .dijitDropDownButtonDisabled,
|
|
.flat .dijitComboButtonDisabled,
|
|
.flat .dijitToggleButtonDisabled {
|
|
outline: none;
|
|
}
|
|
.flat .dijitButtonDisabled .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled .dijitButtonNode {
|
|
cursor: default;
|
|
color: #9e9e9e;
|
|
background-color: #f5f5f5;
|
|
border-color: #e3e3e3;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-primary .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-primary .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-primary .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-primary .dijitButtonNode {
|
|
background: #6db2ee;
|
|
border-color: #50a2eb;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-primary .dijitStretch {
|
|
border-right-color: #50a2eb;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-primary .dijitStretch {
|
|
border-left-color: #50a2eb;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-primary .dijitButtonNode {
|
|
border-left-color: #50a2eb;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-primary .dijitButtonNode {
|
|
border-right-color: #50a2eb;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-primary .dijitButtonNode {
|
|
border-left-color: #50a2eb;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-primary .dijitButtonNode {
|
|
border-right-color: #50a2eb;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-primary .dijitButtonNode {
|
|
border-left-color: #50a2eb;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-primary .dijitButtonNode {
|
|
border-right-color: #50a2eb;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-success .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-success .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-success .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-success .dijitButtonNode {
|
|
background: #7dc981;
|
|
border-color: #63be67;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-success .dijitStretch {
|
|
border-right-color: #63be67;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-success .dijitStretch {
|
|
border-left-color: #63be67;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-success .dijitButtonNode {
|
|
border-left-color: #63be67;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-success .dijitButtonNode {
|
|
border-right-color: #63be67;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-success .dijitButtonNode {
|
|
border-left-color: #63be67;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-success .dijitButtonNode {
|
|
border-right-color: #63be67;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-success .dijitButtonNode {
|
|
border-left-color: #63be67;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-success .dijitButtonNode {
|
|
border-right-color: #63be67;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-info .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-info .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-info .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-info .dijitButtonNode {
|
|
background: #56c9fd;
|
|
border-color: #34befd;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-info .dijitStretch {
|
|
border-right-color: #34befd;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-info .dijitStretch {
|
|
border-left-color: #34befd;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-info .dijitButtonNode {
|
|
border-left-color: #34befd;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-info .dijitButtonNode {
|
|
border-right-color: #34befd;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-info .dijitButtonNode {
|
|
border-left-color: #34befd;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-info .dijitButtonNode {
|
|
border-right-color: #34befd;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-info .dijitButtonNode {
|
|
border-left-color: #34befd;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-info .dijitButtonNode {
|
|
border-right-color: #34befd;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-warning .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-warning .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-warning .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-warning .dijitButtonNode {
|
|
background: #ffb557;
|
|
border-color: #ffa635;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-warning .dijitStretch {
|
|
border-right-color: #ffa635;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-warning .dijitStretch {
|
|
border-left-color: #ffa635;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-warning .dijitButtonNode {
|
|
border-left-color: #ffa635;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-warning .dijitButtonNode {
|
|
border-right-color: #ffa635;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-warning .dijitButtonNode {
|
|
border-left-color: #ffa635;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-warning .dijitButtonNode {
|
|
border-right-color: #ffa635;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-warning .dijitButtonNode {
|
|
border-left-color: #ffa635;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-warning .dijitButtonNode {
|
|
border-right-color: #ffa635;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-danger .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-danger .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-danger .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-danger .dijitButtonNode {
|
|
background: #ee7e7c;
|
|
border-color: #eb6561;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-danger .dijitStretch {
|
|
border-right-color: #eb6561;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-danger .dijitStretch {
|
|
border-left-color: #eb6561;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-danger .dijitButtonNode {
|
|
border-left-color: #eb6561;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-danger .dijitButtonNode {
|
|
border-right-color: #eb6561;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-danger .dijitButtonNode {
|
|
border-left-color: #eb6561;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-danger .dijitButtonNode {
|
|
border-right-color: #eb6561;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-danger .dijitButtonNode {
|
|
border-left-color: #eb6561;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-danger .dijitButtonNode {
|
|
border-right-color: #eb6561;
|
|
}
|
|
.flat .dijitButtonDisabled.alt-inverse .dijitButtonNode,
|
|
.flat .dijitDropDownButtonDisabled.alt-inverse .dijitButtonNode,
|
|
.flat .dijitComboButtonDisabled.alt-inverse .dijitButtonNode,
|
|
.flat .dijitToggleButtonDisabled.alt-inverse .dijitButtonNode {
|
|
background: #989898;
|
|
border-color: #848484;
|
|
color: #f2f2f2;
|
|
}
|
|
.flat .dijitComboButtonDisabled.alt-inverse .dijitStretch {
|
|
border-right-color: #848484;
|
|
}
|
|
.flat .dijitComboButtonRtlDisabled.alt-inverse .dijitStretch {
|
|
border-left-color: #848484;
|
|
}
|
|
.flat .dijitComboBoxDisabled.alt-inverse .dijitButtonNode {
|
|
border-left-color: #848484;
|
|
}
|
|
.flat .dijitComboBoxRtlDisabled.alt-inverse .dijitButtonNode {
|
|
border-right-color: #848484;
|
|
}
|
|
.flat .dijitTimeTextBoxDisabled.alt-inverse .dijitButtonNode {
|
|
border-left-color: #848484;
|
|
}
|
|
.flat .dijitTimeTextBoxRtlDisabled.alt-inverse .dijitButtonNode {
|
|
border-right-color: #848484;
|
|
}
|
|
.flat .dijitDateTextBoxDisabled.alt-inverse .dijitButtonNode {
|
|
border-left-color: #848484;
|
|
}
|
|
.flat .dijitDateTextBoxRtlDisabled.alt-inverse .dijitButtonNode {
|
|
border-right-color: #848484;
|
|
}
|
|
.flat .dijitComboButtonDisabled .dijitArrowButton {
|
|
border-left-width: 0;
|
|
}
|
|
.flat .dijitDropDownButton .dijitButtonNode {
|
|
padding-right: 8px;
|
|
}
|
|
.flat table.dijitComboButton {
|
|
border-collapse: separate; /* override dijit.css so that ComboBox rounded corners work */
|
|
}
|
|
.flat table.dijitComboButton .dijitStretch {
|
|
border-radius: 4px 0 0 4px;
|
|
}
|
|
.flat table.dijitComboButton .dijitArrowButton {
|
|
padding: 4px;
|
|
width: 20px;
|
|
border-radius: 0 4px 4px 0;
|
|
border-left-width: 0;
|
|
}
|
|
.flat .dijitToggleButton .dijitCheckBoxIcon {
|
|
display: none;
|
|
}
|
|
.flat .dijitToggleButtonChecked .dijitIcon {
|
|
display: inline-block;
|
|
}
|
|
.flat .dijitDropDownButton .dijitArrowButtonInner {
|
|
margin-left: 3px;
|
|
}
|
|
.flat .dijitDropDownButton .dijitArrowButtonInner,
|
|
.flat .dijitArrowButton {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.flat .dijitDropDownButton .dijitArrowButtonInner:before,
|
|
.flat .dijitArrowButton:before {
|
|
content: "\f002";
|
|
}
|
|
.flat .dijitLeftArrowButton:before {
|
|
content: "\f000";
|
|
}
|
|
.flat .dijitRightArrowButton:before {
|
|
content: "\f001";
|
|
}
|
|
.flat .dijitUpArrowButton:before {
|
|
content: "\f003";
|
|
}
|
|
/* Toolbar
|
|
*
|
|
* Styling Toolbar means styling the toolbar container and the widget inside toolbar (dijitToolbar)
|
|
*
|
|
* 1. toolbar (default styling):
|
|
* .dijitToolbar - styles for outer container
|
|
*
|
|
* 2. widget inside toolbar
|
|
* .dijitToolbar .dijitButtonNode - Button widget
|
|
* .dijitComboButton - ComboButton widget
|
|
* .dijitDropDownButton - DropDownButton widget
|
|
* .dijitToggleButton - ToggleButton widget
|
|
*
|
|
* 3. hovered widget inside toolbar (ie, mouse hover on the widget inside)
|
|
* .dijitToolbar .dijitButtonNodeHover - styles for hovered Button widget
|
|
*
|
|
* 4. actived widget inside toolbar (ie, mouse down on the widget inside)
|
|
* .dijitToolbar .dijitButtonNodeActive - mouse down on Button widget
|
|
*/
|
|
.flat .dijitToolbar {
|
|
background-color: #f5f5f5;
|
|
padding: 4px;
|
|
zoom: 1;
|
|
/* Override default button styles */
|
|
/* Hover */
|
|
/*
|
|
.dijitComboButtonHover {
|
|
.dijitButtonNode,
|
|
.dijitDownArrowButton {
|
|
}
|
|
|
|
.dijitButtonNodeHover,
|
|
.dijitDownArrowButtonHover {
|
|
}
|
|
}
|
|
*/
|
|
/* Active */
|
|
/* Toggle button checked status */
|
|
}
|
|
.flat .dijitToolbar label {
|
|
padding: 8px;
|
|
}
|
|
.flat .dijitToolbar .dijitToggleButton,
|
|
.flat .dijitToolbar .dijitButton,
|
|
.flat .dijitToolbar .dijitDropDownButton,
|
|
.flat .dijitToolbar .dijitComboButton {
|
|
margin-right: 4px;
|
|
}
|
|
.flat .dijitToolbar .dijitButton .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitDropDownButton .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitComboButton .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitToggleButton .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitComboBox .dijitButtonNode {
|
|
border-color: transparent;
|
|
padding: 4px;
|
|
background-color: transparent;
|
|
border-radius: 4px;
|
|
-webkit-transition-property: background-color;
|
|
-moz-transition-property: background-color;
|
|
-o-transition-property: background-color;
|
|
-ms-transition-property: background-color;
|
|
transition-property: background-color;
|
|
-webkit-transition-duration: 0.3s;
|
|
-moz-transition-duration: 0.3s;
|
|
-o-transition-duration: 0.3s;
|
|
-ms-transition-duration: 0.3s;
|
|
transition-duration: 0.3s;
|
|
}
|
|
.flat .dijitToolbar .dijitComboButton .dijitStretch {
|
|
/* no rounded border on side adjacent to arrow */
|
|
border-radius: 4px 0 0 4px;
|
|
}
|
|
.flat .dijitToolbar .dijitComboButton .dijitArrowButton {
|
|
/* no rounded border on side adjacent to button */
|
|
border-radius: 0 4px 4px 0;
|
|
}
|
|
.flat .dijitToolbar .dijitComboBox .dijitButtonNode {
|
|
padding: 0 8px;
|
|
}
|
|
.flat .dijitToolbar .dijitComboBox .dijitInputInner {
|
|
padding: 0;
|
|
}
|
|
.flat .dijitToolbar .dijitDropDownButton .dijitArrowButtonInner {
|
|
margin-left: 4px;
|
|
}
|
|
.flat .dijitToolbar .dijitButtonHover .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitDropDownButtonHover .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitToggleButtonHover .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitComboButtonHover .dijitButtonNode {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitToolbar .dijitButtonActive .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitDropDownButtonActive .dijitButtonNode,
|
|
.flat .dijitToolbar .dijitToggleButtonActive .dijitButtonNode {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitToolbar .dijitToggleButtonChecked .dijitButtonNode {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.flat .dijitToolbarSeparator {
|
|
width: 1px;
|
|
height: 20px;
|
|
background-color: #ccc;
|
|
padding: 0;
|
|
margin: 0 4px;
|
|
}
|
|
.flat .dijitDisabled .dijitToolbar {
|
|
background-color: #f5f5f5;
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
/* ProgressBar
|
|
*
|
|
* Styling of the ProgressBar consists of the following:
|
|
*
|
|
* 1. the base progress bar
|
|
* .dijitProgressBar - sets margins for the progress bar
|
|
*
|
|
* 2. the empty bar
|
|
* .dijitProgressBarEmpty - sets background img and color for bar or parts of bar that are not finished yet
|
|
* Also sets border color for whole bar
|
|
*
|
|
* 3. tile mode
|
|
* .dijitProgressBarTile
|
|
* inner container for finished portion when in 'tile' (image) mode
|
|
*
|
|
* 4. full bar mode
|
|
* .dijitProgressBarFull
|
|
* adds border to right side of the filled portion of bar
|
|
*
|
|
* 5. text for label of bar
|
|
* .dijitProgressBarLabel - sets text color, which must contrast with both the "Empty" and "Full" parts.
|
|
*
|
|
* 6. indeterminate mode
|
|
* .dijitProgressBarIndeterminate .dijitProgressBarTile
|
|
* sets animated gif for the progress bar in 'indeterminate' mode
|
|
*/
|
|
.flat .dijitProgressBar {
|
|
background-color: #e0e0e0;
|
|
border: 0 none;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitProgressBarTile {
|
|
background: url("images/progressBarStrips.png") repeat-x top;
|
|
-webkit-animation: progress-bar-stripes 2s linear infinite;
|
|
-moz-animation: progress-bar-stripes 2s linear infinite;
|
|
-o-animation: progress-bar-stripes 2s linear infinite;
|
|
-ms-animation: progress-bar-stripes 2s linear infinite;
|
|
animation: progress-bar-stripes 2s linear infinite;
|
|
}
|
|
.flat .dijitProgressBarFull {
|
|
background-color: #257aa7;
|
|
-webkit-transition-property: width;
|
|
-moz-transition-property: width;
|
|
-o-transition-property: width;
|
|
-ms-transition-property: width;
|
|
transition-property: width;
|
|
-webkit-transition-duration: 0.25s;
|
|
-moz-transition-duration: 0.25s;
|
|
-o-transition-duration: 0.25s;
|
|
-ms-transition-duration: 0.25s;
|
|
transition-duration: 0.25s;
|
|
height: 100%;
|
|
}
|
|
.flat .dijitProgressBar.alt-primary .dijitProgressBarFull {
|
|
background-color: #1e88e5;
|
|
}
|
|
.flat .dijitProgressBar.alt-success .dijitProgressBarFull {
|
|
background-color: #43a047;
|
|
}
|
|
.flat .dijitProgressBar.alt-info .dijitProgressBarFull {
|
|
background-color: #03a9f4;
|
|
}
|
|
.flat .dijitProgressBar.alt-warning .dijitProgressBarFull {
|
|
background-color: #fb8c00;
|
|
}
|
|
.flat .dijitProgressBar.alt-danger .dijitProgressBarFull {
|
|
background-color: #e53935;
|
|
}
|
|
.flat .dijitProgressBar.alt-inverse .dijitProgressBarFull {
|
|
background-color: #616161;
|
|
}
|
|
.flat .dijitProgressBarLabel {
|
|
margin-top: 0.2em;
|
|
margin-bottom: 0.2em;
|
|
color: #fff;
|
|
font-size: 1em;
|
|
text-shadow: 0.1em 0.1em 1px #424242;
|
|
}
|
|
@-moz-keyframes progress-bar-stripes {
|
|
from {
|
|
background-position: 75px 0;
|
|
}
|
|
to {
|
|
background-position: 0 0;
|
|
}
|
|
}
|
|
@-webkit-keyframes progress-bar-stripes {
|
|
from {
|
|
background-position: 75px 0;
|
|
}
|
|
to {
|
|
background-position: 0 0;
|
|
}
|
|
}
|
|
@-o-keyframes progress-bar-stripes {
|
|
from {
|
|
background-position: 75px 0;
|
|
}
|
|
to {
|
|
background-position: 0 0;
|
|
}
|
|
}
|
|
@keyframes progress-bar-stripes {
|
|
from {
|
|
background-position: 75px 0;
|
|
}
|
|
to {
|
|
background-position: 0 0;
|
|
}
|
|
}
|
|
.flat .dijitTreeRtl {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitTreeRtl .dijitTreeContainer {
|
|
float: right;
|
|
}
|
|
.flat .dijitTreeRtl .dijitTreeExpandoClosed:before {
|
|
content: "\e60b";
|
|
}
|
|
/* TitlePane and Fieldset
|
|
*
|
|
* 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
|
|
*/
|
|
.flat .dijitTitlePaneTitle {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
border-color: #ccc;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.05s linear;
|
|
-moz-transition: all 0.05s linear;
|
|
-o-transition: all 0.05s linear;
|
|
-ms-transition: all 0.05s linear;
|
|
transition: all 0.05s linear;
|
|
background: #fff;
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitTitlePaneTitleHover,
|
|
.flat .dijitFieldsetTitleHover {
|
|
-webkit-transition: all 0.1s;
|
|
-moz-transition: all 0.1s;
|
|
-o-transition: all 0.1s;
|
|
-ms-transition: all 0.1s;
|
|
transition: all 0.1s;
|
|
background: #f2f2f2;
|
|
border-color: #d9d9d9;
|
|
}
|
|
.flat .dijitTitlePaneTitleActive,
|
|
.flat .dijitFieldsetTitleActive {
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
-ms-transition: none;
|
|
transition: none;
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
box-shadow: inset 0 3px 5px rgba(0,0,0,0.05);
|
|
background: #e0e0e0;
|
|
border-color: #b3b3b3;
|
|
}
|
|
.flat .dijitFieldset {
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitFieldset .dijitArrowNodeInner {
|
|
display: none;
|
|
}
|
|
.flat .dijitFieldset .dijitFieldsetTitleClosed .dijitArrowNode:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitTitlePane .dijitArrowNode,
|
|
.flat .dijitFieldset .dijitArrowNode {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
font-size: 18px;
|
|
text-align: center;
|
|
}
|
|
.flat .dijitTitlePane .dijitArrowNode:before,
|
|
.flat .dijitFieldset .dijitArrowNode:before {
|
|
content: "\f007";
|
|
}
|
|
.flat .dijitTitlePane .dijitClosed,
|
|
.flat .dijitFieldset .dijitClosed {
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitTitlePane .dijitClosed .dijitArrowNode:before,
|
|
.flat .dijitFieldset .dijitClosed .dijitArrowNode:before {
|
|
content: "\f006";
|
|
}
|
|
.flat .dijitTitlePaneContentOuter {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-top: none;
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
.flat .dijitFieldset {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitTitlePaneContentInner,
|
|
.flat .dijitFieldsetContentInner {
|
|
padding: 8px;
|
|
}
|
|
.flat .dijitTitlePaneTextNode,
|
|
.flat .dijitFieldsetLegendNode {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
vertical-align: text-top;
|
|
}
|
|
.flat .dijitFieldsetLegendNode {
|
|
cursor: default;
|
|
}
|
|
/* Time Picker
|
|
*
|
|
* Styling the Time Picker consists of the following:
|
|
*
|
|
* 1. minor time values
|
|
* .dijitTimePickerTick - set text color, size, background color of minor values
|
|
* .dijitTimePickerTickHover - set hover style of minor time values
|
|
* dijitTimePickerTickSelected - set selected style of minor time values
|
|
*
|
|
* 2. major time values - 1:00, 2:00, times on the hour
|
|
* set text color, size, background color, left/right margins for "zoom" affect
|
|
* .dijitTimePickerMarkerHover - to set hover style of major time values
|
|
* .dijitTimePickerMarkerSelected - set selected style of major time values
|
|
*
|
|
* 3. up and down arrow buttons
|
|
* .dijitTimePicker .dijitButtonNode - background-color, border
|
|
* .dijitTimePicker .dijitUpArrowHover, .dijitTimePicker .dijitDownArrowHover - set background-color for hover state
|
|
*
|
|
* Other classes provide the fundamental structure of the TimePicker and should not be modified.
|
|
*/
|
|
.dijitTimePickerPopup {
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
height: 200px;
|
|
}
|
|
.dijitTimePicker {
|
|
background-color: #fff;
|
|
padding: 4px 0;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
}
|
|
.dijitTimePickerItem {
|
|
margin: 0;
|
|
}
|
|
.dijitTimePickerTick {
|
|
/* minor value */
|
|
color: #9e9e9e;
|
|
border: 0 none;
|
|
}
|
|
.dijitTimePickerMarker {
|
|
/* major value - 1:00, 2:00, times on the hour */
|
|
background-color: transparent;
|
|
white-space: nowrap;
|
|
border: 0 none;
|
|
}
|
|
.dijitTimePickerTickHover,
|
|
.dijitTimePickerMarkerHover {
|
|
background: #f2f2f2;
|
|
color: #424242;
|
|
}
|
|
.dijitTimePickerMarkerSelected,
|
|
.dijitTimePickerTickSelected {
|
|
background: #f2f2f2;
|
|
color: #424242;
|
|
}
|
|
.dijitTimePickerTick .dijitTimePickerItemInner,
|
|
.dijitTimePickerMarker .dijitTimePickerItemInner {
|
|
padding: 8px;
|
|
margin: 0;
|
|
}
|
|
.flat .dijitCalendarRtl .dijitCalendarDecrease:before {
|
|
content: "\f001";
|
|
}
|
|
.flat .dijitCalendarRtl .dijitCalendarIncrease:before {
|
|
content: "\f000";
|
|
}
|
|
/* InlineEditBox
|
|
*
|
|
* Styling InlineEditBox mainly includes:
|
|
*
|
|
* 1. Normal state
|
|
* .dijitInlineEditBoxDisplayMode - for border
|
|
*
|
|
* 2. Hover state
|
|
* .dijitInlineEditBoxDisplayModeHover - for border and background color
|
|
*/
|
|
.flat .dijitInlineEditBoxDisplayMode {
|
|
border: 1px dashed transparent;
|
|
padding: 4px 6px;
|
|
}
|
|
.flat .dijitInlineEditBoxDisplayModeHover {
|
|
background-color: transparent;
|
|
border: 1px dashed #257aa7;
|
|
}
|
|
.flat .dijitInlineEditBoxDisplayModeDisabled {
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitMenuBarRtl {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitMenuItemRtl {
|
|
text-align: right;
|
|
}
|
|
.flat .dijitMenuItemRtl .dijitMenuExpand:before {
|
|
content: "\f000";
|
|
}
|
|
/* Dialog
|
|
*
|
|
* Styling Dialog includes two sections: Dialog and Tooltip & TooltipDialog
|
|
*
|
|
* Dialog:
|
|
* 1. Dialog (default styling):
|
|
* .dijitDialog - styles for dialog's bounding box
|
|
*
|
|
* 2. Dialog title
|
|
* .dijitDialogTitleBar - styles for the title container at the top of dialog
|
|
* .dijitDialogTitle - the text container in dialog title
|
|
*
|
|
* 3. Dialog content
|
|
* .dijitDialogPaneContent - main container for content area and action bar
|
|
* .dijitDialogPaneContentArea - styles for content container
|
|
*
|
|
* 4. Dialog action bar
|
|
* .dijitDialogPaneActionBar - styles for action buttons lie at the bottom of dialog pane content
|
|
*
|
|
* 5. Dialog underlay
|
|
* .dijitDialogUnderlay - div under the dialog which used for separate dialog and page content
|
|
*
|
|
*
|
|
* Tooltip & TooltipDialog:
|
|
* 1. tooltip content container:
|
|
* .dijitTooltipContainer - tooltip content container
|
|
*
|
|
* 2. tooltip connector:
|
|
* .dijitTooltipConnector - tooltip anchor includes 4 direction(up, down, left, right)
|
|
*/
|
|
.flat .dijitDialog {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
}
|
|
.flat .dijitDialogPaneContent {
|
|
background-color: #fff;
|
|
border-radius: 0 0 4px 4px;
|
|
padding: 8px;
|
|
position: relative;
|
|
}
|
|
.flat .dijitDialogPaneActionBar {
|
|
/* the bar at bottom with OK/Cancel buttons */
|
|
padding-top: 8px;
|
|
text-align: right;
|
|
position: relative;
|
|
}
|
|
.flat .dijitDialogPaneActionBar .dijitButton {
|
|
float: none;
|
|
}
|
|
.flat .dijitTooltipDialog .dijitDialogPaneActionBar {
|
|
border-radius: 0 0 4px 4px;
|
|
margin: 8px 0 0;
|
|
}
|
|
.flat .dijitDialogTitleBar {
|
|
/* outer container for the titlebar of the dialog */
|
|
line-height: 20px;
|
|
border-bottom: 1px solid #e0e0e0;
|
|
padding: 8px 12px;
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.flat .dijitDialogTitle {
|
|
/* typography and styling of the dialog title */
|
|
font-size: 1.1em;
|
|
font-weight: bold;
|
|
}
|
|
.flat .dijitDialogCloseIcon {
|
|
/* the default close icon for the dialog */
|
|
width: 20px;
|
|
height: 20px;
|
|
line-height: 20px;
|
|
text-align: center;
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 12px;
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitDialogCloseIcon:before {
|
|
content: "\f00e";
|
|
font-size: 20px;
|
|
}
|
|
.flat .dijitDialogCloseIcon .closeText {
|
|
display: none;
|
|
}
|
|
.flat .dijitDialogCloseIconHover,
|
|
.flat .dijitDialogCloseIconActive {
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitDialogUnderlay {
|
|
background: #000;
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitTooltip,
|
|
.flat .dijitTooltipDialog {
|
|
/* the outermost dom node, holding the connector and container */
|
|
background: transparent; /* make the area on the sides of the arrow transparent */
|
|
}
|
|
.flat .dijitTooltipContainer {
|
|
background-color: #424242;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
padding: 4px 8px;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitTooltip .dijitTooltipContainer {
|
|
color: #fff;
|
|
border: 0 none;
|
|
}
|
|
.flat .dijitTooltipConnector {
|
|
/* the arrow */
|
|
z-index: 2;
|
|
width: auto;
|
|
height: auto;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitTooltipABRight .dijitTooltipConnector {
|
|
/* above or below tooltip, but the arrow appears on the right,
|
|
and the right edges of target and tooltip are aligned rather than the left */
|
|
left: auto !important;
|
|
right: 8px;
|
|
}
|
|
.flat .dijitTooltipBelow {
|
|
/* leave room for arrow above content */
|
|
padding-top: 4px;
|
|
}
|
|
.flat .dijitTooltipBelow .dijitTooltipConnector {
|
|
/* the arrow piece for tooltips below an element */
|
|
top: 0;
|
|
left: 8px;
|
|
border-bottom: 4px solid #424242;
|
|
border-left: 4px solid transparent;
|
|
border-right: 4px solid transparent;
|
|
border-top: 0;
|
|
}
|
|
.flat .dijitTooltipAbove {
|
|
/* leave room for arrow below content */
|
|
padding-bottom: 4px;
|
|
}
|
|
.flat .dijitTooltipAbove .dijitTooltipConnector {
|
|
/* the arrow piece for tooltips above an element */
|
|
bottom: 0;
|
|
left: 8px;
|
|
border-top: 4px solid #424242;
|
|
border-left: 4px solid transparent;
|
|
border-right: 4px solid transparent;
|
|
border-bottom: 0;
|
|
}
|
|
.flat .dijitTooltipLeft {
|
|
padding-right: 4px;
|
|
}
|
|
.flat .dijitTooltipLeft .dijitTooltipConnector {
|
|
/* the arrow piece for tooltips to the left of an element, bottom borders aligned */
|
|
right: 0;
|
|
border-left: 4px solid #424242;
|
|
border-bottom: 4px solid transparent;
|
|
border-top: 4px solid transparent;
|
|
border-right: 0;
|
|
}
|
|
.flat .dijitTooltipRight {
|
|
padding-left: 4px;
|
|
}
|
|
.flat .dijitTooltipRight .dijitTooltipConnector {
|
|
/* the arrow piece for tooltips to the right of an element, bottom borders aligned */
|
|
left: 0;
|
|
border-bottom: 4px solid transparent;
|
|
border-top: 4px solid transparent;
|
|
border-right: 4px solid #424242;
|
|
}
|
|
.flat .dijitTooltipDialog .dijitTooltipContainer {
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
-webkit-box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
box-shadow: 0 7px 3px -4px rgba(0,0,0,0.3), 0 8px 8px rgba(0,0,0,0.2);
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipBelow {
|
|
padding-top: 6px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipAbove {
|
|
padding-bottom: 6px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipLeft {
|
|
padding-right: 6px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipRight {
|
|
padding-left: 6px;
|
|
}
|
|
.flat .dijitTooltipDialog .dijitTooltipConnector {
|
|
height: 0;
|
|
width: 0;
|
|
position: absolute;
|
|
z-index: 2;
|
|
opacity: 1;
|
|
-ms-filter: none;
|
|
filter: none;
|
|
}
|
|
.flat .dijitTooltipDialog .dijitTooltipConnector:after {
|
|
content: "";
|
|
height: 0;
|
|
width: 0;
|
|
position: absolute;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipAbove .dijitTooltipConnector {
|
|
border-color: #ccc transparent transparent;
|
|
border-width: 7px 7px 0; /* one extra pixel is added as the border of the arrows */
|
|
border-style: solid;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipAbove .dijitTooltipConnector:after {
|
|
border-color: #fff transparent transparent;
|
|
border-width: 6px 6px 0;
|
|
border-style: solid;
|
|
left: -6px;
|
|
top: -7px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipBelow .dijitTooltipConnector {
|
|
border-color: transparent transparent #ccc;
|
|
border-width: 0 7px 7px;
|
|
border-style: solid;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipBelow .dijitTooltipConnector:after {
|
|
border-color: transparent transparent #fff;
|
|
border-width: 0 6px 6px;
|
|
border-style: solid;
|
|
left: -6px;
|
|
bottom: -7px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipLeft .dijitTooltipConnector {
|
|
border-color: transparent transparent transparent #ccc;
|
|
border-width: 7px 0 7px 7px;
|
|
border-style: solid;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipLeft .dijitTooltipConnector:after {
|
|
border-color: transparent transparent transparent #fff;
|
|
border-width: 6px 0 6px 6px;
|
|
border-style: solid;
|
|
top: -6px;
|
|
left: -7px;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipRight .dijitTooltipConnector {
|
|
border-color: transparent #ccc transparent transparent;
|
|
border-width: 7px 7px 7px 0;
|
|
border-style: solid;
|
|
}
|
|
.flat .dijitTooltipDialog.dijitTooltipRight .dijitTooltipConnector:after {
|
|
border-color: transparent #fff transparent transparent;
|
|
border-width: 6px 6px 6px 0;
|
|
border-style: solid;
|
|
top: -6px;
|
|
right: -7px;
|
|
}
|
|
/* Tree
|
|
*
|
|
* Styling Tree mostly means styling the TreeRow (dijitTreeRow)
|
|
* There are 4 basic states to style:
|
|
*
|
|
* Tree Row:
|
|
* 1. tree row (default styling):
|
|
* .dijitTreeRow - styles for each row of the tree
|
|
*
|
|
* 2. hovered tree row (mouse hover on a tree row)
|
|
* .dijitTreeRowHover - styles when mouse over on one row
|
|
*
|
|
* 3. active tree row (mouse down on a tree row)
|
|
* .dijitTreeRowActive - styles when mouse down on one row
|
|
*
|
|
* 4. selected tree row
|
|
* dijitTreeRowSelected - style when the row has been selected
|
|
*
|
|
* Tree Expando:
|
|
* dijitTreeExpando - the expando at the left of the text of each tree row
|
|
*
|
|
*/
|
|
.flat .dijitTreeIsRoot {
|
|
background-color: transparent;
|
|
}
|
|
.flat .dijitTreeRow,
|
|
.flat .dijitTreeNode .dojoDndItemBefore,
|
|
.flat .dijitTreeNode .dojoDndItemAfter {
|
|
padding: 8px 0;
|
|
border: 0 transparent;
|
|
line-height: 20px;
|
|
-webkit-transition-property: background-color;
|
|
-moz-transition-property: background-color;
|
|
-o-transition-property: background-color;
|
|
-ms-transition-property: background-color;
|
|
transition-property: background-color;
|
|
-webkit-transition-duration: 0.15s;
|
|
-moz-transition-duration: 0.15s;
|
|
-o-transition-duration: 0.15s;
|
|
-ms-transition-duration: 0.15s;
|
|
transition-duration: 0.15s;
|
|
-webkit-transition-timing-function: ease-out;
|
|
-moz-transition-timing-function: ease-out;
|
|
-o-transition-timing-function: ease-out;
|
|
-ms-transition-timing-function: ease-out;
|
|
transition-timing-function: ease-out;
|
|
}
|
|
.flat .dijitTreeRowHover {
|
|
background-color: #f2f2f2;
|
|
border-color: transparent;
|
|
-webkit-transition-duration: 0.15s;
|
|
-moz-transition-duration: 0.15s;
|
|
-o-transition-duration: 0.15s;
|
|
-ms-transition-duration: 0.15s;
|
|
transition-duration: 0.15s;
|
|
}
|
|
.flat .dijitTreeRowActive {
|
|
background-color: #f2f2f2;
|
|
border-color: transparent;
|
|
}
|
|
.flat .dijitTreeRowSelected,
|
|
.flat .dijitTreeRowHover.dijitTreeRowSelected,
|
|
.flat .dijitTreeRowActive.dijitTreeRowSelected {
|
|
color: #fff;
|
|
background-color: #257aa7;
|
|
border-color: transparent;
|
|
}
|
|
.flat .dijitTreeRowSelected .dijitTreeExpando,
|
|
.flat .dijitTreeRowHover.dijitTreeRowSelected .dijitTreeExpando,
|
|
.flat .dijitTreeRowActive.dijitTreeRowSelected .dijitTreeExpando {
|
|
color: #fff;
|
|
}
|
|
.flat .dijitTreeExpando {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
width: 14px;
|
|
height: 14px;
|
|
line-height: 14px;
|
|
text-align: center;
|
|
margin-left: 4px;
|
|
margin-right: 4px;
|
|
color: #257aa7;
|
|
vertical-align: middle;
|
|
}
|
|
.flat .dijitTreeExpandoOpened:before {
|
|
content: "\f012";
|
|
cursor: pointer;
|
|
}
|
|
.flat .dijitTreeExpandoClosed:before {
|
|
content: "\f011";
|
|
}
|
|
.flat .dijitTreeExpandoLoading {
|
|
-webkit-animation: spinning 2s linear infinite;
|
|
-moz-animation: spinning 2s linear infinite;
|
|
-o-animation: spinning 2s linear infinite;
|
|
-ms-animation: spinning 2s linear infinite;
|
|
animation: spinning 2s linear infinite;
|
|
}
|
|
.flat .dijitTreeExpandoLoading:before {
|
|
content: "\f01d";
|
|
}
|
|
.dj_ie8 .dijitTreeExpandoLoading,
|
|
.dj_ie9 .dijitTreeExpandoLoading {
|
|
background: url("images/loadingAnimation.gif") no-repeat;
|
|
}
|
|
.dj_ie8 .dijitTreeExpandoLoading:before,
|
|
.dj_ie9 .dijitTreeExpandoLoading:before {
|
|
content: "";
|
|
}
|
|
@-moz-keyframes spinning {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(-360deg);
|
|
-moz-transform: rotate(-360deg);
|
|
-o-transform: rotate(-360deg);
|
|
-ms-transform: rotate(-360deg);
|
|
transform: rotate(-360deg);
|
|
}
|
|
}
|
|
@-webkit-keyframes spinning {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(-360deg);
|
|
-moz-transform: rotate(-360deg);
|
|
-o-transform: rotate(-360deg);
|
|
-ms-transform: rotate(-360deg);
|
|
transform: rotate(-360deg);
|
|
}
|
|
}
|
|
@-o-keyframes spinning {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(-360deg);
|
|
-moz-transform: rotate(-360deg);
|
|
-o-transform: rotate(-360deg);
|
|
-ms-transform: rotate(-360deg);
|
|
transform: rotate(-360deg);
|
|
}
|
|
}
|
|
@keyframes spinning {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(-360deg);
|
|
-moz-transform: rotate(-360deg);
|
|
-o-transform: rotate(-360deg);
|
|
-ms-transform: rotate(-360deg);
|
|
transform: rotate(-360deg);
|
|
}
|
|
}
|
|
/* ColorPalette
|
|
*
|
|
* Styling of the ColorPalette consists of the following:
|
|
*
|
|
* 1. the whole color palette
|
|
* .dijitColorPalette - for outline, border, and background color of the whole color palette
|
|
* Note: outline does not work for IE
|
|
*
|
|
* 2. the color swatch
|
|
* .dijitColorPalette .dijitPaletteImg
|
|
* transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
|
|
* displays border around a color swatch
|
|
*
|
|
* 3. hovered swatch
|
|
* .dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg
|
|
* the hovered state of the color swatch - adds border
|
|
*
|
|
* 4. active and selected swatch
|
|
* .dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg
|
|
* .dijitColorPalette .dijitPaletteCellSelected .dijitPaletteImg
|
|
* adds border for active or selected state
|
|
*/
|
|
.flat .dijitColorPalette {
|
|
border: 1px solid #ccc;
|
|
background-color: #fff;
|
|
border-radius: 4px;
|
|
/* swatch */
|
|
}
|
|
.flat .dijitColorPalette .dijitPaletteTable {
|
|
padding: 4px;
|
|
}
|
|
.flat .dijitColorPalette .dijitColorPaletteSwatch {
|
|
height: 15px;
|
|
width: 15px;
|
|
border-radius: 2px;
|
|
}
|
|
.flat .dijitColorPalette .dijitPaletteImg {
|
|
/* transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
|
|
* displays border around a color swatch
|
|
* overrides border color in dijit.css */
|
|
border: 1px solid transparent;
|
|
line-height: normal;
|
|
}
|
|
.flat .dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg {
|
|
border-color: #ccc;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-radius: 2px;
|
|
-webkit-transform: scale(1.2);
|
|
-moz-transform: scale(1.2);
|
|
-o-transform: scale(1.2);
|
|
-ms-transform: scale(1.2);
|
|
transform: scale(1.2);
|
|
}
|
|
.flat .dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg,
|
|
.flat .dijitColorPalette .dijitPaletteTable .dijitPaletteCellSelected .dijitPaletteImg {
|
|
border: 1px solid #257aa7;
|
|
-webkit-box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
box-shadow: 0 1px 0.5px rgba(0,0,0,0.3), 0 2px 2px rgba(0,0,0,0.2);
|
|
border-radius: 2px;
|
|
-webkit-transform: scale(1.2);
|
|
-moz-transform: scale(1.2);
|
|
-o-transform: scale(1.2);
|
|
-ms-transform: scale(1.2);
|
|
transform: scale(1.2);
|
|
}
|
|
/* Editor
|
|
*
|
|
* Styling Editor means styling the Editor inside iframe container (dijitEditorIFrameContainer)
|
|
*
|
|
* 1. Editor iframe container (default styling):
|
|
* .dijitEditorIFrameContainer - normal state styles: background-color, border, padding
|
|
*
|
|
* 2. hovered Editor iframe container (ie, mouse hover on editor)
|
|
* .dijitEditorHover .dijitEditorIFrameContainer/dijitEditorIFrame - styles when mouse hover on the container
|
|
*
|
|
* 3. focused Editor iframe container (ie, mouse focus on the editor pane)
|
|
* .dijitEditorFocused .dijitEditorIFrameContainer/dijitEditorIFrame - styles when container focused
|
|
*
|
|
* 3. disabled Editor iframe container
|
|
* .dijitEditorDisabled - editor's inner iframe container disable status styles: background, border
|
|
*/
|
|
.flat .dijitEditor {
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
}
|
|
.flat .dijitEditor .dijitEditorIFrameContainer {
|
|
border: 1px solid transparent;
|
|
border-top: 1px solid #ccc;
|
|
padding: 4px 8px;
|
|
-webkit-transition: border 0.2s linear 0s;
|
|
-moz-transition: border 0.2s linear 0s;
|
|
-o-transition: border 0.2s linear 0s;
|
|
-ms-transition: border 0.2s linear 0s;
|
|
transition: border 0.2s linear 0s;
|
|
}
|
|
.flat .dijitEditorHover .dijitEditorIFrameContainer,
|
|
.flat .dijitEditorHover .dijitEditorIFrameContainer .dijitEditorIFrame {
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitEditorFocused .dijitEditorIFrameContainer {
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitEditorFocused .dijitEditorIFrameContainer .dijitEditorIFrame {
|
|
border: 1px solid #257aa7;
|
|
}
|
|
.flat .dijitEditorDisabled {
|
|
border: 1px solid #ccc;
|
|
opacity: 0.65;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
|
|
filter: alpha(opacity=65);
|
|
}
|
|
.flat .dijitEditorDisabled .dijitEditorIFrame,
|
|
.flat .dijitEditorDisabled .dijitEditorIFrameContainer,
|
|
.flat .dijitEditorDisabled .dijitEditorIFrameContainer .dijitEditorIFrame {
|
|
background-color: #f5f5f5;
|
|
border: 1px solid transparent;
|
|
}
|
|
/*
|
|
* font generated with https://icomoon.io/app
|
|
*
|
|
* all icons are Material Design icons by Google
|
|
* https://github.com/google/material-design-icons/blob/master/LICENSE
|
|
*
|
|
* see README for more about flat theme icons
|
|
*/
|
|
@font-face {
|
|
font-family: 'flat-icon';
|
|
src: url("fonts/flat-icon.eot?90nq1s");
|
|
src: url("fonts/flat-icon.eot?#iefix90nq1s") format('embedded-opentype'), url("fonts/flat-icon.ttf?90nq1s") format('truetype'), url("fonts/flat-icon.woff?90nq1s") format('woff'), url("fonts/flat-icon.svg?90nq1s#flat-icon") format('svg');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
[class^="flat-"],
|
|
[class*=" flat-"] {
|
|
font-family: 'flat-icon';
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.dijitIcon,
|
|
.dijitEditorIcon {
|
|
font-family: "flat-icon";
|
|
speak: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-transform: none;
|
|
line-height: 1;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
font-size: 16px;
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
.flat-drop-left:before {
|
|
content: "\f000";
|
|
}
|
|
.flat-drop-right:before {
|
|
content: "\f001";
|
|
}
|
|
.flat-drop-down:before {
|
|
content: "\f002";
|
|
}
|
|
.flat-drop-up:before {
|
|
content: "\f003";
|
|
}
|
|
.flat-chevron-left:before {
|
|
content: "\f004";
|
|
}
|
|
.flat-chevron-right:before {
|
|
content: "\f005";
|
|
}
|
|
.flat-chevron-down:before {
|
|
content: "\f006";
|
|
}
|
|
.flat-chevron-up:before {
|
|
content: "\f007";
|
|
}
|
|
.flat-arrow-left:before {
|
|
content: "\f008";
|
|
}
|
|
.flat-arrow-right:before {
|
|
content: "\f009";
|
|
}
|
|
.flat-arrow-down:before {
|
|
content: "\f00a";
|
|
}
|
|
.flat-arrow-up:before {
|
|
content: "\f00b";
|
|
}
|
|
.flat-check:before {
|
|
content: "\f00c";
|
|
}
|
|
.flat-check-circle:before {
|
|
content: "\f00d";
|
|
}
|
|
.flat-close:before {
|
|
content: "\f00e";
|
|
}
|
|
.dijitIconClear:before,
|
|
.flat-close-circle:before {
|
|
content: "\f00f";
|
|
}
|
|
.dijitEditorIconCancel:before,
|
|
.flat-close-circle-o:before {
|
|
content: "\f010";
|
|
}
|
|
.flat-add:before {
|
|
content: "\f011";
|
|
}
|
|
.flat-remove:before {
|
|
content: "\f012";
|
|
}
|
|
.flat-add-circle:before {
|
|
content: "\f013";
|
|
}
|
|
.flat-remove-circle:before {
|
|
content: "\f014";
|
|
}
|
|
.flat-add-circle-o:before {
|
|
content: "\f015";
|
|
}
|
|
.flat-remove-circle-o:before {
|
|
content: "\f016";
|
|
}
|
|
.dijitIconError:before,
|
|
.flat-error:before {
|
|
content: "\f017";
|
|
}
|
|
.flat-error-o:before {
|
|
content: "\f018";
|
|
}
|
|
.flat-warning:before {
|
|
content: "\f019";
|
|
}
|
|
.flat-report:before {
|
|
content: "\f01a";
|
|
}
|
|
.flat-help:before {
|
|
content: "\f01b";
|
|
}
|
|
.flat-no-symbol:before {
|
|
content: "\f01c";
|
|
}
|
|
.flat-update:before {
|
|
content: "\f01d";
|
|
}
|
|
.flat-calendar:before {
|
|
content: "\f01e";
|
|
}
|
|
.flat-clock:before {
|
|
content: "\f01f";
|
|
}
|
|
.dijitFolderClosed:before,
|
|
.dijitIconFolderClosed:before,
|
|
.flat-folder:before {
|
|
content: "\f020";
|
|
}
|
|
.dijitFolderOpened:before,
|
|
.dijitIconFolderOpen:before,
|
|
.flat-folder-open:before {
|
|
content: "\f021";
|
|
}
|
|
.dijitIconEdit:before,
|
|
.flat-edit:before {
|
|
content: "\f022";
|
|
}
|
|
.dijitIconSave:before,
|
|
.dijitEditorIconSave:before,
|
|
.flat-save:before {
|
|
content: "\f023";
|
|
}
|
|
.dijitIconPrint:before,
|
|
.dijitEditorIconPrint:before,
|
|
.flat-print:before {
|
|
content: "\f024";
|
|
}
|
|
.dijitIconDelete:before,
|
|
.dijitEditorIconDelete:before,
|
|
.flat-delete:before {
|
|
content: "\f025";
|
|
}
|
|
.dijitLeaf:before,
|
|
.flat-page:before {
|
|
content: "\f026";
|
|
}
|
|
.flat-page-o:before {
|
|
content: "\f027";
|
|
}
|
|
.flat-page-add:before {
|
|
content: "\f028";
|
|
}
|
|
.flat-page-remove:before {
|
|
content: "\f029";
|
|
}
|
|
.flat-page-add-o:before {
|
|
content: "\f02a";
|
|
}
|
|
.flat-page-remove-o:before {
|
|
content: "\f02b";
|
|
}
|
|
.dijitIconFile:before,
|
|
.flat-file:before {
|
|
content: "\f02c";
|
|
}
|
|
.dijitIconMail:before,
|
|
.flat-mail:before {
|
|
content: "\f02d";
|
|
}
|
|
.dijitIconDatabase:before,
|
|
.flat-storage:before {
|
|
content: "\f02e";
|
|
}
|
|
.dijitIconConfigure:before,
|
|
.flat-settings:before {
|
|
content: "\f02f";
|
|
}
|
|
.dijitIconSearch:before,
|
|
.flat-search:before {
|
|
content: "\f030";
|
|
}
|
|
.dijitIconBookmark:before,
|
|
.flat-bookmark:before {
|
|
content: "\f031";
|
|
}
|
|
.flat-menu:before {
|
|
content: "\f032";
|
|
}
|
|
.dijitIconApplication:before,
|
|
.flat-application:before {
|
|
content: "\f033";
|
|
}
|
|
.dijitIconKey:before,
|
|
.flat-key:before {
|
|
content: "\f034";
|
|
}
|
|
.dijitIconTable:before,
|
|
.dijitEditorIconInsertTable:before,
|
|
.flat-table:before {
|
|
content: "\f035";
|
|
}
|
|
.flat-grid:before {
|
|
content: "\f036";
|
|
}
|
|
.dijitIconChart:before,
|
|
.flat-chart:before {
|
|
content: "\f037";
|
|
}
|
|
.dijitIconFilter:before,
|
|
.flat-filter:before {
|
|
content: "\f038";
|
|
}
|
|
.dijitIconFunction:before,
|
|
.flat-function:before {
|
|
content: "\f039";
|
|
}
|
|
.flat-user:before {
|
|
content: "\f03a";
|
|
}
|
|
.dijitIconUsers:before,
|
|
.flat-users:before {
|
|
content: "\f03b";
|
|
}
|
|
.dijitIconConnector:before,
|
|
.flat-connector:before {
|
|
content: "\f03c";
|
|
}
|
|
.dijitIconDocuments:before,
|
|
.flat-documents:before {
|
|
content: "\f03d";
|
|
}
|
|
.dijitIconEditProperty:before,
|
|
.flat-edit-property:before {
|
|
content: "\f03e";
|
|
}
|
|
.dijitIconTask:before,
|
|
.flat-task:before {
|
|
content: "\f03f";
|
|
}
|
|
.dijitIconNewTask:before,
|
|
.flat-task-new:before {
|
|
content: "\f040";
|
|
}
|
|
.dijitIconEditTask:before,
|
|
.flat-task-edit:before {
|
|
content: "\f041";
|
|
}
|
|
.dijitIconSample:before,
|
|
.flat-sample:before {
|
|
content: "\f042";
|
|
}
|
|
.dijitIconPackage:before,
|
|
.flat-package:before {
|
|
content: "\f043";
|
|
}
|
|
.dijitEditorIconUndo:before,
|
|
.flat-undo:before {
|
|
content: "\f044";
|
|
}
|
|
.dijitEditorIconRedo:before,
|
|
.flat-redo:before {
|
|
content: "\f045";
|
|
}
|
|
.dijitIconCopy:before,
|
|
.dijitEditorIconCopy:before,
|
|
.flat-copy:before {
|
|
content: "\f046";
|
|
}
|
|
.dijitIconCut:before,
|
|
.dijitEditorIconCut:before,
|
|
.flat-cut:before {
|
|
content: "\f047";
|
|
}
|
|
.dijitEditorIconPaste:before,
|
|
.flat-paste:before {
|
|
content: "\f048";
|
|
}
|
|
.dijitEditorIconBold:before,
|
|
.flat-bold:before {
|
|
content: "\f049";
|
|
}
|
|
.dijitEditorIconItalic:before,
|
|
.flat-italic:before {
|
|
content: "\f04a";
|
|
}
|
|
.dijitEditorIconUnderline:before,
|
|
.flat-underline:before {
|
|
content: "\f04b";
|
|
}
|
|
.dijitEditorIconStrikethrough:before,
|
|
.flat-strikethrough:before {
|
|
content: "\f04c";
|
|
}
|
|
.dijitEditorIconRemoveFormat:before,
|
|
.flat-clear-format:before {
|
|
content: "\f04d";
|
|
}
|
|
.flat-quote:before {
|
|
content: "\f04e";
|
|
}
|
|
.dijitEditorIconSuperscript:before,
|
|
.flat-superscript:before {
|
|
content: "\f04f";
|
|
}
|
|
.dijitEditorIconSubscript:before,
|
|
.flat-subscript:before {
|
|
content: "\f050";
|
|
}
|
|
.dijitEditorIconForeColor:before,
|
|
.flat-color-text:before {
|
|
content: "\f051";
|
|
}
|
|
.dijitEditorIconBackColor:before,
|
|
.flat-color-fill:before {
|
|
content: "\f052";
|
|
}
|
|
.dijitEditorIconHiliteColor:before,
|
|
.flat-color-highlight:before {
|
|
content: "\f053";
|
|
}
|
|
.flat-font-size:before {
|
|
content: "\f054";
|
|
}
|
|
.dijitEditorIconJustifyCenter:before,
|
|
.flat-align-center:before {
|
|
content: "\f055";
|
|
}
|
|
.dijitEditorIconJustifyFull:before,
|
|
.flat-align-justify:before {
|
|
content: "\f056";
|
|
}
|
|
.dijitEditorIconJustifyLeft:before,
|
|
.flat-align-left:before {
|
|
content: "\f057";
|
|
}
|
|
.dijitEditorIconJustifyRight:before,
|
|
.flat-align-right:before {
|
|
content: "\f058";
|
|
}
|
|
.dijitEditorIconIndent:before,
|
|
.flat-indent:before {
|
|
content: "\f059";
|
|
}
|
|
.dijitEditorIconOutdent:before,
|
|
.flat-outdent:before {
|
|
content: "\f05a";
|
|
}
|
|
.flat-sort:before {
|
|
content: "\f05b";
|
|
}
|
|
.dijitEditorIconSpace:before,
|
|
.flat-keyboard-space:before {
|
|
content: "\f05c";
|
|
}
|
|
.dijitEditorIconTabIndent:before,
|
|
.flat-keyboard-tab:before {
|
|
content: "\f05d";
|
|
}
|
|
.dijitEditorIconInsertUnorderedList:before,
|
|
.flat-list-bullet:before {
|
|
content: "\f05e";
|
|
}
|
|
.dijitEditorIconInsertOrderedList:before,
|
|
.flat-list-number:before {
|
|
content: "\f05f";
|
|
}
|
|
.dijitEditorIconListBulletIndent:before,
|
|
.flat-list-bullet-indent:before {
|
|
content: "\f060";
|
|
}
|
|
.dijitEditorIconListBulletOutdent:before,
|
|
.flat-list-bullet-outdent:before {
|
|
content: "\f061";
|
|
}
|
|
.dijitEditorIconListNumIndent:before,
|
|
.flat-list-number-indent:before {
|
|
content: "\f062";
|
|
}
|
|
.dijitEditorIconListNumOutdent:before,
|
|
.flat-list-number-outdent:before {
|
|
content: "\f063";
|
|
}
|
|
.dijitEditorIconViewSource:before,
|
|
.flat-code:before {
|
|
content: "\f064";
|
|
}
|
|
.dijitEditorIconCreateLink:before,
|
|
.flat-link:before {
|
|
content: "\f065";
|
|
}
|
|
.dijitEditorIconUnlink:before,
|
|
.flat-unlink:before {
|
|
content: "\f066";
|
|
}
|
|
.dijitEditorIconFullScreen:before,
|
|
.flat-fullscreen:before {
|
|
content: "\f067";
|
|
}
|
|
.flat-fullscreen-exit:before {
|
|
content: "\f068";
|
|
}
|
|
.dijitEditorIconInsertImage:before,
|
|
.flat-image:before {
|
|
content: "\f069";
|
|
}
|
|
.dijitEditorIconNewPage:before,
|
|
.flat-page-new:before {
|
|
content: "\f06a";
|
|
}
|
|
.dijitEditorIconToggleDir:before,
|
|
.flat-toggle-dir:before {
|
|
content: "\f06b";
|
|
}
|
|
.dijitEditorIconLeftToRight:before,
|
|
.flat-left-to-right:before {
|
|
content: "\f06c";
|
|
}
|
|
.dijitEditorIconRightToLeft:before,
|
|
.flat-right-to-left:before {
|
|
content: "\f06d";
|
|
}
|
|
.dijitEditorIconSelectAll:before,
|
|
.flat-select-all:before {
|
|
content: "\f06e";
|
|
}
|
|
.dijitEditorIconWikiword:before,
|
|
.flat-wikiword:before {
|
|
content: "\f06f";
|
|
}
|
|
.icon-spin {
|
|
-webkit-animation: spin-right 2s infinite linear;
|
|
-moz-animation: spin-right 2s infinite linear;
|
|
-o-animation: spin-right 2s infinite linear;
|
|
-ms-animation: spin-right 2s infinite linear;
|
|
animation: spin-right 2s infinite linear;
|
|
}
|
|
.dijitIconLoading {
|
|
font-size: 24px;
|
|
}
|
|
.dijitIconLoading:before {
|
|
content: "\f01d";
|
|
-webkit-animation: spin-left 2s linear infinite;
|
|
-moz-animation: spin-left 2s linear infinite;
|
|
-o-animation: spin-left 2s linear infinite;
|
|
-ms-animation: spin-left 2s linear infinite;
|
|
animation: spin-left 2s linear infinite;
|
|
}
|
|
.dj_ie8 .dijitIconLoading,
|
|
.dj_ie9 .dijitIconLoading {
|
|
background: url("images/loadingAnimation.gif") no-repeat;
|
|
height: 20px;
|
|
width: 20px;
|
|
}
|
|
.dj_ie8 .dijitIconLoading:before,
|
|
.dj_ie9 .dijitIconLoading:before {
|
|
content: "";
|
|
}
|
|
.dijitRtl .dijitEditorIconUndo:before {
|
|
content: "\f044";
|
|
}
|
|
.dijitRtl .dijitEditorIconRedo:before {
|
|
content: "\f044";
|
|
}
|
|
.dijitRtl .dijitEditorIconTabIndent:before {
|
|
-webkit-transform: rotate(180deg);
|
|
-moz-transform: rotate(180deg);
|
|
-o-transform: rotate(180deg);
|
|
-ms-transform: rotate(180deg);
|
|
transform: rotate(180deg);
|
|
}
|
|
.dijitRtl .dijitEditorIconInsertUnorderedList,
|
|
.dijitRtl .dijitEditorIconInsertOrderedList {
|
|
-webkit-transform: scale(-1, 1);
|
|
-moz-transform: scale(-1, 1);
|
|
-o-transform: scale(-1, 1);
|
|
-ms-transform: scale(-1, 1);
|
|
transform: scale(-1, 1);
|
|
}
|
|
:root .dijitRtl .dijitEditorIconInsertUnorderedList,
|
|
:root .dijitRtl .dijitEditorIconInsertOrderedList {
|
|
filter: none;
|
|
}
|
|
@-moz-keyframes spin-right {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@-webkit-keyframes spin-right {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@-o-keyframes spin-right {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes spin-right {
|
|
from {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@-moz-keyframes spin-left {
|
|
from {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
}
|
|
@-webkit-keyframes spin-left {
|
|
from {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
}
|
|
@-o-keyframes spin-left {
|
|
from {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
}
|
|
@keyframes spin-left {
|
|
from {
|
|
-webkit-transform: rotate(360deg);
|
|
-moz-transform: rotate(360deg);
|
|
-o-transform: rotate(360deg);
|
|
-ms-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(0);
|
|
-moz-transform: rotate(0);
|
|
-o-transform: rotate(0);
|
|
-ms-transform: rotate(0);
|
|
transform: rotate(0);
|
|
}
|
|
}
|
|
.dijitReset {
|
|
margin:0;
|
|
border:0;
|
|
padding:0;
|
|
font: inherit;
|
|
/*line-height:normal;*/
|
|
color: inherit;
|
|
}
|
|
.dj_a11y .dijitReset {
|
|
-moz-appearance: none;
|
|
}
|
|
.dijitInline {
|
|
display:inline-block;
|
|
#zoom: 1;
|
|
#display:inline;
|
|
border:0;
|
|
padding:0;
|
|
vertical-align:middle;
|
|
#vertical-align: auto;
|
|
}
|
|
table.dijitInline {
|
|
display:inline-table;
|
|
box-sizing: content-box; -moz-box-sizing: content-box;
|
|
}
|
|
.dijitHidden {
|
|
display: none !important;
|
|
}
|
|
.dijitVisible {
|
|
display: block !important;
|
|
position: relative;
|
|
}
|
|
.dj_ie6 .dijitComboBox .dijitInputContainer,
|
|
.dijitInputContainer {
|
|
#zoom: 1;
|
|
overflow: hidden;
|
|
float: none !important;
|
|
position: relative;
|
|
}
|
|
.dj_ie7 .dijitInputContainer {
|
|
float: left !important;
|
|
clear: left;
|
|
display: inline-block !important;
|
|
}
|
|
.dj_ie .dijitSelect input,
|
|
.dj_ie input.dijitTextBox,
|
|
.dj_ie .dijitTextBox input {
|
|
font-size: 100%;
|
|
}
|
|
.dijitSelect .dijitButtonText {
|
|
float: left;
|
|
vertical-align: top;
|
|
}
|
|
TABLE.dijitSelect {
|
|
padding: 0 !important;
|
|
}
|
|
.dijitTextBox .dijitSpinnerButtonContainer,
|
|
.dijitTextBox .dijitArrowButtonContainer,
|
|
.dijitValidationTextBox .dijitValidationContainer {
|
|
float: right;
|
|
text-align: center;
|
|
}
|
|
.dijitSelect input.dijitInputField,
|
|
.dijitTextBox input.dijitInputField {
|
|
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.dijitValidationTextBox .dijitValidationContainer {
|
|
display: none;
|
|
}
|
|
.dijitTeeny {
|
|
font-size:1px;
|
|
line-height:1px;
|
|
}
|
|
.dijitOffScreen {
|
|
position: absolute !important;
|
|
left: 50% !important;
|
|
top: -10000px !important;
|
|
}
|
|
.dijitPopup {
|
|
position: absolute;
|
|
background-color: transparent;
|
|
margin: 0;
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
.dijitPositionOnly {
|
|
padding: 0 !important;
|
|
border: 0 !important;
|
|
background-color: transparent !important;
|
|
background-image: none !important;
|
|
height: auto !important;
|
|
width: auto !important;
|
|
}
|
|
.dijitNonPositionOnly {
|
|
float: none !important;
|
|
position: static !important;
|
|
margin: 0 0 0 0 !important;
|
|
vertical-align: middle !important;
|
|
}
|
|
.dijitBackgroundIframe {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: -1;
|
|
border: 0;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
.dijitDisplayNone {
|
|
display:none !important;
|
|
}
|
|
.dijitContainer {
|
|
overflow: hidden;
|
|
}
|
|
.dj_a11y .dijitIcon,
|
|
.dj_a11y div.dijitArrowButtonInner,
|
|
.dj_a11y span.dijitArrowButtonInner,
|
|
.dj_a11y img.dijitArrowButtonInner,
|
|
.dj_a11y .dijitCalendarIncrementControl,
|
|
.dj_a11y .dijitTreeExpando {
|
|
display: none;
|
|
}
|
|
.dijitSpinner div.dijitArrowButtonInner {
|
|
display: block;
|
|
}
|
|
.dj_a11y .dijitA11ySideArrow {
|
|
display: inline !important;
|
|
cursor: pointer;
|
|
}
|
|
.dj_a11y .dijitCalendarDateLabel {
|
|
padding: 1px;
|
|
border: 0px !important;
|
|
}
|
|
.dj_a11y .dijitCalendarSelectedDate .dijitCalendarDateLabel {
|
|
border-style: solid !important;
|
|
border-width: 1px !important;
|
|
padding: 0;
|
|
}
|
|
.dj_a11y .dijitCalendarDateTemplate {
|
|
padding-bottom: 0.1em !important;
|
|
border: 0px !important;
|
|
}
|
|
.dj_a11y .dijitButtonNode {
|
|
border: black outset medium !important;
|
|
|
|
padding: 0 !important;
|
|
}
|
|
.dj_a11y .dijitArrowButton {
|
|
padding: 0 !important;
|
|
}
|
|
.dj_a11y .dijitButtonContents {
|
|
margin: 0.15em;
|
|
}
|
|
.dj_a11y .dijitTextBoxReadOnly .dijitInputField,
|
|
.dj_a11y .dijitTextBoxReadOnly .dijitButtonNode {
|
|
border-style: outset!important;
|
|
border-width: medium!important;
|
|
border-color: #999 !important;
|
|
color:#999 !important;
|
|
}
|
|
.dijitButtonNode * {
|
|
vertical-align: middle;
|
|
/*vertical-align: baseline;*/
|
|
}
|
|
.dijitSelect .dijitArrowButtonInner,
|
|
.dijitButtonNode .dijitArrowButtonInner {
|
|
background: no-repeat center;
|
|
direction: ltr;
|
|
}
|
|
.dijitLeft {
|
|
background-position:left top;
|
|
background-repeat:no-repeat;
|
|
}
|
|
.dijitStretch {
|
|
white-space:nowrap;
|
|
background-repeat:repeat-x;
|
|
}
|
|
.dijitRight {
|
|
#display:inline;
|
|
background-position:right top;
|
|
background-repeat:no-repeat;
|
|
}
|
|
.dj_gecko .dj_a11y .dijitButtonDisabled .dijitButtonNode {
|
|
opacity: 0.5;
|
|
}
|
|
.dijitToggleButton,
|
|
.dijitButton,
|
|
.dijitDropDownButton,
|
|
.dijitComboButton {
|
|
margin: 0.2em;
|
|
vertical-align: middle;
|
|
}
|
|
.dijitButtonContents {
|
|
display: block;
|
|
}
|
|
td.dijitButtonContents {
|
|
display: table-cell;
|
|
}
|
|
.dijitButtonNode img {
|
|
vertical-align:middle;
|
|
}
|
|
.dijitToolbar .dijitComboButton {
|
|
border-collapse: separate;
|
|
}
|
|
.dijitToolbar .dijitToggleButton,
|
|
.dijitToolbar .dijitButton,
|
|
.dijitToolbar .dijitDropDownButton,
|
|
.dijitToolbar .dijitComboButton {
|
|
margin: 0;
|
|
}
|
|
.dijitToolbar .dijitButtonContents {
|
|
padding: 1px 2px;
|
|
}
|
|
.dj_webkit .dijitToolbar .dijitDropDownButton {
|
|
/*padding-left: 0.3em;*/
|
|
}
|
|
.dj_gecko .dijitToolbar .dijitButtonNode::-moz-focus-inner {
|
|
padding:0;
|
|
}
|
|
.dijitSelect {
|
|
border:1px solid gray;
|
|
}
|
|
.dijitButtonNode {
|
|
border:1px solid gray;
|
|
margin:0;
|
|
line-height:20px;
|
|
vertical-align: middle;
|
|
#vertical-align: auto;
|
|
text-align:center;
|
|
white-space: nowrap;
|
|
}
|
|
.dj_webkit .dijitSpinner .dijitSpinnerButtonContainer {
|
|
line-height:inherit;
|
|
}
|
|
.dijitTextBox .dijitButtonNode {
|
|
border-width: 0;
|
|
}
|
|
.dijitSelect,
|
|
.dijitSelect *,
|
|
.dijitButtonNode,
|
|
.dijitButtonNode * {
|
|
cursor: pointer;
|
|
}
|
|
.dj_ie .dijitButtonNode {
|
|
zoom: 1;
|
|
}
|
|
.dj_ie .dijitButtonNode button {
|
|
overflow: visible;
|
|
}
|
|
div.dijitArrowButton {
|
|
float: right;
|
|
}
|
|
.dijitTextBox {
|
|
border: solid black 1px;
|
|
#overflow: hidden;
|
|
width: 15em;
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTextBoxReadOnly,
|
|
.dijitTextBoxDisabled {
|
|
color: gray;
|
|
}
|
|
.dj_safari .dijitTextBoxDisabled input {
|
|
color: #B0B0B0;
|
|
}
|
|
.dj_safari textarea.dijitTextAreaDisabled {
|
|
color: #333;
|
|
}
|
|
.dj_gecko .dijitTextBoxReadOnly input.dijitInputField,
|
|
.dj_gecko .dijitTextBoxDisabled input {
|
|
-moz-user-input: none;
|
|
}
|
|
.dijitPlaceHolder {
|
|
color: #999;
|
|
/*font-style: italic;*/
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
#filter: "";
|
|
}
|
|
.dijitTimeTextBox {
|
|
width: 8em;
|
|
}
|
|
.dijitTextBox input:focus {
|
|
outline: none;
|
|
}
|
|
.dijitTextBoxFocused {
|
|
outline: 5px -webkit-focus-ring-color;
|
|
}
|
|
.dijitSelect input,
|
|
.dijitTextBox input {
|
|
float: left;
|
|
}
|
|
.dj_ie6 input.dijitTextBox,
|
|
.dj_ie6 .dijitTextBox input {
|
|
float: none;
|
|
}
|
|
.dijitInputInner {
|
|
border:0 !important;
|
|
background-color:transparent !important;
|
|
width:100% !important;
|
|
box-shadow: none !important;
|
|
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 {
|
|
text-indent: -2em !important;
|
|
direction: ltr !important;
|
|
text-align: left !important;
|
|
/*height: auto !important;*/
|
|
#text-indent: 0 !important;
|
|
#letter-spacing: -5em !important;
|
|
#text-align: right !important;
|
|
}
|
|
.dj_ie .dijitSelect input,
|
|
.dj_ie .dijitTextBox input,
|
|
.dj_ie input.dijitTextBox {
|
|
overflow-y: visible;
|
|
line-height: 20px;
|
|
height: 20px;
|
|
}
|
|
.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%;
|
|
}
|
|
.dj_a11y input.dijitValidationInner,
|
|
.dj_a11y input.dijitArrowButtonInner {
|
|
text-indent: 0 !important;
|
|
width: 1em !important;
|
|
text-align: left !important;
|
|
color: black !important;
|
|
}
|
|
.dijitValidationTextBoxError .dijitValidationContainer {
|
|
display: inline;
|
|
cursor: default;
|
|
}
|
|
.dijitSpinner .dijitSpinnerButtonContainer,
|
|
.dijitComboBox .dijitArrowButtonContainer,
|
|
.bootstrap .dijitSelect .dijitArrowButton {
|
|
border-width: 0 0 0 1px !important;
|
|
}
|
|
.dj_a11y .dijitSelect .dijitArrowButtonContainer,
|
|
.dijitToolbar .dijitComboBox .dijitArrowButtonContainer {
|
|
border-width: 0 !important;
|
|
}
|
|
.dijitComboBoxMenu {
|
|
list-style-type: none;
|
|
}
|
|
.dijitSpinner .dijitSpinnerButtonContainer .dijitButtonNode {
|
|
border-width: 0;
|
|
}
|
|
.dj_ie .dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitButtonNode {
|
|
clear: both;
|
|
}
|
|
.dj_ie .dijitToolbar .dijitComboBox {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTextBox .dijitSpinnerButtonContainer {
|
|
width: 1em;
|
|
position: relative !important;
|
|
overflow: hidden;
|
|
}
|
|
.dijitSpinner .dijitSpinnerButtonInner {
|
|
width:1em;
|
|
visibility:hidden !important;
|
|
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;
|
|
}
|
|
.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;
|
|
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 {
|
|
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 {
|
|
#bottom: 50%;
|
|
top: 0;
|
|
}
|
|
.dijitSpinner .dijitArrowButtonInner {
|
|
margin: auto;
|
|
overflow-x: hidden;
|
|
/*height: 100% !important;*/
|
|
}
|
|
.dj_iequirks .dijitSpinner .dijitArrowButtonInner {
|
|
height: auto !important;
|
|
}
|
|
.dijitSpinner .dijitArrowButtonInner .dijitInputField {
|
|
-moz-transform: scale(0.5);
|
|
-moz-transform-origin: center top;
|
|
-webkit-transform: scale(0.5);
|
|
-webkit-transform-origin: center top;
|
|
-o-transform: scale(0.5);
|
|
-o-transform-origin: center top;
|
|
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%;*/
|
|
display: none;
|
|
}
|
|
.dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButtonInner {
|
|
overflow: hidden;
|
|
}
|
|
.dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
|
|
width: 100%;
|
|
}
|
|
.dj_iequirks .dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
|
|
width: 1em;
|
|
}
|
|
.dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
|
|
vertical-align:top;
|
|
visibility: visible;
|
|
}
|
|
.dj_a11y .dijitSpinnerButtonContainer {
|
|
width: 1em;
|
|
}
|
|
.dijitCheckBox,
|
|
.dijitRadio,
|
|
.dijitCheckBoxInput {
|
|
padding: 0;
|
|
border: 0;
|
|
width: 20px;
|
|
height: 20px;
|
|
background-position:center center;
|
|
background-repeat:no-repeat;
|
|
overflow: hidden;
|
|
cursor: pointer;
|
|
}
|
|
.dijitCheckBox input,
|
|
.dijitRadio input {
|
|
margin: 0;
|
|
padding: 0;
|
|
display: block;
|
|
}
|
|
.dijitCheckBoxInput {
|
|
opacity: 0.01;
|
|
}
|
|
.dj_ie .dijitCheckBoxInput {
|
|
filter: alpha(opacity=0);
|
|
}
|
|
.dj_a11y .dijitCheckBox,
|
|
.dj_a11y .dijitRadio {
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
.dj_a11y .dijitCheckBoxInput {
|
|
opacity: 1;
|
|
filter: none;
|
|
width: auto;
|
|
height: auto;
|
|
}
|
|
.dj_a11y .dijitFocusedLabel {
|
|
border: 1px dotted;
|
|
outline: 0px !important;
|
|
}
|
|
.dijitProgressBar {
|
|
z-index: 0;
|
|
}
|
|
.dijitProgressBarEmpty {
|
|
position:relative;overflow:hidden;
|
|
border:1px solid black;
|
|
z-index:0;
|
|
}
|
|
.dijitProgressBarFull {
|
|
position:absolute;
|
|
overflow:hidden;
|
|
z-index:-1;
|
|
top:0;
|
|
width:100%;
|
|
}
|
|
.dj_ie6 .dijitProgressBarFull {
|
|
height:1.6em;
|
|
}
|
|
.dijitProgressBarTile {
|
|
position:absolute;
|
|
overflow:hidden;
|
|
top:0;
|
|
left:0;
|
|
bottom:0;
|
|
right:0;
|
|
margin:0;
|
|
padding:0;
|
|
width: 100%;
|
|
height:auto;
|
|
background-color:#aaa;
|
|
/*background-attachment: fixed;*/
|
|
}
|
|
.dj_a11y .dijitProgressBarTile {
|
|
border-width:2px;
|
|
border-style:solid;
|
|
background-color:transparent !important;
|
|
}
|
|
.dj_ie6 .dijitProgressBarTile {
|
|
position:static;
|
|
height:1.6em;
|
|
}
|
|
.dijitProgressBarIndeterminate .dijitProgressBarTile {
|
|
|
|
}
|
|
.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;
|
|
}
|
|
.dijitTooltip {
|
|
position: absolute;
|
|
z-index: 2000;
|
|
display: block;
|
|
|
|
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;
|
|
}
|
|
.dijitTooltipData {
|
|
display:none;
|
|
}
|
|
.dijitLayoutContainer {
|
|
position: relative;
|
|
display: block;
|
|
overflow: hidden;
|
|
}
|
|
.dijitAlignTop,
|
|
.dijitAlignBottom,
|
|
.dijitAlignLeft,
|
|
.dijitAlignRight {
|
|
position: absolute;
|
|
overflow: hidden;
|
|
}
|
|
body .dijitAlignClient { position: absolute; }
|
|
.dijitBorderContainer, .dijitBorderContainerNoGutter {
|
|
position:relative;
|
|
overflow: hidden;
|
|
z-index: 0;
|
|
}
|
|
.dijitBorderContainerPane,
|
|
.dijitBorderContainerNoGutterPane {
|
|
position: absolute !important;
|
|
z-index: 2;
|
|
}
|
|
.dijitBorderContainer > .dijitTextArea {
|
|
resize: none;
|
|
}
|
|
.dijitGutter {
|
|
position: absolute;
|
|
font-size: 1px;
|
|
}
|
|
.dijitSplitter {
|
|
position: absolute;
|
|
overflow: hidden;
|
|
z-index: 10;
|
|
background-color: #fff;
|
|
border-color: gray;
|
|
border-style: solid;
|
|
border-width: 0;
|
|
}
|
|
.dj_ie .dijitSplitter {
|
|
z-index: 1;
|
|
}
|
|
.dijitSplitterActive {
|
|
z-index: 11 !important;
|
|
}
|
|
.dijitSplitterCover {
|
|
position:absolute;
|
|
z-index:-1;
|
|
top:0;
|
|
left:0;
|
|
width:100%;
|
|
height:100%;
|
|
}
|
|
.dijitSplitterCoverActive {
|
|
z-index:3 !important;
|
|
}
|
|
.dj_ie .dijitSplitterCover {
|
|
background: white;
|
|
filter: alpha(opacity=0);
|
|
}
|
|
.dijitSplitterH {
|
|
height: 7px;
|
|
border-top:1px;
|
|
border-bottom:1px;
|
|
cursor: row-resize;
|
|
}
|
|
.dijitSplitterV {
|
|
width: 7px;
|
|
border-left:1px;
|
|
border-right:1px;
|
|
cursor: col-resize;
|
|
}
|
|
.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;
|
|
-moz-opacity: 0.5;
|
|
opacity: 0.5;
|
|
filter: Alpha(Opacity=50);
|
|
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;
|
|
}
|
|
.dijitContentPane {
|
|
display: block;
|
|
overflow: auto;
|
|
}
|
|
.dijitContentPaneSingleChild {
|
|
overflow: hidden;
|
|
}
|
|
.dijitContentPaneLoading .dijitIconLoading,
|
|
.dijitContentPaneError .dijitIconError {
|
|
margin-right: 9px;
|
|
}
|
|
.dijitTitlePane {
|
|
display: block;
|
|
overflow: hidden;
|
|
}
|
|
.dijitTitlePaneTitle {
|
|
cursor: pointer;
|
|
}
|
|
.dijitFixedOpen, .dijitFixedClosed {
|
|
cursor: default;
|
|
}
|
|
.dijitFixedOpen .dijitArrowNode, .dijitFixedOpen .dijitArrowNodeInner,
|
|
.dijitFixedClosed .dijitArrowNode, .dijitFixedClosed .dijitArrowNodeInner{
|
|
display: none;
|
|
}
|
|
.dijitTitlePaneTitle * {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTitlePane .dijitArrowNodeInner {
|
|
display: none;
|
|
}
|
|
.dj_a11y .dijitTitlePane .dijitArrowNodeInner {
|
|
display:inline !important;
|
|
font-family: monospace;
|
|
}
|
|
.dj_a11y .dijitTitlePane .dijitArrowNode {
|
|
display:none;
|
|
}
|
|
.dj_ie6 .dijitTitlePaneContentOuter,
|
|
.dj_ie6 .dijitTitlePane .dijitTitlePaneTitle {
|
|
zoom: 1;
|
|
}
|
|
.dijitColorPalette {
|
|
border: 1px solid #999;
|
|
background: #fff;
|
|
position: relative;
|
|
}
|
|
.dijitColorPalette .dijitPaletteTable {
|
|
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 {
|
|
padding: 0;
|
|
margin: 2px 3px 3px 3px;
|
|
}
|
|
.dijitColorPalette .dijitPaletteCell {
|
|
font-size: 1px;
|
|
vertical-align: middle;
|
|
text-align: center;
|
|
background: none;
|
|
}
|
|
.dijitColorPalette .dijitPaletteImg {
|
|
padding: 1px;
|
|
border: 1px solid #999;
|
|
margin: 2px 1px;
|
|
cursor: default;
|
|
font-size: 1px;
|
|
}
|
|
.dj_gecko .dijitColorPalette .dijitPaletteImg {
|
|
padding-bottom: 0;
|
|
}
|
|
.dijitColorPalette .dijitColorPaletteSwatch {
|
|
width: 14px;
|
|
height: 12px;
|
|
}
|
|
.dijitPaletteTable td {
|
|
padding: 0;
|
|
}
|
|
.dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg {
|
|
border: 1px solid #000;
|
|
}
|
|
.dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg,
|
|
.dijitColorPalette .dijitPaletteTable .dijitPaletteCellSelected .dijitPaletteImg {
|
|
border: 2px solid #000;
|
|
margin: 1px 0;
|
|
}
|
|
.dj_a11y .dijitColorPalette .dijitPaletteTable,
|
|
.dj_a11y .dijitColorPalette .dijitPaletteTable * {
|
|
background-color: transparent !important;
|
|
}
|
|
.dijitAccordionContainer {
|
|
border:1px solid #b7b7b7;
|
|
border-top:0 !important;
|
|
}
|
|
.dijitAccordionTitle {
|
|
cursor: pointer;
|
|
}
|
|
.dijitAccordionTitleSelected {
|
|
cursor: default;
|
|
}
|
|
.dijitAccordionTitle .arrowTextUp,
|
|
.dijitAccordionTitle .arrowTextDown {
|
|
display: none;
|
|
}
|
|
.dj_a11y .dijitAccordionTitle .arrowTextUp,
|
|
.dj_a11y .dijitAccordionTitleSelected .arrowTextDown {
|
|
display: inline;
|
|
}
|
|
.dj_a11y .dijitAccordionTitleSelected .arrowTextUp {
|
|
display: none;
|
|
}
|
|
.dijitAccordionChildWrapper {
|
|
overflow: hidden;
|
|
}
|
|
.dijitCalendarContainer {
|
|
width: auto;
|
|
}
|
|
.dijitCalendarContainer th, .dijitCalendarContainer td {
|
|
padding: 1px 2px 2px;
|
|
vertical-align: middle;
|
|
}
|
|
.dijitCalendarYearLabel {
|
|
white-space: nowrap;
|
|
}
|
|
.dijitCalendarNextYear {
|
|
margin:0 0 0 0.55em;
|
|
}
|
|
.dijitCalendarPreviousYear {
|
|
margin:0 0.55em 0 0;
|
|
}
|
|
.dijitCalendarIncrementControl {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitCalendarIncrementControl,
|
|
.dijitCalendarDateTemplate,
|
|
.dijitCalendarMonthLabel,
|
|
.dijitCalendarPreviousYear,
|
|
.dijitCalendarNextYear {
|
|
cursor: pointer;
|
|
}
|
|
.dijitCalendarDisabledDate {
|
|
color: gray;
|
|
text-decoration: line-through;
|
|
cursor: default;
|
|
}
|
|
.dijitSpacer {
|
|
position: relative;
|
|
height: 1px;
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
}
|
|
.dijitCalendarMonthMenu .dijitCalendarMonthLabel {
|
|
text-align:center;
|
|
}
|
|
.dijitMenu {
|
|
border:1px solid black;
|
|
background-color:white;
|
|
}
|
|
.dijitMenuTable {
|
|
border-collapse:collapse;
|
|
border-width:0;
|
|
background-color:white;
|
|
}
|
|
.dj_webkit .dijitMenuTable td[colspan="2"]{
|
|
border-right:hidden;
|
|
}
|
|
.dijitMenuItem {
|
|
text-align: left;
|
|
white-space: nowrap;
|
|
padding:.1em .2em;
|
|
cursor:pointer;
|
|
}
|
|
.dijitMenuItem:focus {
|
|
outline: none
|
|
}
|
|
.dijitMenuPassive .dijitMenuItemHover,
|
|
.dijitMenuItemSelected {
|
|
background-color:black;
|
|
color:white;
|
|
}
|
|
.dijitMenuItemIcon, .dijitMenuExpand {
|
|
background-repeat: no-repeat;
|
|
}
|
|
.dijitMenuItemDisabled * {
|
|
/* flat theme styles disabled menu items */
|
|
/*opacity:0.5;*/
|
|
cursor:default;
|
|
}
|
|
.dj_ie .dj_a11y .dijitMenuItemDisabled,
|
|
.dj_ie .dj_a11y .dijitMenuItemDisabled *,
|
|
.dj_ie .dijitMenuItemDisabled * {
|
|
color: gray;
|
|
filter: alpha(opacity=35);
|
|
}
|
|
.dijitMenuItemLabel {
|
|
position: relative;
|
|
vertical-align: middle;
|
|
}
|
|
.dj_a11y .dijitMenuItemSelected {
|
|
border: 1px dotted black !important;
|
|
}
|
|
.dj_a11y .dijitMenuItemSelected .dijitMenuItemLabel {
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
}
|
|
.dj_ie8 .dj_a11y .dijitMenuItemLabel {
|
|
position:static;
|
|
}
|
|
.dijitMenuExpandA11y {
|
|
display: none;
|
|
}
|
|
.dj_a11y .dijitMenuExpandA11y {
|
|
display: inline;
|
|
}
|
|
.dijitMenuSeparator td {
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
.dijitMenuSeparatorTop {
|
|
height: 50%;
|
|
margin: 0;
|
|
margin-top:3px;
|
|
font-size: 1px;
|
|
}
|
|
.dijitMenuSeparatorBottom {
|
|
height: 50%;
|
|
margin: 0;
|
|
margin-bottom:3px;
|
|
font-size: 1px;
|
|
}
|
|
.dijitCheckedMenuItemIconChar {
|
|
vertical-align: middle;
|
|
visibility:hidden;
|
|
}
|
|
.dijitCheckedMenuItemChecked .dijitCheckedMenuItemIconChar {
|
|
visibility: visible;
|
|
}
|
|
.dj_a11y .dijitCheckedMenuItemIconChar {
|
|
display:inline !important;
|
|
}
|
|
.dj_a11y .dijitCheckedMenuItemIcon {
|
|
display: none;
|
|
}
|
|
.dj_ie .dj_a11y .dijitMenuBar .dijitMenuItem {
|
|
|
|
margin: 0;
|
|
}
|
|
.dijitStackController .dijitToggleButtonChecked * {
|
|
cursor: default;
|
|
}
|
|
.dijitTabContainer {
|
|
z-index: 0;
|
|
overflow: visible;
|
|
}
|
|
.dj_ie6 .dijitTabContainer {
|
|
overflow: hidden;
|
|
}
|
|
.dijitTabContainerNoLayout {
|
|
width: 100%;
|
|
}
|
|
.dijitTabContainerBottom-tabs,
|
|
.dijitTabContainerTop-tabs,
|
|
.dijitTabContainerLeft-tabs,
|
|
.dijitTabContainerRight-tabs {
|
|
z-index: 1;
|
|
overflow: visible !important;
|
|
}
|
|
.dijitTabController {
|
|
z-index: 1;
|
|
}
|
|
.dijitTabContainerBottom-container,
|
|
.dijitTabContainerTop-container,
|
|
.dijitTabContainerLeft-container,
|
|
.dijitTabContainerRight-container {
|
|
z-index:0;
|
|
overflow: hidden;
|
|
border: 1px solid black;
|
|
}
|
|
.nowrapTabStrip {
|
|
width: 50000px;
|
|
display: block;
|
|
position: relative;
|
|
text-align: left;
|
|
z-index: 1;
|
|
}
|
|
.dijitTabListWrapper {
|
|
overflow: hidden;
|
|
z-index: 1;
|
|
}
|
|
.dj_a11y .tabStripButton img {
|
|
display: none;
|
|
}
|
|
.dijitTabContainerTop-tabs {
|
|
border-bottom: 1px solid black;
|
|
}
|
|
.dijitTabContainerTop-container {
|
|
border-top: 0;
|
|
}
|
|
.dijitTabContainerLeft-tabs {
|
|
border-right: 1px solid black;
|
|
float: left;
|
|
}
|
|
.dijitTabContainerLeft-container {
|
|
border-left: 0;
|
|
}
|
|
.dijitTabContainerBottom-tabs {
|
|
border-top: 1px solid black;
|
|
}
|
|
.dijitTabContainerBottom-container {
|
|
border-bottom: 0;
|
|
}
|
|
.dijitTabContainerRight-tabs {
|
|
border-left: 1px solid black;
|
|
float: left;
|
|
}
|
|
.dijitTabContainerRight-container {
|
|
border-right: 0;
|
|
}
|
|
div.dijitTabDisabled, .dj_ie div.dijitTabDisabled {
|
|
cursor: auto;
|
|
}
|
|
.dijitTab {
|
|
position:relative;
|
|
cursor:pointer;
|
|
white-space:nowrap;
|
|
z-index:3;
|
|
}
|
|
.dijitTab * {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTabChecked {
|
|
cursor: default;
|
|
}
|
|
.dijitTabContainerTop-tabs .dijitTab {
|
|
top: 1px;
|
|
}
|
|
.dijitTabContainerBottom-tabs .dijitTab {
|
|
top: -1px;
|
|
}
|
|
.dijitTabContainerLeft-tabs .dijitTab {
|
|
left: 1px;
|
|
}
|
|
.dijitTabContainerRight-tabs .dijitTab {
|
|
left: -1px;
|
|
}
|
|
.dijitTabContainerTop-tabs .dijitTab,
|
|
.dijitTabContainerBottom-tabs .dijitTab {
|
|
display:inline-block;
|
|
#zoom: 1;
|
|
#display:inline;
|
|
}
|
|
.tabStripButton {
|
|
z-index: 12;
|
|
}
|
|
.dijitTabButtonDisabled .tabStripButton {
|
|
display: none;
|
|
}
|
|
.dijitTabCloseButton {
|
|
margin-left: 1em;
|
|
}
|
|
.dijitTabCloseText {
|
|
display:none;
|
|
}
|
|
.dijitTab .tabLabel {
|
|
/*min-height: 16px;*/
|
|
display: inline-block;
|
|
}
|
|
.dijitNoIcon {
|
|
display: none;
|
|
}
|
|
.dj_ie6 .dijitTab .dijitNoIcon {
|
|
display: inline;
|
|
height: 15px;
|
|
width: 1px;
|
|
}
|
|
.dj_a11y .dijitTabCloseButton {
|
|
background-image: none !important;
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
.dj_a11y .dijitTabCloseText {
|
|
display: inline;
|
|
}
|
|
.dijitTabPane,
|
|
.dijitStackContainer-child,
|
|
.dijitAccordionContainer-child {
|
|
border: none !important;
|
|
}
|
|
.dijitInlineEditBoxDisplayMode {
|
|
border: 1px solid transparent;
|
|
cursor: text;
|
|
}
|
|
.dj_a11y .dijitInlineEditBoxDisplayMode,
|
|
.dj_ie6 .dijitInlineEditBoxDisplayMode {
|
|
border: none;
|
|
}
|
|
.dijitInlineEditBoxDisplayModeHover,
|
|
.dj_a11y .dijitInlineEditBoxDisplayModeHover,
|
|
.dj_ie6 .dijitInlineEditBoxDisplayModeHover {
|
|
background-color: #e2ebf2;
|
|
border: solid 1px black;
|
|
}
|
|
.dijitInlineEditBoxDisplayModeDisabled {
|
|
cursor: default;
|
|
}
|
|
.dijitTree {
|
|
overflow: auto;
|
|
}
|
|
.dijitTreeContainer {
|
|
float: left;
|
|
}
|
|
.dijitTreeIndent {
|
|
width: 19px;
|
|
}
|
|
.dijitTreeRow, .dijitTreeContent {
|
|
white-space: nowrap;
|
|
}
|
|
.dj_ie .dijitTreeLabel:focus {
|
|
outline: 1px dotted black;
|
|
}
|
|
.dijitTreeRow img {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTreeContent {
|
|
cursor: default;
|
|
}
|
|
.dijitExpandoText {
|
|
display: none;
|
|
}
|
|
.dj_a11y .dijitExpandoText {
|
|
display: inline;
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
font-family: monospace;
|
|
border-style: solid;
|
|
border-width: thin;
|
|
cursor: pointer;
|
|
}
|
|
.dijitTreeLabel {
|
|
margin: 0 4px;
|
|
}
|
|
.dijitDialog {
|
|
position: absolute;
|
|
z-index: 999;
|
|
overflow: hidden;
|
|
}
|
|
.dijitDialogTitleBar {
|
|
cursor: move;
|
|
}
|
|
.dijitDialogFixed .dijitDialogTitleBar {
|
|
cursor:default;
|
|
}
|
|
.dijitDialogCloseIcon {
|
|
cursor: pointer;
|
|
}
|
|
.dijitDialogPaneContent {
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
.dijitDialogUnderlayWrapper {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 998;
|
|
display: none;
|
|
background: transparent !important;
|
|
}
|
|
.dijitDialogUnderlay {
|
|
background: #eee;
|
|
opacity: 0.5;
|
|
}
|
|
.dj_ie .dijitDialogUnderlay {
|
|
filter: alpha(opacity=50);
|
|
}
|
|
.dj_a11y .dijitSpinnerButtonContainer,
|
|
.dj_a11y .dijitDialog {
|
|
opacity: 1 !important;
|
|
background-color: white !important;
|
|
}
|
|
.dijitDialog .closeText {
|
|
/*display:none;*/
|
|
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
|
|
display: block;
|
|
color: #000000;
|
|
text-shadow: 0 1px 0 #FFFFFF;
|
|
position:absolute;
|
|
}
|
|
.dj_a11y .dijitDialog .closeText {
|
|
display:inline;
|
|
}
|
|
.dijitSliderMoveable {
|
|
z-index:99;
|
|
position:absolute !important;
|
|
display:block;
|
|
vertical-align:middle;
|
|
}
|
|
.dijitSliderMoveableH {
|
|
right:0;
|
|
}
|
|
.dijitSliderMoveableV {
|
|
right:50%;
|
|
}
|
|
.dj_a11y div.dijitSliderImageHandle,
|
|
.dijitSliderImageHandle {
|
|
margin:0;
|
|
padding:0;
|
|
position:relative !important;
|
|
border:8px solid gray;
|
|
width:0;
|
|
height:0;
|
|
cursor: pointer;
|
|
}
|
|
.dj_iequirks .dj_a11y .dijitSliderImageHandle {
|
|
font-size: 0;
|
|
}
|
|
.dj_ie7 .dijitSliderImageHandle {
|
|
overflow: hidden;
|
|
}
|
|
.dj_ie7 .dj_a11y .dijitSliderImageHandle {
|
|
overflow: visible;
|
|
}
|
|
.dj_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;
|
|
vertical-align:top;
|
|
text-align:left;
|
|
}
|
|
.dijitSliderProgressBarH {
|
|
position:absolute !important;
|
|
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;
|
|
}
|
|
.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;
|
|
}
|
|
.dijitSliderDecorationC,
|
|
.dijitSliderDecorationV {
|
|
position: relative;
|
|
}
|
|
.dijitSliderDecorationH {
|
|
width: 100%;
|
|
}
|
|
.dijitSliderDecorationV {
|
|
height: 100%;
|
|
white-space: nowrap;
|
|
}
|
|
.dijitSliderButton {
|
|
font-family:monospace;
|
|
margin:0;
|
|
padding:0;
|
|
display:block;
|
|
}
|
|
.dj_a11y .dijitSliderButtonInner {
|
|
visibility:visible !important;
|
|
}
|
|
.dijitSliderButtonContainer {
|
|
text-align:center;
|
|
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;
|
|
}
|
|
.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 {
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
}
|
|
.dijitRuleMarkV {
|
|
height:0;
|
|
border-right-width:0 !important;
|
|
/*border-bottom-width:0 !important;*/
|
|
border-left-width:0 !important;
|
|
width:100%;
|
|
left:0;
|
|
}
|
|
.dj_ie .dijitRuleLabelContainerV {
|
|
margin-top:-.55em;
|
|
}
|
|
.dj_a11y .dijitSliderReadOnly,
|
|
.dj_a11y .dijitSliderDisabled {
|
|
opacity:0.6;
|
|
}
|
|
.dj_ie .dj_a11y .dijitSliderReadOnly .dijitSliderBar,
|
|
.dj_ie .dj_a11y .dijitSliderDisabled .dijitSliderBar {
|
|
filter: alpha(opacity=40);
|
|
}
|
|
.dj_a11y .dijitSlider .dijitSliderButtonContainer div {
|
|
font-family: monospace;
|
|
font-size: 1em;
|
|
line-height: 1em;
|
|
height: auto;
|
|
width: auto;
|
|
margin: 0 4px;
|
|
}
|
|
.dj_a11y .dijitButtonContents .dijitButtonText,
|
|
.dj_a11y .dijitTab .tabLabel {
|
|
display: inline !important;
|
|
}
|
|
.dj_a11y .dijitSelect .dijitButtonText {
|
|
display: inline-block !important;
|
|
}
|
|
.dijitSelectError .dijitButtonContents .dijitButtonText {
|
|
display: none !important;
|
|
}
|
|
.dijitTextArea {
|
|
width:100%;
|
|
overflow-y: auto;
|
|
}
|
|
.dijitTextArea[cols] {
|
|
width:auto;
|
|
}
|
|
.dj_ie .dijitTextAreaCols {
|
|
width:auto;
|
|
}
|
|
.dijitExpandingTextArea {
|
|
|
|
resize: none;
|
|
}
|
|
.dijitToolbarSeparator {
|
|
height: 18px;
|
|
width: 5px;
|
|
padding: 0 1px;
|
|
margin: 0;
|
|
}
|
|
.dijitIEFixedToolbar {
|
|
position:absolute;
|
|
top: expression(eval((document.documentElement||document.body).scrollTop));
|
|
}
|
|
.dijitEditor {
|
|
display: block;
|
|
}
|
|
.dijitEditorDisabled,
|
|
.dijitEditorReadOnly {
|
|
color: gray;
|
|
}
|
|
.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;
|
|
cursor:pointer;
|
|
}
|
|
.dijitTimePickerItemDisabled {
|
|
color:gray;
|
|
text-decoration:line-through;
|
|
}
|
|
.dj_a11y .dijitTimePickerItemSelected .dijitTimePickerItemInner {
|
|
border: solid 4px black;
|
|
}
|
|
.dj_a11y .dijitTimePickerItemHover .dijitTimePickerItemInner {
|
|
border: dashed 4px black;
|
|
}
|
|
.dijitToggleButtonIconChar {
|
|
|
|
display:none !important;
|
|
}
|
|
.dj_a11y .dijitToggleButton .dijitToggleButtonIconChar {
|
|
display:inline !important;
|
|
visibility:hidden;
|
|
}
|
|
.dj_ie6 .dijitToggleButtonIconChar, .dj_ie6 .tabStripButton .dijitButtonText {
|
|
font-family: "Arial Unicode MS";
|
|
}
|
|
.dj_a11y .dijitToggleButtonChecked .dijitToggleButtonIconChar {
|
|
display: inline !important;
|
|
visibility:visible !important;
|
|
}
|
|
.dijitArrowButtonChar {
|
|
display:none !important;
|
|
}
|
|
.dj_a11y .dijitArrowButtonChar {
|
|
display:inline !important;
|
|
}
|
|
.dj_a11y .dijitDropDownButton .dijitArrowButtonInner,
|
|
.dj_a11y .dijitComboButton .dijitArrowButtonInner {
|
|
display:none !important;
|
|
}
|
|
.dj_a11y .dijitSelect {
|
|
border-collapse: separate !important;
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
}
|
|
.dj_ie .dijitSelect {
|
|
vertical-align: middle;
|
|
}
|
|
.dj_ie6 .dijitSelect .dijitValidationContainer,
|
|
.dj_ie8 .dijitSelect .dijitButtonText {
|
|
vertical-align: top;
|
|
}
|
|
.dj_ie6 .dijitTextBox .dijitInputContainer,
|
|
.dj_iequirks .dijitTextBox .dijitInputContainer,
|
|
.dj_ie6 .dijitTextBox .dijitArrowButtonInner,
|
|
.dj_ie6 .dijitSpinner .dijitSpinnerButtonInner,
|
|
.dijitSelect .dijitSelectLabel {
|
|
vertical-align: baseline;
|
|
}
|
|
.dijitNumberTextBox {
|
|
text-align: left;
|
|
direction: ltr;
|
|
}
|
|
.dijitNumberTextBox .dijitInputInner {
|
|
text-align: inherit;
|
|
}
|
|
.dijitToolbar .dijitSelect {
|
|
margin: 0;
|
|
}
|
|
.dj_webkit .dijitToolbar .dijitSelect {
|
|
padding-left: 0.3em;
|
|
}
|
|
.dijitSelect .dijitButtonContents {
|
|
padding: 0;
|
|
white-space: nowrap;
|
|
text-align: left;
|
|
border-style: none solid none none;
|
|
border-width: 0px;
|
|
}
|
|
.dijitSelectFixedWidth .dijitButtonContents {
|
|
width: 100%;
|
|
}
|
|
.dijitSelectMenu .dijitMenuItemIcon {
|
|
display:none;
|
|
}
|
|
.dj_ie6 .dijitSelectMenu .dijitMenuItemLabel,
|
|
.dj_ie7 .dijitSelectMenu .dijitMenuItemLabel {
|
|
position: static;
|
|
}
|
|
.dijitSelectLabel *
|
|
{
|
|
vertical-align: baseline;
|
|
}
|
|
.dijitSelectSelectedOption * {
|
|
font-weight: normal;
|
|
}
|
|
.dijitSelectMenu {
|
|
border-width: 1px;
|
|
}
|
|
.dijitSelectMenu .dijitMenuTable {
|
|
margin: 0;
|
|
background-color: transparent;
|
|
}
|
|
.dijitForceStatic {
|
|
position: static !important;
|
|
}
|
|
.dijitReadOnly *,
|
|
.dijitDisabled *,
|
|
.dijitReadOnly,
|
|
.dijitDisabled {
|
|
cursor: default;
|
|
}
|
|
.dojoDndItem {
|
|
padding: 2px;
|
|
-webkit-touch-callout: none;
|
|
-webkit-user-select: none;
|
|
}
|
|
.dojoDndHorizontal .dojoDndItem {
|
|
#display: inline;
|
|
display: inline-block;
|
|
}
|
|
.dojoDndItemBefore,
|
|
.dojoDndItemAfter {
|
|
border: 0px solid #369;
|
|
}
|
|
.dojoDndItemBefore {
|
|
border-width: 2px 0 0 0;
|
|
padding: 0 2px 2px 2px;
|
|
}
|
|
.dojoDndItemAfter {
|
|
border-width: 0 0 2px 0;
|
|
padding: 2px 2px 0 2px;
|
|
}
|
|
.dojoDndHorizontal .dojoDndItemBefore {
|
|
border-width: 0 0 0 2px;
|
|
padding: 2px 2px 2px 0;
|
|
}
|
|
.dojoDndHorizontal .dojoDndItemAfter {
|
|
border-width: 0 2px 0 0;
|
|
padding: 2px 0 2px 2px;
|
|
}
|
|
.dojoDndItemOver {
|
|
cursor:pointer;
|
|
}
|
|
.dj_gecko .dijitArrowButtonInner INPUT,
|
|
.dj_gecko INPUT.dijitArrowButtonInner {
|
|
-moz-user-focus:ignore;
|
|
}
|
|
.dijitFocused .dijitMenuItemShortcutKey {
|
|
text-decoration: underline;
|
|
}
|
|
.dijitRtl .dijitOffScreen {
|
|
/* align on the right side rather than the left so no horizontal scroll bar shown */
|
|
left: auto !important;
|
|
right: -10000px !important;
|
|
}
|
|
|
|
.dijitRtl .dijitPlaceHolder {
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
|
|
/* Menu */
|
|
|
|
.dijitMenuItemRtl {
|
|
text-align: right;
|
|
}
|
|
|
|
/* Button */
|
|
|
|
.dj_iequirks .dijitComboButtonRtl button {
|
|
/* workaround bug where label invisible (themeTesterQuirk.html?dir=rtl) */
|
|
float:left;
|
|
}
|
|
.dj_ie .dijitTextBoxRtl .dijitInputContainer {
|
|
clear: right;
|
|
}
|
|
|
|
/* TextBox, ComboBox, Spinner */
|
|
|
|
.dijitTextBoxRtl .dijitValidationContainer,
|
|
.dijitTextBoxRtl .dijitSpinnerButtonContainer,
|
|
.dijitComboBoxRtl .dijitArrowButtonContainer {
|
|
/* combobox and spinner: line between the input area and the drop down button */
|
|
border-right-width: 1px !important;
|
|
border-left-width: 0 !important;
|
|
}
|
|
|
|
.dijitSpinnerRtl .dijitSpinnerButtonContainer .dijitArrowButton {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
.dijitSelectRtl .dijitButtonText {
|
|
float: right;
|
|
}
|
|
|
|
.dijitTextBoxRtl .dijitSpinnerButtonContainer,
|
|
.dijitValidationTextBoxRtl .dijitValidationContainer,
|
|
.dijitTextBoxRtl .dijitArrowButtonContainer {
|
|
float: left;
|
|
}
|
|
|
|
div.dijitNumberTextBoxRtl {
|
|
text-align: right;
|
|
}
|
|
|
|
/* Calendar */
|
|
|
|
.dijitCalendarRtl .dijitCalendarNextYear {
|
|
margin:0 0.55em 0 0;
|
|
}
|
|
|
|
.dijitCalendarRtl .dijitCalendarPreviousYear {
|
|
margin:0 0 0 0.55em;
|
|
}
|
|
|
|
|
|
/* Slider */
|
|
|
|
.dijitSliderRtl .dijitSliderImageHandleV {
|
|
left:auto;
|
|
}
|
|
|
|
.dijitSliderRtl .dijitSliderImageHandleH {
|
|
left:-50%;
|
|
}
|
|
|
|
.dijitSliderRtl .dijitSliderMoveableH {
|
|
right:auto;
|
|
left:0;
|
|
}
|
|
|
|
.dijitSliderRtl .dijitRuleContainerV {
|
|
float:right;
|
|
}
|
|
|
|
.dj_ie .dijitSliderRtl .dijitRuleContainerV {
|
|
text-align:right;
|
|
}
|
|
|
|
.dj_ie .dijitSliderRtl .dijitRuleLabelV {
|
|
text-align:left;
|
|
}
|
|
|
|
.dj_ie .dijitSliderRtl .dijitRuleLabelH {
|
|
zoom:1;
|
|
}
|
|
|
|
.dijitSliderRtl .dijitSliderProgressBarH {
|
|
/* workarounds for IE and FF */
|
|
float:right;
|
|
right:0;
|
|
left:auto;
|
|
}
|
|
|
|
/* ContentPane*/
|
|
|
|
.dijitRtl .dijitContentPaneLoading .dijitIconLoading,
|
|
.dijitRtl .dijitContentPaneError .dijitIconError {
|
|
margin-right: 0;
|
|
margin-left: 9px;
|
|
}
|
|
|
|
/* TabContainer */
|
|
|
|
.dijitTabControllerRtl .nowrapTabStrip {
|
|
text-align: right; /* just in case ancestor has non-standard setting */
|
|
}
|
|
.dijitTabRtl .dijitTabCloseButton {
|
|
margin-left: 0;
|
|
margin-right: 1em;
|
|
}
|
|
.dj_ie6 .dijitTabRtl .tabLabel,
|
|
.dj_ie6 .dijitTabContainerRight-tabs .dijitTabRtl,
|
|
.dj_ie6 .dijitTabContainerLeft-tabs .dijitTabRtl,
|
|
.dj_ie7 .dijitTabContainerRight-tabs .dijitTabRtl,
|
|
.dj_ie7 .dijitTabContainerLeft-tabs .dijitTabRtl {
|
|
zoom: 1;
|
|
}
|
|
.dj_ie6 .dijitTabContainerRight-tabs .dijitTabRtl,
|
|
.dj_ie7 .dijitTabContainerRight-tabs .dijitTabRtl {
|
|
left: 0;
|
|
}
|
|
|
|
.dj_ie6 .dijitTabContainerRightRtl .dijitTabContainerRight-tabs,
|
|
.dj_ie6 .dijitTabContainerLeftRtl .dijitTabContainerLeft-tabs {
|
|
/* otherwise tab labels invisible */
|
|
width: 1%;
|
|
}
|
|
|
|
/* TimePicker */
|
|
.dj_ie .dijitTimePickerRtl .dijitTimePickerItem {
|
|
width:100%;
|
|
}
|
|
|
|
|
|
/* ColorPalette */
|
|
.dijitColorPaletteRtl .dijitColorPaletteUnder {
|
|
/* needed in RTL mode when DropDownButton expands the ColorPalette beyond it's natural width */
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
|
|
/* Select */
|
|
.dijitSelectRtl .dijitButtonContents {
|
|
border-style: none none none solid;
|
|
text-align: right;
|
|
}
|
|
|
|
/* Tree */
|
|
|
|
.dijitTreeRtl .dijitTreeContainer {
|
|
float: right; /* for correct highlighting during horizontal scroll, see #16132 */
|
|
}
|
|
|
|
/* DnD
|
|
* These rules should apply for containers that are dir=rtl (either set directly, or inherited)
|
|
* but seems the best we can do is look for .dijitRtl on an ancestor node.
|
|
*/
|
|
.dijitRtl .dojoDndHorizontal .dojoDndItemBefore {
|
|
border-width: 0 2px 0 0;
|
|
padding: 2px 0 2px 2px;
|
|
}
|
|
.dijitRtl .dojoDndHorizontal .dojoDndItemAfter {
|
|
border-width: 0 0 0 2px;
|
|
padding: 2px 2px 2px 0;
|
|
}
|
|
.dijitReset {
|
|
margin:0;
|
|
border:0;
|
|
padding:0;
|
|
font: inherit;
|
|
/*line-height:normal;*/
|
|
color: inherit;
|
|
}
|
|
.dj_a11y .dijitReset {
|
|
-moz-appearance: none;
|
|
}
|
|
.dijitInline {
|
|
display:inline-block;
|
|
#zoom: 1;
|
|
#display:inline;
|
|
border:0;
|
|
padding:0;
|
|
vertical-align:middle;
|
|
#vertical-align: auto;
|
|
}
|
|
table.dijitInline {
|
|
display:inline-table;
|
|
box-sizing: content-box; -moz-box-sizing: content-box;
|
|
}
|
|
.dijitHidden {
|
|
display: none !important;
|
|
}
|
|
.dijitVisible {
|
|
display: block !important;
|
|
position: relative;
|
|
}
|
|
.dj_ie6 .dijitComboBox .dijitInputContainer,
|
|
.dijitInputContainer {
|
|
#zoom: 1;
|
|
overflow: hidden;
|
|
float: none !important;
|
|
position: relative;
|
|
}
|
|
.dj_ie7 .dijitInputContainer {
|
|
float: left !important;
|
|
clear: left;
|
|
display: inline-block !important;
|
|
}
|
|
.dj_ie .dijitSelect input,
|
|
.dj_ie input.dijitTextBox,
|
|
.dj_ie .dijitTextBox input {
|
|
font-size: 100%;
|
|
}
|
|
.dijitSelect .dijitButtonText {
|
|
float: left;
|
|
vertical-align: top;
|
|
}
|
|
TABLE.dijitSelect {
|
|
padding: 0 !important;
|
|
}
|
|
.dijitTextBox .dijitSpinnerButtonContainer,
|
|
.dijitTextBox .dijitArrowButtonContainer,
|
|
.dijitValidationTextBox .dijitValidationContainer {
|
|
float: right;
|
|
text-align: center;
|
|
}
|
|
.dijitSelect input.dijitInputField,
|
|
.dijitTextBox input.dijitInputField {
|
|
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
}
|
|
.dijitValidationTextBox .dijitValidationContainer {
|
|
display: none;
|
|
}
|
|
.dijitTeeny {
|
|
font-size:1px;
|
|
line-height:1px;
|
|
}
|
|
.dijitOffScreen {
|
|
position: absolute !important;
|
|
left: 50% !important;
|
|
top: -10000px !important;
|
|
}
|
|
.dijitPopup {
|
|
position: absolute;
|
|
background-color: transparent;
|
|
margin: 0;
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
.dijitPositionOnly {
|
|
padding: 0 !important;
|
|
border: 0 !important;
|
|
background-color: transparent !important;
|
|
background-image: none !important;
|
|
height: auto !important;
|
|
width: auto !important;
|
|
}
|
|
.dijitNonPositionOnly {
|
|
float: none !important;
|
|
position: static !important;
|
|
margin: 0 0 0 0 !important;
|
|
vertical-align: middle !important;
|
|
}
|
|
.dijitBackgroundIframe {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: -1;
|
|
border: 0;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
.dijitDisplayNone {
|
|
display:none !important;
|
|
}
|
|
.dijitContainer {
|
|
overflow: hidden;
|
|
}
|
|
.dj_a11y .dijitIcon,
|
|
.dj_a11y div.dijitArrowButtonInner,
|
|
.dj_a11y span.dijitArrowButtonInner,
|
|
.dj_a11y img.dijitArrowButtonInner,
|
|
.dj_a11y .dijitCalendarIncrementControl,
|
|
.dj_a11y .dijitTreeExpando {
|
|
display: none;
|
|
}
|
|
.dijitSpinner div.dijitArrowButtonInner {
|
|
display: block;
|
|
}
|
|
.dj_a11y .dijitA11ySideArrow {
|
|
display: inline !important;
|
|
cursor: pointer;
|
|
}
|
|
.dj_a11y .dijitCalendarDateLabel {
|
|
padding: 1px;
|
|
border: 0px !important;
|
|
}
|
|
.dj_a11y .dijitCalendarSelectedDate .dijitCalendarDateLabel {
|
|
border-style: solid !important;
|
|
border-width: 1px !important;
|
|
padding: 0;
|
|
}
|
|
.dj_a11y .dijitCalendarDateTemplate {
|
|
padding-bottom: 0.1em !important;
|
|
border: 0px !important;
|
|
}
|
|
.dj_a11y .dijitButtonNode {
|
|
border: black outset medium !important;
|
|
|
|
padding: 0 !important;
|
|
}
|
|
.dj_a11y .dijitArrowButton {
|
|
padding: 0 !important;
|
|
}
|
|
.dj_a11y .dijitButtonContents {
|
|
margin: 0.15em;
|
|
}
|
|
.dj_a11y .dijitTextBoxReadOnly .dijitInputField,
|
|
.dj_a11y .dijitTextBoxReadOnly .dijitButtonNode {
|
|
border-style: outset!important;
|
|
border-width: medium!important;
|
|
border-color: #999 !important;
|
|
color:#999 !important;
|
|
}
|
|
.dijitButtonNode * {
|
|
vertical-align: middle;
|
|
/*vertical-align: baseline;*/
|
|
}
|
|
.dijitSelect .dijitArrowButtonInner,
|
|
.dijitButtonNode .dijitArrowButtonInner {
|
|
background: no-repeat center;
|
|
direction: ltr;
|
|
}
|
|
.dijitLeft {
|
|
background-position:left top;
|
|
background-repeat:no-repeat;
|
|
}
|
|
.dijitStretch {
|
|
white-space:nowrap;
|
|
background-repeat:repeat-x;
|
|
}
|
|
.dijitRight {
|
|
#display:inline;
|
|
background-position:right top;
|
|
background-repeat:no-repeat;
|
|
}
|
|
.dj_gecko .dj_a11y .dijitButtonDisabled .dijitButtonNode {
|
|
opacity: 0.5;
|
|
}
|
|
.dijitToggleButton,
|
|
.dijitButton,
|
|
.dijitDropDownButton,
|
|
.dijitComboButton {
|
|
margin: 0.2em;
|
|
vertical-align: middle;
|
|
}
|
|
.dijitButtonContents {
|
|
display: block;
|
|
}
|
|
td.dijitButtonContents {
|
|
display: table-cell;
|
|
}
|
|
.dijitButtonNode img {
|
|
vertical-align:middle;
|
|
}
|
|
.dijitToolbar .dijitComboButton {
|
|
border-collapse: separate;
|
|
}
|
|
.dijitToolbar .dijitToggleButton,
|
|
.dijitToolbar .dijitButton,
|
|
.dijitToolbar .dijitDropDownButton,
|
|
.dijitToolbar .dijitComboButton {
|
|
margin: 0;
|
|
}
|
|
.dijitToolbar .dijitButtonContents {
|
|
padding: 1px 2px;
|
|
}
|
|
.dj_webkit .dijitToolbar .dijitDropDownButton {
|
|
/*padding-left: 0.3em;*/
|
|
}
|
|
.dj_gecko .dijitToolbar .dijitButtonNode::-moz-focus-inner {
|
|
padding:0;
|
|
}
|
|
.dijitSelect {
|
|
border:1px solid gray;
|
|
}
|
|
.dijitButtonNode {
|
|
border:1px solid gray;
|
|
margin:0;
|
|
line-height:20px;
|
|
vertical-align: middle;
|
|
#vertical-align: auto;
|
|
text-align:center;
|
|
white-space: nowrap;
|
|
}
|
|
.dj_webkit .dijitSpinner .dijitSpinnerButtonContainer {
|
|
line-height:inherit;
|
|
}
|
|
.dijitTextBox .dijitButtonNode {
|
|
border-width: 0;
|
|
}
|
|
.dijitSelect,
|
|
.dijitSelect *,
|
|
.dijitButtonNode,
|
|
.dijitButtonNode * {
|
|
cursor: pointer;
|
|
}
|
|
.dj_ie .dijitButtonNode {
|
|
zoom: 1;
|
|
}
|
|
.dj_ie .dijitButtonNode button {
|
|
overflow: visible;
|
|
}
|
|
div.dijitArrowButton {
|
|
float: right;
|
|
}
|
|
.dijitTextBox {
|
|
border: solid black 1px;
|
|
#overflow: hidden;
|
|
width: 15em;
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTextBoxReadOnly,
|
|
.dijitTextBoxDisabled {
|
|
color: gray;
|
|
}
|
|
.dj_safari .dijitTextBoxDisabled input {
|
|
color: #B0B0B0;
|
|
}
|
|
.dj_safari textarea.dijitTextAreaDisabled {
|
|
color: #333;
|
|
}
|
|
.dj_gecko .dijitTextBoxReadOnly input.dijitInputField,
|
|
.dj_gecko .dijitTextBoxDisabled input {
|
|
-moz-user-input: none;
|
|
}
|
|
.dijitPlaceHolder {
|
|
color: #999;
|
|
/*font-style: italic;*/
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
#filter: "";
|
|
}
|
|
.dijitTimeTextBox {
|
|
width: 8em;
|
|
}
|
|
.dijitTextBox input:focus {
|
|
outline: none;
|
|
}
|
|
.dijitTextBoxFocused {
|
|
outline: 5px -webkit-focus-ring-color;
|
|
}
|
|
.dijitSelect input,
|
|
.dijitTextBox input {
|
|
float: left;
|
|
}
|
|
.dj_ie6 input.dijitTextBox,
|
|
.dj_ie6 .dijitTextBox input {
|
|
float: none;
|
|
}
|
|
.dijitInputInner {
|
|
border:0 !important;
|
|
background-color:transparent !important;
|
|
width:100% !important;
|
|
box-shadow: none !important;
|
|
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 {
|
|
text-indent: -2em !important;
|
|
direction: ltr !important;
|
|
text-align: left !important;
|
|
/*height: auto !important;*/
|
|
#text-indent: 0 !important;
|
|
#letter-spacing: -5em !important;
|
|
#text-align: right !important;
|
|
}
|
|
.dj_ie .dijitSelect input,
|
|
.dj_ie .dijitTextBox input,
|
|
.dj_ie input.dijitTextBox {
|
|
overflow-y: visible;
|
|
line-height: 20px;
|
|
height: 20px;
|
|
}
|
|
.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%;
|
|
}
|
|
.dj_a11y input.dijitValidationInner,
|
|
.dj_a11y input.dijitArrowButtonInner {
|
|
text-indent: 0 !important;
|
|
width: 1em !important;
|
|
text-align: left !important;
|
|
color: black !important;
|
|
}
|
|
.dijitValidationTextBoxError .dijitValidationContainer {
|
|
display: inline;
|
|
cursor: default;
|
|
}
|
|
.dijitSpinner .dijitSpinnerButtonContainer,
|
|
.dijitComboBox .dijitArrowButtonContainer,
|
|
.bootstrap .dijitSelect .dijitArrowButton {
|
|
border-width: 0 0 0 1px !important;
|
|
}
|
|
.dj_a11y .dijitSelect .dijitArrowButtonContainer,
|
|
.dijitToolbar .dijitComboBox .dijitArrowButtonContainer {
|
|
border-width: 0 !important;
|
|
}
|
|
.dijitComboBoxMenu {
|
|
list-style-type: none;
|
|
}
|
|
.dijitSpinner .dijitSpinnerButtonContainer .dijitButtonNode {
|
|
border-width: 0;
|
|
}
|
|
.dj_ie .dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitButtonNode {
|
|
clear: both;
|
|
}
|
|
.dj_ie .dijitToolbar .dijitComboBox {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTextBox .dijitSpinnerButtonContainer {
|
|
width: 1em;
|
|
position: relative !important;
|
|
overflow: hidden;
|
|
}
|
|
.dijitSpinner .dijitSpinnerButtonInner {
|
|
width:1em;
|
|
visibility:hidden !important;
|
|
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;
|
|
}
|
|
.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;
|
|
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 {
|
|
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 {
|
|
#bottom: 50%;
|
|
top: 0;
|
|
}
|
|
.dijitSpinner .dijitArrowButtonInner {
|
|
margin: auto;
|
|
overflow-x: hidden;
|
|
/*height: 100% !important;*/
|
|
}
|
|
.dj_iequirks .dijitSpinner .dijitArrowButtonInner {
|
|
height: auto !important;
|
|
}
|
|
.dijitSpinner .dijitArrowButtonInner .dijitInputField {
|
|
-moz-transform: scale(0.5);
|
|
-moz-transform-origin: center top;
|
|
-webkit-transform: scale(0.5);
|
|
-webkit-transform-origin: center top;
|
|
-o-transform: scale(0.5);
|
|
-o-transform-origin: center top;
|
|
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%;*/
|
|
display: none;
|
|
}
|
|
.dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButtonInner {
|
|
overflow: hidden;
|
|
}
|
|
.dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
|
|
width: 100%;
|
|
}
|
|
.dj_iequirks .dj_a11y .dijitSpinner .dijitSpinnerButtonContainer .dijitArrowButton {
|
|
width: 1em;
|
|
}
|
|
.dj_a11y .dijitSpinner .dijitArrowButtonInner .dijitInputField {
|
|
vertical-align:top;
|
|
visibility: visible;
|
|
}
|
|
.dj_a11y .dijitSpinnerButtonContainer {
|
|
width: 1em;
|
|
}
|
|
.dijitCheckBox,
|
|
.dijitRadio,
|
|
.dijitCheckBoxInput {
|
|
padding: 0;
|
|
border: 0;
|
|
width: 20px;
|
|
height: 20px;
|
|
background-position:center center;
|
|
background-repeat:no-repeat;
|
|
overflow: hidden;
|
|
cursor: pointer;
|
|
}
|
|
.dijitCheckBox input,
|
|
.dijitRadio input {
|
|
margin: 0;
|
|
padding: 0;
|
|
display: block;
|
|
}
|
|
.dijitCheckBoxInput {
|
|
opacity: 0.01;
|
|
}
|
|
.dj_ie .dijitCheckBoxInput {
|
|
filter: alpha(opacity=0);
|
|
}
|
|
.dj_a11y .dijitCheckBox,
|
|
.dj_a11y .dijitRadio {
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
.dj_a11y .dijitCheckBoxInput {
|
|
opacity: 1;
|
|
filter: none;
|
|
width: auto;
|
|
height: auto;
|
|
}
|
|
.dj_a11y .dijitFocusedLabel {
|
|
border: 1px dotted;
|
|
outline: 0px !important;
|
|
}
|
|
.dijitProgressBar {
|
|
z-index: 0;
|
|
}
|
|
.dijitProgressBarEmpty {
|
|
position:relative;overflow:hidden;
|
|
border:1px solid black;
|
|
z-index:0;
|
|
}
|
|
.dijitProgressBarFull {
|
|
position:absolute;
|
|
overflow:hidden;
|
|
z-index:-1;
|
|
top:0;
|
|
width:100%;
|
|
}
|
|
.dj_ie6 .dijitProgressBarFull {
|
|
height:1.6em;
|
|
}
|
|
.dijitProgressBarTile {
|
|
position:absolute;
|
|
overflow:hidden;
|
|
top:0;
|
|
left:0;
|
|
bottom:0;
|
|
right:0;
|
|
margin:0;
|
|
padding:0;
|
|
width: 100%;
|
|
height:auto;
|
|
background-color:#aaa;
|
|
/*background-attachment: fixed;*/
|
|
}
|
|
.dj_a11y .dijitProgressBarTile {
|
|
border-width:2px;
|
|
border-style:solid;
|
|
background-color:transparent !important;
|
|
}
|
|
.dj_ie6 .dijitProgressBarTile {
|
|
position:static;
|
|
height:1.6em;
|
|
}
|
|
.dijitProgressBarIndeterminate .dijitProgressBarTile {
|
|
|
|
}
|
|
.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;
|
|
}
|
|
.dijitTooltip {
|
|
position: absolute;
|
|
z-index: 2000;
|
|
display: block;
|
|
|
|
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;
|
|
}
|
|
.dijitTooltipData {
|
|
display:none;
|
|
}
|
|
.dijitLayoutContainer {
|
|
position: relative;
|
|
display: block;
|
|
overflow: hidden;
|
|
}
|
|
.dijitAlignTop,
|
|
.dijitAlignBottom,
|
|
.dijitAlignLeft,
|
|
.dijitAlignRight {
|
|
position: absolute;
|
|
overflow: hidden;
|
|
}
|
|
body .dijitAlignClient { position: absolute; }
|
|
.dijitBorderContainer, .dijitBorderContainerNoGutter {
|
|
position:relative;
|
|
overflow: hidden;
|
|
z-index: 0;
|
|
}
|
|
.dijitBorderContainerPane,
|
|
.dijitBorderContainerNoGutterPane {
|
|
position: absolute !important;
|
|
z-index: 2;
|
|
}
|
|
.dijitBorderContainer > .dijitTextArea {
|
|
resize: none;
|
|
}
|
|
.dijitGutter {
|
|
position: absolute;
|
|
font-size: 1px;
|
|
}
|
|
.dijitSplitter {
|
|
position: absolute;
|
|
overflow: hidden;
|
|
z-index: 10;
|
|
background-color: #fff;
|
|
border-color: gray;
|
|
border-style: solid;
|
|
border-width: 0;
|
|
}
|
|
.dj_ie .dijitSplitter {
|
|
z-index: 1;
|
|
}
|
|
.dijitSplitterActive {
|
|
z-index: 11 !important;
|
|
}
|
|
.dijitSplitterCover {
|
|
position:absolute;
|
|
z-index:-1;
|
|
top:0;
|
|
left:0;
|
|
width:100%;
|
|
height:100%;
|
|
}
|
|
.dijitSplitterCoverActive {
|
|
z-index:3 !important;
|
|
}
|
|
.dj_ie .dijitSplitterCover {
|
|
background: white;
|
|
filter: alpha(opacity=0);
|
|
}
|
|
.dijitSplitterH {
|
|
height: 7px;
|
|
border-top:1px;
|
|
border-bottom:1px;
|
|
cursor: row-resize;
|
|
}
|
|
.dijitSplitterV {
|
|
width: 7px;
|
|
border-left:1px;
|
|
border-right:1px;
|
|
cursor: col-resize;
|
|
}
|
|
.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;
|
|
-moz-opacity: 0.5;
|
|
opacity: 0.5;
|
|
filter: Alpha(Opacity=50);
|
|
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;
|
|
}
|
|
.dijitContentPane {
|
|
display: block;
|
|
overflow: auto;
|
|
}
|
|
.dijitContentPaneSingleChild {
|
|
overflow: hidden;
|
|
}
|
|
.dijitContentPaneLoading .dijitIconLoading,
|
|
.dijitContentPaneError .dijitIconError {
|
|
margin-right: 9px;
|
|
}
|
|
.dijitTitlePane {
|
|
display: block;
|
|
overflow: hidden;
|
|
}
|
|
.dijitTitlePaneTitle {
|
|
cursor: pointer;
|
|
}
|
|
.dijitFixedOpen, .dijitFixedClosed {
|
|
cursor: default;
|
|
}
|
|
.dijitFixedOpen .dijitArrowNode, .dijitFixedOpen .dijitArrowNodeInner,
|
|
.dijitFixedClosed .dijitArrowNode, .dijitFixedClosed .dijitArrowNodeInner{
|
|
display: none;
|
|
}
|
|
.dijitTitlePaneTitle * {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTitlePane .dijitArrowNodeInner {
|
|
display: none;
|
|
}
|
|
.dj_a11y .dijitTitlePane .dijitArrowNodeInner {
|
|
display:inline !important;
|
|
font-family: monospace;
|
|
}
|
|
.dj_a11y .dijitTitlePane .dijitArrowNode {
|
|
display:none;
|
|
}
|
|
.dj_ie6 .dijitTitlePaneContentOuter,
|
|
.dj_ie6 .dijitTitlePane .dijitTitlePaneTitle {
|
|
zoom: 1;
|
|
}
|
|
.dijitColorPalette {
|
|
border: 1px solid #999;
|
|
background: #fff;
|
|
position: relative;
|
|
}
|
|
.dijitColorPalette .dijitPaletteTable {
|
|
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 {
|
|
padding: 0;
|
|
margin: 2px 3px 3px 3px;
|
|
}
|
|
.dijitColorPalette .dijitPaletteCell {
|
|
font-size: 1px;
|
|
vertical-align: middle;
|
|
text-align: center;
|
|
background: none;
|
|
}
|
|
.dijitColorPalette .dijitPaletteImg {
|
|
padding: 1px;
|
|
border: 1px solid #999;
|
|
margin: 2px 1px;
|
|
cursor: default;
|
|
font-size: 1px;
|
|
}
|
|
.dj_gecko .dijitColorPalette .dijitPaletteImg {
|
|
padding-bottom: 0;
|
|
}
|
|
.dijitColorPalette .dijitColorPaletteSwatch {
|
|
width: 14px;
|
|
height: 12px;
|
|
}
|
|
.dijitPaletteTable td {
|
|
padding: 0;
|
|
}
|
|
.dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg {
|
|
border: 1px solid #000;
|
|
}
|
|
.dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg,
|
|
.dijitColorPalette .dijitPaletteTable .dijitPaletteCellSelected .dijitPaletteImg {
|
|
border: 2px solid #000;
|
|
margin: 1px 0;
|
|
}
|
|
.dj_a11y .dijitColorPalette .dijitPaletteTable,
|
|
.dj_a11y .dijitColorPalette .dijitPaletteTable * {
|
|
background-color: transparent !important;
|
|
}
|
|
.dijitAccordionContainer {
|
|
border:1px solid #b7b7b7;
|
|
border-top:0 !important;
|
|
}
|
|
.dijitAccordionTitle {
|
|
cursor: pointer;
|
|
}
|
|
.dijitAccordionTitleSelected {
|
|
cursor: default;
|
|
}
|
|
.dijitAccordionTitle .arrowTextUp,
|
|
.dijitAccordionTitle .arrowTextDown {
|
|
display: none;
|
|
}
|
|
.dj_a11y .dijitAccordionTitle .arrowTextUp,
|
|
.dj_a11y .dijitAccordionTitleSelected .arrowTextDown {
|
|
display: inline;
|
|
}
|
|
.dj_a11y .dijitAccordionTitleSelected .arrowTextUp {
|
|
display: none;
|
|
}
|
|
.dijitAccordionChildWrapper {
|
|
overflow: hidden;
|
|
}
|
|
.dijitCalendarContainer {
|
|
width: auto;
|
|
}
|
|
.dijitCalendarContainer th, .dijitCalendarContainer td {
|
|
padding: 1px 2px 2px;
|
|
vertical-align: middle;
|
|
}
|
|
.dijitCalendarYearLabel {
|
|
white-space: nowrap;
|
|
}
|
|
.dijitCalendarNextYear {
|
|
margin:0 0 0 0.55em;
|
|
}
|
|
.dijitCalendarPreviousYear {
|
|
margin:0 0.55em 0 0;
|
|
}
|
|
.dijitCalendarIncrementControl {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitCalendarIncrementControl,
|
|
.dijitCalendarDateTemplate,
|
|
.dijitCalendarMonthLabel,
|
|
.dijitCalendarPreviousYear,
|
|
.dijitCalendarNextYear {
|
|
cursor: pointer;
|
|
}
|
|
.dijitCalendarDisabledDate {
|
|
color: gray;
|
|
text-decoration: line-through;
|
|
cursor: default;
|
|
}
|
|
.dijitSpacer {
|
|
position: relative;
|
|
height: 1px;
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
}
|
|
.dijitCalendarMonthMenu .dijitCalendarMonthLabel {
|
|
text-align:center;
|
|
}
|
|
.dijitMenu {
|
|
border:1px solid black;
|
|
background-color:white;
|
|
}
|
|
.dijitMenuTable {
|
|
border-collapse:collapse;
|
|
border-width:0;
|
|
background-color:white;
|
|
}
|
|
.dj_webkit .dijitMenuTable td[colspan="2"]{
|
|
border-right:hidden;
|
|
}
|
|
.dijitMenuItem {
|
|
text-align: left;
|
|
white-space: nowrap;
|
|
padding:.1em .2em;
|
|
cursor:pointer;
|
|
}
|
|
.dijitMenuItem:focus {
|
|
outline: none
|
|
}
|
|
.dijitMenuPassive .dijitMenuItemHover,
|
|
.dijitMenuItemSelected {
|
|
background-color:black;
|
|
color:white;
|
|
}
|
|
.dijitMenuItemIcon, .dijitMenuExpand {
|
|
background-repeat: no-repeat;
|
|
}
|
|
.dijitMenuItemDisabled * {
|
|
/* flat theme styles disabled menu items */
|
|
/*opacity:0.5;*/
|
|
cursor:default;
|
|
}
|
|
.dj_ie .dj_a11y .dijitMenuItemDisabled,
|
|
.dj_ie .dj_a11y .dijitMenuItemDisabled *,
|
|
.dj_ie .dijitMenuItemDisabled * {
|
|
color: gray;
|
|
filter: alpha(opacity=35);
|
|
}
|
|
.dijitMenuItemLabel {
|
|
position: relative;
|
|
vertical-align: middle;
|
|
}
|
|
.dj_a11y .dijitMenuItemSelected {
|
|
border: 1px dotted black !important;
|
|
}
|
|
.dj_a11y .dijitMenuItemSelected .dijitMenuItemLabel {
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
}
|
|
.dj_ie8 .dj_a11y .dijitMenuItemLabel {
|
|
position:static;
|
|
}
|
|
.dijitMenuExpandA11y {
|
|
display: none;
|
|
}
|
|
.dj_a11y .dijitMenuExpandA11y {
|
|
display: inline;
|
|
}
|
|
.dijitMenuSeparator td {
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
.dijitMenuSeparatorTop {
|
|
height: 50%;
|
|
margin: 0;
|
|
margin-top:3px;
|
|
font-size: 1px;
|
|
}
|
|
.dijitMenuSeparatorBottom {
|
|
height: 50%;
|
|
margin: 0;
|
|
margin-bottom:3px;
|
|
font-size: 1px;
|
|
}
|
|
.dijitCheckedMenuItemIconChar {
|
|
vertical-align: middle;
|
|
visibility:hidden;
|
|
}
|
|
.dijitCheckedMenuItemChecked .dijitCheckedMenuItemIconChar {
|
|
visibility: visible;
|
|
}
|
|
.dj_a11y .dijitCheckedMenuItemIconChar {
|
|
display:inline !important;
|
|
}
|
|
.dj_a11y .dijitCheckedMenuItemIcon {
|
|
display: none;
|
|
}
|
|
.dj_ie .dj_a11y .dijitMenuBar .dijitMenuItem {
|
|
|
|
margin: 0;
|
|
}
|
|
.dijitStackController .dijitToggleButtonChecked * {
|
|
cursor: default;
|
|
}
|
|
.dijitTabContainer {
|
|
z-index: 0;
|
|
overflow: visible;
|
|
}
|
|
.dj_ie6 .dijitTabContainer {
|
|
overflow: hidden;
|
|
}
|
|
.dijitTabContainerNoLayout {
|
|
width: 100%;
|
|
}
|
|
.dijitTabContainerBottom-tabs,
|
|
.dijitTabContainerTop-tabs,
|
|
.dijitTabContainerLeft-tabs,
|
|
.dijitTabContainerRight-tabs {
|
|
z-index: 1;
|
|
overflow: visible !important;
|
|
}
|
|
.dijitTabController {
|
|
z-index: 1;
|
|
}
|
|
.dijitTabContainerBottom-container,
|
|
.dijitTabContainerTop-container,
|
|
.dijitTabContainerLeft-container,
|
|
.dijitTabContainerRight-container {
|
|
z-index:0;
|
|
overflow: hidden;
|
|
border: 1px solid black;
|
|
}
|
|
.nowrapTabStrip {
|
|
width: 50000px;
|
|
display: block;
|
|
position: relative;
|
|
text-align: left;
|
|
z-index: 1;
|
|
}
|
|
.dijitTabListWrapper {
|
|
overflow: hidden;
|
|
z-index: 1;
|
|
}
|
|
.dj_a11y .tabStripButton img {
|
|
display: none;
|
|
}
|
|
.dijitTabContainerTop-tabs {
|
|
border-bottom: 1px solid black;
|
|
}
|
|
.dijitTabContainerTop-container {
|
|
border-top: 0;
|
|
}
|
|
.dijitTabContainerLeft-tabs {
|
|
border-right: 1px solid black;
|
|
float: left;
|
|
}
|
|
.dijitTabContainerLeft-container {
|
|
border-left: 0;
|
|
}
|
|
.dijitTabContainerBottom-tabs {
|
|
border-top: 1px solid black;
|
|
}
|
|
.dijitTabContainerBottom-container {
|
|
border-bottom: 0;
|
|
}
|
|
.dijitTabContainerRight-tabs {
|
|
border-left: 1px solid black;
|
|
float: left;
|
|
}
|
|
.dijitTabContainerRight-container {
|
|
border-right: 0;
|
|
}
|
|
div.dijitTabDisabled, .dj_ie div.dijitTabDisabled {
|
|
cursor: auto;
|
|
}
|
|
.dijitTab {
|
|
position:relative;
|
|
cursor:pointer;
|
|
white-space:nowrap;
|
|
z-index:3;
|
|
}
|
|
.dijitTab * {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTabChecked {
|
|
cursor: default;
|
|
}
|
|
.dijitTabContainerTop-tabs .dijitTab {
|
|
top: 1px;
|
|
}
|
|
.dijitTabContainerBottom-tabs .dijitTab {
|
|
top: -1px;
|
|
}
|
|
.dijitTabContainerLeft-tabs .dijitTab {
|
|
left: 1px;
|
|
}
|
|
.dijitTabContainerRight-tabs .dijitTab {
|
|
left: -1px;
|
|
}
|
|
.dijitTabContainerTop-tabs .dijitTab,
|
|
.dijitTabContainerBottom-tabs .dijitTab {
|
|
display:inline-block;
|
|
#zoom: 1;
|
|
#display:inline;
|
|
}
|
|
.tabStripButton {
|
|
z-index: 12;
|
|
}
|
|
.dijitTabButtonDisabled .tabStripButton {
|
|
display: none;
|
|
}
|
|
.dijitTabCloseButton {
|
|
margin-left: 1em;
|
|
}
|
|
.dijitTabCloseText {
|
|
display:none;
|
|
}
|
|
.dijitTab .tabLabel {
|
|
/*min-height: 16px;*/
|
|
display: inline-block;
|
|
}
|
|
.dijitNoIcon {
|
|
display: none;
|
|
}
|
|
.dj_ie6 .dijitTab .dijitNoIcon {
|
|
display: inline;
|
|
height: 15px;
|
|
width: 1px;
|
|
}
|
|
.dj_a11y .dijitTabCloseButton {
|
|
background-image: none !important;
|
|
width: auto !important;
|
|
height: auto !important;
|
|
}
|
|
.dj_a11y .dijitTabCloseText {
|
|
display: inline;
|
|
}
|
|
.dijitTabPane,
|
|
.dijitStackContainer-child,
|
|
.dijitAccordionContainer-child {
|
|
border: none !important;
|
|
}
|
|
.dijitInlineEditBoxDisplayMode {
|
|
border: 1px solid transparent;
|
|
cursor: text;
|
|
}
|
|
.dj_a11y .dijitInlineEditBoxDisplayMode,
|
|
.dj_ie6 .dijitInlineEditBoxDisplayMode {
|
|
border: none;
|
|
}
|
|
.dijitInlineEditBoxDisplayModeHover,
|
|
.dj_a11y .dijitInlineEditBoxDisplayModeHover,
|
|
.dj_ie6 .dijitInlineEditBoxDisplayModeHover {
|
|
background-color: #e2ebf2;
|
|
border: solid 1px black;
|
|
}
|
|
.dijitInlineEditBoxDisplayModeDisabled {
|
|
cursor: default;
|
|
}
|
|
.dijitTree {
|
|
overflow: auto;
|
|
}
|
|
.dijitTreeContainer {
|
|
float: left;
|
|
}
|
|
.dijitTreeIndent {
|
|
width: 19px;
|
|
}
|
|
.dijitTreeRow, .dijitTreeContent {
|
|
white-space: nowrap;
|
|
}
|
|
.dj_ie .dijitTreeLabel:focus {
|
|
outline: 1px dotted black;
|
|
}
|
|
.dijitTreeRow img {
|
|
vertical-align: middle;
|
|
}
|
|
.dijitTreeContent {
|
|
cursor: default;
|
|
}
|
|
.dijitExpandoText {
|
|
display: none;
|
|
}
|
|
.dj_a11y .dijitExpandoText {
|
|
display: inline;
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
font-family: monospace;
|
|
border-style: solid;
|
|
border-width: thin;
|
|
cursor: pointer;
|
|
}
|
|
.dijitTreeLabel {
|
|
margin: 0 4px;
|
|
}
|
|
.dijitDialog {
|
|
position: absolute;
|
|
z-index: 999;
|
|
overflow: hidden;
|
|
}
|
|
.dijitDialogTitleBar {
|
|
cursor: move;
|
|
}
|
|
.dijitDialogFixed .dijitDialogTitleBar {
|
|
cursor:default;
|
|
}
|
|
.dijitDialogCloseIcon {
|
|
cursor: pointer;
|
|
}
|
|
.dijitDialogPaneContent {
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
.dijitDialogUnderlayWrapper {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 998;
|
|
display: none;
|
|
background: transparent !important;
|
|
}
|
|
.dijitDialogUnderlay {
|
|
background: #eee;
|
|
opacity: 0.5;
|
|
}
|
|
.dj_ie .dijitDialogUnderlay {
|
|
filter: alpha(opacity=50);
|
|
}
|
|
.dj_a11y .dijitSpinnerButtonContainer,
|
|
.dj_a11y .dijitDialog {
|
|
opacity: 1 !important;
|
|
background-color: white !important;
|
|
}
|
|
.dijitDialog .closeText {
|
|
/*display:none;*/
|
|
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
|
|
display: block;
|
|
color: #000000;
|
|
text-shadow: 0 1px 0 #FFFFFF;
|
|
position:absolute;
|
|
}
|
|
.dj_a11y .dijitDialog .closeText {
|
|
display:inline;
|
|
}
|
|
.dijitSliderMoveable {
|
|
z-index:99;
|
|
position:absolute !important;
|
|
display:block;
|
|
vertical-align:middle;
|
|
}
|
|
.dijitSliderMoveableH {
|
|
right:0;
|
|
}
|
|
.dijitSliderMoveableV {
|
|
right:50%;
|
|
}
|
|
.dj_a11y div.dijitSliderImageHandle,
|
|
.dijitSliderImageHandle {
|
|
margin:0;
|
|
padding:0;
|
|
position:relative !important;
|
|
border:8px solid gray;
|
|
width:0;
|
|
height:0;
|
|
cursor: pointer;
|
|
}
|
|
.dj_iequirks .dj_a11y .dijitSliderImageHandle {
|
|
font-size: 0;
|
|
}
|
|
.dj_ie7 .dijitSliderImageHandle {
|
|
overflow: hidden;
|
|
}
|
|
.dj_ie7 .dj_a11y .dijitSliderImageHandle {
|
|
overflow: visible;
|
|
}
|
|
.dj_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;
|
|
vertical-align:top;
|
|
text-align:left;
|
|
}
|
|
.dijitSliderProgressBarH {
|
|
position:absolute !important;
|
|
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;
|
|
}
|
|
.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;
|
|
}
|
|
.dijitSliderDecorationC,
|
|
.dijitSliderDecorationV {
|
|
position: relative;
|
|
}
|
|
.dijitSliderDecorationH {
|
|
width: 100%;
|
|
}
|
|
.dijitSliderDecorationV {
|
|
height: 100%;
|
|
white-space: nowrap;
|
|
}
|
|
.dijitSliderButton {
|
|
font-family:monospace;
|
|
margin:0;
|
|
padding:0;
|
|
display:block;
|
|
}
|
|
.dj_a11y .dijitSliderButtonInner {
|
|
visibility:visible !important;
|
|
}
|
|
.dijitSliderButtonContainer {
|
|
text-align:center;
|
|
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;
|
|
}
|
|
.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 {
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
}
|
|
.dijitRuleMarkV {
|
|
height:0;
|
|
border-right-width:0 !important;
|
|
/*border-bottom-width:0 !important;*/
|
|
border-left-width:0 !important;
|
|
width:100%;
|
|
left:0;
|
|
}
|
|
.dj_ie .dijitRuleLabelContainerV {
|
|
margin-top:-.55em;
|
|
}
|
|
.dj_a11y .dijitSliderReadOnly,
|
|
.dj_a11y .dijitSliderDisabled {
|
|
opacity:0.6;
|
|
}
|
|
.dj_ie .dj_a11y .dijitSliderReadOnly .dijitSliderBar,
|
|
.dj_ie .dj_a11y .dijitSliderDisabled .dijitSliderBar {
|
|
filter: alpha(opacity=40);
|
|
}
|
|
.dj_a11y .dijitSlider .dijitSliderButtonContainer div {
|
|
font-family: monospace;
|
|
font-size: 1em;
|
|
line-height: 1em;
|
|
height: auto;
|
|
width: auto;
|
|
margin: 0 4px;
|
|
}
|
|
.dj_a11y .dijitButtonContents .dijitButtonText,
|
|
.dj_a11y .dijitTab .tabLabel {
|
|
display: inline !important;
|
|
}
|
|
.dj_a11y .dijitSelect .dijitButtonText {
|
|
display: inline-block !important;
|
|
}
|
|
.dijitSelectError .dijitButtonContents .dijitButtonText {
|
|
display: none !important;
|
|
}
|
|
.dijitTextArea {
|
|
width:100%;
|
|
overflow-y: auto;
|
|
}
|
|
.dijitTextArea[cols] {
|
|
width:auto;
|
|
}
|
|
.dj_ie .dijitTextAreaCols {
|
|
width:auto;
|
|
}
|
|
.dijitExpandingTextArea {
|
|
|
|
resize: none;
|
|
}
|
|
.dijitToolbarSeparator {
|
|
height: 18px;
|
|
width: 5px;
|
|
padding: 0 1px;
|
|
margin: 0;
|
|
}
|
|
.dijitIEFixedToolbar {
|
|
position:absolute;
|
|
top: expression(eval((document.documentElement||document.body).scrollTop));
|
|
}
|
|
.dijitEditor {
|
|
display: block;
|
|
}
|
|
.dijitEditorDisabled,
|
|
.dijitEditorReadOnly {
|
|
color: gray;
|
|
}
|
|
.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;
|
|
cursor:pointer;
|
|
}
|
|
.dijitTimePickerItemDisabled {
|
|
color:gray;
|
|
text-decoration:line-through;
|
|
}
|
|
.dj_a11y .dijitTimePickerItemSelected .dijitTimePickerItemInner {
|
|
border: solid 4px black;
|
|
}
|
|
.dj_a11y .dijitTimePickerItemHover .dijitTimePickerItemInner {
|
|
border: dashed 4px black;
|
|
}
|
|
.dijitToggleButtonIconChar {
|
|
|
|
display:none !important;
|
|
}
|
|
.dj_a11y .dijitToggleButton .dijitToggleButtonIconChar {
|
|
display:inline !important;
|
|
visibility:hidden;
|
|
}
|
|
.dj_ie6 .dijitToggleButtonIconChar, .dj_ie6 .tabStripButton .dijitButtonText {
|
|
font-family: "Arial Unicode MS";
|
|
}
|
|
.dj_a11y .dijitToggleButtonChecked .dijitToggleButtonIconChar {
|
|
display: inline !important;
|
|
visibility:visible !important;
|
|
}
|
|
.dijitArrowButtonChar {
|
|
display:none !important;
|
|
}
|
|
.dj_a11y .dijitArrowButtonChar {
|
|
display:inline !important;
|
|
}
|
|
.dj_a11y .dijitDropDownButton .dijitArrowButtonInner,
|
|
.dj_a11y .dijitComboButton .dijitArrowButtonInner {
|
|
display:none !important;
|
|
}
|
|
.dj_a11y .dijitSelect {
|
|
border-collapse: separate !important;
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
}
|
|
.dj_ie .dijitSelect {
|
|
vertical-align: middle;
|
|
}
|
|
.dj_ie6 .dijitSelect .dijitValidationContainer,
|
|
.dj_ie8 .dijitSelect .dijitButtonText {
|
|
vertical-align: top;
|
|
}
|
|
.dj_ie6 .dijitTextBox .dijitInputContainer,
|
|
.dj_iequirks .dijitTextBox .dijitInputContainer,
|
|
.dj_ie6 .dijitTextBox .dijitArrowButtonInner,
|
|
.dj_ie6 .dijitSpinner .dijitSpinnerButtonInner,
|
|
.dijitSelect .dijitSelectLabel {
|
|
vertical-align: baseline;
|
|
}
|
|
.dijitNumberTextBox {
|
|
text-align: left;
|
|
direction: ltr;
|
|
}
|
|
.dijitNumberTextBox .dijitInputInner {
|
|
text-align: inherit;
|
|
}
|
|
.dijitToolbar .dijitSelect {
|
|
margin: 0;
|
|
}
|
|
.dj_webkit .dijitToolbar .dijitSelect {
|
|
padding-left: 0.3em;
|
|
}
|
|
.dijitSelect .dijitButtonContents {
|
|
padding: 0;
|
|
white-space: nowrap;
|
|
text-align: left;
|
|
border-style: none solid none none;
|
|
border-width: 0px;
|
|
}
|
|
.dijitSelectFixedWidth .dijitButtonContents {
|
|
width: 100%;
|
|
}
|
|
.dijitSelectMenu .dijitMenuItemIcon {
|
|
display:none;
|
|
}
|
|
.dj_ie6 .dijitSelectMenu .dijitMenuItemLabel,
|
|
.dj_ie7 .dijitSelectMenu .dijitMenuItemLabel {
|
|
position: static;
|
|
}
|
|
.dijitSelectLabel *
|
|
{
|
|
vertical-align: baseline;
|
|
}
|
|
.dijitSelectSelectedOption * {
|
|
font-weight: normal;
|
|
}
|
|
.dijitSelectMenu {
|
|
border-width: 1px;
|
|
}
|
|
.dijitSelectMenu .dijitMenuTable {
|
|
margin: 0;
|
|
background-color: transparent;
|
|
}
|
|
.dijitForceStatic {
|
|
position: static !important;
|
|
}
|
|
.dijitReadOnly *,
|
|
.dijitDisabled *,
|
|
.dijitReadOnly,
|
|
.dijitDisabled {
|
|
cursor: default;
|
|
}
|
|
.dojoDndItem {
|
|
padding: 2px;
|
|
-webkit-touch-callout: none;
|
|
-webkit-user-select: none;
|
|
}
|
|
.dojoDndHorizontal .dojoDndItem {
|
|
#display: inline;
|
|
display: inline-block;
|
|
}
|
|
.dojoDndItemBefore,
|
|
.dojoDndItemAfter {
|
|
border: 0px solid #369;
|
|
}
|
|
.dojoDndItemBefore {
|
|
border-width: 2px 0 0 0;
|
|
padding: 0 2px 2px 2px;
|
|
}
|
|
.dojoDndItemAfter {
|
|
border-width: 0 0 2px 0;
|
|
padding: 2px 2px 0 2px;
|
|
}
|
|
.dojoDndHorizontal .dojoDndItemBefore {
|
|
border-width: 0 0 0 2px;
|
|
padding: 2px 2px 2px 0;
|
|
}
|
|
.dojoDndHorizontal .dojoDndItemAfter {
|
|
border-width: 0 2px 0 0;
|
|
padding: 2px 0 2px 2px;
|
|
}
|
|
.dojoDndItemOver {
|
|
cursor:pointer;
|
|
}
|
|
.dj_gecko .dijitArrowButtonInner INPUT,
|
|
.dj_gecko INPUT.dijitArrowButtonInner {
|
|
-moz-user-focus:ignore;
|
|
}
|
|
.dijitFocused .dijitMenuItemShortcutKey {
|
|
text-decoration: underline;
|
|
}
|
|
.dijitRtl .dijitOffScreen {
|
|
/* align on the right side rather than the left so no horizontal scroll bar shown */
|
|
left: auto !important;
|
|
right: -10000px !important;
|
|
}
|
|
|
|
.dijitRtl .dijitPlaceHolder {
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
|
|
/* Menu */
|
|
|
|
.dijitMenuItemRtl {
|
|
text-align: right;
|
|
}
|
|
|
|
/* Button */
|
|
|
|
.dj_iequirks .dijitComboButtonRtl button {
|
|
/* workaround bug where label invisible (themeTesterQuirk.html?dir=rtl) */
|
|
float:left;
|
|
}
|
|
.dj_ie .dijitTextBoxRtl .dijitInputContainer {
|
|
clear: right;
|
|
}
|
|
|
|
/* TextBox, ComboBox, Spinner */
|
|
|
|
.dijitTextBoxRtl .dijitValidationContainer,
|
|
.dijitTextBoxRtl .dijitSpinnerButtonContainer,
|
|
.dijitComboBoxRtl .dijitArrowButtonContainer {
|
|
/* combobox and spinner: line between the input area and the drop down button */
|
|
border-right-width: 1px !important;
|
|
border-left-width: 0 !important;
|
|
}
|
|
|
|
.dijitSpinnerRtl .dijitSpinnerButtonContainer .dijitArrowButton {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
.dijitSelectRtl .dijitButtonText {
|
|
float: right;
|
|
}
|
|
|
|
.dijitTextBoxRtl .dijitSpinnerButtonContainer,
|
|
.dijitValidationTextBoxRtl .dijitValidationContainer,
|
|
.dijitTextBoxRtl .dijitArrowButtonContainer {
|
|
float: left;
|
|
}
|
|
|
|
div.dijitNumberTextBoxRtl {
|
|
text-align: right;
|
|
}
|
|
|
|
/* Calendar */
|
|
|
|
.dijitCalendarRtl .dijitCalendarNextYear {
|
|
margin:0 0.55em 0 0;
|
|
}
|
|
|
|
.dijitCalendarRtl .dijitCalendarPreviousYear {
|
|
margin:0 0 0 0.55em;
|
|
}
|
|
|
|
|
|
/* Slider */
|
|
|
|
.dijitSliderRtl .dijitSliderImageHandleV {
|
|
left:auto;
|
|
}
|
|
|
|
.dijitSliderRtl .dijitSliderImageHandleH {
|
|
left:-50%;
|
|
}
|
|
|
|
.dijitSliderRtl .dijitSliderMoveableH {
|
|
right:auto;
|
|
left:0;
|
|
}
|
|
|
|
.dijitSliderRtl .dijitRuleContainerV {
|
|
float:right;
|
|
}
|
|
|
|
.dj_ie .dijitSliderRtl .dijitRuleContainerV {
|
|
text-align:right;
|
|
}
|
|
|
|
.dj_ie .dijitSliderRtl .dijitRuleLabelV {
|
|
text-align:left;
|
|
}
|
|
|
|
.dj_ie .dijitSliderRtl .dijitRuleLabelH {
|
|
zoom:1;
|
|
}
|
|
|
|
.dijitSliderRtl .dijitSliderProgressBarH {
|
|
/* workarounds for IE and FF */
|
|
float:right;
|
|
right:0;
|
|
left:auto;
|
|
}
|
|
|
|
/* ContentPane*/
|
|
|
|
.dijitRtl .dijitContentPaneLoading .dijitIconLoading,
|
|
.dijitRtl .dijitContentPaneError .dijitIconError {
|
|
margin-right: 0;
|
|
margin-left: 9px;
|
|
}
|
|
|
|
/* TabContainer */
|
|
|
|
.dijitTabControllerRtl .nowrapTabStrip {
|
|
text-align: right; /* just in case ancestor has non-standard setting */
|
|
}
|
|
.dijitTabRtl .dijitTabCloseButton {
|
|
margin-left: 0;
|
|
margin-right: 1em;
|
|
}
|
|
.dj_ie6 .dijitTabRtl .tabLabel,
|
|
.dj_ie6 .dijitTabContainerRight-tabs .dijitTabRtl,
|
|
.dj_ie6 .dijitTabContainerLeft-tabs .dijitTabRtl,
|
|
.dj_ie7 .dijitTabContainerRight-tabs .dijitTabRtl,
|
|
.dj_ie7 .dijitTabContainerLeft-tabs .dijitTabRtl {
|
|
zoom: 1;
|
|
}
|
|
.dj_ie6 .dijitTabContainerRight-tabs .dijitTabRtl,
|
|
.dj_ie7 .dijitTabContainerRight-tabs .dijitTabRtl {
|
|
left: 0;
|
|
}
|
|
|
|
.dj_ie6 .dijitTabContainerRightRtl .dijitTabContainerRight-tabs,
|
|
.dj_ie6 .dijitTabContainerLeftRtl .dijitTabContainerLeft-tabs {
|
|
/* otherwise tab labels invisible */
|
|
width: 1%;
|
|
}
|
|
|
|
/* TimePicker */
|
|
.dj_ie .dijitTimePickerRtl .dijitTimePickerItem {
|
|
width:100%;
|
|
}
|
|
|
|
|
|
/* ColorPalette */
|
|
.dijitColorPaletteRtl .dijitColorPaletteUnder {
|
|
/* needed in RTL mode when DropDownButton expands the ColorPalette beyond it's natural width */
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
|
|
/* Select */
|
|
.dijitSelectRtl .dijitButtonContents {
|
|
border-style: none none none solid;
|
|
text-align: right;
|
|
}
|
|
|
|
/* Tree */
|
|
|
|
.dijitTreeRtl .dijitTreeContainer {
|
|
float: right; /* for correct highlighting during horizontal scroll, see #16132 */
|
|
}
|
|
|
|
/* DnD
|
|
* These rules should apply for containers that are dir=rtl (either set directly, or inherited)
|
|
* but seems the best we can do is look for .dijitRtl on an ancestor node.
|
|
*/
|
|
.dijitRtl .dojoDndHorizontal .dojoDndItemBefore {
|
|
border-width: 0 2px 0 0;
|
|
padding: 2px 0 2px 2px;
|
|
}
|
|
.dijitRtl .dojoDndHorizontal .dojoDndItemAfter {
|
|
border-width: 0 0 0 2px;
|
|
padding: 2px 2px 2px 0;
|
|
}
|