change nuxt base

2020-06-03 14:13:34 +04:30
parent b3421baf3c
commit 75f8971cb3
69 changed files with 52497 additions and 689 deletions
@@ -1,15 +0,0 @@
 root = true
 [*]
 charset = utf-8
 end_of_line = lf
 insert_final_newline = true
 indent_style = space
 indent_size = 4
 trim_trailing_whitespace = true
 [*.md]
 trim_trailing_whitespace = false
 [*.{yml,yaml}]
 indent_size = 2
@@ -1,13 +0,0 @@
 # editorconfig.org
 root = true
 [*]
 indent_style = space
 indent_size = 2
 end_of_line = lf
 charset = utf-8
 trim_trailing_whitespace = true
 insert_final_newline = true
 [*.md]
 trim_trailing_whitespace = false
@@ -1,6 +1,6 @@
-# AeakRail
+# ArakRail
-> Arak Rail front-end
+> ArakRail Front-End nuxt app
 ## Build Setup
@@ -1,7 +0,0 @@
 # ASSETS
 **This directory is not required, you can delete it if you don't want to use it.**
 This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
 More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#webpacked).
@@ -0,0 +1,125 @@
 ///////////////////// fonts
@font-face {
  font-family: 'sahel';
  src: url("../fonts/sahel/Sahel-FD.eot"),
  url("../fonts/sahel/Sahel-FD.ttf"),
  url("../fonts/sahel/Sahel-FD.woff") ;
 }
@font-face {
  font-family: 'sahel-bold';
  src: url("../fonts/sahel/Sahel-Bold-FD.eot"),
  url("../fonts/sahel/Sahel-Bold-FD.ttf"),
  url("../fonts/sahel/Sahel-Bold-FD.woff") ;
 }
@font-face {
  font-family: 'sahel-black';
  src: url("../fonts/sahel/Sahel-Black-FD.eot"),
  url("../fonts/sahel/Sahel-Black-FD.ttf"),
  url("../fonts/sahel/Sahel-Black-FD.woff") ;
 }
 ///////////////////// mixins
@mixin transition($p) {
  transition: $p;
  -webkit-transition: $p;
  -moz-transition: $p;
  -ms-transition: $p;
  -o-transition: $p;
 }
@mixin transform($p) {
  transform: $p;
  -webkit-transform: $p;
  -moz-transform: $p;
  -ms-transform: $p;
  -o-transform: $p;
 }
@mixin borderRadius($p) {
  border-radius: $p;
  -webkit-border-radius: $p;
  -moz-border-radius: $p;
 }
 ///////////////////// variables
 %appearance {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
 }
 %userSelect {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
 }
 ///////////////////// variables
 $theme: #1B407C;
 $bg: #F0F0F0;
 $darkGray: #303030;
 ////// global
 body {
  direction: rtl;
  &:lang(en) {
    direction: ltr;
  }
 }
 p, a, span, b, i {
  font-family: 'sahel';
  color: rgba(0, 0, 0, 0.7);
 }
 h1, h2, h3, h4, h5, h6 {
  font-family: 'sahel-bold';
 }
 /////// global classes
 .logo {
  display: inline-block;
  width: 50px;
  svg {
    width: 100%;
  }
 }
 .lang--bar {
  background: $darkGray;
  height: 25px;
  p {
    color: rgba(255, 255, 255, 0.7);
    font-size: 13px;
    line-height: 25px;
    float: left;
  }
  select {
    @extend %appearance;
    @extend %userSelect;
    background: $darkGray;
    color: #fff;
    font-family: sans-serif;
    border: none;
    option{
      padding: 5px;
      background: #fff;
      color: #000;
    }
  }
 }
 .header {
 }
@@ -1,34 +0,0 @@
 <template>
  <svg class="NuxtLogo" width="245" height="180" viewBox="0 0 452 342" xmlns="http://www.w3.org/2000/svg">
    <g fill="none" fill-rule="evenodd">
      <path
        d="M139 330l-1-2c-2-4-2-8-1-13H29L189 31l67 121 22-16-67-121c-1-2-9-14-22-14-6 0-15 2-22 15L5 303c-1 3-8 16-2 27 4 6 10 12 24 12h136c-14 0-21-6-24-12z"
        fill="#00C58E"
      />
      <path
        d="M447 304L317 70c-2-2-9-15-22-15-6 0-15 3-22 15l-17 28v54l39-67 129 230h-49a23 23 0 0 1-2 14l-1 1c-6 11-21 12-23 12h76c3 0 17-1 24-12 3-5 5-14-2-26z"
        fill="#108775"
      />
      <path
        d="M376 330v-1l1-2c1-4 2-8 1-12l-4-12-102-178-15-27h-1l-15 27-102 178-4 12a24 24 0 0 0 2 15c4 6 10 12 24 12h190c3 0 18-1 25-12zM256 152l93 163H163l93-163z"
        fill="#2F495E"
        fill-rule="nonzero"
      />
    </g>
  </svg>
 </template>
 <style>
 .NuxtLogo {
  animation: 1s appear;
  margin: auto;
 }
@keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
 }
 </style>
@@ -1,7 +0,0 @@
 # COMPONENTS
 **This directory is not required, you can delete it if you don't want to use it.**
 The components directory contains your Vue.js Components.
 _Nuxt.js doesn't supercharge these components._
@@ -0,0 +1,54 @@
 <template>
 	<header class="header">
 		<div class="container-fluid">
 			<nav class="row">
 				<div class="col-12">
 					<div class="container-fluid">
 						<ul class="row">
 							<nuxt-link :to="staticData.home.url" tag="li" exact class="col">
 								<a class="logo">
 									<logo/>
 								</a>
 							</nuxt-link>
 							<nuxt-link :to="staticData.home.url" tag="li" exact class="col">
 								<a>{{staticData.home.title}}</a>
 							</nuxt-link>
 							<nuxt-link :to="staticData.about.url" tag="li" exact class="col">
 								<a>{{staticData.about.title}}</a>
 							</nuxt-link>
 							<nuxt-link :to="staticData.services.url" tag="li" exact class="col">
 								<a>{{staticData.services.title}}</a>
 							</nuxt-link>
 							<nuxt-link :to="staticData.products.url" tag="li" exact class="col">
 								<a>{{staticData.products.title}}</a>
 							</nuxt-link>
 							<nuxt-link :to="staticData.contact.url" tag="li" exact class="col">
 								<a>{{staticData.contact.title}}</a>
 							</nuxt-link>
 							<li>
 								<select name="" id="">
 									<option value="fa" selected>فا</option>
 									<option value="en" selected>EN</option>
 								</select>
 							</li>
 						</ul>
 					</div>
 				</div>
 			</nav>
 		</div>
 	</header>
 </template>
 <script>
   export default {
      computed: {
         staticData() {
            if (this.$route.params.lang === 'fa') {
               return this.$store.state.staticData.header.fa
            } else if (this.$route.params.lang === 'en') {
               return this.$store.state.staticData.header.en
            }
         }
      }
   }
 </script>
@@ -0,0 +1,9 @@
 <template>
 	<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
 		  x="0px" y="0px" viewBox="0 0 47.3 36.1" style="enable-background:new 0 0 47.3 36.1;" xml:space="preserve">
 		<rect fill="none" width="109" height="42"/>
 		<path fill="#1B407C" d="M35.7,35.9l-6.6-13.3c0,0-2.3-4.6,2.8-4.9c0,0,5.2,0.2,6.6-1.4c0,0,2-3.9-1.8-5.1H23V11h0
            v16.9h5v8H5.2c0,0-5.2-0.9-5.2-7.6V3h14.9V0h8v3h13.7c0,0,9.7,0.5,10.2,10.1c0,0,1.3,8.7-9.2,11.3l6,11.4L35.7,35.9z M14.9,27.9V11
            H8v16.9H14.9z"/>
        </svg>
 </template>
@@ -0,0 +1,14 @@
 <template>
 	<div class="lang--bar">
 		<div class="container-fluid">
 			<div class="row">
 				<div class="col-6">
 				</div>
 				<div class="col-6">
 					<p>تمامی اطلاعات این سایت برای شرکت اراک ریل محفوظ است</p>
 				</div>
 			</div>
 		</div>
 	</div>
 </template>
@@ -1,7 +0,0 @@
 # LAYOUTS
 **This directory is not required, you can delete it if you don't want to use it.**
 This directory contains your Application Layouts.
 More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).
@@ -1,55 +1,20 @@
 <template>
-  <div>
+	<div>
-    <nuxt />
+		<langBar/>
-  </div>
+		<site-header/>
 		<nuxt/>
 	</div>
 </template>
 <style>
 html {
  font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: 16px;
  word-spacing: 1px;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  box-sizing: border-box;
 }
-*,
+<script>
-*:before,
+   export default {
-*:after {
+      beforeCreate() {
-  box-sizing: border-box;
+         if (this.$route.params.lang === 'fa') {
-  margin: 0;
+            $('html').attr({lang: 'fa'})
-}
+         } else if (this.$route.params.lang === 'en') {
-
+            $('html').attr({lang: 'en'})
-.button--green {
+         }
-  display: inline-block;
+      }
-  border-radius: 4px;
+   }
-  border: 1px solid #3b8070;
+</script>
  color: #3b8070;
  text-decoration: none;
  padding: 10px 30px;
 }
 .button--green:hover {
  color: #fff;
  background-color: #3b8070;
 }
 .button--grey {
  display: inline-block;
  border-radius: 4px;
  border: 1px solid #35495e;
  color: #35495e;
  text-decoration: none;
  padding: 10px 30px;
  margin-left: 15px;
 }
 .button--grey:hover {
  color: #fff;
  background-color: #35495e;
 }
 </style>
@@ -1,8 +0,0 @@
 # MIDDLEWARE
 **This directory is not required, you can delete it if you don't want to use it.**
 This directory contains your application middleware.
 Middleware let you define custom functions that can be run before rendering either a page or a group of pages.
 More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing#middleware).
@@ -1,63 +1,83 @@
-
+const webpack = require("webpack")
 export default {
-  mode: 'spa',
+   mode: 'spa',
-  /*
+   /*
-  ** Headers of the page
+   ** Headers of the page
-  */
+   */
-  head: {
+   head: {
-    title: process.env.npm_package_name || '',
+      title: process.env.npm_package_name || '',
-    meta: [
+      meta: [
-      { charset: 'utf-8' },
+         {charset: 'utf-8'},
-      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+         {name: 'viewport', content: 'width=device-width, initial-scale=1'},
-      { hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
+         {hid: 'description', name: 'description', content: process.env.npm_package_description || ''}
-    ],
+      ],
-    link: [
+      link: [
-      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
+         {rel: 'icon', type: 'image/x-icon', href: '/favicon.ico'}
-    ]
+      ]
-  },
+   },
-  /*
+   /*
-  ** Customize the progress-bar color
+   ** Customize the progress-bar color
-  */
+   */
-  loading: { color: '#fff' },
+   loading: {color: '#fff'},
-  /*
+   /*
-  ** Global CSS
+   ** Global CSS
-  */
+   */
-  css: [
+   css: [
-    'element-ui/lib/theme-chalk/index.css'
+      '~/assets/css/bootstrap-grid-customized.css',
-  ],
+      '~/assets/css/fontawesome/css/all.min.css',
-  /*
+      '~/assets/sass/app.scss',
-  ** Plugins to load before mounting the App
+   ],
-  */
+   /*
-  plugins: [
+   ** Plugins to load before mounting the App
-    '@/plugins/element-ui'
+   */
-  ],
+   plugins: [
-  /*
+      '@/plugins/gsap',
-  ** Nuxt.js dev-modules
+      '@/plugins/scrollMagic',
-  */
+      '@/plugins/components'
-  buildModules: [
+   ],
-  ],
+   /*
-  /*
+   ** Nuxt.js dev-modules
-  ** Nuxt.js modules
+   */
-  */
+   buildModules: [],
-  modules: [
+   /*
-    // Doc: https://axios.nuxtjs.org/usage
+   ** Nuxt.js modules
-    '@nuxtjs/axios',
+   */
-  ],
+   modules: [
-  /*
+      // Doc: https://bootstrap-vue.js.org
-  ** Axios module configuration
+      'bootstrap-vue/nuxt',
-  ** See https://axios.nuxtjs.org/options
+      // Doc: https://axios.nuxtjs.org/usage
-  */
+      '@nuxtjs/axios',
-  axios: {
+   ],
-  },
+   /*
-  /*
+   ** Axios module configuration
-  ** Build configuration
+   ** See https://axios.nuxtjs.org/options
-  */
+   */
-  build: {
+   axios: {},
-    transpile: [/^element-ui/],
+   /*
-    /*
+   ** Build configuration
-    ** You can extend webpack config here
+   */
-    */
+   build: {
-    extend (config, ctx) {
+      vendor: ["jquery", "bootstrap"],
-    }
+      plugins: [new webpack.ProvidePlugin({$: "jquery"})],
-  }
+      /*
      ** Run ESLint
      */
      /*
      ** You can extend webpack config here
      */
      extend(config, ctx) {
      },
      filenames: {
         app: ({isDev}) => isDev ? '[name].js' : '[name].js',
         chunk: ({isDev}) => isDev ? '[name].js' : '[name].js',
         css: ({isDev}) => isDev ? '[name].css' : '[name].css',
         img: ({isDev}) => isDev ? '[path][name].[ext]' : 'images/[name].[ext]',
         font: ({isDev}) => isDev ? '[path][name].[ext]' : 'fonts/[name].[ext]',
         video: ({isDev}) => isDev ? '[path][name].[ext]' : 'videos/[name].[ext]'
      }
   },
   generate: {
      dir: '../../public/nuxt_build'
   },
   router: {}
 }
@@ -1,19 +1,27 @@
 {
-  "name": "AeakRail",
+   "name": "ArakRail",
-  "version": "1.0.0",
+   "version": "1.0.0",
-  "description": "Arak Rail front-end",
+   "description": "ArakRail Front-End nuxt app",
-  "author": "Amir Mohamadi",
+   "author": "Amir Mohamadi",
-  "private": true,
+   "private": true,
-  "scripts": {
+   "scripts": {
-    "dev": "nuxt",
+      "dev": "nuxt",
-    "build": "nuxt build",
+      "build": "nuxt build",
-    "start": "nuxt start",
+      "start": "nuxt start",
-    "generate": "nuxt generate"
+      "generate": "nuxt generate"
-  },
+   },
-  "dependencies": {
+   "dependencies": {
-    "nuxt": "^2.0.0",
+      "nuxt": "^2.0.0",
-    "element-ui": "^2.4.11",
+      "bootstrap-vue": "^2.0.0",
-    "@nuxtjs/axios": "^5.3.6"
+      "bootstrap": "^4.1.3",
-  },
+      "@nuxtjs/axios": "^5.3.6",
-  "devDependencies": {}
+      "jquery": "^3.5.1",
      "gsap": "^3.2.6",
      "scrollmagic": "^2.0.7",
      "vue-scrollmagic": "^1.2.0"
   },
   "devDependencies": {
      "node-sass": "^4.14.1",
      "sass-loader": "^8.0.2"
   }
 }
@@ -1,6 +0,0 @@
 # PAGES
 This directory contains your Application Views and Routes.
 The framework reads all the `*.vue` files inside this directory and creates the router of your application.
 More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing).
@@ -0,0 +1,15 @@
 <template>
  <div class="container">
      salam
  </div>
 </template>
 <script>
 export default {
  components: {
  }
 }
 </script>
@@ -1,72 +0,0 @@
 <template>
  <div class="container">
    <div>
      <logo />
      <h1 class="title">
        AeakRail
      </h1>
      <h2 class="subtitle">
        Arak Rail front-end
      </h2>
      <div class="links">
        <a
          href="https://nuxtjs.org/"
          target="_blank"
          class="button--green"
        >
          Documentation
        </a>
        <a
          href="https://github.com/nuxt/nuxt.js"
          target="_blank"
          class="button--grey"
        >
          GitHub
        </a>
      </div>
    </div>
  </div>
 </template>
 <script>
 import Logo from '~/components/Logo.vue'
 export default {
  components: {
    Logo
  }
 }
 </script>
 <style>
 .container {
  margin: 0 auto;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
 }
 .title {
  font-family: 'Quicksand', 'Source Sans Pro', -apple-system, BlinkMacSystemFont,
    'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  display: block;
  font-weight: 300;
  font-size: 100px;
  color: #35495e;
  letter-spacing: 1px;
 }
 .subtitle {
  font-weight: 300;
  font-size: 42px;
  color: #526488;
  word-spacing: 5px;
  padding-bottom: 15px;
 }
 .links {
  padding-top: 15px;
 }
 </style>
@@ -1,7 +0,0 @@
 # PLUGINS
 **This directory is not required, you can delete it if you don't want to use it.**
 This directory contains Javascript plugins that you want to run before mounting the root Vue.js application.
 More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/plugins).
@@ -0,0 +1,9 @@
 import Vue from 'vue'
 import header from '../components/header'
 import logo from '../components/icons/logo'
 import langBar from '../components/langBar'
 Vue.component('site-header', header)
 Vue.component('logo', logo)
 Vue.component('langBar', langBar)
@@ -1,5 +0,0 @@
 import Vue from 'vue'
 import Element from 'element-ui'
 import locale from 'element-ui/lib/locale/lang/en'
 Vue.use(Element, { locale })
@@ -0,0 +1,4 @@
 import Vue from 'vue'
 import gsap from 'gsap'
 Vue.prototype.$gsap = gsap
@@ -0,0 +1,4 @@
 import Vue from 'vue'
 import vueScrollMagic from 'vue-scrollmagic'
 Vue.use(vueScrollMagic)
@@ -1,10 +0,0 @@
 # STORE
 **This directory is not required, you can delete it if you don't want to use it.**
 This directory contains your Vuex Store files.
 Vuex Store option is implemented in the Nuxt.js framework.
 Creating a file in this directory automatically activates the option in the framework.
 More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/vuex-store).
@@ -0,0 +1,9 @@
 export const state = () => ({
  navigation_guard: false
 })
 export const mutations = {
  navigationGuards(state, data) {
    state.navigation_guard = data
  }
 }
@@ -0,0 +1,50 @@
 export const state = () => ({
  header: {
    fa: {
      home: {
        url: '/fa',
        title: 'صفحه اصلی'
      },
      about: {
        url: '/fa/about',
        title: 'درباره ما'
      },
      services: {
        url: '/fa/services',
        title: 'خدمات'
      },
      products: {
        url: '/fa/products',
        title: 'محصولات'
      },
      contact: {
        url: '/fa/contact',
        title: 'ارتباط با ما'
      }
    },
    en: {
      home: {
        url: '/en',
        title: 'Home'
      },
      about: {
        url: '/en/about',
        title: 'About Us'
      },
      services: {
        url: '/en/services',
        title: 'Services'
      },
      products: {
        url: '/en/products',
        title: 'Products'
      },
      contact: {
        url: '/en/contact',
        title: 'Contact Us'
      }
    }
  }
 })
 export const mutations = {}
@@ -1,100 +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">
        <title>Laravel</title>
        <!-- Fonts -->
        <link href="https://fonts.googleapis.com/css?family=Nunito:200,600" rel="stylesheet">
        <!-- Styles -->
        <style>
            html, body {
                background-color: #fff;
                color: #636b6f;
                font-family: 'Nunito', sans-serif;
                font-weight: 200;
                height: 100vh;
                margin: 0;
            }
            .full-height {
                height: 100vh;
            }
            .flex-center {
                align-items: center;
                display: flex;
                justify-content: center;
            }
            .position-ref {
                position: relative;
            }
            .top-right {
                position: absolute;
                right: 10px;
                top: 18px;
            }
            .content {
                text-align: center;
            }
            .title {
                font-size: 84px;
            }
            .links > a {
                color: #636b6f;
                padding: 0 25px;
                font-size: 13px;
                font-weight: 600;
                letter-spacing: .1rem;
                text-decoration: none;
                text-transform: uppercase;
            }
            .m-b-md {
                margin-bottom: 30px;
            }
        </style>
    </head>
    <body>
        <div class="flex-center position-ref full-height">
            @if (Route::has('login'))
                <div class="top-right links">
                    @auth
                        <a href="{{ url('/home') }}">Home</a>
                    @else
                        <a href="{{ route('login') }}">Login</a>
                        @if (Route::has('register'))
                            <a href="{{ route('register') }}">Register</a>
                        @endif
                    @endauth
                </div>
            @endif
            <div class="content">
                <div class="title m-b-md">
                    Laravel
                </div>
                <div class="links">
                    <a href="https://laravel.com/docs">Docs</a>
                    <a href="https://laracasts.com">Laracasts</a>
                    <a href="https://laravel-news.com">News</a>
                    <a href="https://blog.laravel.com">Blog</a>
                    <a href="https://nova.laravel.com">Nova</a>
                    <a href="https://forge.laravel.com">Forge</a>
                    <a href="https://vapor.laravel.com">Vapor</a>
                    <a href="https://github.com/laravel/laravel">GitHub</a>
                </div>
            </div>
        </div>
    </body>
 </html>