123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183 |
- @mixin extjs-window {
- .#{$prefix}window {
- @extend .outline-none;
- }
- .#{$prefix}window-wrap {
- position: relative;
- }
- .#{$prefix}window-body {
- position: relative;
- overflow: hidden;
- // border-style: $window-body-border-style;
- }
- // Maximized window
- .#{$prefix}window-maximized {
- .#{$prefix}window-wrap {
- .#{$prefix}window-header {
- @include important-no-border-radius;
- }
- }
- }
- // Collapsed window header styles
- .#{$prefix}window-collapsed {
- .#{$prefix}window-header-vertical, .#{$prefix}window-header-horizontal {
- @include border-radius($window-border-radius);
- }
- // // Padding changes for collapsed headers.
- // .#{$prefix}window-header-left {
- // padding-right: $window-border-radius;
- // }
- // .#{$prefix}window-header-right {
- // padding-left: $window-border-radius;
- // }
- // .#{$prefix}window-header-top {
- // padding-bottom: $window-border-radius;
- // }
- // .#{$prefix}window-header-bottom {
- // padding-top: $window-border-radius;
- // }
- }
- .#{$prefix}window-header-left,
- .#{$prefix}window-header-right {
- .#{$prefix}vml-base {
- left: -3px !important;
- }
- }
- .#{$prefix}window-header-text {
- @extend .no-select;
- @extend .bigtext;
- white-space: nowrap;
- display: block;
- }
- .#{$prefix}window-body-plain {
- background: transparent;
- }
- .#{$prefix}window-header {
- .#{$prefix}window-header-body,
- .#{$prefix}window-header-body > .x-box-inner {
- overflow: visible;
- }
- }
- @include extjs-window-ui('default');
- }
- /**
- * @class Ext.Window
- * Used to create a visual theme for an Ext.Panel
- */
- @mixin extjs-window-ui(
- $ui-label,
- $ui-padding: null, // This was not set in @include above...
- $ui-border-radius: $window-border-radius,
- $ui-border-color: $window-border-color,
- $ui-inner-border-color: $window-inner-border-color,
- $ui-header-background-color: $window-base-color,
- $ui-header-color: $window-header-color,
- $ui-header-font-size: $window-header-font-size,
- $ui-header-font-weight: $window-header-font-weight,
- // $ui-body-border-color: $window-body-border-color,
- $ui-body-background-color: $window-body-background-color,
- $ui-body-color: $window-body-color,
- $ui-base-color: $window-base-color
- ){
- .#{$prefix}window-#{$ui-label} {
- border-color: $ui-border-color;
- @include border-radius($ui-border-radius);
- // @include background-image(linear-gradient(top, lighten($ui-base-color, 5%), darken($ui-base-color, 5%) 80px));
- // @if $include-panel-highlights {
- // @include inner-border($window-inner-border-width, $ui-inner-border-color);
- // }
- }
- // $ui-padding was never being set...
- @if $ui-border-radius != null {
- @include x-frame(
- 'window',
- $ui-label,
- $border-radius: $ui-border-radius,
- $border-width: $window-border-width,
- $padding: $ui-padding,
- $background-color: $ui-base-color
- );
- }
- // Window body
- .#{$prefix}window-body-#{$ui-label} {
- // border-color: $ui-body-border-color;
- // border-width: $window-body-border-width;
- background: $ui-body-background-color;
- color: $ui-body-color;
- }
- .#{$prefix}window-header-#{$ui-label} {
- border-color: $ui-border-color;
- padding: 8px 10px 8px 10px;
- @if ($include-window-highlights) {
- @include inset-by-background($ui-base-color);
- }
- // @tag iezoomhack
- @if $supports-gradients or $compile-all {
- @if $ui-header-background-color != null { @include background-image(linear-gradient(top, lighten($ui-header-background-color, 5%), $ui-header-background-color 100%)); }
- }
- }
- .#{$prefix}window-header-text-#{$ui-label} {
- color: $ui-header-color;
- font-weight: $ui-header-font-weight;
- line-height: 1.2em;
- font-size: $ui-header-font-size;
- }
- @if $ui-border-radius != null {
- .#{$prefix}window-header-#{$ui-label}-top {
- @include border-top-radius($ui-border-radius);
- }
- }
- @if $ui-border-radius != null {
- // @include x-frame('window-header', '#{$ui-label}-top', top($ui-border-radius) right($ui-border-radius) 0 0, $window-border-width, 5px 5px 0, $ui-base-color);
- // @include x-frame('window-header', '#{$ui-label}-right', 0 right($ui-border-radius) bottom($ui-border-radius) 0, $window-border-width, 5px 5px 5px 0, $ui-base-color);
- // @include x-frame('window-header', '#{$ui-label}-bottom', 0 0 bottom($ui-border-radius) left($ui-border-radius), $window-border-width, 0 5px 5px, $ui-base-color);
- // @include x-frame('window-header', '#{$ui-label}-left', top($ui-border-radius) 0 0 left($ui-border-radius), $window-border-width, 5px 0px 5px 5px, $ui-base-color);
- }
- @if $include-panel-highlights {
- // So much crud for inner borders...
- // .#{$prefix}window-header-#{$ui-label}-top {
- // @include inner-border(1px 1px 0, $ui-inner-border-color);
- // }
- // .#{$prefix}window-header-#{$ui-label}-right {
- // @include inner-border(1px 1px 1px 0, $ui-inner-border-color);
- // }
- // .#{$prefix}window-header-#{$ui-label}-bottom {
- // @include inner-border(0px 1px 1px, $ui-inner-border-color);
- // }
- // .#{$prefix}window-header-#{$ui-label}-left {
- // @include inner-border(1px 0 1px 1px, $ui-inner-border-color);
- // }
- }
- }
|