parent
7018ef193b
commit
9c94b364ef
@ -1,6 +1,6 @@
|
||||
{
|
||||
"/js/vue/Authentication/app.js": "/js/vue/Authentication/app.js?id=126dc6f3c173336b3c08",
|
||||
"/js/vue/Home/app.js": "/js/vue/Home/app.js?id=a473f236ecf7672e01a4",
|
||||
"/js/vue/Modules/CRM/app.js": "/js/vue/Modules/CRM/app.js?id=70272cd7c8699afb3cee",
|
||||
"/js/vue/User/app.js": "/js/vue/User/app.js?id=325f2bd5f24076b868ff"
|
||||
"/js/vue/Authentication/app.js": "/js/vue/Authentication/app.js?id=96a8a21c57f3f6607a24",
|
||||
"/js/vue/Home/app.js": "/js/vue/Home/app.js?id=cc6efa13405e4735fca0",
|
||||
"/js/vue/Modules/CRM/app.js": "/js/vue/Modules/CRM/app.js?id=7a7f9e30ad43098f5a32",
|
||||
"/js/vue/User/app.js": "/js/vue/User/app.js?id=31c08a25d351028ec785"
|
||||
}
|
||||
|
@ -1,231 +0,0 @@
|
||||
<template>
|
||||
<v-app>
|
||||
<div id="app">
|
||||
|
||||
<!-- <Loader></Loader> -->
|
||||
<!-- <Header></Header> -->
|
||||
<background></background>
|
||||
<v-container mt-5 p-5 fluid class="Login">
|
||||
<h2 class="Title"> WILLA ENGINE </h2>
|
||||
<transition name="Fade" mode="out-in" >
|
||||
<v-layout v-if="State === 'Login'" key="Login" column justify-center fill-height class="LoginContainer" ref="LoginContainer" >
|
||||
<v-flex xs12>
|
||||
<WM-PartTitle class="WM-Margin-T-20" TitleFa=" ورود " TitleEn=" Login " TextFaColor="white--text" TextColor="black--text" color="white"></WM-PartTitle>
|
||||
<v-flex mt-3>
|
||||
<v-text-field dark label=" شماره ی همراه خود را وارد کنید " hint="حداکثر 50 کاراکتر " color="white" prepend-icon="fas fa-phone"></v-text-field>
|
||||
</v-flex>
|
||||
<v-flex>
|
||||
<v-text-field dark type="password" label=" کلمه ی عبور " color="white" prepend-icon="fas fa-asterisk"></v-text-field>
|
||||
</v-flex>
|
||||
<v-flex>
|
||||
<v-btn outline fab color="white" @click="State = 'Register'">
|
||||
<v-icon>fas fa-plus</v-icon>
|
||||
</v-btn>
|
||||
<a href="/Main/Home">
|
||||
<v-btn outline fab color="white" >
|
||||
<v-icon>fas fa-chevron-left</v-icon>
|
||||
</v-btn>
|
||||
</a>
|
||||
</v-flex>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-layout v-if="State === 'Register'" key="Register" column justify-center fill-height class="RegisterContainer" ref="RegisterContainer" >
|
||||
<WM-PartTitle class="WM-Margin-T-20" TitleFa=" ثبت نام " TitleEn=" Sign Up " TextFaColor="white--text" TextColor="black--text" color="white"></WM-PartTitle>
|
||||
<v-flex mt-3>
|
||||
<v-text-field dark label=" نام و نام خانوادگی " hint="حداکثر 50 کاراکتر " color="white" prepend-icon="fas fa-user"></v-text-field>
|
||||
</v-flex>
|
||||
<v-flex>
|
||||
<v-text-field dark label=" شماره ی همراه خود را وارد کنید " hint="حداکثر 50 کاراکتر " color="white" prepend-icon="fas fa-phone"></v-text-field>
|
||||
</v-flex>
|
||||
<v-flex>
|
||||
<v-text-field dark type="password" label=" کلمه ی عبور " color="white" prepend-icon="fas fa-asterisk"></v-text-field>
|
||||
</v-flex>
|
||||
<v-flex>
|
||||
<v-btn outline fab color="white" @click="State = 'Login'">
|
||||
<v-icon>fas fa-plus</v-icon>
|
||||
</v-btn>
|
||||
<a href="/Main/Home">
|
||||
<v-btn outline fab color="white" >
|
||||
<v-icon>fas fa-chevron-left</v-icon>
|
||||
</v-btn>
|
||||
</a>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</transition>
|
||||
|
||||
</v-container>
|
||||
|
||||
|
||||
</div>
|
||||
</v-app>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Background from '@JS/Authentication/components/Background';
|
||||
import Tile from '@JS/Authentication/components/Tile';
|
||||
import Loader from '@JS/Authentication/components/Loader';
|
||||
import Header from '@JS/Authentication/components/Header';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
isShifted: false,
|
||||
loadingVisible: false,
|
||||
RegisterStatus: false,
|
||||
LoginStatus: false,
|
||||
State: 'Login'
|
||||
};
|
||||
},
|
||||
|
||||
components: {
|
||||
Header: Header,
|
||||
background: Background,
|
||||
Tile: Tile,
|
||||
Loader: Loader,
|
||||
},
|
||||
methods: {
|
||||
Register: function() {
|
||||
// console.log(this.$refs.RegisterContainer)
|
||||
this.RegisterStatus = !this.RegisterStatus;
|
||||
this.LoginStatus = !this.LoginStatus;
|
||||
},
|
||||
Log(value) {
|
||||
this.$store.commit('Log',value);
|
||||
}
|
||||
},
|
||||
beforeMount() {
|
||||
var self = this;
|
||||
setTimeout(function() {
|
||||
self.loading = ! self.loading;
|
||||
}, 2000)
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
.Title {
|
||||
letter-spacing: 15px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
|
||||
}
|
||||
.Login {
|
||||
// animation: FadeInUp 1s;
|
||||
// transition: all 600ms cubic-bezier(.17,.67,1,.01);
|
||||
|
||||
}
|
||||
.LoginContainer, .RegisterContainer {
|
||||
margin-top: 150px !important;
|
||||
width:600px;
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.Blur-enter-active, .Blur2-leave-active {
|
||||
animation: BlurIn 0.5s;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
.Blur-enter, .Blur2-leave-to /* .fade-leave-active below version 2.1.8 */ {
|
||||
animation: BlurOut 0.5s;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
|
||||
.FadeUp-enter-active, .FadeUp-leave-active {
|
||||
animation: FadeInUp 500ms;
|
||||
}
|
||||
.FadeUp-enter, .FadeUp-leave-to /* .fade-leave-active below version 2.1.8 */ {
|
||||
animation: FadeOutUp 200ms;
|
||||
}
|
||||
|
||||
|
||||
.Fade-enter-active, .Fade-leave-active {
|
||||
animation: FadeIn 500ms;
|
||||
}
|
||||
.Fade-enter, .Fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
|
||||
animation: FadeOut 500ms;
|
||||
}
|
||||
|
||||
|
||||
@keyframes FadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
display:none;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes FadeOut {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
display:none;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@keyframes FadeInUp {
|
||||
0% {
|
||||
display:none;
|
||||
opacity: 0;
|
||||
transform: translateY(300px);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
}
|
||||
}
|
||||
@keyframes FadeOutUp {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translateY(-300px);
|
||||
display:none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@keyframes BlurIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
filter: blur(40px);
|
||||
-webkit-filter: blur(40px);
|
||||
transform: translateY(50px) scale(3);
|
||||
-webkit-transform: translateY(50px) scale(3);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
filter: blur(0px);
|
||||
-webkit-filter: blur(0px);
|
||||
transform: translateY(0px) scale(1);
|
||||
-webkit-transform: translateY(0px) scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes BlurOut {
|
||||
0% {
|
||||
opacity: 1;
|
||||
filter: blur(0px);
|
||||
-webkit-filter: blur(0px);
|
||||
transform: translateY(0px) scale(1);
|
||||
-webkit-transform: translateY(0px) scale(1);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
filter: blur(40px);
|
||||
-webkit-filter: blur(40px);
|
||||
transform: translateY(0px) scale(0.4);
|
||||
-webkit-transform: translateY(0px) scale(0.4);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
@ -1,85 +0,0 @@
|
||||
import Vue from 'vue'
|
||||
import App from './App.vue'
|
||||
import router from './router.js'
|
||||
import store from './store'
|
||||
import VueScrollReveal from 'vue-scroll-reveal'
|
||||
import Vuetify from 'vuetify'
|
||||
import {
|
||||
global
|
||||
} from '@Global/mixins/global';
|
||||
|
||||
import 'popper.js'
|
||||
import 'bootstrap-v4-rtl'
|
||||
import 'bootstrap-v4-rtl/scss/bootstrap-rtl.scss'
|
||||
import 'bootstrap-select'
|
||||
import 'bootstrap-select/dist/css/bootstrap-select.css'
|
||||
import 'vuetify/dist/vuetify.min.css' // Ensure you are using css-loader
|
||||
import '@Global/assets/Font-Icons/css/fontello.css'
|
||||
import "@Global/scss/style.scss";
|
||||
|
||||
|
||||
// components
|
||||
import PartTitle from "@Global/components/Dividers/PartTitle.vue";
|
||||
import PageTitle from "@Global/components/Dividers/PageTitle.vue";
|
||||
import Checkbox from "@Global/components/Inputs/Checkbox.vue";
|
||||
import InfoBlock from "@Global/components/Misc/InfoBlock.vue";
|
||||
import Breadcrumbs from '@Global/components/Misc/Breadcrumbs';
|
||||
|
||||
|
||||
|
||||
Vue.component('WM-PartTitle', PartTitle)
|
||||
Vue.component('WM-PageTitle', PageTitle)
|
||||
Vue.component('WM-Checkbox', Checkbox)
|
||||
Vue.component('WM-InfoBlock', InfoBlock)
|
||||
Vue.component('wm-breadcrumbs', Breadcrumbs)
|
||||
|
||||
/**
|
||||
* First we will load all of this project's JavaScript dependencies which
|
||||
* includes Vue and other libraries. It is a great starting point when
|
||||
* building robust, powerful web applications using Vue and Laravel.
|
||||
*/
|
||||
|
||||
|
||||
window.Vue = require('vue');
|
||||
|
||||
/**
|
||||
* The following block of code may be used to automatically register your
|
||||
* Vue components. It will recursively scan this directory for the Vue
|
||||
* components and automatically register them with their "basename".
|
||||
*
|
||||
* Eg. ./components/ExampleComponent.vue -> <example-component></example-component>
|
||||
*/
|
||||
|
||||
// const files = require.context('./', true, /\.vue$/i)
|
||||
// files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default))
|
||||
|
||||
/**
|
||||
* Next, we will create a fresh Vue application instance and attach it to
|
||||
* the page. Then, you may begin adding components to this application
|
||||
* or customize the JavaScript scaffolding to fit your unique needs.
|
||||
*/
|
||||
|
||||
|
||||
Vue.use(Vuetify, {
|
||||
iconfont: 'fa',
|
||||
rtl: true,
|
||||
});
|
||||
|
||||
// Vue.config.productionTip = false;
|
||||
Vue.use(VueScrollReveal, {
|
||||
class: 'v-scroll-reveal', // A CSS class applied to elements with the v-scroll-reveal directive; useful for animation overrides.
|
||||
duration: 800,
|
||||
scale: 1,
|
||||
distance: '10px',
|
||||
mobile: false
|
||||
});
|
||||
|
||||
Vue.mixin(global);
|
||||
|
||||
|
||||
|
||||
const app = new Vue({
|
||||
router,
|
||||
store,
|
||||
render: h => h(App),
|
||||
}).$mount('#app');
|
@ -1,117 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="backgrounds">
|
||||
<canvas id="canvas__bg" width="32" height="32"></canvas>
|
||||
<div class="overlay gradient"></div>
|
||||
<div class="overlay vignette"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
methods: {
|
||||
moveGradient: function() {
|
||||
var c = document.getElementById("canvas__bg");
|
||||
var $ = c.getContext("2d");
|
||||
|
||||
var col = function(x, y, r, g, b) {
|
||||
$.fillStyle = "rgb(" + r + "," + g + "," + b + ")";
|
||||
$.fillRect(x, y, 1, 1);
|
||||
};
|
||||
|
||||
var R = function(x, y, t) {
|
||||
return Math.floor(130 + 64 * Math.cos((x * x - y * y) / 300 + t));
|
||||
};
|
||||
var G = function(x, y, t) {
|
||||
return Math.floor(
|
||||
0 +
|
||||
64 *
|
||||
Math.sin(
|
||||
(x * x * Math.cos(t / 4) + y * y * Math.sin(t / 3)) / 300
|
||||
)
|
||||
);
|
||||
};
|
||||
var B = function(x, y, t) {
|
||||
return Math.floor(
|
||||
250 +
|
||||
64 *
|
||||
Math.sin(
|
||||
5 * Math.sin(t / 9) +
|
||||
((x - 100) * (x - 100) + (y - 100) * (y - 100)) / 1100
|
||||
)
|
||||
);
|
||||
};
|
||||
|
||||
var t = 0;
|
||||
|
||||
var run = function() {
|
||||
for (let x = 0; x <= 35; x++) {
|
||||
for (let y = 0; y <= 35; y++) {
|
||||
col(x, y, R(x, y, t), G(x, y, t), B(x, y, t));
|
||||
}
|
||||
}
|
||||
t = t + 0.03;
|
||||
window.requestAnimationFrame(run);
|
||||
};
|
||||
(function() {
|
||||
setTimeout(function() {
|
||||
run(); // canvas background animation
|
||||
}, 100);
|
||||
})();
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.moveGradient();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
#canvas__bg,
|
||||
.overlay {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.backgrounds {
|
||||
position: fixed;
|
||||
z-index: -1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.overlay.gradient {
|
||||
background: #17a2b8;
|
||||
/* Old browsers */
|
||||
// background: -moz-linear-gradient( -45deg, #310089 0%, #5b007c 100%);
|
||||
/* FF3.6-15 */
|
||||
// background: -webkit-linear-gradient( -45deg, #310089 0%, #5b007c 100%);
|
||||
/* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(135deg, #000 0%, #ee3552 100%);
|
||||
/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
// filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#17a2b8', endColorstr='#ee3552', GradientType=1);
|
||||
/* IE6-9 fallback on horizontal gradient */
|
||||
opacity: 0.59;
|
||||
}
|
||||
|
||||
.overlay.vignette {
|
||||
// background: -moz-radial-gradient( center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
|
||||
/* FF3.6-15 */
|
||||
// background: -webkit-radial-gradient( center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
|
||||
/* Chrome10-25,Safari5.1-6 */
|
||||
background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0) 0%, #000000 100%);
|
||||
/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
// filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000', GradientType=1);
|
||||
/* IE6-9 fallback on horizontal gradient */
|
||||
opacity: 0.6;
|
||||
transition: opacity 4s cubic-bezier(0.19, 1, 0.22, 1) 0.5s;
|
||||
-webkit-transition: opacity 4s cubic-bezier(0.19, 1, 0.22, 1) 0.5s;
|
||||
}
|
||||
</style>
|
@ -1,29 +0,0 @@
|
||||
<template>
|
||||
<div class="Header">
|
||||
<div class="Logo">
|
||||
WILLA ENGINE
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
|
||||
export default {
|
||||
components: {
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.Header {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
.Logo {
|
||||
letter-spacing: 15px;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: calc( 50% - 150px );
|
||||
}
|
||||
</style>
|
@ -1,118 +0,0 @@
|
||||
<template>
|
||||
<div class="LoaderContainer">
|
||||
<div class="LoaderOverlay">
|
||||
<div class="Loader"> WILLA ENGINE </div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.LoaderContainer {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.LoaderOverlay {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: inherit;
|
||||
overflow: hidden;
|
||||
|
||||
}
|
||||
.LoaderContainer:after {
|
||||
content: '';
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: inherit;
|
||||
position: absolute;
|
||||
left: -25px;
|
||||
right: 0;
|
||||
top: -25px;
|
||||
bottom: 0;
|
||||
box-shadow: inset 0 0 0 200px rgba(255, 255, 255, 0.05);
|
||||
filter: blur(20px);
|
||||
}
|
||||
|
||||
.Loader {
|
||||
color: #fff;
|
||||
display:flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
margin: auto;
|
||||
background-color: transparent;
|
||||
animation: load 2.2s infinite 0s ease-in-out;
|
||||
animation-direction: alternate;
|
||||
font-size: 40px;
|
||||
}
|
||||
.Loader div {
|
||||
/* animation: BlurFade 4s linear infinite alternate; */
|
||||
animation: load 2.2s infinite 0s ease-in-out;
|
||||
animation-direction: alternate;
|
||||
margin-right: 15px;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
@-webkit-keyframes BlurFade {
|
||||
0% {
|
||||
opacity: 0;
|
||||
filter: blur(40px);
|
||||
-webkit-filter: blur(40px);
|
||||
transform: translateY(50px) rotateY(90deg) scale(3);
|
||||
-webkit-transform: translateY(50px) rotateY(90deg) scale(3);
|
||||
}
|
||||
25% {
|
||||
opacity: 1;
|
||||
filter: blur(0px);
|
||||
-webkit-filter: blur(0px);
|
||||
transform: translateY(0px) rotateY(0deg) scale(1.2);
|
||||
-webkit-transform: translateY(0px) rotateY(0deg) scale(1.2);
|
||||
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
filter: blur(0px);
|
||||
-webkit-filter: blur(0px);
|
||||
transform: translateY(0px) rotateY(0deg) scale(1.2);
|
||||
-webkit-transform: translateY(0px) scale(1.2);
|
||||
|
||||
}
|
||||
75% {
|
||||
opacity: 1;
|
||||
filter: blur(0px);
|
||||
-webkit-filter: blur(0px);
|
||||
transform: translateY(0px) rotateY(0deg) scale(1.2);
|
||||
-webkit-transform: translateY(0px) rotateY(0deg) scale(1.2);
|
||||
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
filter: blur(40px);
|
||||
-webkit-filter: blur(40px);
|
||||
transform: translateY(50px) rotateY(90deg) scale(3);
|
||||
-webkit-transform: translateY(50px) rotateY(90deg) scale(3);
|
||||
|
||||
}
|
||||
}
|
||||
@keyframes load {
|
||||
0% {
|
||||
opacity: 0.08;
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
filter: blur(5px);
|
||||
letter-spacing: 15px;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
font-size: 20px;
|
||||
font-weight:600;
|
||||
filter: blur(0);
|
||||
letter-spacing: 5px;
|
||||
}
|
||||
}
|
||||
</style>
|
@ -1,81 +0,0 @@
|
||||
<template>
|
||||
<v-layout wrap>
|
||||
<v-container>
|
||||
<v-icon class="Menu" @click.stop="drawer = !drawer" dark>fas fa-bars</v-icon>
|
||||
</v-container>
|
||||
|
||||
<v-navigation-drawer v-model="drawer" app temporary right>
|
||||
<v-list class="pa-1">
|
||||
<v-list-tile avatar>
|
||||
<v-list-tile-avatar>
|
||||
<img src="https://randomuser.me/api/portraits/men/85.jpg">
|
||||
</v-list-tile-avatar>
|
||||
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>John Leider</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
</v-list>
|
||||
|
||||
<v-list class="pt-0" dense>
|
||||
<v-divider></v-divider>
|
||||
|
||||
<v-list-tile v-for="item in items" :key="item.title">
|
||||
<v-list-tile-action>
|
||||
<v-icon>{{ item.icon }}</v-icon>
|
||||
</v-list-tile-action>
|
||||
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
</v-list>
|
||||
</v-navigation-drawer>
|
||||
</v-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
drawer: false,
|
||||
items: [
|
||||
{ title: 'Home', icon: 'dashboard' },
|
||||
{ title: 'About', icon: 'question_answer' }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.Menu {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 20px;
|
||||
}
|
||||
.drawer-trigger {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
padding: 40px;
|
||||
background-color: white;
|
||||
left: 400px;
|
||||
}
|
||||
|
||||
.drawer-trigger.active {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.drawer {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: -400px;
|
||||
bottom: 0px;
|
||||
background-color: white;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.drawer.open {
|
||||
left: 0px;
|
||||
}
|
||||
</style>
|
@ -1,38 +0,0 @@
|
||||
<template>
|
||||
<div class="blurred-box">
|
||||
Salam
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.blurred-box {
|
||||
position: relative;
|
||||
width: 250px;
|
||||
height: 350px;
|
||||
top: calc(50% - 175px);
|
||||
left: calc(50% - 125px);
|
||||
background: inherit;
|
||||
border-radius: 2px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.blurred-box:after {
|
||||
content: '';
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
background: inherit;
|
||||
position: absolute;
|
||||
left: -25px;
|
||||
right: 0;
|
||||
top: -25px;
|
||||
bottom: 0;
|
||||
box-shadow: inset 0 0 0 200px rgba(255, 255, 255, 0.05);
|
||||
filter: blur(10px);
|
||||
}
|
||||
</style>
|
@ -1,34 +0,0 @@
|
||||
import Vue from 'vue'
|
||||
import Router from 'vue-router'
|
||||
|
||||
Vue.use(Router)
|
||||
|
||||
const router = new Router({
|
||||
mode: 'history',
|
||||
base: process.env.BASE_URL,
|
||||
linkActiveClass: "WM-Active",
|
||||
linkExactActiveClass: "WM-Exact-Active",
|
||||
routes: [
|
||||
// {
|
||||
// path: '*',
|
||||
// redirect: '/Login'
|
||||
// },
|
||||
|
||||
]
|
||||
})
|
||||
|
||||
router.beforeResolve((to, from, next) => {
|
||||
if (to.name && router.app.$children[0] != undefined)
|
||||
router.app.$children[0].loadingVisible = true;
|
||||
|
||||
setTimeout(() => {
|
||||
next();
|
||||
}, 500)
|
||||
})
|
||||
|
||||
router.afterEach(() => {
|
||||
if (router.app.$children[0] != undefined)
|
||||
router.app.$children[0].loadingVisible = false;
|
||||
})
|
||||
|
||||
export default router;
|
@ -1,20 +0,0 @@
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
|
||||
Vue.use(Vuex)
|
||||
|
||||
export default new Vuex.Store({
|
||||
state: {
|
||||
UserDetails: false,
|
||||
UserRoles: false,
|
||||
OrderDetails: false,
|
||||
OrderStatus: false,
|
||||
SendEmail: false,
|
||||
SendSMS: false
|
||||
},
|
||||
mutations: {
|
||||
Log(state, ToLog) {
|
||||
console.log(ToLog);
|
||||
}
|
||||
}
|
||||
})
|
@ -1,129 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" rel="stylesheet">
|
||||
{{-- <link href="{{ asset('css/styles.css') }}" rel="stylesheet"> --}}
|
||||
|
||||
<title> New Design </title>
|
||||
|
||||
<!-- Styles -->
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div id='cursor'></div>
|
||||
{{-- <div class="Loader">
|
||||
<div class="W">W</div>
|
||||
<div class="I">I</div>
|
||||
<div class="L">L</div>
|
||||
<div class="L">L</div>
|
||||
<div class="A">A</div>
|
||||
<div class="E">E</div>
|
||||
<div class="N">N</div>
|
||||
<div class="G">G</div>
|
||||
<div class="I">I</div>
|
||||
<div class="N">N</div>
|
||||
<div class="E">E</div>
|
||||
</div> --}}
|
||||
|
||||
|
||||
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
<style lang="scss">
|
||||
#app {
|
||||
background-color: transparent;
|
||||
}
|
||||
.backgrounds {
|
||||
width: 100%;
|
||||
height:100%;
|
||||
}
|
||||
.c-hamburger {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
(function () {
|
||||
|
||||
"use strict";
|
||||
|
||||
var w = window;
|
||||
|
||||
const b = document.getElementsByTagName("body")[0];
|
||||
b.addEventListener("mousemove", mouseMove);
|
||||
|
||||
var cursor = document.getElementById('cursor');
|
||||
b.addEventListener("mousedown", cursorClick);
|
||||
b.addEventListener("mouseup", cursorUnclick);
|
||||
|
||||
|
||||
var panel = document.querySelectorAll(".section.active");
|
||||
var text = document.querySelectorAll(".section-tagline-wrapper");
|
||||
var img = document.querySelectorAll(".section-img-wrapper");
|
||||
var no = document.querySelectorAll(".section-no-wrapper");
|
||||
|
||||
var cImg = document.querySelectorAll('.pattern');
|
||||
|
||||
var patterns = document.querySelectorAll('.pattern');
|
||||
|
||||
|
||||
function mouseMove(e) {
|
||||
// Custom Cursor
|
||||
cursor.style.left = e.clientX + 'px';
|
||||
cursor.style.top = e.clientY + 'px';
|
||||
|
||||
// if (menu.classList.contains('active')) {
|
||||
// return
|
||||
// }
|
||||
|
||||
};
|
||||
function clipMask(pattern, e) {
|
||||
pattern.style.setProperty("--clip-position", e.clientX + 'px ' + e.clientY + 'px');
|
||||
}
|
||||
|
||||
function cursorClick(e) {
|
||||
cursor.classList.add("clicked")
|
||||
}
|
||||
|
||||
function cursorUnclick(e) {
|
||||
setTimeout(function () {
|
||||
cursor.classList.remove("clicked")
|
||||
}, 300);
|
||||
}
|
||||
|
||||
|
||||
function cursorHover(e) {
|
||||
cursor.classList.add("hover")
|
||||
}
|
||||
|
||||
function cursorUnhover(e) {
|
||||
cursor.classList.remove("hover")
|
||||
}
|
||||
|
||||
|
||||
var hovers = document.querySelectorAll(".hover-target");
|
||||
|
||||
for (var i = hovers.length - 1; i >= 0; i--) {
|
||||
var hover = hovers[i];
|
||||
hoverHandler(hover);
|
||||
};
|
||||
|
||||
function hoverHandler(hover) {
|
||||
hover.addEventListener("mouseover", cursorHover);
|
||||
hover.addEventListener("mouseout", cursorUnhover);
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
{{-- <script type="text/javascript" src="{{ asset('js/vendors.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ asset('js/scripts.js') }}"></script> --}}
|
||||
|
||||
<script src="{{ mix('js/vue/Authentication/app.js') }}"></script>
|
||||
</html>
|
Loading…
Reference in new issue