Skip to content
This repository was archived by the owner on Feb 5, 2022. It is now read-only.

Commit f1f3fea

Browse files
Fdom92Fdom92
committed
fix(opportunities): fix feedback
1 parent 95651b0 commit f1f3fea

File tree

8 files changed

+67
-10
lines changed

8 files changed

+67
-10
lines changed

‎src/assets/opportunities/codemaster.png‎

89.7 KB
Loading

‎src/assets/opportunities/designmaster.png‎

100 KB
Loading

‎src/assets/opportunities/test-designer.png‎

123 KB
Loading

‎src/assets/opportunities/test-dev.png‎

126 KB
Loading

‎src/components/app-input/app-input.scss‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,3 +23,9 @@
2323
display: block;
2424
}
2525
}
26+
27+
input.form-control.slimmer {
28+
@include media-breakpoint-down(md) {
29+
height: calc(2em + 0.25rem + 2px);
30+
}
31+
}

‎src/components/app-input/app-input.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,8 @@ export class AppInput {
2323
valueChanged: EventEmitter;
2424
@Prop()
2525
valid = false;
26+
@Prop()
27+
slimmer = false;
2628

2729
inputHandler(event) {
2830
this.valueChanged.emit({
@@ -37,7 +39,10 @@ export class AppInput {
3739
<div class={`form-group${this.valid ? ` valid` : ``}`}>
3840
<label htmlFor={this.name}>{this.label}</label>
3941
<input
40-
class="form-control"
42+
class={{
43+
slimmer: this.slimmer,
44+
'form-control': true,
45+
}}
4146
type={this.type}
4247
name={this.name}
4348
id={this.inputId}

‎src/pages/app-opportunities/app-opportunities.scss‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,11 @@
1111
background-image: url('/assets/opportunities/opportunities-header-animated.svg');
1212

1313
@include media-breakpoint-down(md) {
14+
background-size: cover;
15+
background-repeat: no-repeat;
16+
height: calc(100vh);
17+
padding-top: 156px;
18+
margin-top: 0;
1419
background-image: url('/assets/opportunities/opportunities-tablet-header-animated.svg');
1520
}
1621
@include media-breakpoint-down(sm) {
@@ -26,6 +31,11 @@
2631
background-image: url('/assets/opportunities/opportunities-transition-dev.svg');
2732

2833
@include media-breakpoint-down(md) {
34+
background-size: cover;
35+
background-repeat: no-repeat;
36+
height: calc(100vh);
37+
padding-top: 156px;
38+
margin-top: 0;
2939
background-image: url('/assets/opportunities/opportunities-tablet-transition-dev.svg');
3040
}
3141
@include media-breakpoint-down(sm) {
@@ -41,6 +51,11 @@
4151
background-image: url('/assets/opportunities/opportunities-transition-design.svg');
4252

4353
@include media-breakpoint-down(md) {
54+
background-size: cover;
55+
background-repeat: no-repeat;
56+
height: calc(100vh);
57+
padding-top: 156px;
58+
margin-top: 0;
4459
background-image: url('/assets/opportunities/opportunities-tablet-transition-design.svg');
4560
}
4661
@include media-breakpoint-down(sm) {
@@ -56,6 +71,11 @@
5671
background-image: url('/assets/opportunities/opportunities-transition-dev-design.svg');
5772

5873
@include media-breakpoint-down(md) {
74+
background-size: cover;
75+
background-repeat: no-repeat;
76+
height: calc(100vh);
77+
padding-top: 156px;
78+
margin-top: 0;
5979
background-image: url('/assets/opportunities/opportunities-tablet-transition-dev-design.svg');
6080
}
6181
@include media-breakpoint-down(sm) {
@@ -71,6 +91,11 @@
7191
background-image: url('/assets/opportunities/opportunities-transition-design-dev.svg');
7292

7393
@include media-breakpoint-down(md) {
94+
background-size: cover;
95+
background-repeat: no-repeat;
96+
height: calc(100vh);
97+
padding-top: 156px;
98+
margin-top: 0;
7499
background-image: url('/assets/opportunities/opportunities-tablet-transition-design-dev.svg');
75100
}
76101
@include media-breakpoint-down(sm) {
@@ -86,6 +111,11 @@
86111
background-image: url('/assets/opportunities/opportunities-dev-active.svg');
87112

88113
@include media-breakpoint-down(md) {
114+
background-size: cover;
115+
background-repeat: no-repeat;
116+
height: calc(100vh);
117+
padding-top: 156px;
118+
margin-top: 0;
89119
background-image: url('/assets/opportunities/opportunities-tablet-dev-active.svg');
90120
}
91121
@include media-breakpoint-down(sm) {
@@ -101,6 +131,11 @@
101131
background-image: url('/assets/opportunities/opportunities-design-active.svg');
102132

103133
@include media-breakpoint-down(md) {
134+
background-size: cover;
135+
background-repeat: no-repeat;
136+
height: calc(100vh);
137+
padding-top: 156px;
138+
margin-top: 0;
104139
background-image: url('/assets/opportunities/opportunities-tablet-design-active.svg');
105140
}
106141
@include media-breakpoint-down(sm) {
@@ -325,6 +360,10 @@
325360

326361
// Application
327362
&.apply-2 {
363+
@include media-breakpoint-down(md) {
364+
max-width: 60%;
365+
}
366+
328367
h2 {
329368
text-align: center;
330369
}

‎src/pages/app-opportunities/app-opportunities.tsx‎

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@ export class AppOpportunities {
107107
url: 'https://openforge.io/opportunities/develop/',
108108
image: 'https://openforge.io/assets/graphic-opportunities-dev-header.png',
109109
},
110-
candidateUrl: '/assets/graphic-opportunities-master-develop.jpg',
110+
candidateUrl: '/assets/opportunities/codemaster.png',
111111
requisitesUrl: '/assets/case-study-development.png',
112112
},
113113
design: {
@@ -158,7 +158,7 @@ export class AppOpportunities {
158158
url: 'https://openforge.io/opportunities/design/',
159159
image: 'https://openforge.io/assets/graphic-opportunities-design-header.png',
160160
},
161-
candidateUrl: '/assets/graphic-opportunities-master-design.jpg',
161+
candidateUrl: '/assets/opportunities/designmaster.png',
162162
requisitesUrl: '/assets/case-study-design.png',
163163
},
164164
};
@@ -449,7 +449,7 @@ export class AppOpportunities {
449449
</p>
450450
</content-graphic>
451451

452-
<content-graphic img-url={`/assets/graphic-opportunities-master-${this.opporunityTypeCurrent}.jpg`}>
452+
<content-graphic img-url={this.opporunityTypeCurrent === 'design' ? '/assets/opportunities/test-designer.png' : '/assets/opportunities/test-dev.png'}>
453453
<h3 class="original thin margin-bottom" slot="header">
454454
<app-translate keyword="opportunities.test.title" />
455455
</h3>
@@ -497,7 +497,7 @@ export class AppOpportunities {
497497
</p>
498498
</content-graphic>
499499

500-
<content-graphic img-url="/assets/graphic-opportunities-sword.png">
500+
<content-graphic img-url={this.opporunityTypeCurrent === 'design' ? '/assets/opportunities/designmaster.png' : '/assets/opportunities/codemaster.png'}>
501501
<h3 class="thin" slot="header">
502502
<app-translate keyword="opportunities.prepared.title" />
503503
</h3>
@@ -661,21 +661,21 @@ export class AppOpportunities {
661661
{this.fileError}
662662
</p>
663663

664-
<app-input placeholder={translate('contact.form.placeholder.fullName')} label={translate('contact.form.fullName')} name="name" type="text" required={true} />
664+
<app-input slimmer={true} placeholder={translate('contact.form.placeholder.fullName')} label={translate('contact.form.fullName')} name="name" type="text" required={true} />
665665
<p class="error">
666666
<span style={!this.nameError ? { display: 'none' } : this.errorIconStyles}>
667667
<i class="fa fa-exclamation-circle" aria-hidden="true" />
668668
</span>
669669
{this.nameError}
670670
</p>
671-
<app-input placeholder={translate('contact.form.placeholder.email')} label={translate('contact.form.email')} name="email" type="email" required={true} />
671+
<app-input slimmer={true} placeholder={translate('contact.form.placeholder.email')} label={translate('contact.form.email')} name="email" type="email" required={true} />
672672
<p class="error">
673673
<span style={!this.emailError ? { display: 'none' } : this.errorIconStyles}>
674674
<i class="fa fa-exclamation-circle" aria-hidden="true" />
675675
</span>
676676
{this.emailError}
677677
</p>
678-
<app-input placeholder={translate('contact.form.placeholder.phone')} label={translate('contact.form.phone')} name="phone" type="number" required={true} />
678+
<app-input slimmer={true} placeholder={translate('contact.form.placeholder.phone')} label={translate('contact.form.phone')} name="phone" type="number" required={true} />
679679
<p class="error">
680680
<span style={!this.phoneError ? { display: 'none' } : this.errorIconStyles}>
681681
<i class="fa fa-exclamation-circle" aria-hidden="true" />
@@ -684,7 +684,7 @@ export class AppOpportunities {
684684
</p>
685685
{this.opporunityTypeCurrent === 'develop'
686686
? [
687-
<app-input placeholder={translate('contact.form.placeholder.github')} label={translate('contact.form.github')} name="github" type="text" required={true} />,
687+
<app-input slimmer={true} placeholder={translate('contact.form.placeholder.github')} label={translate('contact.form.github')} name="github" type="text" required={true} />,
688688
<p class="error">
689689
<span style={!this.githubError ? { display: 'none' } : this.errorIconStyles}>
690690
<i class="fa fa-exclamation-circle" aria-hidden="true" />
@@ -693,7 +693,14 @@ export class AppOpportunities {
693693
</p>,
694694
]
695695
: [
696-
<app-input placeholder={translate('contact.form.placeholder.designProfile')} label={translate('contact.form.designProfile')} name="github" type="text" required={true} />,
696+
<app-input
697+
slimmer={true}
698+
placeholder={translate('contact.form.placeholder.designProfile')}
699+
label={translate('contact.form.designProfile')}
700+
name="github"
701+
type="text"
702+
required={true}
703+
/>,
697704
<p class="error">
698705
<span style={!this.githubError ? { display: 'none' } : this.errorIconStyles}>
699706
<i class="fa fa-exclamation-circle" aria-hidden="true" />

0 commit comments

Comments
 (0)