Skip to content

Commit 7c01b0b

Browse files
JanosenseJanosense
committed
Fixed mobile version
1 parent 94425c9 commit 7c01b0b

File tree

18 files changed

+445
-204
lines changed

18 files changed

+445
-204
lines changed

‎wp-content/themes/player-key/dist/css/main.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎wp-content/themes/player-key/dist/js/main.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎wp-content/themes/player-key/src/assets/styles/global/button.css‎

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -33,29 +33,31 @@
3333
background-color: var(--rich-black);
3434
}
3535

36-
.button--black:hover {
37-
color: var(--rich-black);
38-
background-color: var(--white);
39-
}
40-
4136
.button--white,
4237
.button--white:disabled:hover {
4338
color: var(--rich-black);
4439
background-color: var(--white);
4540
}
4641

47-
.button--white:hover {
48-
color: var(--white);
49-
background-color: var(--rich-black);
50-
}
51-
5242
.button--lime,
5343
.button--lime:disabled:hover {
5444
color: var(--rich-black);
5545
background-color: var(--fresh-lime);
5646
}
5747

58-
.button--lime:hover {
59-
color: var(--white);
60-
background-color: var(--rich-black);
48+
@media (min-width: 1024px) {
49+
.button--black:hover {
50+
color: var(--rich-black);
51+
background-color: var(--white);
52+
}
53+
54+
.button--white:hover {
55+
color: var(--white);
56+
background-color: var(--rich-black);
57+
}
58+
59+
.button--lime:hover {
60+
color: var(--white);
61+
background-color: var(--rich-black);
62+
}
6163
}

‎wp-content/themes/player-key/src/assets/styles/global/entities.css‎

Lines changed: 12 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,15 @@
88
margin-bottom: 40px;
99
}
1010

11+
.entities__list-holder {
12+
overflow: auto;
13+
}
14+
1115
.entities__list {
1216
list-style-type: none;
1317
margin: 0;
1418
padding: 0;
19+
min-width: 1000px;
1520
}
1621

1722
.entities__item {
@@ -89,22 +94,6 @@
8994
text-align: right;
9095
}
9196

92-
/*.entities__cell-indicator {*/
93-
/* display: block;*/
94-
/* width: 36px;*/
95-
/* margin: auto;*/
96-
/* padding: 4px 8px;*/
97-
/* box-sizing: border-box;*/
98-
/* font-size: 14px;*/
99-
/* text-align: center;*/
100-
/* border-radius: 8px;*/
101-
/*}*/
102-
103-
/*.entities__cell-indicator--true {*/
104-
/* color: green;*/
105-
/* background-color: rgba(0, 183, 43, 0.22);*/
106-
/*}*/
107-
10897
.entities__cell-indicator--false {
10998
color: #9d0000;
11099
background-color: rgba(255, 0, 0, 0.11);
@@ -190,7 +179,7 @@
190179
right: 0;
191180
z-index: 2;
192181
display: block;
193-
width: 700px;
182+
width: 100%;
194183
height: 100vh;
195184
overflow: hidden;
196185
padding: 100px 40px;
@@ -232,3 +221,9 @@
232221
width: 100%;
233222
height: 100%;
234223
}
224+
225+
@media (min-width: 1024px) {
226+
.entities__layout {
227+
width: 700px;
228+
}
229+
}

‎wp-content/themes/player-key/src/assets/styles/global/form.css‎

Lines changed: 21 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,20 +3,6 @@
33
width: 100%;
44
}
55

6-
.form__fieldset {
7-
display: grid;
8-
grid-template-columns: 1fr 1fr;
9-
column-gap: 24px;
10-
margin-bottom: 40px;
11-
}
12-
13-
.form__fieldset-title {
14-
grid-column-start: 1;
15-
grid-column-end: 3;
16-
font-weight: 700;
17-
text-transform: none;
18-
}
19-
206
.form__label {
217
display: block;
228
margin-bottom: 8px;
@@ -45,8 +31,6 @@
4531
}
4632

4733
.form__links {
48-
position: relative;
49-
top: -40px;
5034
display: flex;
5135
justify-content: flex-end;
5236
column-gap: 20px;
@@ -56,3 +40,24 @@
5640
.form__links a {
5741
color: var(--rich-black)
5842
}
43+
44+
@media (min-width: 1024px) {
45+
.form__fieldset {
46+
display: grid;
47+
grid-template-columns: 1fr 1fr;
48+
column-gap: 24px;
49+
margin-bottom: 40px;
50+
}
51+
52+
.form__fieldset-title {
53+
grid-column-start: 1;
54+
grid-column-end: 3;
55+
font-weight: 700;
56+
text-transform: none;
57+
}
58+
59+
.form__links {
60+
position: relative;
61+
top: -40px;
62+
}
63+
}

‎wp-content/themes/player-key/src/components/Athletes.vue‎

Lines changed: 25 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -472,34 +472,36 @@ export default {
472472
Add Athlete
473473
</button>
474474
</div>
475-
<ul v-if="entities !== null && entities.length > 0" class="entities__list">
476-
<li class="entities__item entities__item--athlete">
477-
<span class="entities__cell">#</span>
478-
<span class="entities__cell">Athlete</span>
479-
<span class="entities__cell">Team</span>
480-
<span class="entities__cell">Parent</span>
481-
<span class="entities__cell entities__cell--status">Verified Status</span>
482-
<span class="entities__cell entities__cell--status">Payment status</span>
483-
<span class="entities__cell">Actions</span>
484-
</li>
485-
<li v-for="(entity, index) in entities" :key="entity.ID" :id="entity.ID"
486-
class="entities__item entities__item--athlete" @click="viewAthlete(entity.slug)">
487-
<span class="entities__cell">{{ index + 1 }}.</span>
488-
<span class="entities__cell">{{ entity.first_name }} {{ entity.last_name }}</span>
489-
<span class="entities__cell">{{ entity.team.post_title }}</span>
490-
<span class="entities__cell">{{ entity.parent_name }}</span>
491-
<span class="entities__cell entities__cell-status"
492-
:class="`entities__cell-status--${entity.status}`">{{ entity.status }}</span>
493-
<span class="entities__cell entities__cell-status"
494-
:class="`entities__cell-status--${entity.payment_status}`">{{ entity.payment_status }}</span>
495-
<span class="entities__cell entities__cell--actions">
475+
<div v-if="entities !== null && entities.length > 0" class="entities__list-holder">
476+
<ul class="entities__list">
477+
<li class="entities__item entities__item--athlete">
478+
<span class="entities__cell">#</span>
479+
<span class="entities__cell">Athlete</span>
480+
<span class="entities__cell">Team</span>
481+
<span class="entities__cell">Parent</span>
482+
<span class="entities__cell entities__cell--status">Verified Status</span>
483+
<span class="entities__cell entities__cell--status">Payment status</span>
484+
<span class="entities__cell">Actions</span>
485+
</li>
486+
<li v-for="(entity, index) in entities" :key="entity.ID" :id="entity.ID"
487+
class="entities__item entities__item--athlete" @click="viewAthlete(entity.slug)">
488+
<span class="entities__cell">{{ index + 1 }}.</span>
489+
<span class="entities__cell">{{ entity.first_name }} {{ entity.last_name }}</span>
490+
<span class="entities__cell">{{ entity.team.post_title }}</span>
491+
<span class="entities__cell">{{ entity.parent_name }}</span>
492+
<span class="entities__cell entities__cell-status"
493+
:class="`entities__cell-status--${entity.status}`">{{ entity.status }}</span>
494+
<span class="entities__cell entities__cell-status"
495+
:class="`entities__cell-status--${entity.payment_status}`">{{ entity.payment_status }}</span>
496+
<span class="entities__cell entities__cell--actions">
496497
<button v-if="entity.payment_status === 'unpaid' && entity.status === 'pending'" type="button"
497498
class="entities__action" @click.stop="setupPayment(entity)">Pay</button>
498499
<button type="button" class="entities__action" @click.stop="edit(entity)">Edit</button>
499500
<button type="button" class="entities__action" @click.stop="remove(entity.ID)">Remove</button>
500501
</span>
501-
</li>
502-
</ul>
502+
</li>
503+
</ul>
504+
</div>
503505
<p v-else-if="entities !== null && entities.length === 0">You don't have associated athletes yet</p>
504506
</div>
505507
</div>

‎wp-content/themes/player-key/src/components/Board.vue‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -284,16 +284,11 @@ export default {
284284
font-weight: 900;
285285
}
286286
287-
.board__entities {
288-
display: flex;
289-
column-gap: 60px;
290-
justify-content: center;
291-
}
292-
293287
.board__entity {
294288
flex-shrink: 1;
295289
position: relative;
296290
width: 200px;
291+
margin: 0 auto 28px;
297292
height: 300px;
298293
padding: 24px 20px;
299294
box-sizing: border-box;
@@ -404,4 +399,16 @@ export default {
404399
.board__role.active {
405400
color: #fff;
406401
}
402+
403+
@media (min-width: 1024px) {
404+
.board__entities {
405+
display: flex;
406+
column-gap: 60px;
407+
justify-content: center;
408+
}
409+
410+
.board__entity {
411+
margin: 0;
412+
}
413+
}
407414
</style>

‎wp-content/themes/player-key/src/components/BoardNavgation.vue‎

Lines changed: 26 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export default {
2929
<style scoped>
3030
.board-navigation {
3131
position: relative;
32-
top: -100px;
32+
top: -60px;
3333
background-color: var(--rich-black);
3434
}
3535
@@ -40,10 +40,7 @@ export default {
4040
}
4141
4242
.board-navigation__user {
43-
position: relative;
44-
font-size: 16px;
45-
font-weight: 700;
46-
color: var(--white);
43+
display: none;
4744
}
4845
4946
.board-navigation__user-role {
@@ -60,7 +57,7 @@ export default {
6057
list-style-type: none;
6158
display: flex;
6259
justify-content: flex-end;
63-
column-gap: 20px;
60+
column-gap: 16px;
6461
margin: 0;
6562
padding: 12px 0;
6663
}
@@ -69,11 +66,33 @@ export default {
6966
color: var(--white);
7067
text-decoration: none;
7168
text-transform: uppercase;
72-
font-size: 16px;
69+
font-size: 12px;
7370
font-weight: 300;
7471
}
7572
7673
.board-navigation__link.router-link-active {
7774
font-weight: 700;
7875
}
76+
77+
@media (min-width: 1024px) {
78+
.board-navigation {
79+
top: -100px;
80+
}
81+
82+
.board-navigation__user {
83+
position: relative;
84+
display: block;
85+
font-size: 16px;
86+
font-weight: 700;
87+
color: var(--white);
88+
}
89+
90+
.board-navigation__list {
91+
column-gap: 20px;
92+
}
93+
94+
.board-navigation__link {
95+
font-size: 16px;
96+
}
97+
}
7998
</style>

‎wp-content/themes/player-key/src/components/ErrorList.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export default {
3535
margin-bottom: 0;
3636
}
3737
38-
.error-list__item /deep/ a {
38+
.error-list__item:deep(a) {
3939
color: #770000 !important;
4040
}
4141
</style>

‎wp-content/themes/player-key/src/components/FormItemFile.vue‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ export default {
3939
:id="inputId"
4040
class="hide-file-input"
4141
type="file"
42+
capture="user"
4243
accept="image/jpeg, image/png, application/pdf"
4344
@change="onFileChange"
4445
/>

0 commit comments

Comments
 (0)