1 | @mixin next-button-size-rtl(
|
2 | $padding,
|
3 | $icon-margin,
|
4 | $icon-size,
|
5 | $corner
|
6 | ) {
|
7 | border-radius: $corner;
|
8 | & > #{$btn-prefix}-icon#{$btn-icon-prefix}-first {
|
9 | @include icon-size($icon-size, $icon-margin, 0);
|
10 | }
|
11 | & > #{$btn-prefix}-icon#{$btn-icon-prefix}-last {
|
12 | @include icon-size($icon-size, 0, $icon-margin);
|
13 | }
|
14 |
|
15 | &#{$btn-prefix}-loading {
|
16 | padding-left: $padding;
|
17 | padding-right: calc(#{$padding} + #{$icon-size} + #{$icon-margin});
|
18 |
|
19 | &:after {
|
20 | right: $padding;
|
21 | top: 50%;
|
22 | margin-right: 0;
|
23 | margin-left: $icon-margin;
|
24 | }
|
25 | }
|
26 | }
|
27 |
|
28 |
|
29 |
|
30 | #{$btn-prefix}-group[dir="rtl"] {
|
31 | > #{$btn-prefix} {
|
32 | float: right;
|
33 | }
|
34 |
|
35 | #{$btn-prefix}#{$btn-prefix} {
|
36 | margin: 0 -1px 0 0;
|
37 | }
|
38 |
|
39 | > #{$btn-prefix}:first-child:not(:last-child) {
|
40 | border-bottom-left-radius: 0;
|
41 | border-top-left-radius: 0;
|
42 | }
|
43 |
|
44 | > #{$btn-prefix}:last-child:not(:first-child) {
|
45 | border-bottom-right-radius: 0;
|
46 | border-top-right-radius: 0;
|
47 | }
|
48 |
|
49 | > #{$btn-prefix}-primary:not(:first-child) {
|
50 | border-right-color: rgba($color-white, .2);
|
51 |
|
52 | &:hover {
|
53 | border-right-color: transparent;
|
54 | }
|
55 | &.disabled,
|
56 | &[disabled] {
|
57 | border-right-color: $color-line1-1;
|
58 | }
|
59 | }
|
60 | }
|
61 |
|
62 |
|
63 |
|
64 |
|
65 | #{$btn-prefix}.#{$css-prefix} {
|
66 | &small[dir="rtl"] {
|
67 | @include next-button-size-rtl(
|
68 | $btn-size-s-padding,
|
69 | $btn-size-s-icon-margin,
|
70 | $btn-size-s-icon-size,
|
71 | $btn-size-s-corner
|
72 | );
|
73 | }
|
74 | &medium[dir="rtl"] {
|
75 | @include next-button-size-rtl(
|
76 | $btn-size-m-padding,
|
77 | $btn-size-m-icon-margin,
|
78 | $btn-size-m-icon-size,
|
79 | $btn-size-m-corner
|
80 | );
|
81 | }
|
82 | &large[dir="rtl"] {
|
83 | @include next-button-size-rtl(
|
84 | $btn-size-l-padding,
|
85 | $btn-size-l-icon-margin,
|
86 | $btn-size-l-icon-size,
|
87 | $btn-size-l-corner
|
88 | );
|
89 | }
|
90 | }
|
91 |
|
92 |
|
93 | #{$btn-prefix}-text[dir="rtl"] {
|
94 | &.#{$css-prefix}large {
|
95 | @include next-button-size-rtl(
|
96 | 0px,
|
97 | $btn-text-icon-l-margin,
|
98 | $btn-size-l-icon-size,
|
99 | 0
|
100 | );
|
101 | }
|
102 | &.#{$css-prefix}medium {
|
103 | @include next-button-size-rtl(
|
104 | 0px,
|
105 | $btn-text-icon-m-margin,
|
106 | $btn-size-m-icon-size,
|
107 | 0
|
108 | );
|
109 | }
|
110 | &.#{$css-prefix}small {
|
111 | @include next-button-size-rtl(
|
112 | 0px,
|
113 | $btn-text-icon-s-margin,
|
114 | $btn-size-s-icon-size,
|
115 | 0
|
116 | );
|
117 | }
|
118 | }
|
119 |
|