blob: 63fb236ec37b8da18b73f2ad33dc9ec49ac71515 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
|
@mixin flipOverlayDirection($itemsInRow) {
&:nth-child(#{$itemsInRow}n) {
.vsp-overlay-wrapper {
right: 74%;
left: inherit;
.vsp-overlay-arrow {
border-right-color: transparent;
border-left-color: $tlv-light-gray;
border-right-width: 2px;
border-left-width: 6px;
left: 100%;
&:after {
border-left-color: $white;
border-right-color: transparent;
left: -11px;
}
}
}
}
}
.catalog-tile.vendor-type {
position: relative;
.catalog-tile-top {
.catalog-tile-item-name {
margin-top: 21px;
line-height: inherit;
&:first-letter {
text-transform: capitalize;
}
}
.catalog-tile-vsp-count {
@extend .body-3-semibold;
margin-top: 8px;
margin-left: 54px;
margin-bottom: 9px;
color: $dark-gray;
border: 1px solid $dark-gray;
padding: 0 15px 0 15px;
border-radius: 15px;
&.clickable {
&:hover {
background-color: #eceff3;
color: $dark-gray;
}
}
&.active {
background-color: $white;
color: $dark-gray;
}
}
}
.catalog-tile-content {
flex-basis: auto;
max-height: 31px;
height: 31px;
text-align: center;
color: $blue;
display: block;
background-color: $white;
margin-bottom: 7px;
padding-bottom: 0px;
.create-new-vsp-button {
margin-top: 1px;
}
&:hover {
color: $dark-blue;
.svg-icon.plus {
fill: $dark-blue;
}
}
&.disabled {
cursor: default;
}
}
@media (min-width: 1900px) {
@include flipOverlayDirection($itemsInRow: 8);
}
@media (min-width: 1586px) and (max-width: 1899px) {
@include flipOverlayDirection($itemsInRow: 7);
}
@media (min-width: 1368px) and (max-width: 1585px) {
@include flipOverlayDirection($itemsInRow: 6);
}
@media (max-width: 1367px) {
@include flipOverlayDirection($itemsInRow: 5);
}
@import 'vspOverlay';
}
|
