responsive on smallest screens under 35rem width

This commit is contained in:
Tykayn 2023-05-11 14:52:51 +02:00 committed by tykayn
parent 35836defa8
commit 76699566e3
3 changed files with 64 additions and 1 deletions

View File

@ -1,4 +1,4 @@
@media screen and (max-width: 900px) {
@media screen and (max-width: 1023px) {
#main_title_container h2 {
margin-top: 15vh;
}
@ -105,3 +105,59 @@
min-height:100vh;
}
}
@media screen and (max-width: 35em) {
#main_title{
margin-top: 5vh;
}
#main_title_container h2 {
margin-top: 15vh;
}
#content_all h2, #welcome h2 {
font-size: 4rem !important;
}
#content_all .text{
padding-right:0;
}
.container-text-md{
width: auto;
}
#content_all .columns{
width:100%;
margin: 1rem;
}
.flip-container .container-text{
width:100%;
left:5vw;
}
.flip-container .phone-container {
position: static;
margin: 4rem auto;
}
.flip-container.flip-from-left .container-text{
left: 5vw;
}
.flip-container .phone-container {
margin-top: 7rem;
}
.flip-container .text-description{
max-width: 90vw;
}
#content-4 {
margin-top: 50vh;
}
#content-5 {
margin-top: 45vh;
}
.slider-screen .text, .slider-screen .phone-container{
left: 5vw;
max-width: 90vw;
}
}

View File

@ -188,6 +188,11 @@
</div>
<section id="coming_soon">
<h2>
coming soon
</h2>
</section>
<!-- other section-->

View File

@ -2,7 +2,9 @@
* gsap lib https://greensock.com/get-started-2#controllingYourAnimations
*/
let development_debug = false
let enable_animations = false
// enable_animations = true
if (enable_animations) {