index.less 2.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. @import "../styles/mixins/index.less";
  2. @import "../styles/themes/index.less";
  3. .dialog-button-style(@theme, @color) {
  4. &--@{theme} {
  5. color: @color !important;
  6. }
  7. }
  8. .@{wux-prefix}-dialog {
  9. &__button {
  10. .button-reset();
  11. display: block;
  12. flex: 1;
  13. color: @balanced !important;
  14. position: relative;
  15. .dialog-button-style(default, @dark);
  16. .dialog-button-style(primary, @balanced);
  17. .dialog-button-style(light, @light-inverse);
  18. .dialog-button-style(stable, @stable-inverse);
  19. .dialog-button-style(positive, @positive);
  20. .dialog-button-style(calm, @calm);
  21. .dialog-button-style(assertive, @assertive);
  22. .dialog-button-style(balanced, @balanced);
  23. .dialog-button-style(energized, @energized);
  24. .dialog-button-style(royal, @royal);
  25. .dialog-button-style(dark, @dark);
  26. &--bold {
  27. font-weight: 500 !important;
  28. }
  29. &--hover {
  30. background-color: @active-state-bg !important;
  31. }
  32. &--disabled {
  33. opacity: @disabled-opacity;
  34. }
  35. }
  36. &__prompt {
  37. position: relative;
  38. margin-top: 10px;
  39. &::after {
  40. .hairline(@border-color-split);
  41. border-top-width: @border-width-base;
  42. border-right-width: @border-width-base;
  43. border-bottom-width: @border-width-base;
  44. border-left-width: @border-width-base;
  45. border-radius: @border-radius-lg;
  46. }
  47. }
  48. &__input {
  49. padding: 4px 6px;
  50. height: 36px;
  51. line-height: 1;
  52. width: 100%;
  53. text-align: left;
  54. box-sizing: border-box;
  55. }
  56. &__buttons {
  57. display: flex;
  58. flex: 1;
  59. &--horizontal {
  60. .@{wux-prefix}-dialog__button {
  61. &::after {
  62. .setLeftLine(@border-color-split);
  63. }
  64. &:first-child::after {
  65. display: none;
  66. }
  67. }
  68. }
  69. &--vertical {
  70. display: block;
  71. height: auto;
  72. .@{wux-prefix}-dialog__button {
  73. &::after {
  74. .setTopLine(@border-color-split);
  75. }
  76. }
  77. }
  78. }
  79. }