merdan
/
sarga
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added image lazyloading in velocity theme

This commit is contained in:
jitendra 2020-10-13 19:52:51 +05:30
parent 6618c3658a
commit 9107e57383
10 changed files with 29 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/Webkul/Velocity/package.json
View File

@ -22,6 +22,7 @@
"accounting": "^0.4.1",
"bootstrap-sass": "^3.4.1",
"font-awesome": "^4.7.0",
"lazysizes": "^5.2.2",
"material-icons": "^0.3.1",
"vee-validate": "^2.2.15",
"vue-slider-component": "^3.1.0",

2
packages/Webkul/Velocity/publishable/assets/js/velocity.js vendored
View File

File diff suppressed because one or more lines are too long

2
packages/Webkul/Velocity/publishable/assets/mix-manifest.json
View File

@ -1,5 +1,5 @@
{
"/js/velocity.js": "/js/velocity.js?id=46abb4f85cbb52473cec",
"/js/velocity.js": "/js/velocity.js?id=8aa00114ba3523e8303b",
"/css/velocity-admin.css": "/css/velocity-admin.css?id=4322502d80a0e4a0affd",
"/css/velocity.css": "/css/velocity.css?id=a37ae1fb6f34223126b8"
}

1
packages/Webkul/Velocity/src/Resources/assets/js/app.js vendored
View File

@ -7,6 +7,7 @@ import de from 'vee-validate/dist/locale/de';
import ar from 'vee-validate/dist/locale/ar';
import VeeValidate, { Validator } from 'vee-validate';
import axios from 'axios';
import 'lazysizes';
window.axios = axios;
window.VeeValidate = VeeValidate;

16
packages/Webkul/Velocity/src/Resources/views/shop/home/advertisements/advertisement-four.blade.php
View File

@ -21,27 +21,27 @@
<div class="row">
@if ( isset($advertisementFour[0]))
<a @if (isset($one)) href="{{ $one }}" @endif class="col-lg-4 col-12 no-padding" aria-label="Advertisement">
<img class="col-12" src="{{ asset('/storage/' . $advertisementFour[0]) }}" alt="" />
<img class="col-12 lazyload" data-src="{{ asset('/storage/' . $advertisementFour[0]) }}" alt="" />
</a>
@endif
<div class="col-lg-4 col-12 offers-ct-panel">
@if ( isset($advertisementFour[1]))
<a @if (isset($two)) href="{{ $two }}" @endif class="row col-12 remove-padding-margin" aria-label="Advertisement">
<img class="col-12 offers-ct-top" src="{{ asset('/storage/' . $advertisementFour[1]) }}" alt="" />
<img class="col-12 offers-ct-top lazyload" data-src="{{ asset('/storage/' . $advertisementFour[1]) }}" alt="" />
</a>
@endif
@if ( isset($advertisementFour[2]))
<a @if (isset($three)) href="{{ $three }}" @endif class="row col-12 remove-padding-margin" aria-label="Advertisement">
<img class="col-12 offers-ct-bottom" src="{{ asset('/storage/' . $advertisementFour[2]) }}" alt="" />
<img class="col-12 offers-ct-bottom lazyload" data-src="{{ asset('/storage/' . $advertisementFour[2]) }}" alt="" />
</a>
@endif
</div>
@if ( isset($advertisementFour[3]))
<a @if (isset($four)) href="{{ $four }}" @endif class="col-lg-4 col-12 no-padding" aria-label="Advertisement">
<img class="col-12" src="{{ asset('/storage/' . $advertisementFour[3]) }}" alt="" />
<img class="col-12 lazyload" data-src="{{ asset('/storage/' . $advertisementFour[3]) }}" alt="" />
</a>
@endif
</div>
@ -53,20 +53,20 @@
<div class="container-fluid advertisement-four-container">
<div class="row">
<a @if (isset($one)) href="{{ $one }}" @endif class="col-lg-4 col-12 no-padding" aria-label="Advertisement">
<img class="col-12" src="{{ asset('/themes/velocity/assets/images/big-sale-banner.webp') }}" alt="" />
<img class="col-12 lazyload" data-src="{{ asset('/themes/velocity/assets/images/big-sale-banner.webp') }}" alt="" />
</a>
<div class="col-lg-4 col-12 offers-ct-panel">
<a @if (isset($two)) href="{{ $two }}" @endif class="row col-12 remove-padding-margin" aria-label="Advertisement">
<img class="col-12 offers-ct-top" src="{{ asset('/themes/velocity/assets/images/seasons.webp') }}" alt="" />
<img class="col-12 offers-ct-top lazyload" data-src="{{ asset('/themes/velocity/assets/images/seasons.webp') }}" alt="" />
</a>
<a @if (isset($three)) href="{{ $three }}" @endif class="row col-12 remove-padding-margin" aria-label="Advertisement">
<img class="col-12 offers-ct-bottom" src="{{ asset('/themes/velocity/assets/images/deals.webp') }}" alt="" />
<img class="col-12 offers-ct-bottom lazyload" data-src="{{ asset('/themes/velocity/assets/images/deals.webp') }}" alt="" />
</a>
</div>
<a @if (isset($four)) href="{{ $four }}" @endif class="col-lg-4 col-12 no-padding" aria-label="Advertisement">
<img class="col-12" src="{{ asset('/themes/velocity/assets/images/kids.webp') }}" alt="" />
<img class="col-12 lazyload" data-src="{{ asset('/themes/velocity/assets/images/kids.webp') }}" alt="" />
</a>
</div>
</div>

12
packages/Webkul/Velocity/src/Resources/views/shop/home/advertisements/advertisement-three.blade.php
View File

@ -21,19 +21,19 @@
<div class="row">
@if ( isset($advertisementThree[0]))
<a @if (isset($one)) href="{{ $one }}" @endif class="col-lg-6 col-md-12 no-padding">
<img src="{{ asset('/storage/' . $advertisementThree[0]) }}" class="full-width" alt="" />
<img data-src="{{ asset('/storage/' . $advertisementThree[0]) }}" class="full-width lazyload" alt="" />
</a>
@endif
<div class="col-lg-6 col-md-12 second-panel">
@if ( isset($advertisementThree[1]))
<a @if (isset($two)) href="{{ $two }}" @endif class="row top-container">
<img src="{{ asset('/storage/' . $advertisementThree[1]) }}" class="col-12 pr0" alt="" />
<img data-src="{{ asset('/storage/' . $advertisementThree[1]) }}" class="col-12 pr0 lazyload" alt="" />
</a>
@endif
@if ( isset($advertisementThree[2]))
<a @if (isset($three)) href="{{ $three }}" @endif class="row bottom-container">
<img src="{{ asset('/storage/' . $advertisementThree[2]) }}" class="col-12 pr0" alt="" />
<img data-src="{{ asset('/storage/' . $advertisementThree[2]) }}" class="col-12 pr0 lazyload" alt="" />
</a>
@endif
</div>
@ -46,15 +46,15 @@
<div class="container-fluid advertisement-three-container">
<div class="row">
<a @if (isset($one)) href="{{ $one }}" @endif class="col-lg-6 col-md-12 no-padding">
<img src="{{ asset('/themes/velocity/assets/images/headphones.webp') }}" class="full-width" alt="" />
<img data-src="{{ asset('/themes/velocity/assets/images/headphones.webp') }}" class="full-width lazyload" alt="" />
</a>
<div class="col-lg-6 col-md-12 second-panel">
<a @if (isset($two)) href="{{ $two }}" @endif class="row top-container">
<img src="{{ asset('/themes/velocity/assets/images/watch.webp') }}" class="col-12 pr0" alt="" />
<img data-src="{{ asset('/themes/velocity/assets/images/watch.webp') }}" class="col-12 pr0 lazyload" alt="" />
</a>
<a @if (isset($three)) href="{{ $three }}" @endif class="row bottom-container">
<img src="{{ asset('/themes/velocity/assets/images/kids-2.webp') }}" class="col-12 pr0" alt="" />
<img data-src="{{ asset('/themes/velocity/assets/images/kids-2.webp') }}" class="col-12 pr0 lazyload" alt="" />
</a>
</div>
</div>

8
packages/Webkul/Velocity/src/Resources/views/shop/home/advertisements/advertisement-two.blade.php
View File

@ -21,13 +21,13 @@
<div class="row">
@if ( isset($advertisementTwo[0]))
<a class="col-lg-9 col-md-12 no-padding">
<img src="{{ asset('/storage/' . $advertisementTwo[0]) }}" alt="" />
<img data-src="{{ asset('/storage/' . $advertisementTwo[0]) }}" class="lazyload" alt="" />
</a>
@endif
@if ( isset($advertisementTwo[1]))
<a class="col-lg-3 col-md-12 pr0">
<img src="{{ asset('/storage/' . $advertisementTwo[1]) }}" alt="" />
<img data-src="{{ asset('/storage/' . $advertisementTwo[1]) }}" class="lazyload" alt="" />
</a>
@endif
</div>
@ -39,11 +39,11 @@
<div class="container-fluid advertisement-two-container">
<div class="row">
<a class="col-lg-9 col-md-12 no-padding">
<img src="{{ asset('/themes/velocity/assets/images/toster.webp') }}" alt="" />
<img data-src="{{ asset('/themes/velocity/assets/images/toster.webp') }}" class="lazyload" alt="" />
</a>
<a class="col-lg-3 col-md-12 pr0">
<img src="{{ asset('/themes/velocity/assets/images/trimmer.webp') }}" alt="" />
<img data-src="{{ asset('/themes/velocity/assets/images/trimmer.webp') }}" class="lazyload" alt="" />
</a>
</div>
</div>

10
packages/Webkul/Velocity/src/Resources/views/shop/home/category-with-custom-option.blade.php
View File

@ -8,7 +8,7 @@
<div class="container-fluid category-with-custom-options">
<div class="row">
<div class="col pr15">
<img src="{{ asset ('/storage/' . $category['2']->image) }}" alt="" />
<img data-src="{{ asset ('/storage/' . $category['2']->image) }}" class="lazyload" alt="" />
</div>
<div class="col">
@ -37,7 +37,7 @@
</div>
<div class="col pr15">
<img src="{{ asset ('/storage/' . $category['0']->image) }}" alt=""/>
<img data-src="{{ asset ('/storage/' . $category['0']->image) }}" class="lazyload" alt=""/>
</div>
<div class="col">
@ -92,7 +92,7 @@
</div>
</div>
<div class="col mt15">
<img src="{{ asset ('/storage/' . $category['3']->image) }}" alt="" />
<img data-src="{{ asset ('/storage/' . $category['3']->image) }}" class="lazyload" alt="" />
</div>
<div class="col mt15 mr15">
@ -121,7 +121,7 @@
</div>
<div class="col">
<img src="{{ asset ('/storage/' . $category['1']->image) }}" alt="" />
<img data-src="{{ asset ('/storage/' . $category['1']->image) }}" class="lazyload" alt="" />
</div>
</div>
@ -131,7 +131,7 @@
@foreach ($category as $categoryItem)
<div class="smart-category-container">
<div class="col-12">
<img src="{{ asset ('/storage/' . $categoryItem->image) }}" alt="" />
<img data-src="{{ asset ('/storage/' . $categoryItem->image) }}" class="lazyload" alt="" />
</div>
<div class="col-12">

2
packages/Webkul/Velocity/src/Resources/views/shop/home/popular-categories.blade.php
View File

@ -12,7 +12,7 @@
<div class="col-lg-3 col-md-12 popular-category-wrapper">
<div class="card col-12 no-padding">
<div class="category-image">
<img src="{{ asset('/storage/' . $categoryDetails->image) }}" alt="" />
<img data-src="{{ asset('/storage/' . $categoryDetails->image) }}" class="lazyload" alt="" />
</div>
<div class="card-description">

2
public/.htaccess
View File

@ -21,7 +21,7 @@
</IfModule>
<IfModule mod_expires.c>
<filesMatch ".(css|jpg|jpeg|png|gif|js|svg|ico|webp)$">
<filesMatch ".(css|jpg|jpeg|png|gif|js|svg|ico|webp|ttf)$">
Header set Cache-Control "max-age=31536000, public"
</filesMatch>
</IfModule>