added list of services
This commit is contained in:
soyed
parent
f3fdab2a52
commit
9013655215
2 changed files with 66 additions and 87 deletions
|
|
@ -39,6 +39,7 @@ body {
|
|||
background-color: #34626c;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.colored-section3 {
|
||||
background-color: #cfd3ce;
|
||||
color: #ffffff;
|
||||
|
|
@ -62,8 +63,8 @@ h3 {
|
|||
}
|
||||
|
||||
p {
|
||||
color: rgb(77, 77, 77);
|
||||
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif
|
||||
color: rgb(77, 77, 77);
|
||||
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -86,22 +87,19 @@ p {
|
|||
|
||||
.navbar-item {
|
||||
padding: 0px 18px;
|
||||
|
||||
}
|
||||
|
||||
.navbar-link {
|
||||
font-size: 1.2rem;
|
||||
font-family: 'Montserrat-light', sans-serif;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#test {
|
||||
color:rgb(236, 236, 236);
|
||||
color: rgb(236, 236, 236);
|
||||
}
|
||||
|
||||
#test:hover {
|
||||
color:rgb(216, 181, 24);
|
||||
color: rgb(216, 181, 24);
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -129,9 +127,8 @@ p {
|
|||
}
|
||||
|
||||
#features .container-fluid {
|
||||
padding: 3% 5% ;
|
||||
padding: 3% 5%;
|
||||
text-align: left;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -210,16 +207,22 @@ p {
|
|||
|
||||
|
||||
/* CTA Section */
|
||||
#cta{
|
||||
|
||||
#cta {
|
||||
padding: 3% 7%
|
||||
}
|
||||
|
||||
.map-img{
|
||||
width:70%;
|
||||
height:400px;
|
||||
margin: 3% auto;
|
||||
|
||||
.map-img {
|
||||
width: 70%;
|
||||
height: 400px;
|
||||
margin: 3% auto;
|
||||
}
|
||||
|
||||
|
||||
/*****Appointment Section *****/
|
||||
|
||||
.request-label {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -245,30 +248,44 @@ p {
|
|||
background-image: url("images/biking.jpg");
|
||||
}
|
||||
|
||||
|
||||
/* Style inputs with type="text", select elements and textareas */
|
||||
input[type=text], select, textarea {
|
||||
width: 100%; /* Full width */
|
||||
padding: 12px; /* Some padding */
|
||||
border: 1px solid #ccc; /* Gray border */
|
||||
border-radius: 4px; /* Rounded borders */
|
||||
box-sizing: border-box; /* Make sure that padding and width stays in place */
|
||||
margin-top: 6px; /* Add a top margin */
|
||||
margin-bottom: 16px; /* Bottom margin */
|
||||
resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
|
||||
}
|
||||
|
||||
/* Style the submit button with a specific background color etc */
|
||||
input[type=submit] {
|
||||
|
||||
input[type=text],
|
||||
select,
|
||||
textarea {
|
||||
width: 100%;
|
||||
/* Full width */
|
||||
padding: 12px;
|
||||
/* Some padding */
|
||||
border: 1px solid #ccc;
|
||||
/* Gray border */
|
||||
border-radius: 4px;
|
||||
/* Rounded borders */
|
||||
box-sizing: border-box;
|
||||
/* Make sure that padding and width stays in place */
|
||||
margin-top: 6px;
|
||||
/* Add a top margin */
|
||||
margin-bottom: 16px;
|
||||
/* Bottom margin */
|
||||
resize: vertical/* Allow the user to vertically resize the textarea (not horizontally) */
|
||||
}
|
||||
|
||||
|
||||
/* Style the submit button with a specific background color etc */
|
||||
|
||||
input[type=submit] {
|
||||
background-color: #d60024;
|
||||
color: white;
|
||||
padding: 12px 20px;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* When moving the mouse over the submit button, add a darker green color */
|
||||
input[type=submit]:hover {
|
||||
}
|
||||
|
||||
|
||||
/* When moving the mouse over the submit button, add a darker green color */
|
||||
|
||||
input[type=submit]:hover {
|
||||
background-color: #fa4664;
|
||||
}
|
||||
|
||||
}
|
||||
68
index.html
68
index.html
|
|
@ -106,39 +106,6 @@
|
|||
|
||||
</section>
|
||||
|
||||
<!-- Features -->
|
||||
|
||||
<!--
|
||||
|
||||
|
||||
<section class="colored-section3" id="features">
|
||||
|
||||
<div class="container-fluid">
|
||||
|
||||
<div class="row">
|
||||
<div class="feature-box col-lg-4">
|
||||
<i class="feature-icon fas fa-check-circle fa-4x"></i>
|
||||
<h3 class="feature-title">Fast and Easy</h3>
|
||||
<p>Just leave it to us, we can fix any problem within 3 days</p>
|
||||
</div>
|
||||
|
||||
<div class="feature-box col-lg-4">
|
||||
<i class="feature-icon fas fa-bullseye fa-4x"></i>
|
||||
<h3 class="feature-title">Precise</h3>
|
||||
<p>We can help you find what bike is right for you</p>
|
||||
</div>
|
||||
|
||||
<div class="feature-box col-lg-4">
|
||||
<i class="feature-icon fas fa-heart fa-4x"></i>
|
||||
<h3 class="feature-title">Guaranteed Satisfaction</h3>
|
||||
<p>All of our customers have loved their bikes. Take it from them.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</section>
|
||||
-->
|
||||
|
||||
<!-- Testimonials -->
|
||||
|
||||
|
|
@ -187,18 +154,6 @@
|
|||
|
||||
</section>
|
||||
|
||||
|
||||
<!-- Press -->
|
||||
<!---
|
||||
<section class="colored-section" id="press">
|
||||
<img class="press-img" src="images/techcrunch.png" alt="tc-logo">
|
||||
<img class="press-img" src="images/tnw.png" alt="tnw-logo">
|
||||
<img class="press-img" src="images/bizinsider.png" alt="biz-insider-logo">
|
||||
<img class="press-img" src="images/mashable.png" alt="mashable-logo">
|
||||
|
||||
</section>
|
||||
-->
|
||||
|
||||
<!-- Pricing -->
|
||||
|
||||
<section class="white-section" id="pricing">
|
||||
|
|
@ -312,8 +267,21 @@
|
|||
<div class="container-fluid">
|
||||
<form action="action_page.php">
|
||||
|
||||
<h2 class="big-heading">Book an Appointment</h2>
|
||||
<h2 class="big-heading">Book an Appointment</h2>
|
||||
|
||||
<!--- Select Services --->
|
||||
<select class="form-select form-select-sm" aria-label=".form-select-sm example">
|
||||
<option selected>Select Services</option>
|
||||
<option value="1">Brake Repair</option>
|
||||
<option value="2">Fixing Punctures</option>
|
||||
<option value="3">Full Repair/Maintenance</option>
|
||||
</select>
|
||||
<!--- Select Appointment Data --->
|
||||
<div class="request-label">
|
||||
<label for="appTime">Request Appointment for: </label>
|
||||
<input type="datetime-local" id="birthdaytime" name="birthdaytime">
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-6" style="float: right;">
|
||||
<input type="text" id="fname" name="firstname" placeholder="First Name">
|
||||
|
|
@ -323,19 +291,13 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<input type="text" id="subject" name="subject" placeholder="Subject">
|
||||
|
||||
<textarea id="message" name="message" placeholder="Your Message" style="height:200px"></textarea>
|
||||
|
||||
<label for="appTime">Request Appointment for: </label>
|
||||
<input type="datetime-local" id="birthdaytime" name="birthdaytime">
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<input type="submit" value="Submit">
|
||||
<input type="submit" value="Submit">
|
||||
|
||||
</form>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue