This commit is contained in:
rahul shukla 2018-10-01 13:58:06 +05:30
commit ccba2eb6a2
11 changed files with 579 additions and 1654 deletions

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,144 @@
// product card, requires no changes for responsiveness.
.product-card {
.product-image {
max-height: 350px;
max-width: 280px;
margin-bottom: 10px;
background: #F2F2F2;
img {
display: block;
width: 100%;
}
}
.product-name {
margin-bottom: 14px;
width: 100%;
color: $font-color;
a {
color: $font-color;
}
}
.product-description {
margin-bottom: 14px;
display: none;
}
.product-ratings {
width: 100%;
margin-bottom: 14px;
.icon {
width: 16px;
height: 16px;
}
.total-reviews {
display: none;
}
}
.cart-fav-seg {
display: inline-flex;
width: 100%;
align-items: center;
.addtocart {
border-radius: 0px;
margin-right: 10px;
text-transform: uppercase;
white-space: nowrap;
}
}
}
//layered filter wrapper styles
.layered-filter-wrapper {
width: 25%;
float: left;
padding-right: 20px;
min-height: 1px;
.filter-title {
border-bottom: 1px solid $border-color;
color: $font-color;
padding: 10px 0;
}
.filter-attributes {
.filter-attributes-item {
border-bottom: 1px solid $border-color;
padding-bottom: 10px;
.filter-attributes-title {
padding: 10px 40px 0 10px;
color: #5E5E5E;
cursor: pointer;
position: relative;
.remove-filter-link {
font-weight: 400;
color: $brand-color;
margin-right: 10px;
}
.icon {
background-image: url('../images/arrow-down.svg') !important;
width: 10px;
height: 10px;
position: absolute;
right: 15px;
top: 14px;
}
}
.filter-attributes-content {
padding: 10px;
display: none;
ol.items {
padding: 0;
margin: 0;
list-style: none none;
li.item {
padding: 8px 0;
color: #5E5E5E;
.checkbox {
margin: 0;
.checkbox-view {
height: 16px;
width: 16px;
background-image: url("../images/checkbox.svg");
}
input:checked + .checkbox-view {
background-image: url("../images/checkbox-checked.svg");
}
}
}
}
.price-range-wrapper {
margin-top: 21px;
}
}
&.active {
.filter-attributes-content {
display: block;
}
.filter-attributes-title .icon {
background-image: url('../images//arrow-up.svg') !important;
}
}
}
}
}

View File

@ -0,0 +1,125 @@
body {
margin: 0;
padding: 0;
font-weight: 500;
max-width: 100%;
width: auto;
color: $font-color;
font-size: $font-size-base;
}
* {
font-family: "Montserrat", sans-serif;
}
.btn.btn-primary{
border-radius: 0px;
}
//margin bottom classes
.mb-10 {
margin-bottom: 10px;
}
.mb-15 {
margin-bottom: 15px;
}
.mb-20 {
margin-bottom: 20px;
}
.mb-25 {
margin-bottom: 25px;
}
.mb-30 {
margin-bottom: 30px;
}
.mb-35 {
margin-bottom: 35px;
}
.mb-40 {
margin-bottom: 40px;
}
.mb-45 {
margin-bottom: 45px;
}
.mb-50 {
margin-bottom: 50px;
}
.mb-60 {
margin-bottom: 60px;
}
.mb-70 {
margin-bottom: 70px;
}
.mb-80 {
margin-bottom: 80px;
}
.mb-90 {
margin-bottom: 90px;
}
//margin-top
.mt-10 {
margin-top: 10px;
}
.mt-15 {
margin-top: 15px;
}
.mt-20 {
margin-top: 20px;
}
.mt-25 {
margin-top: 25px;
}
.mt-30 {
margin-top: 30px;
}
.mt-35 {
margin-top: 35px;
}
.mt-40 {
margin-top: 40px;
}
.mt-45 {
margin-top: 45px;
}
.mt-50 {
margin-top: 50px;
}
.mt-60 {
margin-top: 60px;
}
.mt-70 {
margin-top: 70px;
}
.mt-80 {
margin-top: 80px;
}
.mt-90 {
margin-top: 90px;
}

View File

@ -49,11 +49,11 @@
@if ($product->type == 'configurable')
<div class="summary">
{{-- @foreach (cart::getItemAttributeOptionDetails($item) as $key => $option)
@foreach (cart::getItemAttributeOptionDetails($item) as $key => $option)
{{ (!$key ? '' : ' , ') . $option['attribute_name'] . ' : ' . $option['option_label'] }}
@endforeach --}}
@endforeach
</div>
@endif

View File

@ -4,7 +4,7 @@
<span class="featured-seperator" style="color:lightgrey;">_____</span>
</div>
<div class="featured-grid product-grid max-4-col">
<div class="featured-grid product-grid-4">
<div class="product-card">
<div class="product-image">
<img src="vendor/webkul/shop/assets/images/grid.png" />

View File

@ -4,7 +4,7 @@
<span class="featured-seperator" style="color:lightgrey;">_____</span>
</div>
<div class="new-product-grid product-grid max-4-col">
<div class="new-product-grid product-grid-4">
<div class="product-card">
<div class="product-image">
<img src="vendor/webkul/shop/assets/images/new.png" />

View File

@ -35,7 +35,7 @@
</div>
<div class="search-suggestion">
{{-- <div class="search-suggestion">
<div class="control-group">
<span class="icon search-icon"></span>
@ -43,7 +43,7 @@
<span class="icon icon-menu-back right"></span>
</div>
{{-- <div class="suggestion">
<div class="suggestion">
<span>Designer sarees</span>
</div>
<div class="suggestion">
@ -51,13 +51,14 @@
</div>
<div class="suggestion">
<span>Border Sarees</span>
</div> --}}
</div>
</div>
<div class="nav-responsive">
@include('shop::layouts.header.nav-menu.navmenu')
</div>
</div> --}}
@include('shop::layouts.footer')

View File

@ -2,46 +2,54 @@
@section('content-wrapper')
@include ('shop::products.list.layered-navigation')
@inject ('productRepository', 'Webkul\Product\Repositories\ProductRepository')
<div class="main" style="display: inline-block">
<div class="main">
@inject ('productRepository', 'Webkul\Product\Repositories\ProductRepository')
<div class="category-block">
@include ('shop::products.list.layered-navigation')
<?php $products = $productRepository->findAllByCategory($category->id); ?>
<div class="category-block">
@include ('shop::products.list.toolbar')
<div class="hero-image mb-15">
<img src="https://images.pexels.com/photos/428338/pexels-photo-428338.jpeg?cs=srgb&dl=adolescent-casual-cute-428338.jpg&fm=jpg" />
</div>
@inject ('toolbarHelper', 'Webkul\Product\Product\Toolbar')
<?php $products = $productRepository->findAllByCategory($category->id); ?>
@if ($toolbarHelper->getCurrentMode() == 'grid')
<div class="product-grid max-3-col">
@include ('shop::products.list.toolbar')
@foreach ($products as $product)
@inject ('toolbarHelper', 'Webkul\Product\Product\Toolbar')
@include ('shop::products.list.card', ['product' => $product])
@if ($toolbarHelper->getCurrentMode() == 'grid')
<div class="product-grid-3">
@endforeach
@foreach ($products as $product)
@include ('shop::products.list.card', ['product' => $product])
@endforeach
</div>
@else
<div class="product-list">
@foreach ($products as $product)
@include ('shop::products.list.card', ['product' => $product])
@endforeach
</div>
@endif
<div class="bottom-toolbar">
{{ $products->appends(request()->input())->links() }}
</div>
</div>
@else
<div class="product-list">
@foreach ($products as $product)
@include ('shop::products.list.card', ['product' => $product])
@endforeach
</div>
@endif
<div class="bottom-toolbar">
{{ $products->appends(request()->input())->links() }}
</div>
</div>
@stop

View File

@ -22,9 +22,7 @@
</filter-attribute-item>
</div>
</div>
</div>
</script>

View File

@ -1,6 +1,6 @@
@inject ('toolbarHelper', 'Webkul\Product\Product\Toolbar')
<div class="top-toolbar">
<div class="top-toolbar mb-35">
<div class="page-info">
<span>

View File

@ -483,6 +483,44 @@ body {
margin-top: 60px;
}
.nav-responsive ul.nav {
display: block;
font-size: 16px;
height: 48px;
max-width: 100%;
width: auto;
margin-left: auto;
margin-right: auto;
}
.nav-responsive .nav ul {
margin: 0;
padding: 0;
border: 1px solid #B1B1B1;
-webkit-box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, 0.4);
box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, 0.4);
}
.nav-responsive .nav a {
display: block;
color: #242424;
text-decoration: none;
padding: 0.8em 0.3em 0.8em 0.5em;
text-transform: uppercase;
letter-spacing: 2px;
position: relative;
}
.nav-responsive .nav {
vertical-align: top;
display: inline-block;
}
.nav-responsive .nav li {
position: relative;
height: 45px;
}
@media only screen and (max-width: 770px) {
.header .header-top div.left-content ul.search-container li.search-group {
display: none;