Skip to content

Commit 5023f5e

Browse files
kkartunovkkartunov
committed
Implement #4921 
1 parent 45a4d8f commit 5023f5e

File tree

15 files changed

+277
-18
lines changed

15 files changed

+277
-18
lines changed

‎__tests__/shared/components/GUIKit/Checkbox/__snapshots__/index.jsx.snap

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,10 @@ exports[`Default render 1`] = `
1515
<IconCheckSolid
1616
className="src-shared-components-GUIKit-Checkbox-___style__after___2rEBg"
1717
height={13}
18-
viewBox="0 0 15 13"
18+
viewBox="0 0 18 15"
1919
width={13}
2020
xmlns="http://www.w3.org/2000/svg"
21+
xmlnsXlink="http://www.w3.org/1999/xlink"
2122
/>
2223
</div>
2324
</label>

‎src/assets/images/check-mark.svg

Lines changed: 24 additions & 0 deletions
Loading

‎src/assets/images/l4.png

-1.86 KB
Binary file not shown.

‎src/shared/components/GUIKit/Assets/Styles/Includes/_mixin.scss

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
$gui-kit-gray-30: #aaa;
33
$gui-kit-gray-90: #2a2a2a;
44
$gui-kit-level-2: #0ab88a;
5+
$gui-kit-level-5: #ef476f;
56

67
@mixin textInputLabel {
78
font-size: 12px;
@@ -22,6 +23,7 @@ $gui-kit-level-2: #0ab88a;
2223
padding: 15px;
2324
margin-bottom: 0;
2425
margin-top: 12px;
26+
color: $gui-kit-gray-90;
2527

2628
&::-webkit-input-placeholder {
2729
/* Edge */
@@ -50,6 +52,12 @@ $gui-kit-level-2: #0ab88a;
5052
border: 1px solid $gui-kit-gray-30;
5153
box-shadow: none;
5254
}
55+
56+
&:focus-within {
57+
label {
58+
color: #229174;
59+
}
60+
}
5361
}
5462

5563
@mixin textInputXs {
@@ -75,8 +83,10 @@ $gui-kit-level-2: #0ab88a;
7583
line-height: 20px;
7684
margin-top: 10px;
7785
margin-left: 15px;
86+
color: $gui-kit-gray-90;
7887
}
7988

8089
@mixin errorMessageXs {
8190
margin-top: 8px;
91+
color: $gui-kit-gray-90;
8292
}

‎src/shared/components/GUIKit/Checkbox/index.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
*/
66
import React, { useRef, useState } from 'react';
77
import PT from 'prop-types';
8-
import IconCheckSolid from 'assets/images/dashboard/ico-checkmark.svg';
8+
import IconCheckSolid from 'assets/images/check-mark.svg';
99
import _ from 'lodash';
1010
import './style.scss';
1111

‎src/shared/components/GUIKit/Datepicker/style.scss

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020

2121
&.haveError .label,
2222
&.haveError.isFocused .label {
23-
color: $tc-level-5;
23+
color: $gui-kit-level-5;
2424
}
2525

2626
:global {
@@ -153,8 +153,17 @@
153153
border-radius: 50%;
154154
}
155155

156+
&.CalendarDay__default {
157+
color: #2a2a2a;
158+
}
159+
160+
&.CalendarDay__blocked_out_of_range {
161+
color: #aaa;
162+
}
163+
156164
&.CalendarDay__selected {
157165
background: transparent !important;
166+
color: #fff;
158167

159168
div {
160169
background: $gui-kit-level-2;
@@ -190,7 +199,7 @@
190199
.SingleDatePickerInput {
191200
.DateInput {
192201
input {
193-
border: 2px solid $tc-level-5;
202+
border: 2px solid $gui-kit-level-5;
194203
}
195204
}
196205
}

‎src/shared/components/GUIKit/Dropdown/style.scss

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@
4343

4444
&.haveError .label,
4545
&.haveError.isFocused .label {
46-
color: $tc-level-5;
46+
color: $gui-kit-level-5;
4747
}
4848

4949
:global {
@@ -80,6 +80,7 @@
8080
height: 22px;
8181
line-height: 22px;
8282
font-size: 16px;
83+
color: $gui-kit-gray-90 !important;
8384
}
8485
}
8586

@@ -163,7 +164,7 @@
163164
&.haveError {
164165
:global {
165166
.Select-control {
166-
border: 2px solid $tc-level-5 !important;
167+
border: 2px solid $gui-kit-level-5 !important;
167168
}
168169
}
169170
}
@@ -200,6 +201,7 @@
200201
.Select-value {
201202
.Select-value-label {
202203
font-size: 14px;
204+
color: $gui-kit-gray-90 !important;
203205
}
204206
}
205207

‎src/shared/components/GUIKit/TextInput/style.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -51,13 +51,13 @@
5151

5252
input:not([type='checkbox']).haveError + label,
5353
input:not([type='checkbox']).haveError:focus + label {
54-
color: $tc-level-5;
54+
color: $gui-kit-level-5;
5555
}
5656

5757
input:not([type='checkbox']).haveError,
5858
input:not([type='checkbox']).haveError:active,
5959
input:not([type='checkbox']).haveError:focus,
6060
input:not([type='checkbox']).haveError:hover {
61-
border: 2px solid $tc-level-5;
61+
border: 2px solid $gui-kit-level-5;
6262
}
6363
}

‎src/shared/components/GUIKit/Textarea/style.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030

3131
&.haveError ~ label,
3232
&.haveError:focus ~ label {
33-
color: $tc-level-5;
33+
color: $gui-kit-level-5;
3434
}
3535
}
3636

@@ -52,7 +52,7 @@
5252
textarea.haveError:active,
5353
textarea.haveError:focus,
5454
textarea.haveError:hover {
55-
border: 2px solid $tc-level-5;
55+
border: 2px solid $gui-kit-level-5;
5656
}
5757

5858
textarea.haveError ~ .labelMask {

‎src/shared/components/Gigs/GigDetails.jsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import PT from 'prop-types';
88
import { isomorphy, Link, config } from 'topcoder-react-utils';
99
import ReactHtmlParser from 'react-html-parser';
1010
import { getSalaryType, getCustomField } from 'utils/gigs';
11+
import SubscribeMailChimpTag from 'containers/SubscribeMailChimpTag';
1112
import './style.scss';
1213
import IconFacebook from 'assets/images/icon-facebook.svg';
1314
import IconTwitter from 'assets/images/icon-twitter.svg';
@@ -21,7 +22,6 @@ import iconSkills from 'assets/images/icon-skills-blue.png';
2122
import iconLabel1 from 'assets/images/l1.png';
2223
import iconLabel2 from 'assets/images/l2.png';
2324
import iconLabel3 from 'assets/images/l3.png';
24-
import iconLabel4 from 'assets/images/l4.png';
2525

2626
// Cleanup HTML from style tags
2727
// so it won't affect other parts of the UI
@@ -127,8 +127,12 @@ export default function GigDetails(props) {
127127
<IconTwitter />
128128
</a>
129129
</div>
130+
<div styleName="subscribe-area">
131+
<h6>SUBSCRIBE TO WEEKLY UPDATES</h6>
132+
<p>Not ready to apply? Want to stay tuned for any new gigs that may be upcoming? Join our weekly Gig Work list.</p>
133+
<SubscribeMailChimpTag listId="28bfd3c062" tags={['Gig Work']} />
134+
</div>
130135
<div styleName="info-area">
131-
<p>Thank you for checking out our latest gig at Topcoder. Gig work through us is simple and effective for those that would like traditional freelance work. To learn more about how Gigs work with us, go <a target="_blank" rel="noreferrer" href="https://www.topcoder.com/thrive/tracks?track=Topcoder&amp;tax=Gig%20Work">here</a>.</p>
132136
<p>At Topcoder, we pride ourselves in bringing our customers the very best candidates to help fill their needs. Want to improve your chances? You can do a few things:</p>
133137
<ul>
134138
<li>
@@ -137,14 +141,10 @@ export default function GigDetails(props) {
137141
</li>
138142
<li>
139143
<img src={iconLabel2} alt="label 2" />
140-
<div><strong>Subscribe to our <a target="_blank" rel="noreferrer" href="https://www.topcoder.com/community/taas">Gig notifications email</a>.</strong> We’ll send you a weekly update on gigs available so you don’t miss a beat.</div>
144+
<div><strong>Let us know you’re here!</strong> Check in on our <a target="_blank" rel="noreferrer" href="https://apps.topcoder.com/forums/?module=ThreadList&forumID=703475">Gig Work forum</a> and tell us you’re looking for a gig. It’s great visibility for the Gig team.</div>
141145
</li>
142146
<li>
143147
<img src={iconLabel3} alt="label 3" />
144-
<div><strong>Let us know you’re here!</strong> Check in on our <a target="_blank" rel="noreferrer" href="https://apps.topcoder.com/forums/">Gig Work forum</a> and tell us you’re looking for a gig. It’s great visibility for the Gig team.</div>
145-
</li>
146-
<li>
147-
<img src={iconLabel4} alt="label 4" />
148148
<div><strong>Check out our <a target="_blank" rel="noreferrer" href="https://www.topcoder.com/challenges">Topcoder challenges</a> and participate.</strong> Challenges showing your technology skills make you a “qualified” candidate so we know you’re good. The proof is in the pudding!</div>
149149
</li>
150150
</ul>

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

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,7 @@
101101
.shareButtons {
102102
display: flex;
103103
align-items: center;
104+
margin-bottom: 12px;
104105

105106
a {
106107
margin-right: 5px;
@@ -111,11 +112,27 @@
111112
}
112113
}
113114

115+
.subscribe-area {
116+
background-image: linear-gradient(135.29deg, #2c95d7 0%, #06d6a0 100%);
117+
border-radius: 10px;
118+
padding: 25px 32px 30px 20px;
119+
120+
h6 {
121+
margin: 0 0 6px;
122+
color: #fff;
123+
}
124+
125+
p {
126+
color: #fff;
127+
margin-bottom: 15px;
128+
}
129+
}
130+
114131
.info-area {
115132
background-color: #f4f4f4;
116133
padding: 20px;
117134
border-radius: 10px;
118-
margin-top: 18px;
135+
margin-top: 20px;
119136

120137
/* stylelint-disable */
121138
p,

‎src/shared/components/examples/GUIKit/TextInput/index.jsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ function TextInputExample({ size }) {
4040
value: 'Adam Morehead',
4141
required: true,
4242
errorMsg: '',
43+
sectionTitle: 'Required',
4344
},
4445
];
4546

0 commit comments

Comments
 (0)