├── .gitignore ├── .postcssrc.js ├── README.md ├── babel.config.js ├── package-lock.json ├── package.json ├── public ├── 1.jpg ├── 2.jpg ├── 3.jpg ├── 4.jpg ├── 4.png ├── avatar.png ├── favicon.ico └── index.html ├── src ├── App.vue ├── assets │ └── logo.png ├── components │ ├── HelloWorld.vue │ └── SideBar.vue ├── main.js ├── quasar.js ├── router │ └── index.js ├── store │ └── index.js ├── styles │ ├── quasar.sass │ └── quasar.variables.sass └── views │ ├── About.vue │ └── Home.vue └── vue.config.js /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /dist 4 | 5 | 6 | # local env files 7 | .env.local 8 | .env.*.local 9 | 10 | # Log files 11 | npm-debug.log* 12 | yarn-debug.log* 13 | yarn-error.log* 14 | pnpm-debug.log* 15 | 16 | # Editor directories and files 17 | .idea 18 | .vscode 19 | *.suo 20 | *.ntvs* 21 | *.njsproj 22 | *.sln 23 | *.sw? 24 | -------------------------------------------------------------------------------- /.postcssrc.js: -------------------------------------------------------------------------------- 1 | const plugins = [ 2 | require('autoprefixer') 3 | ] 4 | 5 | if (process.env.QUASAR_RTL) { 6 | plugins.push( 7 | require('postcss-rtl')({}) 8 | ) 9 | } 10 | 11 | module.exports = { 12 | plugins 13 | } 14 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # quasardesign 2 | 3 | ## Project setup 4 | ``` 5 | npm install 6 | ``` 7 | 8 | ### Compiles and hot-reloads for development 9 | ``` 10 | npm run serve 11 | ``` 12 | 13 | ### Compiles and minifies for production 14 | ``` 15 | npm run build 16 | ``` 17 | 18 | ### Lints and fixes files 19 | ``` 20 | npm run lint 21 | ``` 22 | 23 | ### Customize configuration 24 | See [Configuration Reference](https://cli.vuejs.org/config/). 25 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | '@vue/cli-plugin-babel/preset' 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "quasardesign", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "serve": "vue-cli-service serve", 7 | "build": "vue-cli-service build", 8 | "lint": "vue-cli-service lint" 9 | }, 10 | "dependencies": { 11 | "@quasar/extras": "^1.0.0", 12 | "core-js": "^3.6.5", 13 | "quasar": "^1.0.0", 14 | "vue": "^2.6.11", 15 | "vue-router": "^3.2.0", 16 | "vuex": "^3.4.0" 17 | }, 18 | "devDependencies": { 19 | "@vue/cli-plugin-babel": "~4.5.0", 20 | "@vue/cli-plugin-eslint": "~4.5.0", 21 | "@vue/cli-plugin-router": "~4.5.0", 22 | "@vue/cli-plugin-vuex": "~4.5.0", 23 | "@vue/cli-service": "~4.5.0", 24 | "babel-eslint": "^10.1.0", 25 | "eslint": "^6.7.2", 26 | "eslint-plugin-vue": "^6.2.2", 27 | "node-sass": "^4.13.0", 28 | "postcss-rtl": "^1.2.3", 29 | "sass-loader": "^8.0.0", 30 | "vue-cli-plugin-quasar": "~3.0.1", 31 | "vue-template-compiler": "^2.6.11" 32 | }, 33 | "eslintConfig": { 34 | "root": true, 35 | "env": { 36 | "node": true 37 | }, 38 | "extends": [ 39 | "plugin:vue/essential", 40 | "eslint:recommended" 41 | ], 42 | "parserOptions": { 43 | "parser": "babel-eslint" 44 | }, 45 | "rules": {} 46 | }, 47 | "browserslist": [ 48 | "> 1%", 49 | "last 2 versions", 50 | "not dead" 51 | ] 52 | } 53 | -------------------------------------------------------------------------------- /public/1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zakaria-29-dev/vuejs-quasar-framework-admin-dashboard-ui/8fba0ee0f66331173c2c0936e542f6e548a40851/public/1.jpg -------------------------------------------------------------------------------- /public/2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zakaria-29-dev/vuejs-quasar-framework-admin-dashboard-ui/8fba0ee0f66331173c2c0936e542f6e548a40851/public/2.jpg -------------------------------------------------------------------------------- /public/3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zakaria-29-dev/vuejs-quasar-framework-admin-dashboard-ui/8fba0ee0f66331173c2c0936e542f6e548a40851/public/3.jpg -------------------------------------------------------------------------------- /public/4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zakaria-29-dev/vuejs-quasar-framework-admin-dashboard-ui/8fba0ee0f66331173c2c0936e542f6e548a40851/public/4.jpg -------------------------------------------------------------------------------- /public/4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zakaria-29-dev/vuejs-quasar-framework-admin-dashboard-ui/8fba0ee0f66331173c2c0936e542f6e548a40851/public/4.png -------------------------------------------------------------------------------- /public/avatar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zakaria-29-dev/vuejs-quasar-framework-admin-dashboard-ui/8fba0ee0f66331173c2c0936e542f6e548a40851/public/avatar.png -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zakaria-29-dev/vuejs-quasar-framework-admin-dashboard-ui/8fba0ee0f66331173c2c0936e542f6e548a40851/public/favicon.ico -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | <%= htmlWebpackPlugin.options.title %> 9 | 10 | 11 | 14 |
15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 9 | -------------------------------------------------------------------------------- /src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zakaria-29-dev/vuejs-quasar-framework-admin-dashboard-ui/8fba0ee0f66331173c2c0936e542f6e548a40851/src/assets/logo.png -------------------------------------------------------------------------------- /src/components/HelloWorld.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 9 | 10 | 15 | -------------------------------------------------------------------------------- /src/components/SideBar.vue: -------------------------------------------------------------------------------- 1 | 126 | 138 | -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | import router from './router' 4 | import store from './store' 5 | import './quasar' 6 | 7 | Vue.config.productionTip = false 8 | 9 | new Vue({ 10 | router, 11 | store, 12 | render: h => h(App) 13 | }).$mount('#app') 14 | -------------------------------------------------------------------------------- /src/quasar.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | import './styles/quasar.sass' 4 | import '@quasar/extras/fontawesome-v5/fontawesome-v5.css' 5 | import '@quasar/extras/material-icons/material-icons.css' 6 | import { Quasar } from 'quasar' 7 | 8 | Vue.use(Quasar, { 9 | config: {}, 10 | plugins: { 11 | } 12 | }) -------------------------------------------------------------------------------- /src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import VueRouter from 'vue-router' 3 | import Home from '../views/Home.vue' 4 | 5 | Vue.use(VueRouter) 6 | 7 | const routes = [ 8 | { 9 | path: '/', 10 | name: 'Home', 11 | component: Home 12 | }, 13 | { 14 | path: '/about', 15 | name: 'About', 16 | // route level code-splitting 17 | // this generates a separate chunk (about.[hash].js) for this route 18 | // which is lazy-loaded when the route is visited. 19 | component: () => import(/* webpackChunkName: "about" */ '../views/About.vue') 20 | } 21 | ] 22 | 23 | const router = new VueRouter({ 24 | mode: 'history', 25 | base: process.env.BASE_URL, 26 | routes 27 | }) 28 | 29 | export default router 30 | -------------------------------------------------------------------------------- /src/store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | 4 | Vue.use(Vuex) 5 | 6 | export default new Vuex.Store({ 7 | state: { 8 | }, 9 | mutations: { 10 | }, 11 | actions: { 12 | }, 13 | modules: { 14 | } 15 | }) 16 | -------------------------------------------------------------------------------- /src/styles/quasar.sass: -------------------------------------------------------------------------------- 1 | @import './quasar.variables.sass' 2 | @import '~quasar-styl' 3 | // @import '~quasar-addon-styl' 4 | -------------------------------------------------------------------------------- /src/styles/quasar.variables.sass: -------------------------------------------------------------------------------- 1 | // It's highly recommended to change the default colors 2 | // to match your app's branding. 3 | 4 | $primary : #027BE3 5 | $secondary : #26A69A 6 | $accent : #9C27B0 7 | 8 | $dark : #1D1D1D 9 | 10 | $positive : #21BA45 11 | $negative : #C10015 12 | $info : #31CCEC 13 | $warning : #F2C037 14 | 15 | @import '~quasar-variables-styl' 16 | -------------------------------------------------------------------------------- /src/views/About.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/views/Home.vue: -------------------------------------------------------------------------------- 1 | 248 | 249 | 259 | -------------------------------------------------------------------------------- /vue.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | pluginOptions: { 3 | quasar: { 4 | importStrategy: 'kebab', 5 | rtlSupport: true 6 | } 7 | }, 8 | transpileDependencies: [ 9 | 'quasar' 10 | ] 11 | } 12 | --------------------------------------------------------------------------------