Skip to content

Commit 1f5c3bf

Browse files
dedywahyudidedywahyudi
committed
improvement(reskin): lint spacing issue
1 parent 5e8eee9 commit 1f5c3bf

File tree

1 file changed

+119
-117
lines changed

1 file changed

+119
-117
lines changed

‎src/shared/components/SortingSelectBar/style.scss

Lines changed: 119 additions & 117 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
@import '~styles/mixins';
2+
23
$view-options-toggle-right-margin: $base-unit * 2;
34
$down-arrow-size: $base-unit;
45

@@ -46,144 +47,145 @@ $down-arrow-size: $base-unit;
4647
@include xs-to-md {
4748
margin-right: 16px;
4849
}
49-
:global {
50-
// 'Sort by' dropdown
51-
.Select {
52-
@include roboto-regular;
53-
}
5450

55-
.is-focused {
56-
font-weight: 700;
57-
}
51+
:global {
52+
// 'Sort by' dropdown
53+
.Select {
54+
@include roboto-regular;
55+
}
5856

59-
.Select-control {
60-
line-height: 12px;
61-
padding: 4px 35px 4px 10px;
62-
width: 208px;
63-
height: 40px;
64-
background-color: $tc-white;
65-
font-weight: 400;
66-
font-size: 12px;
67-
text-transform: none;
68-
border: 1px solid #aaa;
69-
color: $tc-gray-90;
70-
position: relative;
71-
overflow: hidden;
72-
box-sizing: border-box;
73-
}
57+
.is-focused {
58+
font-weight: 700;
59+
}
7460

75-
.Select-input {
76-
width: 100% !important;
77-
height: 0;
78-
padding: 0;
79-
opacity: 0;
80-
position: absolute;
81-
}
61+
.Select-control {
62+
line-height: 12px;
63+
padding: 4px 35px 4px 10px;
64+
width: 208px;
65+
height: 40px;
66+
background-color: $tc-white;
67+
font-weight: 400;
68+
font-size: 12px;
69+
text-transform: none;
70+
border: 1px solid #aaa;
71+
color: $tc-gray-90;
72+
position: relative;
73+
overflow: hidden;
74+
box-sizing: border-box;
75+
}
8276

83-
.Select--single > .Select-control .Select-value {
84-
position: static;
85-
padding: 0;
86-
overflow: visible;
87-
}
77+
.Select-input {
78+
width: 100% !important;
79+
height: 0;
80+
padding: 0;
81+
opacity: 0;
82+
position: absolute;
83+
}
8884

89-
.Select.is-focused:not(.is-open) > .Select-control {
90-
border-color: #137d60 !important;
91-
}
85+
.Select--single > .Select-control .Select-value {
86+
position: static;
87+
padding: 0;
88+
overflow: visible;
89+
}
9290

93-
.Select-value-label {
94-
@include roboto-regular;
91+
.Select.is-focused:not(.is-open) > .Select-control {
92+
border-color: #137d60 !important;
93+
}
9594

96-
font-size: 400;
97-
font-size: 14px;
98-
line-height: 22px;
99-
color: $tco-black;
100-
vertical-align: middle;
101-
}
95+
.Select-value-label {
96+
@include roboto-regular;
10297

103-
.Select-arrow-zone {
104-
content: ' ';
105-
display: block;
106-
height: 0;
107-
position: absolute;
108-
right: 17px;
109-
top: 50%;
110-
width: 0;
98+
font-size: 400;
99+
font-size: 14px;
100+
line-height: 22px;
101+
color: $tco-black;
102+
vertical-align: middle;
103+
}
111104

112-
svg {
113-
width: 10px;
114-
height: 10px;
105+
.Select-arrow-zone {
106+
content: ' ';
107+
display: block;
108+
height: 0;
109+
position: absolute;
110+
right: 17px;
111+
top: 50%;
112+
width: 0;
113+
114+
svg {
115+
width: 10px;
116+
height: 10px;
117+
}
115118
}
116-
}
117119

118-
.Select-menu-outer {
119-
width: 100%;
120-
color: $tc-gray-90;
121-
font-weight: 400;
122-
font-size: 12px;
123-
background-color: $tc-white;
124-
box-sizing: border-box;
125-
margin-top: 2px;
126-
padding: 4px 0;
127-
position: absolute;
128-
top: 100%;
129-
right: 0;
130-
z-index: 1000;
131-
-webkit-overflow-scrolling: touch;
132-
border: none !important;
133-
}
120+
.Select-menu-outer {
121+
width: 100%;
122+
color: $tc-gray-90;
123+
font-weight: 400;
124+
font-size: 12px;
125+
background-color: $tc-white;
126+
box-sizing: border-box;
127+
margin-top: 2px;
128+
padding: 4px 0;
129+
position: absolute;
130+
top: 100%;
131+
right: 0;
132+
z-index: 1000;
133+
-webkit-overflow-scrolling: touch;
134+
border: none !important;
135+
}
134136

135-
.Select-menu {
136-
max-height: none;
137-
overflow-y: visible;
138-
height: 22px;
139-
font-size: 14px;
140-
}
137+
.Select-menu {
138+
max-height: none;
139+
overflow-y: visible;
140+
height: 22px;
141+
font-size: 14px;
142+
}
141143

142-
.Select-option {
143-
box-sizing: border-box;
144-
color: rgba(51, 51, 51, 0.8);
145-
cursor: pointer;
146-
display: block;
147-
padding: 6px 16px;
148-
border-left: 1px solid #aaa;
149-
border-right: 1px solid #aaa;
150-
}
144+
.Select-option {
145+
box-sizing: border-box;
146+
color: rgba(51, 51, 51, 0.8);
147+
cursor: pointer;
148+
display: block;
149+
padding: 6px 16px;
150+
border-left: 1px solid #aaa;
151+
border-right: 1px solid #aaa;
152+
}
151153

152-
.Select-option:last-child {
153-
border-bottom-right-radius: 5px !important;
154-
border-bottom-left-radius: 5px !important;
155-
border-bottom: 1px solid #aaa;
156-
}
154+
.Select-option:last-child {
155+
border-bottom-right-radius: 5px !important;
156+
border-bottom-left-radius: 5px !important;
157+
border-bottom: 1px solid #aaa;
158+
}
157159

158-
.Select-option:first-child {
159-
border-top: 1px solid #aaa;
160-
border-top-left-radius: $base-unit;
161-
border-top-right-radius: $base-unit;
162-
}
160+
.Select-option:first-child {
161+
border-top: 1px solid #aaa;
162+
border-top-left-radius: $base-unit;
163+
border-top-right-radius: $base-unit;
164+
}
163165

164-
.Select-option:hover {
165-
color: $tc-black;
166-
}
166+
.Select-option:hover {
167+
color: $tc-black;
168+
}
167169

168-
.Select-option.is-selected {
169-
color: $tc-black;
170-
font-weight: 500;
171-
background: $tc-white;
172-
}
170+
.Select-option.is-selected {
171+
color: $tc-black;
172+
font-weight: 500;
173+
background: $tc-white;
174+
}
173175

174-
.Select-option.is-focused {
175-
background: $tc-white;
176-
}
176+
.Select-option.is-focused {
177+
background: $tc-white;
178+
}
177179

178-
.Select-noresults {
179-
box-sizing: border-box;
180-
color: $tc-gray-90;
181-
cursor: default;
182-
display: block;
183-
padding: 8px 20px;
180+
.Select-noresults {
181+
box-sizing: border-box;
182+
color: $tc-gray-90;
183+
cursor: default;
184+
display: block;
185+
padding: 8px 20px;
186+
}
184187
}
185188
}
186-
}
187189

188190
.view-options {
189191
position: absolute;

0 commit comments

Comments
 (0)