Skip to content

Commit

Permalink
edit first section
Browse files Browse the repository at this point in the history
  • Loading branch information
aliramezani747 committed Jul 9, 2024
1 parent 8dc24ce commit a562335
Show file tree
Hide file tree
Showing 5 changed files with 114 additions and 73 deletions.
Binary file added img/adsl.webp
Binary file not shown.
Binary file added img/background.webp
Binary file not shown.
Binary file added img/تابستانت.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
36 changes: 17 additions & 19 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,24 +9,22 @@
</head>
<body>
<div class="main-container">
<header>
<img class="image0"src="./img/logo-final2 2.webp" alt="لوگو پیشگامان">
<img class="image0" src="./img/1577 2.webp" alt="تلفن 1577">
</header>
<main>
<section class="first">
<div class="season">
<img class="image1" src="./img/بهــارستــون 2.webp" alt="بهــارستــون">
<div class="register">
<p class="text1">از بهار به تابستون&nbsp|&nbsp اینترنت +ADSL2</p>
</div>
<div class="btnBox">
<button class="button2 btn" id="scrollBtn">ثبت نام</button>
<button class="button1 btn" id="scrollBtn1">اطلاعات بیشتر</button>
</div>
<div class="back">
<div class="header">
<img class="image0"src="./img/logo-final2 2.webp" alt="لوگو پیشگامان">
<img class="image0" src="./img/1577 2.webp" alt="شماره 1577">
</div>
<div class="season">
<img class="image1" src="./img/تابستانت.png" alt="بهــارستــون">
<p class="text1"> فصل داغ اینترنت </p>
<img class="image1 image2" src="./img/adsl.webp" alt="بهــارستــون">
<div class="btns">
<button class="button2 btn" id="scrollBtn">ثبت نام</button>
<button class="button1 btn" id="scrollBtn1">اطلاعات بیشتر</button>
</div>
<img class="image1" src="./img/enhanced-image (18) 2.webp" alt="بهــارستــون دو">
</section>
</div>
</div>
<main>
<section class="second">
<div class="card">
<img class="image2" src="./img/3.webp" alt="اقتصادی">
Expand Down Expand Up @@ -110,11 +108,11 @@ <h2 style="display: none;">25187</h2>
<div class="form">
<div>
<label for="fname">نام</label><br>
<input placeholder="فارسی تاریپ کنید" value="" name="tbFirstName" type="text" maxlength="50" id="tbFirstName"><br>
<input placeholder="فارسی تایپ کنید" value="" name="tbFirstName" type="text" maxlength="50" id="tbFirstName"><br>
</div>
<div>
<label for="fname"> نام خانوادگی </label><br>
<input placeholder="فارسی تاریپ کنید" value="" name="tbLastName" type="text" maxlength="50" required id="tbLastName"><br>
<input placeholder="فارسی تایپ کنید" value="" name="tbLastName" type="text" maxlength="50" required id="tbLastName"><br>
</div>
<div>
<label for="fname"> شماره تلفن ثابت </label><br>
Expand Down
151 changes: 97 additions & 54 deletions style.css
Original file line number Diff line number Diff line change
Expand Up @@ -18,71 +18,78 @@ body {
font-family: 'MyCustomFont';
}

header{

.main-container .back {
background-image: url(./img/background.webp);
background-repeat: no-repeat;
background-size: 100vw;
background-position: center;
border-radius: 0px 0px 50px 50px;
justify-content: center;
padding-bottom: 10%;
}

.main-container .back .header{
display: flex;
justify-content: space-between;
align-items: center;
background-color: #E9E8EB;
padding: 3% 3% 3% 3%;
}


main .first {
display: grid;
grid-template-columns: repeat(2,1fr);
justify-content: space-between;
align-items: center;
background-color: #E9E8EB;
padding: 0 5%;
border-radius: 0px 0px 50px 50px;
.main-container .back .header a {
margin-left: 2%;
width: 10%;
}


main .first .season {
.main-container .back .season {
display: flex;
flex-direction: column;
justify-content: center;
justify-content: right;
align-items: center;

width: 50%;
text-align: center;
}

main .first .register {
display: flex;
flex-direction: row;
.main-container .back .season .image1 {
padding-top: 8%;
}

.main-container .back .season .image2 {
padding: 5% 0;
}

.main-container .back .text1 {
font-weight: bold;
color: #286444;
color: #ffffff;
margin: 0px;
padding: 0px;
font-size: 2.1vw;
}

main .first .btnBox {
display: block;
justify-content: center;
text-align: center;
border: 0px;
font-size: 5.2vw;
text-shadow: 1px 1px 8px #353935;
}

main .first .button1 {
.main-container .back .button1 {
padding: 0%;
border-radius: 10px;
background-color: #bb1613;
border-radius: 5px;
color: #ffffff;
background-color: transparent;
font-family: 'MyCustomFont';
padding: 2px 10px;
border: 0px;
padding: 2px 5px;
border: 1.5px solid #ffffff ;
font-size: 2vw;
scroll-behavior: smooth;
text-decoration: none;
}

main .first .button2 {
.main-container .back .button2 {
padding: 0%;
border-radius: 10px;
background-color: #286444;
border-radius: 5px;
background-color: #bb1613;
color: #ffffff;
font-family: 'MyCustomFont';
padding: 2px 18px;
padding: 2px 10px;
border: 0px;
font-size: 2vw;
text-decoration: none;
}


Expand Down Expand Up @@ -399,7 +406,7 @@ main .fifth {
content: "+";
font-size: 1.1em;;
}
.accordion-item:first-child {
.accordion-item:back-child {
margin-top: 0;
}
.accordion-item .icon {
Expand Down Expand Up @@ -444,11 +451,11 @@ footer p {
.main-container {width: 100%;}


header .image0 {width: 10%;}

.main-container .image0 {width: 10%;}

main .first .image1 {width: 80%;}
main .first .text1
.main-container .back .image1 {width: 80%}
.main-container .back .button1 {padding: 2px 18px;}
.main-container .back .button2 {padding: 2px 15px;}


main .second .image2 {width: 30%;}
Expand All @@ -467,11 +474,16 @@ footer p {
.main-container {width: 100%;}


header .image0 {width: 10%;}
.main-container .image0 {width: 10%;}


main .first .image1 {width: 80%;}
main .first .text1
.main-container .back .image1 {width: 70%}
.main-container .back .button1 {
padding: 2px 18px;
border-radius: 10px;}
.main-container .back .button2 {
padding: 2px 15px;
border-radius: 10px;}


main .second .image2 {width: 30%;}
Expand All @@ -494,10 +506,16 @@ footer p {
.main-container {width: 100%;}


header .image0 {width: 10%;}
.main-container .image0 {width: 10%;}


main .first .image1 {width: 80%;}
.main-container .back .image1 {width: 60%}
.main-container .back .button1 {
padding: 2px 18px;
border-radius: 10px;}
.main-container .back .button2 {
padding: 2px 15px;
border-radius: 10px;}


main .second .image2 {width: 30%;}
Expand All @@ -523,10 +541,16 @@ footer p {
.main-container {width: 100%;}


header .image0 {width: 10%;}
.main-container .image0 {width: 10%;}


main .first .image1 {width: 80%;}
.main-container .back .image1 {width: 80%}
.main-container .back .button1 {
padding: 2px 18px;
border-radius: 10px;}
.main-container .back .button2 {
padding: 2px 15px;
border-radius: 10px;}


main .second .image2 {width: 30%;}
Expand All @@ -552,10 +576,16 @@ footer p {
.main-container {width: 100%;}


header .image0 {width: 10%;}
.main-container .image0 {width: 10%;}


main .first .image1 {width: 80%;}
.main-container .back .image1 {width: 80%}
.main-container .back .button1 {
padding: 2px 5px;
border-radius: 5px;}
.main-container .back .button2 {
padding: 2px 5px;
border-radius: 5px;}


main .second .image2 {width: 30%;}
Expand Down Expand Up @@ -583,10 +613,17 @@ footer p {
.main-container {width: 100%;}


header .image0 {width: 10%;}
.main-container .image0 {width: 10%;}


main .first .image1 {width: 80%;}
.main-container .back .image1 {width: 80%}
.main-container .back .button1 {
padding: 2px 5px;
border-radius: 5px;}
.main-container .back .button2 {
padding: 2px 5px;
border-radius:
px;}


main .second .image2 {width: 30%;}
Expand Down Expand Up @@ -615,10 +652,16 @@ footer p {
.main-container {width: 100%;}


header .image0 {width: 10%;}
.main-container .image0 {width: 10%;}


main .first .image1 {width: 80%;}
.main-container .back .image1 {width: 80%}
.main-container .back .button1 {
padding: 2px 5px;
border-radius: 5px;}
.main-container .back .button2 {
padding: 2px 5px;
border-radius: 5px;}


main .second .image2 {width: 80%;}
Expand Down

0 comments on commit a562335

Please sign in to comment.