Skip to content
Snippets Groups Projects
Commit 2bc93c21 authored by Aliaksandr BUDZKO's avatar Aliaksandr BUDZKO
Browse files

feat: responsiveness mobile L 425px

parent 42dbd08d
Branches
No related tags found
No related merge requests found
...@@ -52,3 +52,11 @@ html { ...@@ -52,3 +52,11 @@ html {
} }
} }
@media (max-width: 425px) {
.footer{
a {
font-size: 0.5rem;
}
}
}
...@@ -135,15 +135,6 @@ ...@@ -135,15 +135,6 @@
} }
//@media (max-width: 1200px) {
// .BottomSection {
// min-height: 100vh;
// background-position: bottom, 107% 40%, -5% 55%;
//
//
// }
//}
@media (max-width: 1024px) { @media (max-width: 1024px) {
.BottomSection { .BottomSection {
...@@ -258,6 +249,7 @@ ...@@ -258,6 +249,7 @@
.ButtonContainer { .ButtonContainer {
max-width: 60%; max-width: 60%;
align-self: center; align-self: center;
padding-right: 0;
a { a {
width: fit-content; width: fit-content;
...@@ -319,7 +311,94 @@ ...@@ -319,7 +311,94 @@
@media (max-width: 425px) { @media (max-width: 425px) {
.BottomSection { .BottomSection {
min-height: 70vh; min-height: 75vh;
background-position: bottom, 106% 49%, -5% 63%;
.MiddleBlock {
.Title {
font-size: 1.2rem;
line-height: 1.4rem;
}
.Caption {
flex-direction: column;
.Comments {
font-size: 0.6rem;
line-height: 1rem;
.FirstComment {
}
.SecondComment {
}
}
.ButtonContainer {
max-width: 60%;
align-self: center;
padding-right: 0;
a {
width: fit-content;
}
}
}
}
.BottomBlock {
bottom: 1%;
.Logos {
margin-right: 5%;
max-width: 30%;
flex-direction: column;
img {
width: 100%;
height: 40%;
}
p {
max-width: 100%;
font-size: 0.6rem;
line-height: 1rem;
}
}
.ContactLinks {
max-width: 40%;
.BigCaption {
font-size: 0.8rem;
line-height: 1.2rem;
margin-bottom: 10%;
}
a {
width: fit-content;
font-size: 0.6rem;
}
.SmallCaption {
font-size: 0.6rem;
line-height: 1rem;
}
}
}
} }
} }
......
...@@ -105,16 +105,32 @@ ...@@ -105,16 +105,32 @@
max-width: 80%; max-width: 80%;
margin: 15px auto; margin: 15px auto;
} }
;
} }
} }
} }
@media (max-width: 575.98px) { @media (max-width: 425px) {
.CloudSection { .CloudSection {
.UpperBlock { .UpperBlock {
margin-top: 10%; margin-top: 3%;
max-width: 55%;
font-size: 1.3rem;
}
.Cloud {
margin-top: 2%;
max-width: 60%;
max-height: 60%;
}
.BottomBlock {
margin-top: 0;
max-width: 40%;
.Caption {
max-width: 100%;
margin: 15px auto;
}
} }
} }
} }
......
...@@ -101,7 +101,6 @@ ...@@ -101,7 +101,6 @@
} }
@media (max-width: 768px) { @media (max-width: 768px) {
.FeatureSection { .FeatureSection {
min-height: 50vh; min-height: 50vh;
...@@ -123,6 +122,20 @@ ...@@ -123,6 +122,20 @@
@media (max-width: 425px) { @media (max-width: 425px) {
.FeatureSection { .FeatureSection {
min-height: 40vh; min-height: 40vh;
flex-direction: column;
padding: 5% 0 5% 0;
.RightSide {
.Bubble {
margin: 20px auto;
}
.Author {
padding: 2% 0 0 15%;
margin-top: 0;
}
}
} }
} }
...@@ -134,6 +147,7 @@ ...@@ -134,6 +147,7 @@
.LeftSide { .LeftSide {
margin-top: 5%; margin-top: 5%;
.Feature { .Feature {
.Checkmark { .Checkmark {
font-size: 5vw; font-size: 5vw;
......
...@@ -97,46 +97,28 @@ ...@@ -97,46 +97,28 @@
} }
} }
@media (max-width: 425px) {
@media (max-width: 575.98px) {
.LandingSection { .LandingSection {
flex-direction: column; padding-top: 5%;
text-align: center; min-height: 85vh;
padding-top: 0;
min-height: 55vh;
.LeftSide { .LeftSide {
.Octopus { .Octopus {
width: 50vw; width: 55vw;
height: 30vh; height: 45vh;
} }
} }
.RightSide { .RightSide {
text-align: center;
.Title { .Title {
font-size: 10vw; font-size: 3rem;
.Caption { .Caption {
font-size: 3vw; font-size: 0.7rem;
text-align: center;
}
} }
} }
}
}
@media (max-width: 320px) { }
.LandingSection {
min-height: 50vh;
} }
} }
...@@ -147,17 +147,26 @@ ...@@ -147,17 +147,26 @@
@media (max-width: 576px) { @media (max-width: 425px) {
.StatsSection { .StatsSection {
min-height: 50vh; min-height: 50vh;
.RightSide { .RightSide {
.NotesImage { .NotesImage {
width: 80vw; width: 80vw;
height: 20vh; height: 20vh;
} }
} }
.LeftSide {
.Caption {
left: 37%;
right: 5%;
bottom: 10%;
max-width: 55%;
font-size: 0.7rem;
line-height: 1rem;
}
}
} }
} }
......
...@@ -133,9 +133,20 @@ ...@@ -133,9 +133,20 @@
} }
@media (max-width: 375px) { @media (max-width: 425px) {
.TowerSection { .TowerSection {
min-height: 40vh; padding: 5% 0 5% 0;
.RightSide {
max-width: 80%;
text-align: center;
.Title {
font-size: 1.1rem;
}
.Caption {
max-width: 100%;
}
}
} }
} }
\ No newline at end of file
...@@ -120,6 +120,12 @@ ...@@ -120,6 +120,12 @@
height: 30vh; height: 30vh;
} }
} }
.RightSide {
.Caption {
max-width: 100%;
}
}
} }
} }
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment