Skip to content

Commit 3e566c7

Browse files
author
Hwashiang Yu
committed
MC-5701: Slide Dots Are Hard To See Against Certain Backgrounds On Storefront
- Resolved less file static failures
1 parent 957a141 commit 3e566c7

File tree

2 files changed

+23
-16
lines changed
  • app/code/Magento/PageBuilder/view

2 files changed

+23
-16
lines changed

app/code/Magento/PageBuilder/view/adminhtml/web/css/source/content-type/slider/_default.less

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
// * See COPYING.txt for license details.
44
// */
55

6-
@ccc: #ccc;
76
@b3: #b3b3b3;
87

98
//

app/code/Magento/PageBuilder/view/frontend/web/css/source/slick/_slick.less

Lines changed: 23 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,26 @@
1-
/* Slider */
1+
// /**
2+
// * Copyright © Magento, Inc. All rights reserved.
3+
// * See COPYING.txt for license details.
4+
// */
5+
6+
@b3: #b3b3b3;
7+
8+
//
9+
// Slick slider styles
10+
// _____________________________________________
211

312
.slick-slider {
13+
-khtml-user-select: none;
14+
-moz-user-select: none;
15+
-ms-touch-action: pan-y;
16+
-ms-user-select: none;
17+
-webkit-tap-highlight-color: transparent;
18+
-webkit-touch-callout: none;
19+
-webkit-user-select: none;
420
box-sizing: border-box;
521
display: block;
622
position: relative;
7-
-webkit-tap-highlight-color: transparent;
8-
-ms-touch-action: pan-y;
923
touch-action: pan-y;
10-
-webkit-touch-callout: none;
11-
-webkit-user-select: none;
12-
-khtml-user-select: none;
13-
-moz-user-select: none;
14-
-ms-user-select: none;
1524
user-select: none;
1625
}
1726
.slick-list {
@@ -89,10 +98,10 @@
8998

9099
.slick-slider .slick-track,
91100
.slick-slider .slick-list {
92-
-webkit-transform: translate3d(0, 0, 0);
93101
-moz-transform: translate3d(0, 0, 0);
94102
-ms-transform: translate3d(0, 0, 0);
95103
-o-transform: translate3d(0, 0, 0);
104+
-webkit-transform: translate3d(0, 0, 0);
96105
transform: translate3d(0, 0, 0);
97106
}
98107

@@ -118,6 +127,8 @@
118127

119128
.slick-prev,
120129
.slick-next {
130+
-ms-transform: translate(0, -50%);
131+
-webkit-transform: translate(0, -50%);
121132
background: rgba(252, 252, 252, .6);
122133
border: none;
123134
border-radius: 0;
@@ -131,8 +142,6 @@
131142
padding: 0;
132143
position: absolute;
133144
top: 50%;
134-
-webkit-transform: translate(0, -50%);
135-
-ms-transform: translate(0, -50%);
136145
transform: translate(0, -50%);
137146
width: 60px;
138147
z-index: 101;
@@ -161,7 +170,6 @@
161170
opacity: 1;
162171
}
163172

164-
// Reset luma styles applied to all buttons
165173
&:active,
166174
&:focus,
167175
&:not(.primary) {
@@ -195,7 +203,7 @@
195203
width: 14px;
196204
button {
197205
background: @color-white;
198-
border: 1px solid #ccc;
206+
border: 1px solid @color-gray80;
199207
border-radius: 10px;
200208
box-shadow: none;
201209
cursor: pointer;
@@ -207,7 +215,7 @@
207215
width: 14px;
208216

209217
&:hover {
210-
border: 1px solid #b3b3b3;
218+
border: 1px solid @b3;
211219
}
212220

213221
&:active,
@@ -219,7 +227,7 @@
219227

220228
&.slick-active {
221229
button {
222-
background: #1c1918;
230+
background: @color-pagebuilder-darkest-gray;
223231
}
224232
}
225233
}

0 commit comments

Comments
 (0)