apuc/guild_front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Mobile adaptation

Browse Source
This commit is contained in:
MaxOvs19 2023-10-05 18:49:16 +03:00
parent aba12694bf
commit a604824f84
2 changed files with 142 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

141
src/pages/Statistics/statistics.scss
View File

@ -27,6 +27,19 @@
transition: 0.4s; transition: 0.4s;
} }
} }
@media (max-width: 850px) {
display: flex;
align-items: center;
img {
margin-right: 10px;
}
}
@media (max-width: 425px) {
display: none;
}
} }
&__menu { &__menu {
@ -51,6 +64,29 @@
transition: 0.4s; transition: 0.4s;
} }
} }
@media (max-width: 850px) {
h1 {
margin: 0 15px 0 5px;
}
span {
margin-left: 10px;
}
}
@media (max-width: 425px) {
padding: 0 20px;
h1 {
margin: 0;
line-height: 22px;
}
span {
margin: 10px;
}
}
} }
} }
@ -75,6 +111,10 @@
font-size: 22px; font-size: 22px;
margin: 0 0 0 21px; margin: 0 0 0 21px;
} }
@media (max-width: 425px) {
padding: 0 15px;
}
} }
&__team { &__team {
@ -144,6 +184,33 @@
background: #6e7c87; background: #6e7c87;
} }
} }
@media (max-width: 850px) {
justify-content: space-around;
}
@media (max-width: 650px) {
margin-top: 10px;
padding: 0;
gap: 20px;
}
@media (max-width: 425px) {
margin-top: 25px;
flex-direction: column;
flex-wrap: wrap;
align-items: center;
gap: 15px;
}
}
@media (max-width: 850px) {
flex-direction: column;
padding: 15px;
}
@media (max-width: 425px) {
flex-direction: column;
} }
} }
@ -154,7 +221,16 @@
padding: 0 0 10px 0; padding: 0 0 10px 0;
border-bottom: 2px solid #f1f1f1; border-bottom: 2px solid #f1f1f1;
margin-bottom: 23px; margin-bottom: 23px;
@media (max-width: 650px) {
border-bottom: 2px solid #b5b5b5a8;
} }
@media (max-width: 425px) {
margin: 0;
}
}
&__head { &__head {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -164,6 +240,15 @@
color: #5b6871; color: #5b6871;
font-size: 12px; font-size: 12px;
} }
@media (max-width: 850px) {
padding: 0px 80px 0 80px;
margin: 0;
}
@media (max-width: 650px) {
display: none;
}
} }
&__item { &__item {
@ -202,6 +287,26 @@
&-type { &-type {
width: 168px; width: 168px;
} }
@media (max-width: 850px) {
&-name {
width: 115px;
}
&-type {
width: 100px;
}
}
@media (max-width: 650px) {
&-name {
width: auto;
}
&-type {
width: auto;
}
}
} }
.status { .status {
@ -221,6 +326,38 @@
&-none { &-none {
background: #6e7c87; background: #6e7c87;
} }
@media (max-width: 850px) {
width: 120px;
}
}
@media (max-width: 850px) {
margin: 0;
gap: 10px;
}
@media (max-width: 650px) {
margin: 0;
flex-direction: column;
justify-content: center;
gap: 10px;
}
}
&__body {
@media (max-width: 850px) {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
}
@media (max-width: 650px) {
padding: 0px 15px;
&__body {
gap: 25px;
} }
} }
} }
@ -251,6 +388,10 @@
} }
} }
} }
@media (max-width: 850px) {
padding: 0 15px;
}
} }
.return-text { .return-text {

1
src/pages/Tracker/tracker.scss
View File

@ -205,6 +205,7 @@
@media (max-width: 650px) { @media (max-width: 650px) {
height: 40px; height: 40px;
font-size: 12px; font-size: 12px;
height: 166px;
} }
} }
} }