nekoya/web
nekoya/web
1
0
Fork 0
mirror of https://gitlab.com/nekoya/web.git synced 2025-04-09 23:52:57 +02:00
Code Issues Projects Releases Packages1 Wiki Activity

Modified Carousel on Home Page

Browse source
This commit is contained in:
Kelvin Samuel 2021-09-21 17:30:29 +07:00
parent 46744021be
commit eee523b4bd
2 changed files with 22 additions and 27 deletions

14
Style-index.css
View file

@ -16,10 +16,16 @@ body {
.carousel-inner{
margin-top: -3%;
width: 1400px;
margin-left: 4%;
width: 1518px;
}
.carousel-item{
text-align: center;
justify-content: center;
align-items: center;
position: relative;
}
.banner{
width: 100%;
margin-top: 30px;
@ -90,7 +96,7 @@ body {
border-radius: 3px;
margin: 0;
float: left;
margin-left: -1px;
justify-content: center;
}
.grid_sorting_button:first-child{
@ -109,7 +115,7 @@ body {
.product-grid{
width: 100%;
margin-top: 57px;
}
}
.product-item{
width: 20%;

35
index.html
View file

@ -49,7 +49,7 @@
</nav>
<header>
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel" style="width: 100%;">
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<div style="padding-top: 66px;">
<div class="col-13">
<ol class="carousel-indicators">
@ -59,13 +59,13 @@
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="assets/Carousel_1.jpg" alt="First slide" height="500px">
<img class="d-block w-100" src="assets/Carousel_1.jpg" alt="First slide" height="550px">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="assets/Carousel_2.jpg" alt="Second slide" height="500px">
<img class="d-block w-100" src="assets/Carousel_2.jpg" alt="Second slide" height="550px">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="assets/Carousel_3.jpg" alt="Third slide" height="500px">
<img class="d-block w-100" src="assets/Carousel_3.jpg" alt="Third slide" height="550px">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
@ -107,7 +107,7 @@
<div class="container">
<div class="row">
<div class="col text-center">
<div class="section-title new_arrivals_title">
<div class="section-title new_arrivals_title" style="margin-top: 3%;">
<h2>New Arrivals</h2>
</div>
</div>
@ -115,7 +115,7 @@
<div class="row align-items-center">
<div class="col text-center">
<div class="new_arrivals_sorting">
<div class="new_arrivals_sorting" style="margin-top: 3%; justify-content: center ;">
<ul class="arrivals_grid_sorting clearfix button-group filters-button-group">
<li class="grid_sorting_button button d-flex flex-column justify-content-center align-items-center active is-checked"
data-filter="*">All
@ -290,7 +290,7 @@
<div class="main_slider" style="background-image: url(assets/slider_1.jpg);">
<div class="container fill_hight">
<div class="row align-items-center fill_hight">
<div class="row align-items-center fill_hight" style="margin-top: -4%;">
<div class="col">
<div class="main_slider_content">
<h6>Spring / Summer Collection 2021</h6>
@ -306,14 +306,14 @@
<div class="container">
<div class="row">
<div class="col text-center">
<div class="section_title new_arrivals_title">
<div class="section_title new_arrivals_title" style="margin-top: 3%;">
<h2>Best Sellers</h2>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="product_slider_container">
<div class="product_slider_container" style="margin-top: 3%;">
<div class="owl-carousel owl-theme product_slider">
<div class="owl-item product_slider_item">
<div class="product-item men">
@ -502,9 +502,9 @@
</div>
</div>
<div class="benefit">
<div class="benefit" style="margin-top: 2%;">
<div class="container">
<div class="row benefit_row">
<div class="row benefit_row" style="justify-content: center;">
<div class="col-lg-3 benefit_col">
<div class="benefit_item d-flex flex-row align-items-center">
<div class="benefit_icon">
@ -527,17 +527,6 @@
</div>
</div>
</div>
<div class="col-lg-3 benefit_col">
<div class="benefit_item d-flex flex-row align-items-center">
<div class="benefit_icon">
<i class="fa fa-money" aria-hidden="true"></i>
</div>
<div class="benefit_content">
<h6>Cash on Delivery</h6>
<p>The Internet tend to Repeat</p>
</div>
</div>
</div>
<div class="col-lg-3 benefit_col">
<div class="benefit_item d-flex flex-row align-items-center">
<div class="benefit_icon">
@ -553,7 +542,7 @@
</div>
</div>
<div class="newsletter">
<div class="newsletter" style="margin-top: 2%;">
<div class="container">
<div class="row">
<div class="col-lg-6">