summaryrefslogtreecommitdiff
path: root/lib/viewers/odf/editor/dijit/themes/claro/Menu.less
diff options
context:
space:
mode:
Diffstat (limited to 'lib/viewers/odf/editor/dijit/themes/claro/Menu.less')
-rw-r--r--lib/viewers/odf/editor/dijit/themes/claro/Menu.less179
1 files changed, 179 insertions, 0 deletions
diff --git a/lib/viewers/odf/editor/dijit/themes/claro/Menu.less b/lib/viewers/odf/editor/dijit/themes/claro/Menu.less
new file mode 100644
index 0000000..9f4f860
--- /dev/null
+++ b/lib/viewers/odf/editor/dijit/themes/claro/Menu.less
@@ -0,0 +1,179 @@
+/* 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
+
+*/
+
+@import "variables";
+
+.claro .dijitMenuBar {
+ border: 1px solid @border-color;
+ margin: 0;
+ padding: 0;
+ background-color: @bar-background-color;
+ .standard-gradient;
+}
+
+.claro .dijitMenu {
+ background-color:@menu-background-color;
+ border: 1px solid @popup-border-color;
+
+ /* so adjoining borders of MenuBar/ComboBox and Menu overlap, avoiding double border */
+ margin: -1px 0;
+}
+.dj_ie6 .claro .dijitMenu {
+ margin: 0; /* above -1px makes top/bottom borders disappear on IE6 */
+}
+
+.claro .dijitMenuItem {
+ color: @text-color;
+}
+.claro .dijitMenuBar .dijitMenuItem {
+ padding: 6px 10px 7px;
+ margin:-1px;
+}
+.claro .dijitMenuBar .dijitMenuItemHover,
+.claro .dijitMenuBar .dijitMenuItemSelected {
+ // on hover or selection of MenuBar item, add border and reduce padding to compensate
+ border:solid 1px @hovered-border-color;
+ padding: 5px 9px 6px;
+}
+
+/* this prevents jiggling upon hover of a menu item */
+.claro .dijitMenuTable {
+ border-collapse:separate;
+ border-spacing:0 0;
+ padding:0;
+}
+.claro .dijitMenuItem td{
+ padding:1px;
+}
+/* hover over a MenuItem or MenuBarItem */
+.claro .dijitSelectMenu .dijitMenuItemHover td,
+.claro .dijitSelectMenu .dijitMenuItemSelected td,
+.claro .dijitMenuItemHover,
+.claro .dijitMenuItemSelected {
+ // note: seems like the selected MenuItem should use @pressed-background-color
+ // and .active-gradient, but claro didn't to that
+ background-color: @hovered-background-color;
+ .standard-gradient;
+}
+.claro .dijitMenuItemActive {
+ // todo: seems like the selected MenuItem should come here
+ // todo: seems like should use @pressed-background-color
+ .active-gradient;
+}
+.dj_ie .claro .dijitMenuActive .dijitMenuItemHover,
+.dj_ie .claro .dijitMenuActive .dijitMenuItemSelected,
+.dj_ie .claro .dijitMenuPassive .dijitMenuItemHover,
+.dj_ie .claro .dijitMenuPassive .dijitMenuItemSelected {
+ // Selectivity set to override ComboBox rules below.
+ // If this rule isn't present, on IE6 hovering an item in the ComboBox drop down causes two
+ // items to be highlighted (except when hovering the first item in the list)
+ padding-top: 6px;
+ padding-bottom: 5px;
+ margin-top: -3px;
+}
+
+.claro td.dijitMenuItemIconCell {
+ padding: 2px;
+ margin: 0 0 0 4px;
+}
+.claro td.dijitMenuItemLabel {
+ padding-top: 5px;
+ padding-bottom: 5px;
+}
+.claro .dijitMenuExpand {
+ width: 7px;
+ height: 7px;
+ background-image: url(@image-arrow-sprite);
+ background-position: -14px 0;
+ margin-right:3px;
+}
+.claro .dijitMenuItemDisabled .dijitMenuItemIconCell {
+ opacity:1;
+}
+.claro .dijitMenuSeparatorTop {
+ height: auto;
+ margin-top:1px; /* prevents spacing above/below separator */
+ border-bottom: 1px solid @border-color
+}
+.claro .dijitMenuSeparatorBottom{
+ height: auto;
+ margin-bottom:1px;
+}
+/* the checked menu item */
+.claro .dijitCheckedMenuItemIconChar {
+ display: none;
+}
+.claro .dijitCheckedMenuItemIcon {
+ background-image: url(@image-form-checkbox-and-radios);
+ background-repeat:no-repeat;
+ background-position: -15px 50%;
+ width:15px;
+ height:16px;
+}
+.dj_ie6 .claro .dijitCheckedMenuItemIcon {
+ background-image: url(@image-form-checkbox-and-radios-ie6);
+}
+.claro .dijitCheckedMenuItemChecked .dijitCheckedMenuItemIcon {
+ background-position: 0 50%;
+}
+
+/*ComboBox Menu*/
+.claro .dijitComboBoxMenu {
+ margin-left:0;
+ background-image: none;
+}
+
+.claro .dijitSelectMenu .dijitMenuItem td,
+.claro .dijitComboBoxMenu .dijitMenuItem {
+ padding: @textbox-padding; // Make drop down menu text line up with text in <input>.
+ border-width:1px 0 1px 0;
+ border-style:solid;
+ border-color: @select-dropdownitem-background-color;
+}
+.claro .dijitSelectMenu .dijitMenuItemSelected td,
+.claro .dijitComboBoxMenu .dijitMenuItemSelected {
+ color:@selected-text-color;
+ border-color:@hovered-border-color;
+ background-color:@hovered-background-color;
+}
+.claro .dijitSelectMenu .dijitMenuItemHover td,
+.claro .dijitComboBoxMenu .dijitMenuItemHover {
+ color: #000000;
+ border-color: #769dc0;
+ background-color: #abd6ff;
+}
+.claro .dijitComboBoxMenuActive .dijitMenuItemSelected {
+ background-color: @select-dropdownitem-hovered-background-color; /* TODO: why is this a different color than normal .dijitMenuItemSelected? */
+}
+.claro .dijitMenuPreviousButton, .claro .dijitMenuNextButton {
+ font-style: italic;
+}