X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/resources/themes/stylesheets/ext4/default/widgets/_menu.scss diff --git a/resources/themes/stylesheets/ext4/default/widgets/_menu.scss b/resources/themes/stylesheets/ext4/default/widgets/_menu.scss new file mode 100644 index 00000000..53b970e2 --- /dev/null +++ b/resources/themes/stylesheets/ext4/default/widgets/_menu.scss @@ -0,0 +1,180 @@ +/** + * @class Ext.menu.* + */ +@mixin extjs-menu { + .#{$prefix}menu-body { + @include no-select; + background: $menu-background-color !important; + padding: $menu-padding; + } + + .#{$prefix}menu-icon-separator { + position: absolute; + top: 0px; + left: $menu-item-indent; + z-index: 0; + border-left: solid 1px $menu-separator-border-color; + background-color: $menu-separator-background-color; + width: 2px; + height: 100%; + overflow: hidden; + } + + .#{$prefix}menu-plain { + .#{$prefix}menu-icon-separator { + display: none; + } + } + + .#{$prefix}menu-focus { + display: block; + position: absolute; + top: -10px; + left: -10px; + width: 0px; + height: 0px; + } + + .#{$prefix}menu-item { + white-space: nowrap; + overflow: hidden; + z-index: 1; + } + + .#{$prefix}menu-item-cmp { + margin-bottom: 1px; + } + + .#{$prefix}menu-item-link { + display: block; + padding: 0px $menu-padding; + margin: 1px; + text-decoration: none !important; + line-height: 16px; + cursor: default; + } + + @if $include-opera { + .#{$prefix}opera { + // Opera 10.5 absolute positioning of submenu arrow has issues + // This will fix it, and not affect newer Operas + .#{$prefix}menu-item-link { + position: relative; + } + } + } + + .#{$prefix}menu-item-icon { + width: 16px; + height: 16px; + margin: 4px 11px 0px 2px; + background: no-repeat center center; + } + + .#{$prefix}menu-item-text { + position: relative; + font-size: ceil($font-size * .9); + color: $menu-text-color; + top: -4px; + } + + .#{$prefix}menu-item-checked { + .#{$prefix}menu-item-icon { + background-image: theme-image($theme-name, $menu-icon-checked); + } + .#{$prefix}menu-group-icon { + background-image: theme-image($theme-name, $menu-icon-group-checked); + } + } + + .#{$prefix}menu-item-unchecked { + .#{$prefix}menu-item-icon { + background-image: theme-image($theme-name, $menu-icon-unchecked); + } + .#{$prefix}menu-group-icon { + background-image: none; + } + } + + .#{$prefix}menu-item-separator { + height: 2px; + border-top: solid 1px $menu-separator-border-color; + background-color: $menu-separator-background-color; + margin: $menu-padding 0px; + overflow: hidden; + } + + .#{$prefix}menu-item-arrow { + position: absolute; + width: 12px; + height: 9px; + top: 9px; + right: 0px; + background: theme-image($theme-name, $menu-icon-arrow) no-repeat center center; + } + + .#{$prefix}menu-item-indent { + margin-left: $menu-item-indent + $menu-padding + 2px; /* The 2px is the width of the seperator */ + } + + .#{$prefix}menu-item-active { + cursor: pointer; + + .#{$prefix}menu-item-link { + @include background-gradient($menu-item-active-background-color, 'matte'); + margin: 0px; + border: 1px solid $menu-item-active-border-color; + cursor: pointer; + } + } + + .#{$prefix}menu-item-disabled { + @include opacity(.5); + } + + @if $include-ie { + .#{$prefix}ie { + .#{$prefix}menu-item-link { + line-height: 17px; + padding-bottom: 1px; + } + + .#{$prefix}menu-item-disabled { + .#{$prefix}menu-item-icon { + @include opacity(.5); + } + + .#{$prefix}menu-item-text { + // IE opacity/cleartype bug workaround + background-color: $menu-background-color; + } + } + + .#{$prefix}strict & { + .#{$prefix}menu-icon-separator { + width: 1px; + } + + .#{$prefix}menu-item-separator { + height: 1px; + } + } + } + + .#{$prefix}ie6, + .#{$prefix}ie7, + .#{$prefix}quirks .#{$prefix}ie8 { + .#{$prefix}menu-item-link { + padding-bottom: $menu-padding; + } + } + } + + @if not $supports-gradients or $compile-all { + .#{$prefix}nlg { + .#{$prefix}menu-item-active .#{$prefix}menu-item-link { + background: $menu-item-active-background-color theme-image($theme-name, $menu-item-active-background-image) repeat-x left top; + } + } + } +}