_loadmask.scss 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. /**
  2. * @class Ext.LoadMask
  3. * Component used to mask a component
  4. */
  5. .#{$prefix}mask {
  6. z-index: 100;
  7. position: absolute;
  8. top: 0;
  9. left: 0;
  10. @include opacity($mask-opacity);
  11. width: 100%;
  12. height: 100%;
  13. // @tag iezoomhack
  14. background: $mask-background;
  15. // @tag frameme
  16. }
  17. .#{$prefix}mask-msg {
  18. z-index: 20001;
  19. position: absolute;
  20. top: 0;
  21. left: 0;
  22. @include box-shadow(rgba(#000, .2) 0 1px 2px);
  23. padding: $loadmask-msg-padding;
  24. // border: 1px solid;
  25. // border-color: $loadmask-msg-border-color;
  26. @include border-radius(6px);
  27. @if $loadmask-msg-background-gradient {
  28. @if $supports-gradients or $compile-all {
  29. @include background-gradient($loadmask-base-color, $loadmask-msg-background-gradient);
  30. }
  31. } @else {
  32. background: $loadmask-base-color;
  33. }
  34. div {
  35. padding: $loadmask-msg-inner-padding;
  36. // if an icon is defined show it
  37. @if $loadmask-msg-inner-icon != null {
  38. background-image: theme-background-image($theme-name, $loadmask-msg-inner-icon);
  39. background-repeat: no-repeat;
  40. background-position: 5px center;
  41. }
  42. // @tag question Not a great effect...
  43. // cursor: wait;
  44. cursor: default;
  45. font-size: $loadmask-font-size;
  46. font-weight: bold;
  47. @include color-by-background($loadmask-base-color, $default-color: $base-color, $contrast: 30);
  48. }
  49. }