_extends.less 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. // /**
  2. // * Copyright © Magento, Inc. All rights reserved.
  3. // * See COPYING.txt for license details.
  4. // */
  5. //
  6. // Styles Extends
  7. // _____________________________________________
  8. //
  9. // Icons
  10. // ---------------------------------------------
  11. .abs-icon {
  12. -webkit-font-smoothing: antialiased;
  13. font-family: @icons-admin__font-name;
  14. font-style: normal;
  15. font-weight: normal;
  16. line-height: 1;
  17. speak: none;
  18. }
  19. //
  20. // Forms
  21. // ---------------------------------------------
  22. // Validation
  23. .validation-symbol {
  24. &:after {
  25. color: @validation__color;
  26. content: '*';
  27. font-weight: @font-weight__regular;
  28. margin-left: 3px;
  29. }
  30. }
  31. //
  32. // Modals
  33. // ---------------------------------------------
  34. .abs-modal-overlay {
  35. background: @popup-overlay__background-color;
  36. bottom: 0;
  37. left: 0;
  38. position: fixed;
  39. right: 0;
  40. top: 0;
  41. }
  42. //
  43. // Other
  44. // ---------------------------------------------
  45. // Visually hidden
  46. .abs-visually-hidden {
  47. .lib-visually-hidden();
  48. }
  49. .extend__visually-hidden() {
  50. &:extend(.abs-visually-hidden all);
  51. }
  52. // Revert visually hidden
  53. .abs-visually-hidden-reset {
  54. .lib-visually-hidden-reset();
  55. }
  56. .extend__visually-hidden-reset() {
  57. &:extend(.abs-visually-hidden-reset all);
  58. }
  59. // Clearfixes
  60. .abs-clearfix {
  61. .lib-clearfix();
  62. }
  63. // Clearer - clearing container using only :after element
  64. .abs-clearer {
  65. .lib-clearer();
  66. }
  67. .extend__clearer() {
  68. &:extend(.abs-clearer all);
  69. }
  70. .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
  71. .abs-clearer-mobile {
  72. .lib-clearer();
  73. }
  74. }
  75. // Reset list styles
  76. .abs-list-reset-styles {
  77. .lib-list-reset-styles();
  78. }
  79. .extend__list-reset-styles() {
  80. &:extend(.abs-list-reset-styles all);
  81. }
  82. // Draggable handle with an icon
  83. .abs-draggable-handle {
  84. cursor: -moz-grab;
  85. cursor: -webkit-grab;
  86. cursor: move;
  87. display: inline-block;
  88. font-size: 0;
  89. margin-top: -4px;
  90. padding: 0 @indent__s 0 0;
  91. vertical-align: middle;
  92. .lib-icon-font(
  93. @icon-gripper__content,
  94. @_icon-font: @icons-admin__font-name,
  95. @_icon-font-size: 1.8rem,
  96. @_icon-font-color: @color-gray62,
  97. @_icon-font-color-hover: @color-gray52
  98. );
  99. }
  100. .abs-config-scope-label {
  101. bottom: -1.3rem;
  102. color: @field-scope__color;
  103. content: attr(data-config-scope);
  104. font-size: 1.1rem;
  105. font-weight: @font-weight__regular;
  106. min-width: 15rem;
  107. position: absolute;
  108. right: 0;
  109. text-transform: lowercase;
  110. }
  111. // Word wrap
  112. .abs-word-wrap {
  113. .lib-wrap-words();
  114. }