Skip to content

Commit eefb9cb

Browse files
committed
MAGETWO-46052: Wish Lists UI issues
1 parent bf4e733 commit eefb9cb

File tree

4 files changed

+50
-200
lines changed

4 files changed

+50
-200
lines changed

app/design/frontend/Magento/blank/Magento_MultipleWishlist/web/css/source/_module.less

Lines changed: 9 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -30,21 +30,21 @@
3030
@_dropdown-split-list-min-width: 200px
3131
);
3232
vertical-align: middle;
33+
&:extend(.abs-dropdown-items-new all);
3334

3435
.items {
3536
text-align: left;
36-
}
37-
38-
.items .item:last-child {
39-
background: @color-gray-darken1;
37+
.item {
38+
&:last-child {
39+
background: @color-gray-darken1;
4040

41-
&:hover {
42-
.lib-css(background, @dropdown-list-item__hover);
41+
&:hover {
42+
.lib-css(background, @dropdown-list-item__hover);
43+
}
44+
}
4345
}
4446
}
4547

46-
&:extend(.abs-dropdown-items-new all);
47-
4848
.table-comparison &,
4949
.product-items & {
5050
> .action {
@@ -93,9 +93,6 @@
9393
margin-bottom: @indent__s;
9494

9595
> .action {
96-
&.split {
97-
}
98-
9996
&.toggle {
10097
padding: 4px @indent__xs;
10198
}
@@ -134,22 +131,13 @@
134131
font-weight: @font-weight__semibold;
135132
&:extend(.abs-colon all);
136133
}
137-
138-
&-current {
139-
}
140134
}
135+
141136
&-items {
142137
&:extend(.abs-reset-list all);
143-
144-
&.active {
145-
}
146138
}
147139
}
148140

149-
&-add.item {
150-
.action {
151-
}
152-
}
153141
// Wish list name
154142
&-title {
155143
margin-bottom: @indent__s;
@@ -158,21 +146,12 @@
158146
font-weight: @font-weight__light;
159147
margin-right: @indent__s;
160148
}
161-
162-
.action.edit {
163-
}
164-
}
165-
// Wish list info
166-
&-info {
167149
}
168150

169151
&-notice {
170152
.lib-css(color, @text__color__muted);
171153
display: inline-block;
172154
margin-right: @indent__base;
173-
174-
&.private {
175-
}
176155
}
177156

178157
// Wish list toolbar
@@ -185,9 +164,6 @@
185164
&-select {
186165
margin-right: @indent__base;
187166
}
188-
189-
&-actions {
190-
}
191167
}
192168
// Wish list toolbar actions
193169
&-dropdown.move {
@@ -299,12 +275,6 @@
299275

300276
.wishlist-name {
301277
&:extend(.abs-toggling-title-mobile all);
302-
303-
&-label {
304-
}
305-
306-
&-current {
307-
}
308278
}
309279

310280
&-items {
@@ -352,36 +322,19 @@
352322
strong {
353323
.lib-font-size(26);
354324
}
355-
.action.edit {
356-
}
357325
}
358326

359327
// Wish list info
360328
&-info {
361329
margin-bottom: 15px;
362330
}
363331

364-
&-notice {
365-
&.private {
366-
}
367-
}
368-
369332
// Wish list toolbar
370333
&-toolbar {
371334
&-select,
372335
&-actions {
373336
margin-bottom: 15px;
374337
}
375-
376-
&-select {
377-
}
378-
379-
&-actions {
380-
}
381-
}
382-
383-
// Wish list toolbar actions
384-
&-dropdown.move {
385338
}
386339
}
387340
}
@@ -460,28 +413,13 @@
460413
vertical-align: top;
461414
white-space: nowrap;
462415
width: 5%;
463-
464-
span {
465-
}
466-
467-
&.active {
468-
}
469-
470-
&-label {
471-
}
472-
473-
&-current {
474-
}
475416
}
476417

477418
&-items {
478419
display: table-cell;
479420
padding-right: 160px;
480421
vertical-align: top;
481422

482-
&.active {
483-
}
484-
485423
.item {
486424
display: inline-block;
487425
margin-right: @indent__s;
@@ -514,38 +452,16 @@
514452
strong {
515453
.lib-font-size(40);
516454
}
517-
518-
.action.edit {
519-
}
520455
}
521456

522457
// Wish list info
523458
&-info {
524459
float: left;
525460
}
526461

527-
&-notice {
528-
&.private {
529-
}
530-
}
531-
532462
// Wish list toolbar
533463
&-toolbar {
534464
float: right;
535-
536-
&-select,
537-
&-actions {
538-
}
539-
540-
&-select {
541-
}
542-
543-
&-actions {
544-
}
545-
}
546-
547-
// Wish list toolbar actions
548-
&-dropdown.move {
549465
}
550466
}
551467
}

app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/module/_listings.less

Lines changed: 35 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,9 @@
1717
@product-name-link__text-decoration__hover: @link__hover__text-decoration;
1818
@product-name-link__text-decoration__visited: @link__hover__text-decoration;
1919

20+
@product-item__hover__background-color: @color-white;
21+
@product-item__hover__box-shadow: 3px 3px 4px 0 rgba(0, 0, 0, .3);
22+
2023
//
2124

2225
//
@@ -252,14 +255,13 @@
252255
.products-grid & {
253256
&:hover,
254257
&.active {
258+
.lib-css(background, @product-item__hover__background-color);
259+
.lib-css(box-shadow, @product-item__hover__box-shadow);
260+
border: 1px solid @color-gray-light2;
255261
margin: -10px;
256262
padding: 9px;
257-
border: 1px solid @color-gray-light2;
258-
@_shadow: 3px 3px 4px 0 rgba(0, 0, 0, .3);
259-
.lib-css(box-shadow, @_shadow);
260263
position: relative;
261264
z-index: 2;
262-
.lib-css(background, @color-white);
263265

264266
.product-item-inner {
265267
display: block;
@@ -270,17 +272,16 @@
270272

271273
.product-item-inner {
272274
.products-grid & {
273-
position: absolute;
275+
.lib-css(background, @product-item__hover__background-color);
276+
.lib-css(box-shadow, @product-item__hover__box-shadow);
277+
border: 1px solid @color-gray-light2;
278+
border-top: none;
274279
left: 0;
280+
margin: 9px 0 0 -1px;
281+
padding: 0 9px 9px;
282+
position: absolute;
275283
right: -1px;
276284
z-index: 2;
277-
.lib-css(background, @color-white);
278-
padding: 0 9px 9px 9px;
279-
margin: 9px 0 0 -1px;
280-
border: 1px solid @color-gray-light2;
281-
border-top: none;
282-
@_shadow: 3px 4px 4px 0 rgba(0, 0, 0, .3);
283-
.lib-css(box-shadow, @_shadow);
284285
}
285286
}
286287

@@ -308,6 +309,28 @@
308309
.actions-primary { display: table-cell; }
309310
}
310311

312+
.page-products {
313+
.products-grid {
314+
.product-item-inner {
315+
&:before {
316+
.lib-css(background, @product-item__hover__background-color);
317+
content: '';
318+
height: 3px;
319+
left: 0;
320+
position: absolute;
321+
top: -2px;
322+
width: 100%;
323+
z-index: 1;
324+
}
325+
}
326+
}
327+
328+
.product-item-actions {
329+
position: relative;
330+
z-index: 2;
331+
}
332+
}
333+
311334
.products-grid {
312335
.product-item-info {
313336
&:not(:hover) {

0 commit comments

Comments
 (0)