index.scss 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. @import './../common/abstracts/_mixin.scss';
  2. @import './../common/abstracts/variable.scss';
  3. .wot-theme-dark {
  4. @include b(popup-wrapper) {
  5. :deep() {
  6. .wd-popup {
  7. background: $-dark-background2;
  8. }
  9. .wd-popup__close {
  10. color: $-dark-color;
  11. }
  12. }
  13. }
  14. }
  15. @include b(popup-wrapper) {
  16. :deep() {
  17. .wd-popup {
  18. position: fixed;
  19. max-height: 100%;
  20. overflow-y: auto;
  21. background: #fff;
  22. }
  23. }
  24. }
  25. @include b(popup) {
  26. @include edeep(close) {
  27. position: absolute;
  28. top: 10px;
  29. right: 10px;
  30. color: $-popup-close-color;
  31. font-size: $-popup-close-size;
  32. transform: rotate(-45deg);
  33. }
  34. @include mdeep(center) {
  35. left: 50%;
  36. top: 50%;
  37. transform: translate3d(-50%, -50%, 0);
  38. transform-origin: 0% 0%;
  39. &.wd-zoom-in-enter,
  40. &.wd-zoom-in-leave-to {
  41. transform: scale(0.8) translate3d(-50%, -50%, 0) !important;
  42. }
  43. @include when(deep) {
  44. &.wd-zoom-in-enter,
  45. &.wd-zoom-in-leave-to {
  46. transform: scale(0.1) translate3d(-50%, -50%, 0) !important;
  47. }
  48. }
  49. }
  50. @include mdeep(left) {
  51. top: 0;
  52. bottom: 0;
  53. left: 0;
  54. }
  55. @include mdeep(right) {
  56. top: 0;
  57. right: 0;
  58. bottom: 0;
  59. }
  60. @include mdeep(top) {
  61. top: 0;
  62. left: 0;
  63. right: 0;
  64. }
  65. @include mdeep(bottom) {
  66. right: 0;
  67. bottom: 0;
  68. left: 0;
  69. }
  70. }