first commit
This commit is contained in:
98
app/layouts/default.vue
Normal file
98
app/layouts/default.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<div>
|
||||
<slot />
|
||||
<div class="progress-wrap">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
useHead({
|
||||
title: 'Blog details Sidebar Right || Avigo Multipurpose Theme',
|
||||
meta: [
|
||||
{ charset: 'utf-8' },
|
||||
{ name: 'viewport', content: 'width=device-width, initial-scale=1.0' },
|
||||
],
|
||||
link: [
|
||||
{ rel: 'stylesheet', href: '/assets/css/bootstrap.min.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/font-awesome-pro.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/magnific-popup.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/owl.carousel.min.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/slick-slider.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/meanmenu.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/typography.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/preloader.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/mobile-menu.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/header.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/footer.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/aos.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/fonts.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/blog-page.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/nice-select.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/modal-video.min.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/responsive.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/comon.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/avigo-unit.css' },
|
||||
{ rel: 'stylesheet', href: '/assets/css/avigo-core.css' },
|
||||
{ rel: 'stylesheet', href: '/style.css' }
|
||||
],
|
||||
script: [
|
||||
{ src: '/assets/js/jquery-3-6-0.min.js', defer: true },
|
||||
{ src: '/assets/js/bootstrap.min.js', defer: true },
|
||||
{ src: '/assets/js/fontawesome.js', defer: true },
|
||||
{ src: '/assets/js/owl.carousel.min.js', defer: true },
|
||||
{ src: 'https://unpkg.com/aos@next/dist/aos.js', defer: true, crossorigin: 'anonymous' },
|
||||
{ src: '/assets/js/jquery.magnific-popup.min.js', defer: true },
|
||||
{ src: 'https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.min.js', defer: true, crossorigin: 'anonymous' },
|
||||
{ src: 'https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js', defer: true, integrity: 'sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3', crossorigin: 'anonymous' },
|
||||
{ src: '/assets/js/slick-slider.js', defer: true },
|
||||
{ src: '/assets/js/mobile-menu.js', defer: true },
|
||||
{ src: '/assets/js/tilt.jquery.js', defer: true },
|
||||
{ src: '/assets/js/jquery.lineProgressbar.js', defer: true },
|
||||
{ src: '/assets/js/jquery.nice-select.js', defer: true },
|
||||
{ src: '/assets/js/mobile-meanmenu.js', defer: true },
|
||||
{ src: '/assets/js/modal-video.min.js', defer: true },
|
||||
{ src: '/assets/js/main.js', defer: true },
|
||||
]
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
// page-progress
|
||||
var progressPath = document.querySelector(".progress-wrap path");
|
||||
if (progressPath) {
|
||||
var pathLength = progressPath.getTotalLength();
|
||||
progressPath.style.transition = progressPath.style.WebkitTransition =
|
||||
"none";
|
||||
progressPath.style.strokeDasharray = pathLength + " " + pathLength;
|
||||
progressPath.style.strokeDashoffset = pathLength;
|
||||
progressPath.getBoundingClientRect();
|
||||
progressPath.style.transition = progressPath.style.WebkitTransition =
|
||||
"stroke-dashoffset 10ms linear";
|
||||
var updateProgress = function () {
|
||||
var scroll = $(window).scrollTop();
|
||||
var height = $(document).height() - $(window).height();
|
||||
var progress = pathLength - (scroll * pathLength) / height;
|
||||
progressPath.style.strokeDashoffset = progress;
|
||||
};
|
||||
updateProgress();
|
||||
$(window).scroll(updateProgress);
|
||||
var offset = 50;
|
||||
var duration = 550;
|
||||
jQuery(window).on("scroll", function () {
|
||||
if (jQuery(this).scrollTop() > offset) {
|
||||
jQuery(".progress-wrap").addClass("active-progress");
|
||||
} else {
|
||||
jQuery(".progress-wrap").removeClass("active-progress");
|
||||
}
|
||||
});
|
||||
jQuery(".progress-wrap").on("click", function (event) {
|
||||
event.preventDefault();
|
||||
jQuery("html, body").animate({ scrollTop: 0 }, duration);
|
||||
return false;
|
||||
});
|
||||
}
|
||||
})
|
||||
</script>
|
||||
Reference in New Issue
Block a user