Skip to content

Commit

Permalink
Merge pull request #76 from DasunThathsara/dasun
Browse files Browse the repository at this point in the history 
Update max-width 1000px
  • Loading branch information
@DasunThathsara
DasunThathsara authored Oct 19, 2023
2 parents 438d3d5 + ad05e02 commit 39e1400
Showing 1 changed file with 195 additions and 18 deletions.
213 changes: 195 additions & 18 deletions public/css/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -193,7 +193,6 @@
width: 12rem;
height: 6rem;
border-radius: 10rem 10rem 0 0;

}

.landing-container .row .col .left-right .yellow-circle-4{
Expand All @@ -212,7 +211,7 @@
background: linear-gradient(to right, rgb(248,215,90), rgb(255,167,41));
z-index: -1;
position: absolute;
right: 600px;
right: 50vw;
top: 0;
width: 10rem;
height: 5rem;
Expand Down Expand Up @@ -319,54 +318,232 @@
}

.landing-container .row .col .left-col h1{
font-size: 65px;
font-size: 55px;
font-weight: 500;
}

.landing-container .row .col .left-col p{
margin-top: 50px;
color: rgba(0,0,0,0.29);
width: 30vw;
}

.landing-container .row .col .left-right .black-circle-1{
background-color: #1c1c1c;
border-radius: 50%;
height: 450px;
width: 450px;
height: 400px;
width: 400px;
position: absolute;
right: 50px;
top: 130px;
top: 150px;
}

.landing-container .row .col .left-right .yellow-circle-1{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,156,19));
border-radius: 50%;
height: 200px;
width: 200px;
height: 160px;
width: 160px;
z-index: 1;
position: absolute;
right: 30px;
top: 120px;
top: 150px;
}

.landing-container .row .col .left-right .yellow-circle-2{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,167,41));
border-radius: 50%;
height: 80px;
width: 80px;
height: 70px;
width: 70px;
z-index: 1;
position: absolute;
right: 450px;
top: 280px;
right: 400px;
top: 260px;
}

.landing-container .row .col .left-right .phone{
width: 300px;
width: 270px;
position: absolute;
right: 120px;
right: 100px;
top: 200px;
z-index: 1
}

.landing-container .row .col .left-right .car{
width: 450px;
position: absolute;
right: 180px;
top: 380px
}
}

@media screen and (max-width: 880px){
.landing-container .row .col .left-col{
padding-left: 30px;
}

.landing-container .row .col .left-col h1{
font-size: 50px;
font-weight: 500;
}

.landing-container .row .col .left-col p{
margin-top: 50px;
color: rgba(0,0,0,0.29);
width: 40vw;
}

.landing-container .row .col .left-right .black-circle-1{
background-color: #1c1c1c;
border-radius: 50%;
height: 350px;
width: 350px;
position: absolute;
right: 40px;
top: 190px;
}

.landing-container .row .col .left-right .yellow-circle-1{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,156,19));
border-radius: 50%;
height: 140px;
width: 140px;
z-index: 1;
position: absolute;
right: 30px;
top: 180px;
}

.landing-container .row .col .left-right .yellow-circle-2{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,167,41));
border-radius: 50%;
height: 60px;
width: 60px;
z-index: 1;
position: absolute;
right: 340px;
top: 270px;
}

.landing-container .row .col .left-right .yellow-circle-3{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,167,41));
z-index: 1;
position: absolute;
left: 50px;
bottom: 0;
width: 10rem;
height: 5rem;
border-radius: 10rem 10rem 0 0;
}

.landing-container .row .col .left-right .yellow-circle-5{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,167,41));
z-index: -1;
position: absolute;
right: 40vw;
top: 0;
width: 8rem;
height: 4rem;
border-radius: 0 0 10rem 10rem;
}

.landing-container .row .col .left-right .phone{
width: 230px;
position: absolute;
right: 80px;
top: 240px;
z-index: 1
}

.landing-container .row .col .left-right .car{
width: 480px;
width: 380px;
position: absolute;
right: 220px;
top: 400px
right: 140px;
top: 390px
}
}

@media screen and (max-width: 880px){
.landing-container .row .col .left-col{
padding-left: 30px;
}

.landing-container .row .col .left-col h1{
font-size: 50px;
font-weight: 500;
}

.landing-container .row .col .left-col p{
margin-top: 50px;
color: rgba(0,0,0,0.29);
width: 40vw;
}

.landing-container .row .col .left-right .black-circle-1{
background-color: #1c1c1c;
border-radius: 50%;
height: 350px;
width: 350px;
position: absolute;
right: 40px;
top: 190px;
}

.landing-container .row .col .left-right .yellow-circle-1{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,156,19));
border-radius: 50%;
height: 140px;
width: 140px;
z-index: 1;
position: absolute;
right: 30px;
top: 180px;
}

.landing-container .row .col .left-right .yellow-circle-2{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,167,41));
border-radius: 50%;
height: 60px;
width: 60px;
z-index: 1;
position: absolute;
right: 340px;
top: 270px;
}

.landing-container .row .col .left-right .yellow-circle-3{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,167,41));
z-index: 1;
position: absolute;
left: 50px;
bottom: 0;
width: 10rem;
height: 5rem;
border-radius: 10rem 10rem 0 0;
}

.landing-container .row .col .left-right .yellow-circle-5{
background: linear-gradient(to right, rgb(248,215,90), rgb(255,167,41));
z-index: -1;
position: absolute;
right: 40vw;
top: 0;
width: 8rem;
height: 4rem;
border-radius: 0 0 10rem 10rem;
}

.landing-container .row .col .left-right .phone{
width: 230px;
position: absolute;
right: 80px;
top: 240px;
z-index: 1
}

.landing-container .row .col .left-right .car{
width: 380px;
position: absolute;
right: 140px;
top: 390px
}
}

0 comments on commit 39e1400

Please sign in to comment.