@mantine/carousel 7.0.2 → 7.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/cjs/index.css CHANGED
@@ -1,205 +1 @@
1
- .m-17884d0f {
2
- position: relative;
3
- }
4
-
5
- .m-a2dae653 {
6
- height: var(--carousel-height, auto);
7
- overflow: hidden;
8
- }
9
-
10
- .m-fcd81474 {
11
- display: flex;
12
- flex-direction: var(--_container-direction, row);
13
- height: var(--carousel-height, auto);
14
- margin-right: var(--_container-mr);
15
- margin-left: var(--_container-ml);
16
- margin-bottom: var(--_container-mb);
17
- }
18
-
19
- [data-include-gap-in-size] .m-fcd81474[data-orientation='vertical'] {
20
- --_container-mb: calc(var(--carousel-slide-gap) * -1);
21
- }
22
-
23
- [data-include-gap-in-size] .m-fcd81474[data-orientation='horizontal'] {
24
- --_container-mr: calc(var(--carousel-slide-gap) * -1);
25
- }
26
-
27
- [dir="rtl"] [data-include-gap-in-size] .m-fcd81474[data-orientation='horizontal'] {
28
- --_container-ml: calc(var(--carousel-slide-gap) * -1);
29
- --_container-mr: 0;
30
- }
31
-
32
- .m-fcd81474[data-orientation='vertical'] {
33
- --_container-direction: column;
34
- }
35
-
36
- .m-39bc3463 {
37
- position: absolute;
38
- display: flex;
39
- align-items: center;
40
- justify-content: space-between;
41
- z-index: 1;
42
- pointer-events: none;
43
- flex-direction: var(--_controls-direction);
44
- left: var(--_controls-left);
45
- right: var(--_controls-right);
46
- top: var(--_controls-top);
47
- bottom: var(--_controls-bottom);
48
- padding: var(--_controls-padding);
49
- }
50
-
51
- .m-17884d0f[data-orientation='vertical'] .m-39bc3463 {
52
- --_controls-left: calc(50% - var(--carousel-control-size) / 2);
53
- --_controls-top: 0;
54
- --_controls-bottom: 0;
55
- --_controls-direction: column;
56
- --_controls-padding: var(--carousel-controls-offset) 0;
57
- }
58
-
59
- .m-17884d0f[data-orientation='horizontal'] .m-39bc3463 {
60
- --_controls-left: 0;
61
- --_controls-right: 0;
62
- --_controls-top: calc(50% - var(--carousel-control-size) / 2);
63
- --_controls-direction: row;
64
- --_controls-padding: 0 var(--carousel-controls-offset);
65
- }
66
-
67
- .m-64f58e10 {
68
- display: flex;
69
- justify-content: center;
70
- align-items: center;
71
- min-width: var(--carousel-control-size);
72
- min-height: var(--carousel-control-size);
73
- border-radius: var(--carousel-control-size);
74
- pointer-events: all;
75
- background-color: var(--mantine-color-white);
76
- color: var(--mantine-color-black);
77
- box-shadow: var(--mantine-shadow-md);
78
- opacity: var(--_control-opacity);
79
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
80
- transition: opacity 100ms ease;
81
- }
82
-
83
- [data-mantine-color-scheme='light'] .m-64f58e10 {
84
- --_control-opacity: 0.85;
85
- }
86
-
87
- [data-mantine-color-scheme='dark'] .m-64f58e10 {
88
- --_control-opacity: 0.65;
89
- }
90
-
91
- @media (hover: hover) {
92
-
93
- .m-64f58e10:hover {
94
- --_control-opacity: 1;
95
- }
96
- }
97
-
98
- @media (hover: none) {
99
-
100
- .m-64f58e10:active {
101
- --_control-opacity: 1;
102
- }
103
- }
104
-
105
- .m-71ea3ab1 {
106
- position: absolute;
107
- display: flex;
108
- justify-content: center;
109
- gap: calc(0.5rem * var(--mantine-scale));
110
- pointer-events: none;
111
- flex-direction: var(--_indicators-direction);
112
- bottom: var(--_indicators-bottom);
113
- left: var(--_indicators-left);
114
- right: var(--_indicators-right);
115
- top: var(--_indicators-top);
116
- }
117
-
118
- .m-17884d0f[data-orientation='vertical'] .m-71ea3ab1 {
119
- --_indicators-bottom: 0;
120
- --_indicators-top: 0;
121
- --_indicators-right: var(--mantine-spacing-md);
122
- --_indicators-direction: column;
123
- }
124
-
125
- .m-17884d0f[data-orientation='horizontal'] .m-71ea3ab1 {
126
- --_indicators-bottom: var(--mantine-spacing-md);
127
- --_indicators-left: 0;
128
- --_indicators-right: 0;
129
- --_indicators-direction: row;
130
- }
131
-
132
- .m-eae68602 {
133
- pointer-events: all;
134
- width: var(--_indicator-width);
135
- height: var(--_indicator-height);
136
- border-radius: var(--mantine-radius-xl);
137
- box-shadow: var(--mantine-shadow-sm);
138
- opacity: var(--_indicator-opacity, 0.6);
139
- background-color: var(--mantine-color-white);
140
- }
141
-
142
- @media (hover: hover) {
143
-
144
- .m-eae68602:hover {
145
- --_indicator-opacity: 1;
146
- }
147
- }
148
-
149
- @media (hover: none) {
150
-
151
- .m-eae68602:active {
152
- --_indicator-opacity: 1;
153
- }
154
- }
155
-
156
- .m-eae68602[data-active] {
157
- --_indicator-opacity: 1;
158
- }
159
-
160
- .m-17884d0f[data-orientation='vertical'] .m-eae68602 {
161
- --_indicator-width: calc(0.3125rem * var(--mantine-scale));
162
- --_indicator-height: calc(1.5625rem * var(--mantine-scale));
163
- }
164
-
165
- .m-17884d0f[data-orientation='horizontal'] .m-eae68602 {
166
- --_indicator-width: calc(1.5625rem * var(--mantine-scale));
167
- --_indicator-height: calc(0.3125rem * var(--mantine-scale));
168
- }
169
-
170
- .m-d98df724 {
171
- position: relative;
172
- flex: 0 0 var(--carousel-slide-size);
173
- padding-right: var(--_slide-pr, 0);
174
- padding-left: var(--_slide-pl, 0);
175
- padding-bottom: var(--_slide-pb, 0);
176
- margin-right: var(--_slide-mr, 0);
177
- margin-left: var(--_slide-ml, 0);
178
- margin-bottom: var(--_slide-mb, 0);
179
- }
180
-
181
- .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation='vertical'] {
182
- --_slide-pb: var(--carousel-slide-gap);
183
- }
184
-
185
- .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation='horizontal'] {
186
- --_slide-pr: var(--carousel-slide-gap);
187
- }
188
-
189
- [dir="rtl"] .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation='horizontal'] {
190
- --_slide-pl: var(--carousel-slide-gap);
191
- --_slide-pr: 0;
192
- }
193
-
194
- .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation='vertical'] {
195
- --_slide-mb: var(--carousel-slide-gap);
196
- }
197
-
198
- .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation='horizontal'] {
199
- --_slide-mr: var(--carousel-slide-gap);
200
- }
201
-
202
- [dir="rtl"] .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation='horizontal'] {
203
- --_slide-ml: var(--carousel-slide-gap);
204
- --_slide-mr: 0;
205
- }
1
+ .m-17884d0f{position:relative}.m-a2dae653{overflow:hidden}.m-a2dae653,.m-fcd81474{height:var(--carousel-height,auto)}.m-fcd81474{display:flex;flex-direction:var(--_container-direction,row);margin-bottom:var(--_container-mb);margin-left:var(--_container-ml);margin-right:var(--_container-mr)}[data-include-gap-in-size] .m-fcd81474[data-orientation=vertical]{--_container-mb:calc(var(--carousel-slide-gap)*-1)}[data-include-gap-in-size] .m-fcd81474[data-orientation=horizontal]{--_container-mr:calc(var(--carousel-slide-gap)*-1)}[dir=rtl] [data-include-gap-in-size] .m-fcd81474[data-orientation=horizontal]{--_container-ml:calc(var(--carousel-slide-gap)*-1);--_container-mr:0}.m-fcd81474[data-orientation=vertical]{--_container-direction:column}.m-39bc3463{align-items:center;bottom:var(--_controls-bottom);display:flex;flex-direction:var(--_controls-direction);justify-content:space-between;left:var(--_controls-left);padding:var(--_controls-padding);pointer-events:none;position:absolute;right:var(--_controls-right);top:var(--_controls-top);z-index:1}.m-17884d0f[data-orientation=vertical] .m-39bc3463{--_controls-left:calc(50% - var(--carousel-control-size)/2);--_controls-top:0;--_controls-bottom:0;--_controls-direction:column;--_controls-padding:var(--carousel-controls-offset) 0}.m-17884d0f[data-orientation=horizontal] .m-39bc3463{--_controls-left:0;--_controls-right:0;--_controls-top:calc(50% - var(--carousel-control-size)/2);--_controls-direction:row;--_controls-padding:0 var(--carousel-controls-offset)}.m-64f58e10{align-items:center;background-color:var(--mantine-color-white);border:calc(.0625rem*var(--mantine-scale)) solid var(--mantine-color-gray-3);border-radius:var(--carousel-control-size);box-shadow:var(--mantine-shadow-md);color:var(--mantine-color-black);display:flex;justify-content:center;min-height:var(--carousel-control-size);min-width:var(--carousel-control-size);opacity:var(--_control-opacity);pointer-events:all;transition:opacity .1s ease}[data-mantine-color-scheme=light] .m-64f58e10{--_control-opacity:0.85}[data-mantine-color-scheme=dark] .m-64f58e10{--_control-opacity:0.65}@media (hover:hover){.m-64f58e10:hover{--_control-opacity:1}}@media (hover:none){.m-64f58e10:active{--_control-opacity:1}}.m-71ea3ab1{bottom:var(--_indicators-bottom);display:flex;flex-direction:var(--_indicators-direction);gap:calc(.5rem*var(--mantine-scale));justify-content:center;left:var(--_indicators-left);pointer-events:none;position:absolute;right:var(--_indicators-right);top:var(--_indicators-top)}.m-17884d0f[data-orientation=vertical] .m-71ea3ab1{--_indicators-bottom:0;--_indicators-top:0;--_indicators-right:var(--mantine-spacing-md);--_indicators-direction:column}.m-17884d0f[data-orientation=horizontal] .m-71ea3ab1{--_indicators-bottom:var(--mantine-spacing-md);--_indicators-left:0;--_indicators-right:0;--_indicators-direction:row}.m-eae68602{background-color:var(--mantine-color-white);border-radius:var(--mantine-radius-xl);box-shadow:var(--mantine-shadow-sm);height:var(--_indicator-height);opacity:var(--_indicator-opacity,.6);pointer-events:all;width:var(--_indicator-width)}@media (hover:hover){.m-eae68602:hover{--_indicator-opacity:1}}@media (hover:none){.m-eae68602:active{--_indicator-opacity:1}}.m-eae68602[data-active]{--_indicator-opacity:1}.m-17884d0f[data-orientation=vertical] .m-eae68602{--_indicator-width:calc(0.3125rem*var(--mantine-scale));--_indicator-height:calc(1.5625rem*var(--mantine-scale))}.m-17884d0f[data-orientation=horizontal] .m-eae68602{--_indicator-width:calc(1.5625rem*var(--mantine-scale));--_indicator-height:calc(0.3125rem*var(--mantine-scale))}.m-d98df724{flex:0 0 var(--carousel-slide-size);margin-bottom:var(--_slide-mb,0);margin-left:var(--_slide-ml,0);margin-right:var(--_slide-mr,0);padding-bottom:var(--_slide-pb,0);padding-left:var(--_slide-pl,0);padding-right:var(--_slide-pr,0);position:relative}.m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation=vertical]{--_slide-pb:var(--carousel-slide-gap)}.m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation=horizontal]{--_slide-pr:var(--carousel-slide-gap)}[dir=rtl] .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation=horizontal]{--_slide-pl:var(--carousel-slide-gap);--_slide-pr:0}.m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation=vertical]{--_slide-mb:var(--carousel-slide-gap)}.m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation=horizontal]{--_slide-mr:var(--carousel-slide-gap)}[dir=rtl] .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation=horizontal]{--_slide-ml:var(--carousel-slide-gap);--_slide-mr:0}
package/esm/index.css CHANGED
@@ -1,205 +1 @@
1
- .m-17884d0f {
2
- position: relative;
3
- }
4
-
5
- .m-a2dae653 {
6
- height: var(--carousel-height, auto);
7
- overflow: hidden;
8
- }
9
-
10
- .m-fcd81474 {
11
- display: flex;
12
- flex-direction: var(--_container-direction, row);
13
- height: var(--carousel-height, auto);
14
- margin-right: var(--_container-mr);
15
- margin-left: var(--_container-ml);
16
- margin-bottom: var(--_container-mb);
17
- }
18
-
19
- [data-include-gap-in-size] .m-fcd81474[data-orientation='vertical'] {
20
- --_container-mb: calc(var(--carousel-slide-gap) * -1);
21
- }
22
-
23
- [data-include-gap-in-size] .m-fcd81474[data-orientation='horizontal'] {
24
- --_container-mr: calc(var(--carousel-slide-gap) * -1);
25
- }
26
-
27
- [dir="rtl"] [data-include-gap-in-size] .m-fcd81474[data-orientation='horizontal'] {
28
- --_container-ml: calc(var(--carousel-slide-gap) * -1);
29
- --_container-mr: 0;
30
- }
31
-
32
- .m-fcd81474[data-orientation='vertical'] {
33
- --_container-direction: column;
34
- }
35
-
36
- .m-39bc3463 {
37
- position: absolute;
38
- display: flex;
39
- align-items: center;
40
- justify-content: space-between;
41
- z-index: 1;
42
- pointer-events: none;
43
- flex-direction: var(--_controls-direction);
44
- left: var(--_controls-left);
45
- right: var(--_controls-right);
46
- top: var(--_controls-top);
47
- bottom: var(--_controls-bottom);
48
- padding: var(--_controls-padding);
49
- }
50
-
51
- .m-17884d0f[data-orientation='vertical'] .m-39bc3463 {
52
- --_controls-left: calc(50% - var(--carousel-control-size) / 2);
53
- --_controls-top: 0;
54
- --_controls-bottom: 0;
55
- --_controls-direction: column;
56
- --_controls-padding: var(--carousel-controls-offset) 0;
57
- }
58
-
59
- .m-17884d0f[data-orientation='horizontal'] .m-39bc3463 {
60
- --_controls-left: 0;
61
- --_controls-right: 0;
62
- --_controls-top: calc(50% - var(--carousel-control-size) / 2);
63
- --_controls-direction: row;
64
- --_controls-padding: 0 var(--carousel-controls-offset);
65
- }
66
-
67
- .m-64f58e10 {
68
- display: flex;
69
- justify-content: center;
70
- align-items: center;
71
- min-width: var(--carousel-control-size);
72
- min-height: var(--carousel-control-size);
73
- border-radius: var(--carousel-control-size);
74
- pointer-events: all;
75
- background-color: var(--mantine-color-white);
76
- color: var(--mantine-color-black);
77
- box-shadow: var(--mantine-shadow-md);
78
- opacity: var(--_control-opacity);
79
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
80
- transition: opacity 100ms ease;
81
- }
82
-
83
- [data-mantine-color-scheme='light'] .m-64f58e10 {
84
- --_control-opacity: 0.85;
85
- }
86
-
87
- [data-mantine-color-scheme='dark'] .m-64f58e10 {
88
- --_control-opacity: 0.65;
89
- }
90
-
91
- @media (hover: hover) {
92
-
93
- .m-64f58e10:hover {
94
- --_control-opacity: 1;
95
- }
96
- }
97
-
98
- @media (hover: none) {
99
-
100
- .m-64f58e10:active {
101
- --_control-opacity: 1;
102
- }
103
- }
104
-
105
- .m-71ea3ab1 {
106
- position: absolute;
107
- display: flex;
108
- justify-content: center;
109
- gap: calc(0.5rem * var(--mantine-scale));
110
- pointer-events: none;
111
- flex-direction: var(--_indicators-direction);
112
- bottom: var(--_indicators-bottom);
113
- left: var(--_indicators-left);
114
- right: var(--_indicators-right);
115
- top: var(--_indicators-top);
116
- }
117
-
118
- .m-17884d0f[data-orientation='vertical'] .m-71ea3ab1 {
119
- --_indicators-bottom: 0;
120
- --_indicators-top: 0;
121
- --_indicators-right: var(--mantine-spacing-md);
122
- --_indicators-direction: column;
123
- }
124
-
125
- .m-17884d0f[data-orientation='horizontal'] .m-71ea3ab1 {
126
- --_indicators-bottom: var(--mantine-spacing-md);
127
- --_indicators-left: 0;
128
- --_indicators-right: 0;
129
- --_indicators-direction: row;
130
- }
131
-
132
- .m-eae68602 {
133
- pointer-events: all;
134
- width: var(--_indicator-width);
135
- height: var(--_indicator-height);
136
- border-radius: var(--mantine-radius-xl);
137
- box-shadow: var(--mantine-shadow-sm);
138
- opacity: var(--_indicator-opacity, 0.6);
139
- background-color: var(--mantine-color-white);
140
- }
141
-
142
- @media (hover: hover) {
143
-
144
- .m-eae68602:hover {
145
- --_indicator-opacity: 1;
146
- }
147
- }
148
-
149
- @media (hover: none) {
150
-
151
- .m-eae68602:active {
152
- --_indicator-opacity: 1;
153
- }
154
- }
155
-
156
- .m-eae68602[data-active] {
157
- --_indicator-opacity: 1;
158
- }
159
-
160
- .m-17884d0f[data-orientation='vertical'] .m-eae68602 {
161
- --_indicator-width: calc(0.3125rem * var(--mantine-scale));
162
- --_indicator-height: calc(1.5625rem * var(--mantine-scale));
163
- }
164
-
165
- .m-17884d0f[data-orientation='horizontal'] .m-eae68602 {
166
- --_indicator-width: calc(1.5625rem * var(--mantine-scale));
167
- --_indicator-height: calc(0.3125rem * var(--mantine-scale));
168
- }
169
-
170
- .m-d98df724 {
171
- position: relative;
172
- flex: 0 0 var(--carousel-slide-size);
173
- padding-right: var(--_slide-pr, 0);
174
- padding-left: var(--_slide-pl, 0);
175
- padding-bottom: var(--_slide-pb, 0);
176
- margin-right: var(--_slide-mr, 0);
177
- margin-left: var(--_slide-ml, 0);
178
- margin-bottom: var(--_slide-mb, 0);
179
- }
180
-
181
- .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation='vertical'] {
182
- --_slide-pb: var(--carousel-slide-gap);
183
- }
184
-
185
- .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation='horizontal'] {
186
- --_slide-pr: var(--carousel-slide-gap);
187
- }
188
-
189
- [dir="rtl"] .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation='horizontal'] {
190
- --_slide-pl: var(--carousel-slide-gap);
191
- --_slide-pr: 0;
192
- }
193
-
194
- .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation='vertical'] {
195
- --_slide-mb: var(--carousel-slide-gap);
196
- }
197
-
198
- .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation='horizontal'] {
199
- --_slide-mr: var(--carousel-slide-gap);
200
- }
201
-
202
- [dir="rtl"] .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation='horizontal'] {
203
- --_slide-ml: var(--carousel-slide-gap);
204
- --_slide-mr: 0;
205
- }
1
+ .m-17884d0f{position:relative}.m-a2dae653{overflow:hidden}.m-a2dae653,.m-fcd81474{height:var(--carousel-height,auto)}.m-fcd81474{display:flex;flex-direction:var(--_container-direction,row);margin-bottom:var(--_container-mb);margin-left:var(--_container-ml);margin-right:var(--_container-mr)}[data-include-gap-in-size] .m-fcd81474[data-orientation=vertical]{--_container-mb:calc(var(--carousel-slide-gap)*-1)}[data-include-gap-in-size] .m-fcd81474[data-orientation=horizontal]{--_container-mr:calc(var(--carousel-slide-gap)*-1)}[dir=rtl] [data-include-gap-in-size] .m-fcd81474[data-orientation=horizontal]{--_container-ml:calc(var(--carousel-slide-gap)*-1);--_container-mr:0}.m-fcd81474[data-orientation=vertical]{--_container-direction:column}.m-39bc3463{align-items:center;bottom:var(--_controls-bottom);display:flex;flex-direction:var(--_controls-direction);justify-content:space-between;left:var(--_controls-left);padding:var(--_controls-padding);pointer-events:none;position:absolute;right:var(--_controls-right);top:var(--_controls-top);z-index:1}.m-17884d0f[data-orientation=vertical] .m-39bc3463{--_controls-left:calc(50% - var(--carousel-control-size)/2);--_controls-top:0;--_controls-bottom:0;--_controls-direction:column;--_controls-padding:var(--carousel-controls-offset) 0}.m-17884d0f[data-orientation=horizontal] .m-39bc3463{--_controls-left:0;--_controls-right:0;--_controls-top:calc(50% - var(--carousel-control-size)/2);--_controls-direction:row;--_controls-padding:0 var(--carousel-controls-offset)}.m-64f58e10{align-items:center;background-color:var(--mantine-color-white);border:calc(.0625rem*var(--mantine-scale)) solid var(--mantine-color-gray-3);border-radius:var(--carousel-control-size);box-shadow:var(--mantine-shadow-md);color:var(--mantine-color-black);display:flex;justify-content:center;min-height:var(--carousel-control-size);min-width:var(--carousel-control-size);opacity:var(--_control-opacity);pointer-events:all;transition:opacity .1s ease}[data-mantine-color-scheme=light] .m-64f58e10{--_control-opacity:0.85}[data-mantine-color-scheme=dark] .m-64f58e10{--_control-opacity:0.65}@media (hover:hover){.m-64f58e10:hover{--_control-opacity:1}}@media (hover:none){.m-64f58e10:active{--_control-opacity:1}}.m-71ea3ab1{bottom:var(--_indicators-bottom);display:flex;flex-direction:var(--_indicators-direction);gap:calc(.5rem*var(--mantine-scale));justify-content:center;left:var(--_indicators-left);pointer-events:none;position:absolute;right:var(--_indicators-right);top:var(--_indicators-top)}.m-17884d0f[data-orientation=vertical] .m-71ea3ab1{--_indicators-bottom:0;--_indicators-top:0;--_indicators-right:var(--mantine-spacing-md);--_indicators-direction:column}.m-17884d0f[data-orientation=horizontal] .m-71ea3ab1{--_indicators-bottom:var(--mantine-spacing-md);--_indicators-left:0;--_indicators-right:0;--_indicators-direction:row}.m-eae68602{background-color:var(--mantine-color-white);border-radius:var(--mantine-radius-xl);box-shadow:var(--mantine-shadow-sm);height:var(--_indicator-height);opacity:var(--_indicator-opacity,.6);pointer-events:all;width:var(--_indicator-width)}@media (hover:hover){.m-eae68602:hover{--_indicator-opacity:1}}@media (hover:none){.m-eae68602:active{--_indicator-opacity:1}}.m-eae68602[data-active]{--_indicator-opacity:1}.m-17884d0f[data-orientation=vertical] .m-eae68602{--_indicator-width:calc(0.3125rem*var(--mantine-scale));--_indicator-height:calc(1.5625rem*var(--mantine-scale))}.m-17884d0f[data-orientation=horizontal] .m-eae68602{--_indicator-width:calc(1.5625rem*var(--mantine-scale));--_indicator-height:calc(0.3125rem*var(--mantine-scale))}.m-d98df724{flex:0 0 var(--carousel-slide-size);margin-bottom:var(--_slide-mb,0);margin-left:var(--_slide-ml,0);margin-right:var(--_slide-mr,0);padding-bottom:var(--_slide-pb,0);padding-left:var(--_slide-pl,0);padding-right:var(--_slide-pr,0);position:relative}.m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation=vertical]{--_slide-pb:var(--carousel-slide-gap)}.m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation=horizontal]{--_slide-pr:var(--carousel-slide-gap)}[dir=rtl] .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation=horizontal]{--_slide-pl:var(--carousel-slide-gap);--_slide-pr:0}.m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation=vertical]{--_slide-mb:var(--carousel-slide-gap)}.m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation=horizontal]{--_slide-mr:var(--carousel-slide-gap)}[dir=rtl] .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation=horizontal]{--_slide-ml:var(--carousel-slide-gap);--_slide-mr:0}
@@ -0,0 +1 @@
1
+ @layer mantine {.m-17884d0f{position:relative}.m-a2dae653{overflow:hidden}.m-a2dae653,.m-fcd81474{height:var(--carousel-height,auto)}.m-fcd81474{display:flex;flex-direction:var(--_container-direction,row);margin-bottom:var(--_container-mb);margin-left:var(--_container-ml);margin-right:var(--_container-mr)}[data-include-gap-in-size] .m-fcd81474[data-orientation=vertical]{--_container-mb:calc(var(--carousel-slide-gap)*-1)}[data-include-gap-in-size] .m-fcd81474[data-orientation=horizontal]{--_container-mr:calc(var(--carousel-slide-gap)*-1)}[dir=rtl] [data-include-gap-in-size] .m-fcd81474[data-orientation=horizontal]{--_container-ml:calc(var(--carousel-slide-gap)*-1);--_container-mr:0}.m-fcd81474[data-orientation=vertical]{--_container-direction:column}.m-39bc3463{align-items:center;bottom:var(--_controls-bottom);display:flex;flex-direction:var(--_controls-direction);justify-content:space-between;left:var(--_controls-left);padding:var(--_controls-padding);pointer-events:none;position:absolute;right:var(--_controls-right);top:var(--_controls-top);z-index:1}.m-17884d0f[data-orientation=vertical] .m-39bc3463{--_controls-left:calc(50% - var(--carousel-control-size)/2);--_controls-top:0;--_controls-bottom:0;--_controls-direction:column;--_controls-padding:var(--carousel-controls-offset) 0}.m-17884d0f[data-orientation=horizontal] .m-39bc3463{--_controls-left:0;--_controls-right:0;--_controls-top:calc(50% - var(--carousel-control-size)/2);--_controls-direction:row;--_controls-padding:0 var(--carousel-controls-offset)}.m-64f58e10{align-items:center;background-color:var(--mantine-color-white);border:calc(.0625rem*var(--mantine-scale)) solid var(--mantine-color-gray-3);border-radius:var(--carousel-control-size);box-shadow:var(--mantine-shadow-md);color:var(--mantine-color-black);display:flex;justify-content:center;min-height:var(--carousel-control-size);min-width:var(--carousel-control-size);opacity:var(--_control-opacity);pointer-events:all;transition:opacity .1s ease}[data-mantine-color-scheme=light] .m-64f58e10{--_control-opacity:0.85}[data-mantine-color-scheme=dark] .m-64f58e10{--_control-opacity:0.65}@media (hover:hover){.m-64f58e10:hover{--_control-opacity:1}}@media (hover:none){.m-64f58e10:active{--_control-opacity:1}}.m-71ea3ab1{bottom:var(--_indicators-bottom);display:flex;flex-direction:var(--_indicators-direction);gap:calc(.5rem*var(--mantine-scale));justify-content:center;left:var(--_indicators-left);pointer-events:none;position:absolute;right:var(--_indicators-right);top:var(--_indicators-top)}.m-17884d0f[data-orientation=vertical] .m-71ea3ab1{--_indicators-bottom:0;--_indicators-top:0;--_indicators-right:var(--mantine-spacing-md);--_indicators-direction:column}.m-17884d0f[data-orientation=horizontal] .m-71ea3ab1{--_indicators-bottom:var(--mantine-spacing-md);--_indicators-left:0;--_indicators-right:0;--_indicators-direction:row}.m-eae68602{background-color:var(--mantine-color-white);border-radius:var(--mantine-radius-xl);box-shadow:var(--mantine-shadow-sm);height:var(--_indicator-height);opacity:var(--_indicator-opacity,.6);pointer-events:all;width:var(--_indicator-width)}@media (hover:hover){.m-eae68602:hover{--_indicator-opacity:1}}@media (hover:none){.m-eae68602:active{--_indicator-opacity:1}}.m-eae68602[data-active]{--_indicator-opacity:1}.m-17884d0f[data-orientation=vertical] .m-eae68602{--_indicator-width:calc(0.3125rem*var(--mantine-scale));--_indicator-height:calc(1.5625rem*var(--mantine-scale))}.m-17884d0f[data-orientation=horizontal] .m-eae68602{--_indicator-width:calc(1.5625rem*var(--mantine-scale));--_indicator-height:calc(0.3125rem*var(--mantine-scale))}.m-d98df724{flex:0 0 var(--carousel-slide-size);margin-bottom:var(--_slide-mb,0);margin-left:var(--_slide-ml,0);margin-right:var(--_slide-mr,0);padding-bottom:var(--_slide-pb,0);padding-left:var(--_slide-pl,0);padding-right:var(--_slide-pr,0);position:relative}.m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation=vertical]{--_slide-pb:var(--carousel-slide-gap)}.m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation=horizontal]{--_slide-pr:var(--carousel-slide-gap)}[dir=rtl] .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation=horizontal]{--_slide-pl:var(--carousel-slide-gap);--_slide-pr:0}.m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation=vertical]{--_slide-mb:var(--carousel-slide-gap)}.m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation=horizontal]{--_slide-mr:var(--carousel-slide-gap)}[dir=rtl] .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation=horizontal]{--_slide-ml:var(--carousel-slide-gap);--_slide-mr:0}}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mantine/carousel",
3
3
  "description": "Embla based carousel",
4
- "version": "7.0.2",
4
+ "version": "7.1.0",
5
5
  "main": "./cjs/index.js",
6
6
  "types": "./lib/index.d.ts",
7
7
  "module": "./esm/index.mjs",
@@ -17,6 +17,7 @@
17
17
  }
18
18
  },
19
19
  "./styles.css": "./esm/index.css",
20
+ "./styles.layer.css": "./esm/index.layer.css",
20
21
  "./styles/*": "./esm/styles/*"
21
22
  },
22
23
  "license": "MIT",
@@ -44,8 +45,8 @@
44
45
  "slick"
45
46
  ],
46
47
  "peerDependencies": {
47
- "@mantine/core": "7.0.2",
48
- "@mantine/hooks": "7.0.2",
48
+ "@mantine/core": "7.1.0",
49
+ "@mantine/hooks": "7.1.0",
49
50
  "embla-carousel-react": "^7.0.0",
50
51
  "react": "^18.2.0"
51
52
  },