├── static └── .gitkeep ├── CNAME ├── .eslintignore ├── config ├── prod.env.js ├── dev.env.js └── index.js ├── .gitignore ├── src ├── assets │ ├── logo.png │ ├── background.jpg │ ├── wang-editor │ │ └── fonts │ │ │ ├── icomoon.eot │ │ │ ├── icomoon.ttf │ │ │ └── icomoon.woff │ └── font-awesome-4.7 │ │ └── fonts │ │ ├── FontAwesome.otf │ │ ├── fontawesome-webfont.eot │ │ ├── fontawesome-webfont.ttf │ │ ├── fontawesome-webfont.woff │ │ └── fontawesome-webfont.woff2 ├── styles │ ├── base.less │ ├── element-style.less │ ├── theme.less │ └── global.less ├── App.vue ├── views │ ├── no-page.vue │ ├── menus.js │ ├── article │ │ ├── MarkdownMix.js │ │ ├── edit.vue │ │ └── list.vue │ ├── tag │ │ ├── edit.vue │ │ └── list.vue │ ├── emailconfig │ │ ├── sendLog.vue │ │ ├── sendEmail.vue │ │ ├── edit.vue │ │ └── list.vue │ ├── user │ │ ├── edit.vue │ │ └── init.vue │ ├── comment │ │ ├── reply-form.vue │ │ ├── edit.vue │ │ └── list.vue │ ├── catalog │ │ ├── edit.vue │ │ └── list.vue │ ├── setting │ │ ├── list.vue │ │ └── edit.vue │ ├── login │ │ └── login.vue │ ├── pageview │ │ └── list.vue │ └── index.vue ├── utils │ ├── PugClientSide.js │ └── util.js ├── filters │ └── index.js ├── components │ ├── RichEditor.vue │ ├── PugEditor.vue │ └── mix │ │ └── DTMix.js ├── vuex │ └── store.js ├── routes.js └── main.js ├── theme ├── fonts │ ├── element-icons.eot │ ├── element-icons.ttf │ └── element-icons.woff ├── form-item.css ├── menu-item.css ├── submenu.css ├── tab-pane.css ├── breadcrumb-item.css ├── button-group.css ├── checkbox-group.css ├── collapse-item.css ├── dropdown-item.css ├── dropdown-menu.css ├── menu-item-group.css ├── radio-button.css ├── radio-group.css ├── element-variables.css ├── steps.css ├── option-group.css ├── card.css ├── icon.css ├── spinner.css ├── badge.css ├── rate.css ├── carousel-item.css ├── option.css ├── row.css ├── collapse.css ├── breadcrumb.css ├── scrollbar.css ├── select-dropdown.css ├── loading.css ├── alert.css ├── notification.css ├── message.css └── form.css ├── .babelrc ├── .editorconfig ├── index.html ├── dist-build.js ├── .eslintrc.js ├── README.md └── package.json /static/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /CNAME: -------------------------------------------------------------------------------- 1 | blog.admin.diamondfsd.com 2 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | build/*.js 2 | config/*.js 3 | -------------------------------------------------------------------------------- /config/prod.env.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | NODE_ENV: '"production"' 3 | } 4 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | *.map 6 | -------------------------------------------------------------------------------- /src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/logo.png -------------------------------------------------------------------------------- /src/assets/background.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/background.jpg -------------------------------------------------------------------------------- /theme/fonts/element-icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/theme/fonts/element-icons.eot -------------------------------------------------------------------------------- /theme/fonts/element-icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/theme/fonts/element-icons.ttf -------------------------------------------------------------------------------- /theme/fonts/element-icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/theme/fonts/element-icons.woff -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["es2015", "stage-2"], 3 | "plugins": ["transform-runtime"], 4 | "comments": false 5 | } 6 | -------------------------------------------------------------------------------- /src/assets/wang-editor/fonts/icomoon.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/wang-editor/fonts/icomoon.eot -------------------------------------------------------------------------------- /src/assets/wang-editor/fonts/icomoon.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/wang-editor/fonts/icomoon.ttf -------------------------------------------------------------------------------- /src/assets/wang-editor/fonts/icomoon.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/wang-editor/fonts/icomoon.woff -------------------------------------------------------------------------------- /src/assets/font-awesome-4.7/fonts/FontAwesome.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/font-awesome-4.7/fonts/FontAwesome.otf -------------------------------------------------------------------------------- /src/assets/font-awesome-4.7/fonts/fontawesome-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/font-awesome-4.7/fonts/fontawesome-webfont.eot -------------------------------------------------------------------------------- /src/assets/font-awesome-4.7/fonts/fontawesome-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/font-awesome-4.7/fonts/fontawesome-webfont.ttf -------------------------------------------------------------------------------- /src/assets/font-awesome-4.7/fonts/fontawesome-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/font-awesome-4.7/fonts/fontawesome-webfont.woff -------------------------------------------------------------------------------- /src/assets/font-awesome-4.7/fonts/fontawesome-webfont.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k55k32/cms-admin-front/HEAD/src/assets/font-awesome-4.7/fonts/fontawesome-webfont.woff2 -------------------------------------------------------------------------------- /config/dev.env.js: -------------------------------------------------------------------------------- 1 | var merge = require('webpack-merge') 2 | var prodEnv = require('./prod.env') 3 | 4 | module.exports = merge(prodEnv, { 5 | NODE_ENV: '"development"' 6 | }) 7 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | -------------------------------------------------------------------------------- /src/styles/base.less: -------------------------------------------------------------------------------- 1 | @border-color: #eee; 2 | @border-size: 1px; 3 | @border-style: solid; 4 | 5 | @border: @border-size @border-style @border-color; 6 | 7 | @header-heigth: 58px; 8 | 9 | @flex-padding: 15px; 10 | -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 12 | 13 | 18 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Manager 7 | 8 | 9 |
10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /dist-build.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const fs = require('fs') 3 | fs.writeFileSync(path.join(__dirname, 'dist/CNAME'), fs.readFileSync(path.join(__dirname, 'CNAME'))) 4 | const ghpages = require('gh-pages') 5 | const pushOptions = { 6 | logger (message) { 7 | console.log(message) 8 | }, 9 | } 10 | ghpages.publish(path.join(__dirname, 'dist'), pushOptions, () => { 11 | console.log(`${new Date()} dist publish success`) 12 | }) 13 | -------------------------------------------------------------------------------- /src/views/no-page.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 26 | 27 | 29 | -------------------------------------------------------------------------------- /src/utils/PugClientSide.js: -------------------------------------------------------------------------------- 1 | import lex from 'pug-lexer' 2 | import parse from 'pug-parser' 3 | import wrap from 'pug-runtime/wrap' 4 | import generateCode from 'pug-code-gen' 5 | 6 | exports.render = (str, opts) => { 7 | let templateName = 'template' 8 | let funcStr = generateCode(parse(lex(str)), { 9 | // compileDebug: false, 10 | pretty: true, 11 | indents: 2, 12 | // inlineRuntimeFunctions: false, 13 | templateName: templateName, 14 | ...opts 15 | }) 16 | return wrap(funcStr, templateName)() 17 | } 18 | -------------------------------------------------------------------------------- /src/styles/element-style.less: -------------------------------------------------------------------------------- 1 | .el-form--inline{ 2 | .el-form-item__content{ 3 | float: left; 4 | } 5 | } 6 | .el-input__inner, .el-dragger, .el-tag{ 7 | border-radius: 0px; 8 | } 9 | .el-menu-item.is-active{ 10 | background: #fff; 11 | color: #000; 12 | &:hover{ 13 | background: #fff; 14 | } 15 | } 16 | 17 | .full-upload{ 18 | margin-bottom: 20px; 19 | width: 100%; 20 | .el-upload__inner{ 21 | width: 100%; 22 | } 23 | .el-dragger__cover img{ 24 | width: 100%; 25 | } 26 | } 27 | .el-form-item{ 28 | .el-select{ 29 | width: 100%; 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/views/menus.js: -------------------------------------------------------------------------------- 1 | export default [ 2 | { 3 | id: 'pageview', 4 | text: '浏览记录', 5 | name: 'pageview' 6 | }, 7 | { 8 | id: 'article', 9 | text: '文章管理', 10 | name: 'article' 11 | }, 12 | { 13 | id: 'catalog', 14 | text: '目录管理', 15 | name: 'catalog' 16 | }, 17 | { 18 | id: 'tag', 19 | text: '标签管理', 20 | name: 'tag' 21 | }, 22 | { 23 | id: 'comment', 24 | text: '评论管理', 25 | name: 'comment' 26 | }, 27 | { 28 | id: 'email-config', 29 | text: '邮箱配置', 30 | name: 'email-config' 31 | }, 32 | { 33 | id: 'setting', 34 | text: '系统配置', 35 | name: 'setting' 36 | } 37 | ] 38 | -------------------------------------------------------------------------------- /src/utils/util.js: -------------------------------------------------------------------------------- 1 | exports.dateFormat = (date, fmt) => { 2 | var o = { 3 | 'M+': date.getMonth() + 1, 4 | 'd+': date.getDate(), 5 | 'h+': date.getHours(), 6 | 'm+': date.getMinutes(), 7 | 's+': date.getSeconds(), 8 | 'q+': Math.floor((date.getMonth() + 3) / 3), 9 | 'S': date.getMilliseconds() 10 | } 11 | if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length)) 12 | Object.keys(o).forEach(k => { 13 | if (new RegExp('(' + k + ')').test(fmt)) { 14 | fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? o[k] : ('00' + o[k]).substr(('' + o[k]).length)) 15 | } 16 | }) 17 | return fmt 18 | } 19 | -------------------------------------------------------------------------------- /src/views/article/MarkdownMix.js: -------------------------------------------------------------------------------- 1 | import 'highlightjs/styles/github.css' 2 | 3 | export default { 4 | data () { 5 | return { 6 | MarkdownOptions: {} 7 | } 8 | }, 9 | mounted () { 10 | require.ensure(['highlightjs'], require => { 11 | let hljs = require('highlightjs') 12 | this.MarkdownOptions = { 13 | ...this.MarkdownOptions, 14 | highlight (str, lang) { 15 | lang = lang || 'javascript' 16 | if (hljs.getLanguage(lang)) { 17 | try { 18 | return hljs.highlight(lang, str).value 19 | } catch (__) {} 20 | } 21 | return '' 22 | } 23 | } 24 | }) 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /src/styles/theme.less: -------------------------------------------------------------------------------- 1 | @import "./base.less"; 2 | .form-input{ 3 | height: 40px; 4 | border-bottom: 1px solid #eee; 5 | background: none; 6 | border: 0; 7 | outline: none; 8 | border-bottom: @border; 9 | font-size: 1.1em; 10 | width: 100%; 11 | } 12 | 13 | .btn-block{ 14 | display: block; 15 | width: 100%; 16 | } 17 | 18 | .btn{ 19 | padding: 10px; 20 | background: none; 21 | border: @border; 22 | } 23 | 24 | .main-bg{ 25 | height: 100%; 26 | width: 100%; 27 | background: #3d3f47; 28 | .btn{ 29 | color: #fff; 30 | } 31 | .form-input{ 32 | color: #fff; 33 | } 34 | .el-loading-mask{ 35 | background-color: rgba(0, 0, 0, 0.5); 36 | } 37 | } 38 | .markdown-editor{ 39 | height: 70vh; 40 | } 41 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parser: 'babel-eslint', 4 | parserOptions: { 5 | sourceType: 'module' 6 | }, 7 | // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style 8 | extends: 'standard', 9 | // required to lint *.vue files 10 | plugins: [ 11 | 'html' 12 | ], 13 | // add your custom rules here 14 | 'rules': { 15 | // allow paren-less arrow functions 16 | 'arrow-parens': 0, 17 | // allow async-await 18 | 'generator-star-spacing': 0, 19 | // allow debugger during development 20 | 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, 21 | // allow new for side effects 22 | "no-new": 0, 23 | 'comma-dangle': ['error', 'only-multiline'], 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /src/views/tag/edit.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | 29 | 30 | 32 | -------------------------------------------------------------------------------- /src/views/emailconfig/sendLog.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 26 | 27 | 29 | -------------------------------------------------------------------------------- /src/views/user/edit.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 31 | 32 | 34 | -------------------------------------------------------------------------------- /src/filters/index.js: -------------------------------------------------------------------------------- 1 | import {dateFormat} from '../utils/util' 2 | 3 | exports.datetime = (value) => { 4 | if (value) { 5 | let date = new Date(value) 6 | value = dateFormat(date, 'yyyy-MM-dd hh:mm') 7 | } 8 | return value 9 | } 10 | 11 | exports.html2text = (value) => { 12 | if (value) { 13 | value = value.replace(/<[^>]*>/g, '') 14 | } 15 | return value 16 | } 17 | 18 | exports.substr = (value, start, length) => { 19 | if (value) { 20 | value = value.substr(start, length) 21 | } 22 | return value 23 | } 24 | 25 | exports.maxlength = (value, length, ellipsis = true) => { 26 | if (value) { 27 | if (value.length > length) { 28 | value = value.substr(0, length) 29 | if (ellipsis) value += '...' 30 | } 31 | } 32 | return value 33 | } 34 | 35 | exports.number = (value) => { 36 | return parseInt(value) 37 | } 38 | const stateMap = { 39 | 1: '正常', 40 | 0: '已删除' 41 | } 42 | exports.state = (value) => { 43 | return stateMap[value] 44 | } 45 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # cms-admin-front 2 | 3 | > a porject about cms 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8989 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | ## PLAN 19 | 20 | forget password for admin 21 | 22 | 2017-1-22 23 | 1. `status` filter for article-list 24 | 2. more information in pageview (add `userAgent` `fullPath`) 25 | 3. remember username and password (login page, save in `localStorage`) 26 | 27 | make login page beautiful `done` 2017-1-18 28 | new admin-init page. 2step 2017-1-18 `done` 29 | 1. config you email smtp server 30 | 2. register your login account (send email use `step-1` smtp config) 31 | 32 | update the element-ui to the new version 2017-1-12 `done` 33 | deleted comment recovery 2017-1-12 `done` 34 | change the comment search `article-select` to `filterable` 2017-1-12 `done` 35 | user password-modify 2017-1-12 `done` 36 | -------------------------------------------------------------------------------- /src/views/comment/reply-form.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 31 | 32 | 34 | -------------------------------------------------------------------------------- /src/views/catalog/edit.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 33 | 34 | 36 | -------------------------------------------------------------------------------- /src/views/comment/edit.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 33 | 34 | 36 | -------------------------------------------------------------------------------- /src/styles/global.less: -------------------------------------------------------------------------------- 1 | @import "./base.less"; 2 | 3 | html{ 4 | font-family: "Microsoft YaHei","微软雅黑","Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB",Arial,sans-serif; 5 | // font-weight: 100; 6 | } 7 | h1,h2,h3,h4,h5,h6,th{ 8 | // font-weight: normal; 9 | } 10 | * { 11 | margin: 0; 12 | padding: 0; 13 | box-sizing: border-box; 14 | } 15 | h1,h2,h3,h4,h5,h6{ 16 | font-weight: normal; 17 | } 18 | .el-dialog--large{ 19 | margin-bottom: 0 !important; 20 | top: 5% !important; 21 | } 22 | .pagination{ 23 | display: flex; 24 | justify-content: flex-end; 25 | margin-top: 20px; 26 | &>div{ 27 | padding: 0; 28 | } 29 | } 30 | .actions { 31 | display: flex; 32 | justify-content: flex-end; 33 | margin-bottom: 20px; 34 | } 35 | .flexrow{ 36 | display: flex; 37 | margin: 0px -@flex-padding; 38 | [class*="flex-"] { 39 | padding: 0px @flex-padding; 40 | } 41 | } 42 | .flex{ 43 | display: flex; 44 | } 45 | .flex-1{ 46 | flex: 1; 47 | } 48 | .flex-2{ 49 | flex: 2; 50 | } 51 | .flex-3{ 52 | flex: 3; 53 | } 54 | .flex-4{ 55 | flex: 4; 56 | } 57 | -------------------------------------------------------------------------------- /src/views/tag/list.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 26 | 27 | 29 | -------------------------------------------------------------------------------- /src/views/setting/list.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 27 | -------------------------------------------------------------------------------- /src/views/emailconfig/sendEmail.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 30 | 31 | 36 | -------------------------------------------------------------------------------- /src/components/RichEditor.vue: -------------------------------------------------------------------------------- 1 | 5 | 6 | 36 | 37 | 44 | -------------------------------------------------------------------------------- /src/components/PugEditor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 42 | 43 | 55 | -------------------------------------------------------------------------------- /config/index.js: -------------------------------------------------------------------------------- 1 | // see http://vuejs-templates.github.io/webpack for documentation. 2 | var path = require('path') 3 | 4 | module.exports = { 5 | build: { 6 | env: require('./prod.env'), 7 | index: path.resolve(__dirname, '../dist/index.html'), 8 | assetsRoot: path.resolve(__dirname, '../dist'), 9 | assetsSubDirectory: 'static', 10 | assetsPublicPath: '/', 11 | productionSourceMap: false, 12 | // Gzip off by default as many popular static hosts such as 13 | // Surge or Netlify already gzip all static assets for you. 14 | // Before setting to `true`, make sure to: 15 | // npm install --save-dev compression-webpack-plugin 16 | productionGzip: false, 17 | productionGzipExtensions: ['js', 'css'] 18 | }, 19 | dev: { 20 | env: require('./dev.env'), 21 | port: 8989, 22 | assetsSubDirectory: 'static', 23 | assetsPublicPath: '/', 24 | proxyTable: {}, 25 | // CSS Sourcemaps off by default because relative paths are "buggy" 26 | // with this option, according to the CSS-Loader README 27 | // (https://github.com/webpack/css-loader#sourcemaps) 28 | // In our experience, they generally work as expected, 29 | // just be aware of this issue when enabling this option. 30 | cssSourceMap: false 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/views/catalog/list.vue: -------------------------------------------------------------------------------- 1 | 22 | 23 | 31 | 32 | 34 | -------------------------------------------------------------------------------- /src/vuex/store.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | 4 | Vue.use(Vuex) 5 | 6 | const localStorage = window.localStorage 7 | export default new Vuex.Store({ 8 | state: { 9 | user: {}, 10 | login: false, 11 | token: '' 12 | }, 13 | mutations: { 14 | LOGIN (state, {user, token}) { 15 | state.user = user 16 | state.login = true 17 | state.token = token 18 | localStorage.setItem('token', token) 19 | }, 20 | LOGOUT (state) { 21 | state.login = false 22 | state.token = '' 23 | localStorage.clear() 24 | } 25 | }, 26 | actions: { 27 | logout ({commit, state}) { 28 | commit('LOGOUT') 29 | if (state.token) { 30 | return Vue.http.get('user/logout/' + state.token).then((data, e) => { 31 | console.log(data, e) 32 | }) 33 | } 34 | }, 35 | login ({commit}, token = localStorage.getItem('token')) { 36 | return new Promise((resolve, reject) => { 37 | if (!token) { 38 | reject('no token') 39 | } else { 40 | Vue.http.get('user/' + token).then(({data}) => { 41 | let user = data 42 | commit('LOGIN', {user, token}) 43 | resolve(user) 44 | }).catch((data) => { 45 | reject(data) 46 | }) 47 | } 48 | }) 49 | } 50 | } 51 | }) 52 | -------------------------------------------------------------------------------- /src/views/setting/edit.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 47 | 48 | 50 | -------------------------------------------------------------------------------- /src/routes.js: -------------------------------------------------------------------------------- 1 | // import App from './App' 2 | const ignoreAuth = {authorization: false} 3 | export default [ 4 | { 5 | path: '/login', 6 | name: 'login', 7 | meta: ignoreAuth, 8 | component: r => require(['src/views/login/login.vue'], r) 9 | }, 10 | { 11 | path: '/init', 12 | name: 'init', 13 | meta: ignoreAuth, 14 | component: r => require(['src/views/user/init.vue'], r) 15 | }, 16 | { 17 | path: '/no-page/:message', 18 | name: 'no-page', 19 | title: '404 no found', 20 | meta: ignoreAuth, 21 | component: r => require(['src/views/no-page.vue'], r) 22 | }, 23 | { 24 | path: '/', 25 | name: 'index', 26 | component: r => require(['src/views/index.vue'], r), 27 | children: [ 28 | { 29 | path: 'article', 30 | name: 'article', 31 | component: r => require(['src/views/article/list.vue'], r) 32 | }, 33 | { 34 | path: 'catalog', 35 | name: 'catalog', 36 | component: r => require(['src/views/catalog/list.vue'], r) 37 | }, 38 | { 39 | path: 'tag', 40 | name: 'tag', 41 | component: r => require(['src/views/tag/list.vue'], r) 42 | }, 43 | { 44 | path: 'pageview', 45 | name: 'pageview', 46 | component: r => require(['src/views/pageview/list.vue'], r) 47 | }, 48 | { 49 | path: 'setting', 50 | name: 'setting', 51 | component: r => require(['src/views/setting/list.vue'], r) 52 | }, 53 | { 54 | path: 'comment', 55 | name: 'comment', 56 | component: r => require(['src/views/comment/list.vue'], r) 57 | }, 58 | { 59 | path: 'email-config', 60 | name: 'email-config', 61 | component: r => require(['src/views/emailconfig/list.vue'], r) 62 | } 63 | ] 64 | } 65 | ] 66 | -------------------------------------------------------------------------------- /src/views/emailconfig/edit.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 52 | 53 | 58 | -------------------------------------------------------------------------------- /theme/form-item.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/menu-item.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/submenu.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/tab-pane.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/breadcrumb-item.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/button-group.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/checkbox-group.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/collapse-item.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/dropdown-item.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/dropdown-menu.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/menu-item-group.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/radio-button.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /theme/radio-group.css: -------------------------------------------------------------------------------- 1 | :root { 2 | /* Transition 3 | -------------------------- */ 4 | /* Colors 5 | -------------------------- */ 6 | /* Link 7 | -------------------------- */ 8 | /* Border 9 | -------------------------- */ 10 | /* Box-shadow 11 | -------------------------- */ 12 | /* Fill 13 | -------------------------- */ 14 | /* Font 15 | -------------------------- */ 16 | /* Size 17 | -------------------------- */ 18 | /* z-index 19 | -------------------------- */ 20 | /* Disable base 21 | -------------------------- */ 22 | /* Icon 23 | -------------------------- */ 24 | /* Checkbox 25 | -------------------------- */ 26 | /* Radio 27 | -------------------------- */ 28 | /* Select 29 | -------------------------- */ 30 | /* Alert 31 | -------------------------- */ 32 | /* Message Box 33 | -------------------------- */ 34 | /* Message 35 | -------------------------- */ 36 | /* Notification 37 | -------------------------- */ 38 | /* Input 39 | -------------------------- */ 40 | /* Cascader 41 | -------------------------- */ 42 | /* Group 43 | -------------------------- */ 44 | /* Tab 45 | -------------------------- */ 46 | /* Button 47 | -------------------------- */ 48 | /* cascader 49 | -------------------------- */ 50 | /* Switch 51 | -------------------------- */ 52 | /* Dialog 53 | -------------------------- */ 54 | /* Table 55 | -------------------------- */ 56 | /* Pagination 57 | -------------------------- */ 58 | /* Popover 59 | -------------------------- */ 60 | /* Tooltip 61 | -------------------------- */ 62 | /* Tag 63 | -------------------------- */ 64 | /* Dropdown 65 | -------------------------- */ 66 | /* Badge 67 | -------------------------- */ 68 | /* Card 69 | --------------------------*/ 70 | /* Slider 71 | --------------------------*/ 72 | /* Steps 73 | --------------------------*/ 74 | /* Steps 75 | --------------------------*/ 76 | /* Rate 77 | --------------------------*/ 78 | /* DatePicker 79 | --------------------------*/ 80 | /* Loading 81 | --------------------------*/ 82 | /* Scrollbar 83 | --------------------------*/ 84 | /* Carousel 85 | --------------------------*/ 86 | /* Collapse 87 | --------------------------*/ 88 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "cms-admin-fron", 3 | "version": "1.0.0", 4 | "description": "a porject about cms", 5 | "author": "Diamond Zhou <458293193@qq.com>", 6 | "private": true, 7 | "scripts": { 8 | "dev": "node build/dev-server.js", 9 | "build": "node build/build.js", 10 | "build-docs": "npm run build & node ./dist-build.js", 11 | "lint": "eslint --ext .js,.vue src" 12 | }, 13 | "dependencies": { 14 | "chart.js": "^2.4.0", 15 | "element-ui": "^1.0.6", 16 | "gh-pages": "^0.12.0", 17 | "he": "^1.1.0", 18 | "highlightjs": "^9.8.0", 19 | "html2jade": "^0.8.6", 20 | "markdown-it-editor": "^1.0.29", 21 | "vue": "^2.0.1", 22 | "vue-resource": "^1.0.3", 23 | "vue-router": "^2.0.1", 24 | "vuex": "^2.0.0" 25 | }, 26 | "devDependencies": { 27 | "autoprefixer": "^6.4.0", 28 | "babel-core": "^6.0.0", 29 | "babel-eslint": "^7.0.0", 30 | "babel-loader": "^6.0.0", 31 | "babel-plugin-transform-runtime": "^6.0.0", 32 | "babel-preset-es2015": "^6.0.0", 33 | "babel-preset-stage-2": "^6.0.0", 34 | "babel-register": "^6.0.0", 35 | "chalk": "^1.1.3", 36 | "connect-history-api-fallback": "^1.1.0", 37 | "css-loader": "^0.25.0", 38 | "element-theme-default": "^1.1.5", 39 | "eslint": "^3.7.1", 40 | "eslint-config-standard": "^6.1.0", 41 | "eslint-friendly-formatter": "^2.0.5", 42 | "eslint-loader": "^1.5.0", 43 | "eslint-plugin-html": "^1.3.0", 44 | "eslint-plugin-promise": "^2.0.1", 45 | "eslint-plugin-standard": "^2.0.1", 46 | "eventsource-polyfill": "^0.9.6", 47 | "express": "^4.13.3", 48 | "extract-text-webpack-plugin": "^1.0.1", 49 | "file-loader": "^0.9.0", 50 | "function-bind": "^1.0.2", 51 | "html-webpack-plugin": "^2.8.1", 52 | "http-proxy-middleware": "^0.17.2", 53 | "json-loader": "^0.5.4", 54 | "less": "^2.7.1", 55 | "less-loader": "^2.2.3", 56 | "opn": "^4.0.2", 57 | "ora": "^0.3.0", 58 | "pug": "^2.0.0-beta6", 59 | "semver": "^5.3.0", 60 | "shelljs": "^0.7.4", 61 | "url-loader": "^0.5.7", 62 | "vue-loader": "^9.9.2", 63 | "vue-style-loader": "^1.0.0", 64 | "webpack": "^1.13.2", 65 | "webpack-dev-middleware": "^1.8.3", 66 | "webpack-hot-middleware": "^2.12.2", 67 | "webpack-merge": "^0.14.1" 68 | }, 69 | "engines": { 70 | "node": ">= 4.0.0", 71 | "npm": ">= 3.0.0" 72 | } 73 | } 74 | -------------------------------------------------------------------------------- /src/views/emailconfig/list.vue: -------------------------------------------------------------------------------- 1 | 26 | 27 | 62 | 63 | 65 | -------------------------------------------------------------------------------- /src/views/login/login.vue: -------------------------------------------------------------------------------- 1 | 13 | 14 | 70 | 71 | 89 | -------------------------------------------------------------------------------- /theme/element-variables.css: -------------------------------------------------------------------------------- 1 | :root { 2 | 3 | /* Transition 4 | -------------------------- */ 5 | 6 | /* Colors 7 | -------------------------- */ 8 | 9 | /* Link 10 | -------------------------- */ 11 | 12 | /* Border 13 | -------------------------- */ 14 | 15 | /* Box-shadow 16 | -------------------------- */ 17 | 18 | /* Fill 19 | -------------------------- */ 20 | 21 | /* Font 22 | -------------------------- */ 23 | 24 | /* Size 25 | -------------------------- */ 26 | 27 | /* z-index 28 | -------------------------- */ 29 | 30 | /* Disable base 31 | -------------------------- */ 32 | 33 | /* Icon 34 | -------------------------- */ 35 | 36 | /* Checkbox 37 | -------------------------- */ 38 | 39 | /* Radio 40 | -------------------------- */ 41 | 42 | /* Select 43 | -------------------------- */ 44 | 45 | /* Alert 46 | -------------------------- */ 47 | 48 | /* Message Box 49 | -------------------------- */ 50 | 51 | /* Message 52 | -------------------------- */ 53 | 54 | /* Notification 55 | -------------------------- */ 56 | 57 | /* Input 58 | -------------------------- */ 59 | 60 | /* Cascader 61 | -------------------------- */ 62 | 63 | /* Group 64 | -------------------------- */ 65 | 66 | /* Tab 67 | -------------------------- */ 68 | 69 | /* Button 70 | -------------------------- */ 71 | 72 | 73 | /* cascader 74 | -------------------------- */ 75 | 76 | /* Switch 77 | -------------------------- */ 78 | 79 | /* Dialog 80 | -------------------------- */ 81 | 82 | /* Table 83 | -------------------------- */ 84 | 85 | /* Pagination 86 | -------------------------- */ 87 | 88 | /* Popover 89 | -------------------------- */ 90 | 91 | /* Tooltip 92 | -------------------------- */ 93 | 94 | /* Tag 95 | -------------------------- */ 96 | 97 | /* Dropdown 98 | -------------------------- */ 99 | 100 | /* Badge 101 | -------------------------- */ 102 | 103 | /* Card 104 | --------------------------*/ 105 | 106 | /* Slider 107 | --------------------------*/ 108 | 109 | /* Steps 110 | --------------------------*/ 111 | 112 | /* Steps 113 | --------------------------*/ 114 | 115 | /* Rate 116 | --------------------------*/ 117 | 118 | /* DatePicker 119 | --------------------------*/ 120 | 121 | /* Loading 122 | --------------------------*/ 123 | 124 | /* Scrollbar 125 | --------------------------*/ 126 | 127 | /* Carousel 128 | --------------------------*/ 129 | 130 | /* Collapse 131 | --------------------------*/ 132 | } 133 | -------------------------------------------------------------------------------- /src/components/mix/DTMix.js: -------------------------------------------------------------------------------- 1 | /** 2 | * table list mix - 3 | * inculde curd opeartor 4 | **/ 5 | export default { 6 | created () { 7 | if (this.autoload !== false) this.loadPage() 8 | if (this.autoSearch) { 9 | this.$watch('queryParams', () => { 10 | this.loadPage() 11 | }, {deep: true}) 12 | } 13 | }, 14 | data () { 15 | return { 16 | url: this.$route.name, 17 | pageData: {}, 18 | editData: {}, 19 | editDialog: false, 20 | listLoading: false, 21 | saveLoading: false, 22 | saveOptions: {} 23 | } 24 | }, 25 | computed: { 26 | tableData () { 27 | return this.pageData.data 28 | } 29 | }, 30 | methods: { 31 | searchPage () { 32 | return this.loadPage() 33 | }, 34 | loadPage (pageSize = this.pageData.pageSize || 10, currentPage = this.pageData.currentPage || 1, queryParams = this.queryParams || {}) { 35 | this.listLoading = true 36 | this.$get(this.url, { 37 | pageSize: pageSize, 38 | currentPage: currentPage, 39 | ...queryParams 40 | }).then(({data}) => { 41 | this.pageData = data 42 | }).finally(() => { 43 | this.listLoading = false 44 | }) 45 | }, 46 | sizeChange (size) { 47 | this.pageData.pageSize = size 48 | this.loadPage() 49 | }, 50 | pageChange (currentPage) { 51 | this.pageData.currentPage = currentPage 52 | this.loadPage() 53 | }, 54 | remove (id) { 55 | return this.$confirm(this.deleteMsg || '确定要删除该条记录吗?', '提示', { 56 | confirmButtonText: '删除', 57 | cancelButtonText: '取消', 58 | type: 'warning' 59 | }) 60 | .then(() => { 61 | return this.$delete(this.url, {id}).then(() => { 62 | this.$message.success('删除成功') 63 | }) 64 | }) 65 | .then(() => { return this.loadPage() }) 66 | .catch(() => {}) 67 | }, 68 | edit (id) { 69 | if (id) { 70 | this.listLoading = true 71 | this.$get(this.url + '/' + id).then(({data}) => { 72 | this.editData = data 73 | this.editDialog = true 74 | }).finally(() => { 75 | this.listLoading = false 76 | }) 77 | } else { 78 | this.editData = {} 79 | this.editDialog = true 80 | } 81 | }, 82 | save (data) { 83 | let requestPath = this.url 84 | if (data.id) { 85 | requestPath += '/' + data.id 86 | } 87 | this.saveLoading = true 88 | this.$post(requestPath, data, this.saveOptions).then(() => { 89 | this.editDialog = false 90 | this.loadPage() 91 | }).finally(() => { 92 | this.saveLoading = false 93 | }) 94 | } 95 | } 96 | } 97 | -------------------------------------------------------------------------------- /src/views/user/init.vue: -------------------------------------------------------------------------------- 1 | 22 | 23 | 93 | 94 | 104 | -------------------------------------------------------------------------------- /src/views/comment/list.vue: -------------------------------------------------------------------------------- 1 | 37 | 38 | 96 | 97 | 105 | -------------------------------------------------------------------------------- /src/views/article/edit.vue: -------------------------------------------------------------------------------- 1 | 37 | 38 | 121 | 122 | 125 | -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App' 3 | import ElementUI from 'element-ui' 4 | import VueRouter from 'vue-router' 5 | import VueResource from 'vue-resource' 6 | import routes from './routes' 7 | import '../theme/index.css' 8 | import './assets/font-awesome-4.7/css/font-awesome.css' 9 | import './styles/global.less' 10 | import './styles/element-style.less' 11 | import './styles/theme.less' 12 | import store from './vuex/store' 13 | import filters from './filters' 14 | Vue.use(ElementUI) 15 | Vue.use(VueRouter) 16 | Vue.use(VueResource) 17 | const isProd = process.env.NODE_ENV === 'production' 18 | let uploadUrl = '' 19 | if (isProd) { 20 | Vue.http.options.root = 'http://api.diamondfsd.com' 21 | Vue.config.devtools = false 22 | Vue.config.silent = true 23 | uploadUrl = 'http://file.diamondfsd.com/upload' 24 | } else { 25 | // Vue.http.options.root = 'http://42.96.203.79:8080' 26 | Vue.http.options.root = 'http://api.diamondfsd.com' 27 | uploadUrl = 'http://localhost:22222/upload' 28 | } 29 | 30 | Vue.http.options.emulateJSON = true 31 | Vue.globalOptions = { 32 | uploadUrl: uploadUrl 33 | } 34 | 35 | Object.keys(filters).forEach(k => { 36 | Vue.filter(k, filters[k]) 37 | }) 38 | 39 | Vue.mixin({ 40 | computed: { 41 | mix_headers () { 42 | return {'Authorization': store.state.token} 43 | } 44 | }, 45 | methods: { 46 | $post (url, data, options) { 47 | return this.$http.post(url, data, {headers: this.mix_headers, ...options}) 48 | }, 49 | $put (url, data, options) { 50 | return this.$http.put(url, data, {headers: this.mix_headers, ...options}) 51 | }, 52 | $get (url, data, options) { 53 | return this.$http.get(`${url}?${this.$serialize(data)}`, {headers: this.mix_headers, ...options}) 54 | }, 55 | $delete (url, data, options) { 56 | return this.$http.delete(`${url}?${this.$serialize(data)}`, {headers: this.mix_headers, ...options}) 57 | }, 58 | $serialize (data = {}) { 59 | let dataStr = '' 60 | Object.keys(data).forEach(k => { 61 | let value = data[k] 62 | if (value !== null && value !== undefined && value !== '') { 63 | dataStr += `${k}=${value}&` 64 | } 65 | }) 66 | return dataStr.substr(0, dataStr.length - 1) 67 | } 68 | } 69 | }) 70 | 71 | const router = new VueRouter({ routes }) 72 | 73 | router.beforeEach((to, from, next) => { 74 | if (to.matched.length === 0) { 75 | router.replace({ name: 'no-page', params: {message: to.path} }) 76 | next() 77 | } else if (to.meta.authorization !== false && store.state.login === false) { 78 | let load = ElementUI.Loading.service({text: 'loading'}) 79 | store.dispatch('login') 80 | .then((user) => { 81 | load.close() 82 | next() 83 | }) 84 | .catch(() => { 85 | router.replace({name: 'login', query: {redirect: to.fullPath}}) 86 | load.close() 87 | }) 88 | } else { 89 | next() 90 | } 91 | }) 92 | 93 | const statusMap = { 94 | 0: 'Cannot connect to server', 95 | 404: 'request does not exist', 96 | 500: 'server exception' 97 | } 98 | 99 | Vue.http.interceptors.push((request, next) => { 100 | next(response => { 101 | if (response.ok) { 102 | let result = response.data 103 | if (!result) return response 104 | if (result.success === false) { 105 | ElementUI.Message.error(result.msg) 106 | response.ok = false 107 | } else if (result.success) { 108 | response.data = result.data 109 | } 110 | } else { 111 | let status = response.status 112 | switch (status) { 113 | case 401: 114 | ElementUI.Message.error('login expired, please re-login') 115 | router.replace({name: 'login', query: {redirect: app.$route.fullPath}}) 116 | break 117 | case 402: 118 | router.replace({name: 'init'}) 119 | break 120 | default: 121 | ElementUI.Message.error(statusMap[status] || response.body) 122 | break 123 | } 124 | } 125 | }) 126 | }) 127 | 128 | /* eslint-disable no-new */ 129 | const app = new Vue({ 130 | el: '#app', 131 | router, 132 | store: store, 133 | template: '', 134 | components: { App } 135 | }) 136 | 137 | app.$get('user/need-init') 138 | -------------------------------------------------------------------------------- /theme/steps.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-steps{ 92 | font-size: 0; 93 | } 94 | 95 | .el-steps > :last-child .el-step__line{ 96 | display: none; 97 | } 98 | 99 | .el-steps.is-horizontal{ 100 | white-space: nowrap; 101 | } 102 | 103 | .el-steps.is-horizontal.is-center{ 104 | text-align: center; 105 | } 106 | :root{ 107 | /* Transition 108 | -------------------------- */ 109 | /* Colors 110 | -------------------------- */ 111 | /* Link 112 | -------------------------- */ 113 | /* Border 114 | -------------------------- */ 115 | /* Box-shadow 116 | -------------------------- */ 117 | /* Fill 118 | -------------------------- */ 119 | /* Font 120 | -------------------------- */ 121 | /* Size 122 | -------------------------- */ 123 | /* z-index 124 | -------------------------- */ 125 | /* Disable base 126 | -------------------------- */ 127 | /* Icon 128 | -------------------------- */ 129 | /* Checkbox 130 | -------------------------- */ 131 | /* Radio 132 | -------------------------- */ 133 | /* Select 134 | -------------------------- */ 135 | /* Alert 136 | -------------------------- */ 137 | /* Message Box 138 | -------------------------- */ 139 | /* Message 140 | -------------------------- */ 141 | /* Notification 142 | -------------------------- */ 143 | /* Input 144 | -------------------------- */ 145 | /* Cascader 146 | -------------------------- */ 147 | /* Group 148 | -------------------------- */ 149 | /* Tab 150 | -------------------------- */ 151 | /* Button 152 | -------------------------- */ 153 | /* cascader 154 | -------------------------- */ 155 | /* Switch 156 | -------------------------- */ 157 | /* Dialog 158 | -------------------------- */ 159 | /* Table 160 | -------------------------- */ 161 | /* Pagination 162 | -------------------------- */ 163 | /* Popover 164 | -------------------------- */ 165 | /* Tooltip 166 | -------------------------- */ 167 | /* Tag 168 | -------------------------- */ 169 | /* Dropdown 170 | -------------------------- */ 171 | /* Badge 172 | -------------------------- */ 173 | /* Card 174 | --------------------------*/ 175 | /* Slider 176 | --------------------------*/ 177 | /* Steps 178 | --------------------------*/ 179 | /* Steps 180 | --------------------------*/ 181 | /* Rate 182 | --------------------------*/ 183 | /* DatePicker 184 | --------------------------*/ 185 | /* Loading 186 | --------------------------*/ 187 | /* Scrollbar 188 | --------------------------*/ 189 | /* Carousel 190 | --------------------------*/ 191 | /* Collapse 192 | --------------------------*/ 193 | } -------------------------------------------------------------------------------- /src/views/article/list.vue: -------------------------------------------------------------------------------- 1 | 41 | 42 | 112 | 113 | 141 | -------------------------------------------------------------------------------- /src/views/pageview/list.vue: -------------------------------------------------------------------------------- 1 | 31 | 32 | 163 | 164 | 166 | -------------------------------------------------------------------------------- /theme/option-group.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-select-group{ 92 | margin: 0; 93 | padding: 0 94 | } 95 | 96 | .el-select-group .el-select-dropdown__item{ 97 | padding-left: 20px 98 | } 99 | 100 | .el-select-group__wrap{ 101 | list-style: none; 102 | margin: 0; 103 | padding: 0 104 | } 105 | 106 | .el-select-group__title{ 107 | padding-left: 10px; 108 | font-size: 12px; 109 | color: #999; 110 | height: 30px; 111 | line-height: 30px 112 | } 113 | :root{ 114 | /* Transition 115 | -------------------------- */ 116 | /* Colors 117 | -------------------------- */ 118 | /* Link 119 | -------------------------- */ 120 | /* Border 121 | -------------------------- */ 122 | /* Box-shadow 123 | -------------------------- */ 124 | /* Fill 125 | -------------------------- */ 126 | /* Font 127 | -------------------------- */ 128 | /* Size 129 | -------------------------- */ 130 | /* z-index 131 | -------------------------- */ 132 | /* Disable base 133 | -------------------------- */ 134 | /* Icon 135 | -------------------------- */ 136 | /* Checkbox 137 | -------------------------- */ 138 | /* Radio 139 | -------------------------- */ 140 | /* Select 141 | -------------------------- */ 142 | /* Alert 143 | -------------------------- */ 144 | /* Message Box 145 | -------------------------- */ 146 | /* Message 147 | -------------------------- */ 148 | /* Notification 149 | -------------------------- */ 150 | /* Input 151 | -------------------------- */ 152 | /* Cascader 153 | -------------------------- */ 154 | /* Group 155 | -------------------------- */ 156 | /* Tab 157 | -------------------------- */ 158 | /* Button 159 | -------------------------- */ 160 | /* cascader 161 | -------------------------- */ 162 | /* Switch 163 | -------------------------- */ 164 | /* Dialog 165 | -------------------------- */ 166 | /* Table 167 | -------------------------- */ 168 | /* Pagination 169 | -------------------------- */ 170 | /* Popover 171 | -------------------------- */ 172 | /* Tooltip 173 | -------------------------- */ 174 | /* Tag 175 | -------------------------- */ 176 | /* Dropdown 177 | -------------------------- */ 178 | /* Badge 179 | -------------------------- */ 180 | /* Card 181 | --------------------------*/ 182 | /* Slider 183 | --------------------------*/ 184 | /* Steps 185 | --------------------------*/ 186 | /* Steps 187 | --------------------------*/ 188 | /* Rate 189 | --------------------------*/ 190 | /* DatePicker 191 | --------------------------*/ 192 | /* Loading 193 | --------------------------*/ 194 | /* Scrollbar 195 | --------------------------*/ 196 | /* Carousel 197 | --------------------------*/ 198 | /* Collapse 199 | --------------------------*/ 200 | } -------------------------------------------------------------------------------- /theme/card.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-card{ 92 | border: 1px solid rgb(209, 221, 229); 93 | border-radius: 4px; 94 | background-color: #fff; 95 | overflow: hidden; 96 | box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, .12), 97 | 0px 0px 6px 0px rgba(0, 0, 0, .04) 98 | } 99 | 100 | .el-card__header{ 101 | padding: 18px 20px; 102 | border-bottom: 1px solid rgb(209, 221, 229); 103 | box-sizing: border-box 104 | } 105 | 106 | .el-card__body{ 107 | padding: 20px 108 | } 109 | :root{ 110 | /* Transition 111 | -------------------------- */ 112 | /* Colors 113 | -------------------------- */ 114 | /* Link 115 | -------------------------- */ 116 | /* Border 117 | -------------------------- */ 118 | /* Box-shadow 119 | -------------------------- */ 120 | /* Fill 121 | -------------------------- */ 122 | /* Font 123 | -------------------------- */ 124 | /* Size 125 | -------------------------- */ 126 | /* z-index 127 | -------------------------- */ 128 | /* Disable base 129 | -------------------------- */ 130 | /* Icon 131 | -------------------------- */ 132 | /* Checkbox 133 | -------------------------- */ 134 | /* Radio 135 | -------------------------- */ 136 | /* Select 137 | -------------------------- */ 138 | /* Alert 139 | -------------------------- */ 140 | /* Message Box 141 | -------------------------- */ 142 | /* Message 143 | -------------------------- */ 144 | /* Notification 145 | -------------------------- */ 146 | /* Input 147 | -------------------------- */ 148 | /* Cascader 149 | -------------------------- */ 150 | /* Group 151 | -------------------------- */ 152 | /* Tab 153 | -------------------------- */ 154 | /* Button 155 | -------------------------- */ 156 | /* cascader 157 | -------------------------- */ 158 | /* Switch 159 | -------------------------- */ 160 | /* Dialog 161 | -------------------------- */ 162 | /* Table 163 | -------------------------- */ 164 | /* Pagination 165 | -------------------------- */ 166 | /* Popover 167 | -------------------------- */ 168 | /* Tooltip 169 | -------------------------- */ 170 | /* Tag 171 | -------------------------- */ 172 | /* Dropdown 173 | -------------------------- */ 174 | /* Badge 175 | -------------------------- */ 176 | /* Card 177 | --------------------------*/ 178 | /* Slider 179 | --------------------------*/ 180 | /* Steps 181 | --------------------------*/ 182 | /* Steps 183 | --------------------------*/ 184 | /* Rate 185 | --------------------------*/ 186 | /* DatePicker 187 | --------------------------*/ 188 | /* Loading 189 | --------------------------*/ 190 | /* Scrollbar 191 | --------------------------*/ 192 | /* Carousel 193 | --------------------------*/ 194 | /* Collapse 195 | --------------------------*/ 196 | } -------------------------------------------------------------------------------- /theme/icon.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'element-icons'; 3 | src: url('fonts/element-icons.eot?t=1472440741'); /* IE9*/ 4 | src: url('fonts/element-icons.woff?t=1472440741') format('woff'), /* chrome, firefox */ 5 | url('fonts/element-icons.ttf?t=1472440741') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/ 6 | url('fonts/element-icons.svg?t=1472440741#el-icon') format('svg'); /* iOS 4.1- */ 7 | font-weight: 400; 8 | font-style: normal; 9 | } 10 | 11 | [class^="el-icon-"], [class*=" el-icon-"] { 12 | /* use !important to prevent issues with browser extensions that change fonts */ 13 | font-family: 'element-icons' !important; 14 | speak: none; 15 | font-style: normal; 16 | font-weight: 400; 17 | font-variant: normal; 18 | text-transform: none; 19 | line-height: 1; 20 | vertical-align: baseline; 21 | display: inline-block; 22 | 23 | /* Better Font Rendering =========== */ 24 | -webkit-font-smoothing: antialiased; 25 | -moz-osx-font-smoothing: grayscale; 26 | } 27 | 28 | .el-icon-arrow-down:before { content: "\e600"; } 29 | .el-icon-arrow-left:before { content: "\e601"; } 30 | .el-icon-arrow-right:before { content: "\e602"; } 31 | .el-icon-arrow-up:before { content: "\e603"; } 32 | .el-icon-caret-bottom:before { content: "\e604"; } 33 | .el-icon-caret-left:before { content: "\e605"; } 34 | .el-icon-caret-right:before { content: "\e606"; } 35 | .el-icon-caret-top:before { content: "\e607"; } 36 | .el-icon-check:before { content: "\e608"; } 37 | .el-icon-circle-check:before { content: "\e609"; } 38 | .el-icon-circle-close:before { content: "\e60a"; } 39 | .el-icon-circle-cross:before { content: "\e60b"; } 40 | .el-icon-close:before { content: "\e60c"; } 41 | .el-icon-upload:before { content: "\e60d"; } 42 | .el-icon-d-arrow-left:before { content: "\e60e"; } 43 | .el-icon-d-arrow-right:before { content: "\e60f"; } 44 | .el-icon-d-caret:before { content: "\e610"; } 45 | .el-icon-date:before { content: "\e611"; } 46 | .el-icon-delete:before { content: "\e612"; } 47 | .el-icon-document:before { content: "\e613"; } 48 | .el-icon-edit:before { content: "\e614"; } 49 | .el-icon-information:before { content: "\e615"; } 50 | .el-icon-loading:before { content: "\e616"; } 51 | .el-icon-menu:before { content: "\e617"; } 52 | .el-icon-message:before { content: "\e618"; } 53 | .el-icon-minus:before { content: "\e619"; } 54 | .el-icon-more:before { content: "\e61a"; } 55 | .el-icon-picture:before { content: "\e61b"; } 56 | .el-icon-plus:before { content: "\e61c"; } 57 | .el-icon-search:before { content: "\e61d"; } 58 | .el-icon-setting:before { content: "\e61e"; } 59 | .el-icon-share:before { content: "\e61f"; } 60 | .el-icon-star-off:before { content: "\e620"; } 61 | .el-icon-star-on:before { content: "\e621"; } 62 | .el-icon-time:before { content: "\e622"; } 63 | .el-icon-warning:before { content: "\e623"; } 64 | .el-icon-delete2:before { content: "\e624"; } 65 | .el-icon-upload2:before { content: "\e627"; } 66 | .el-icon-view:before { content: "\e626"; } 67 | 68 | .el-icon-loading { 69 | animation: rotating 1s linear infinite; 70 | } 71 | 72 | .el-icon--right { 73 | margin-left: 5px; 74 | } 75 | .el-icon--left { 76 | margin-right: 5px; 77 | } 78 | 79 | @keyframes rotating { 80 | 0% { 81 | transform: rotateZ(0deg); 82 | } 83 | 100% { 84 | transform: rotateZ(360deg); 85 | } 86 | } 87 | :root { /* Transition 88 | -------------------------- */ /* Colors 89 | -------------------------- */ /* Link 90 | -------------------------- */ /* Border 91 | -------------------------- */ /* Box-shadow 92 | -------------------------- */ /* Fill 93 | -------------------------- */ /* Font 94 | -------------------------- */ /* Size 95 | -------------------------- */ /* z-index 96 | -------------------------- */ /* Disable base 97 | -------------------------- */ /* Icon 98 | -------------------------- */ /* Checkbox 99 | -------------------------- */ /* Radio 100 | -------------------------- */ /* Select 101 | -------------------------- */ /* Alert 102 | -------------------------- */ /* Message Box 103 | -------------------------- */ /* Message 104 | -------------------------- */ /* Notification 105 | -------------------------- */ /* Input 106 | -------------------------- */ /* Cascader 107 | -------------------------- */ /* Group 108 | -------------------------- */ /* Tab 109 | -------------------------- */ /* Button 110 | -------------------------- */ /* cascader 111 | -------------------------- */ /* Switch 112 | -------------------------- */ /* Dialog 113 | -------------------------- */ /* Table 114 | -------------------------- */ /* Pagination 115 | -------------------------- */ /* Popover 116 | -------------------------- */ /* Tooltip 117 | -------------------------- */ /* Tag 118 | -------------------------- */ /* Dropdown 119 | -------------------------- */ /* Badge 120 | -------------------------- */ /* Card 121 | --------------------------*/ /* Slider 122 | --------------------------*/ /* Steps 123 | --------------------------*/ /* Steps 124 | --------------------------*/ /* Rate 125 | --------------------------*/ /* DatePicker 126 | --------------------------*/ /* Loading 127 | --------------------------*/ /* Scrollbar 128 | --------------------------*/ /* Carousel 129 | --------------------------*/ /* Collapse 130 | --------------------------*/ 131 | } -------------------------------------------------------------------------------- /src/views/index.vue: -------------------------------------------------------------------------------- 1 | 33 | 34 | 113 | 114 | 196 | -------------------------------------------------------------------------------- /theme/spinner.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-time-spinner{ 92 | width: 100%; 93 | white-space: nowrap; 94 | } 95 | 96 | .el-spinner{ 97 | display: inline-block; 98 | vertical-align: middle; 99 | } 100 | 101 | .el-spinner-inner{ 102 | animation: rotate 2s linear infinite; 103 | width: 50px; 104 | height: 50px; 105 | } 106 | 107 | .el-spinner-inner .path{ 108 | stroke: #ececec; 109 | stroke-linecap: round; 110 | animation: dash 1.5s ease-in-out infinite; 111 | } 112 | @keyframes rotate { 113 | 100% { 114 | transform: rotate(360deg); 115 | } 116 | } 117 | 118 | @keyframes dash { 119 | 0% { 120 | stroke-dasharray: 1, 150; 121 | stroke-dashoffset: 0; 122 | } 123 | 50% { 124 | stroke-dasharray: 90, 150; 125 | stroke-dashoffset: -35; 126 | } 127 | 100% { 128 | stroke-dasharray: 90, 150; 129 | stroke-dashoffset: -124; 130 | } 131 | } 132 | :root{ 133 | /* Transition 134 | -------------------------- */ 135 | /* Colors 136 | -------------------------- */ 137 | /* Link 138 | -------------------------- */ 139 | /* Border 140 | -------------------------- */ 141 | /* Box-shadow 142 | -------------------------- */ 143 | /* Fill 144 | -------------------------- */ 145 | /* Font 146 | -------------------------- */ 147 | /* Size 148 | -------------------------- */ 149 | /* z-index 150 | -------------------------- */ 151 | /* Disable base 152 | -------------------------- */ 153 | /* Icon 154 | -------------------------- */ 155 | /* Checkbox 156 | -------------------------- */ 157 | /* Radio 158 | -------------------------- */ 159 | /* Select 160 | -------------------------- */ 161 | /* Alert 162 | -------------------------- */ 163 | /* Message Box 164 | -------------------------- */ 165 | /* Message 166 | -------------------------- */ 167 | /* Notification 168 | -------------------------- */ 169 | /* Input 170 | -------------------------- */ 171 | /* Cascader 172 | -------------------------- */ 173 | /* Group 174 | -------------------------- */ 175 | /* Tab 176 | -------------------------- */ 177 | /* Button 178 | -------------------------- */ 179 | /* cascader 180 | -------------------------- */ 181 | /* Switch 182 | -------------------------- */ 183 | /* Dialog 184 | -------------------------- */ 185 | /* Table 186 | -------------------------- */ 187 | /* Pagination 188 | -------------------------- */ 189 | /* Popover 190 | -------------------------- */ 191 | /* Tooltip 192 | -------------------------- */ 193 | /* Tag 194 | -------------------------- */ 195 | /* Dropdown 196 | -------------------------- */ 197 | /* Badge 198 | -------------------------- */ 199 | /* Card 200 | --------------------------*/ 201 | /* Slider 202 | --------------------------*/ 203 | /* Steps 204 | --------------------------*/ 205 | /* Steps 206 | --------------------------*/ 207 | /* Rate 208 | --------------------------*/ 209 | /* DatePicker 210 | --------------------------*/ 211 | /* Loading 212 | --------------------------*/ 213 | /* Scrollbar 214 | --------------------------*/ 215 | /* Carousel 216 | --------------------------*/ 217 | /* Collapse 218 | --------------------------*/ 219 | } -------------------------------------------------------------------------------- /theme/badge.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-badge{ 92 | position: relative; 93 | vertical-align: middle; 94 | display: inline-block 95 | } 96 | 97 | .el-badge__content{ 98 | background-color: #cf0000; 99 | border-radius: 10px; 100 | color: #fff; 101 | display: inline-block; 102 | font-size: 12px; 103 | height: 18px; 104 | line-height: 18px; 105 | padding: 0 6px; 106 | text-align: center; 107 | white-space: nowrap; 108 | border: 1px solid #fff 109 | } 110 | 111 | .el-badge__content.is-dot{ 112 | width: 8px; 113 | height: 8px; 114 | padding: 0; 115 | right: 0; 116 | border-radius: 50% 117 | } 118 | 119 | .el-badge__content.is-fixed{ 120 | top: 0; 121 | right: 10px; 122 | position: absolute; 123 | transform: translateY(-50%) translateX(100%) 124 | } 125 | 126 | .el-badge__content.is-fixed.is-dot{ 127 | right: 5px 128 | } 129 | :root{ 130 | /* Transition 131 | -------------------------- */ 132 | /* Colors 133 | -------------------------- */ 134 | /* Link 135 | -------------------------- */ 136 | /* Border 137 | -------------------------- */ 138 | /* Box-shadow 139 | -------------------------- */ 140 | /* Fill 141 | -------------------------- */ 142 | /* Font 143 | -------------------------- */ 144 | /* Size 145 | -------------------------- */ 146 | /* z-index 147 | -------------------------- */ 148 | /* Disable base 149 | -------------------------- */ 150 | /* Icon 151 | -------------------------- */ 152 | /* Checkbox 153 | -------------------------- */ 154 | /* Radio 155 | -------------------------- */ 156 | /* Select 157 | -------------------------- */ 158 | /* Alert 159 | -------------------------- */ 160 | /* Message Box 161 | -------------------------- */ 162 | /* Message 163 | -------------------------- */ 164 | /* Notification 165 | -------------------------- */ 166 | /* Input 167 | -------------------------- */ 168 | /* Cascader 169 | -------------------------- */ 170 | /* Group 171 | -------------------------- */ 172 | /* Tab 173 | -------------------------- */ 174 | /* Button 175 | -------------------------- */ 176 | /* cascader 177 | -------------------------- */ 178 | /* Switch 179 | -------------------------- */ 180 | /* Dialog 181 | -------------------------- */ 182 | /* Table 183 | -------------------------- */ 184 | /* Pagination 185 | -------------------------- */ 186 | /* Popover 187 | -------------------------- */ 188 | /* Tooltip 189 | -------------------------- */ 190 | /* Tag 191 | -------------------------- */ 192 | /* Dropdown 193 | -------------------------- */ 194 | /* Badge 195 | -------------------------- */ 196 | /* Card 197 | --------------------------*/ 198 | /* Slider 199 | --------------------------*/ 200 | /* Steps 201 | --------------------------*/ 202 | /* Steps 203 | --------------------------*/ 204 | /* Rate 205 | --------------------------*/ 206 | /* DatePicker 207 | --------------------------*/ 208 | /* Loading 209 | --------------------------*/ 210 | /* Scrollbar 211 | --------------------------*/ 212 | /* Carousel 213 | --------------------------*/ 214 | /* Collapse 215 | --------------------------*/ 216 | } -------------------------------------------------------------------------------- /theme/rate.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-rate{ 92 | height: 20px; 93 | line-height: 1; 94 | } 95 | 96 | .el-rate__item{ 97 | display: inline-block; 98 | position: relative; 99 | font-size: 0; 100 | vertical-align: middle; 101 | } 102 | 103 | .el-rate__icon{ 104 | position: relative; 105 | display: inline-block; 106 | font-size: 18px; 107 | margin-right: 6px; 108 | color: rgb(191, 206, 217); 109 | transition: .3s; 110 | } 111 | 112 | .el-rate__icon .path2 { 113 | position: absolute; 114 | left: 0; 115 | top: 0; 116 | } 117 | 118 | .el-rate__icon.hover{ 119 | transform: scale(1.15); 120 | } 121 | 122 | .el-rate__decimal{ 123 | position: absolute; 124 | top: 0; 125 | left: 0; 126 | display: inline-block; 127 | overflow: hidden; 128 | } 129 | 130 | .el-rate__text{ 131 | font-size: 14px; 132 | vertical-align: middle; 133 | } 134 | :root{ 135 | /* Transition 136 | -------------------------- */ 137 | /* Colors 138 | -------------------------- */ 139 | /* Link 140 | -------------------------- */ 141 | /* Border 142 | -------------------------- */ 143 | /* Box-shadow 144 | -------------------------- */ 145 | /* Fill 146 | -------------------------- */ 147 | /* Font 148 | -------------------------- */ 149 | /* Size 150 | -------------------------- */ 151 | /* z-index 152 | -------------------------- */ 153 | /* Disable base 154 | -------------------------- */ 155 | /* Icon 156 | -------------------------- */ 157 | /* Checkbox 158 | -------------------------- */ 159 | /* Radio 160 | -------------------------- */ 161 | /* Select 162 | -------------------------- */ 163 | /* Alert 164 | -------------------------- */ 165 | /* Message Box 166 | -------------------------- */ 167 | /* Message 168 | -------------------------- */ 169 | /* Notification 170 | -------------------------- */ 171 | /* Input 172 | -------------------------- */ 173 | /* Cascader 174 | -------------------------- */ 175 | /* Group 176 | -------------------------- */ 177 | /* Tab 178 | -------------------------- */ 179 | /* Button 180 | -------------------------- */ 181 | /* cascader 182 | -------------------------- */ 183 | /* Switch 184 | -------------------------- */ 185 | /* Dialog 186 | -------------------------- */ 187 | /* Table 188 | -------------------------- */ 189 | /* Pagination 190 | -------------------------- */ 191 | /* Popover 192 | -------------------------- */ 193 | /* Tooltip 194 | -------------------------- */ 195 | /* Tag 196 | -------------------------- */ 197 | /* Dropdown 198 | -------------------------- */ 199 | /* Badge 200 | -------------------------- */ 201 | /* Card 202 | --------------------------*/ 203 | /* Slider 204 | --------------------------*/ 205 | /* Steps 206 | --------------------------*/ 207 | /* Steps 208 | --------------------------*/ 209 | /* Rate 210 | --------------------------*/ 211 | /* DatePicker 212 | --------------------------*/ 213 | /* Loading 214 | --------------------------*/ 215 | /* Scrollbar 216 | --------------------------*/ 217 | /* Carousel 218 | --------------------------*/ 219 | /* Collapse 220 | --------------------------*/ 221 | } -------------------------------------------------------------------------------- /theme/carousel-item.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-carousel{} 92 | 93 | .el-carousel__item{ 94 | position: absolute; 95 | top: 0; 96 | left: 0; 97 | width: 100%; 98 | height: 100%; 99 | display: inline-block; 100 | transition: .4s ease-in-out; 101 | overflow: hidden 102 | } 103 | 104 | .el-carousel__item--card{ 105 | width: 50%; 106 | z-index: 0 107 | } 108 | 109 | .el-carousel__item--card.is-in-stage{ 110 | cursor: pointer; 111 | z-index: 1 112 | } 113 | 114 | .el-carousel__item--card.is-in-stage:hover .el-carousel__mask, .el-carousel__item--card.is-in-stage.is-hover .el-carousel__mask{ 115 | opacity: 0.12 116 | } 117 | 118 | .el-carousel__item--card.is-active{ 119 | z-index: 2 120 | } 121 | 122 | .el-carousel__mask{ 123 | position: absolute; 124 | width: 100%; 125 | height: 100%; 126 | top: 0; 127 | left: 0; 128 | background-color: #fff; 129 | opacity: 0.24; 130 | transition: .2s 131 | }:root{ 132 | /* Transition 133 | -------------------------- */ 134 | /* Colors 135 | -------------------------- */ 136 | /* Link 137 | -------------------------- */ 138 | /* Border 139 | -------------------------- */ 140 | /* Box-shadow 141 | -------------------------- */ 142 | /* Fill 143 | -------------------------- */ 144 | /* Font 145 | -------------------------- */ 146 | /* Size 147 | -------------------------- */ 148 | /* z-index 149 | -------------------------- */ 150 | /* Disable base 151 | -------------------------- */ 152 | /* Icon 153 | -------------------------- */ 154 | /* Checkbox 155 | -------------------------- */ 156 | /* Radio 157 | -------------------------- */ 158 | /* Select 159 | -------------------------- */ 160 | /* Alert 161 | -------------------------- */ 162 | /* Message Box 163 | -------------------------- */ 164 | /* Message 165 | -------------------------- */ 166 | /* Notification 167 | -------------------------- */ 168 | /* Input 169 | -------------------------- */ 170 | /* Cascader 171 | -------------------------- */ 172 | /* Group 173 | -------------------------- */ 174 | /* Tab 175 | -------------------------- */ 176 | /* Button 177 | -------------------------- */ 178 | /* cascader 179 | -------------------------- */ 180 | /* Switch 181 | -------------------------- */ 182 | /* Dialog 183 | -------------------------- */ 184 | /* Table 185 | -------------------------- */ 186 | /* Pagination 187 | -------------------------- */ 188 | /* Popover 189 | -------------------------- */ 190 | /* Tooltip 191 | -------------------------- */ 192 | /* Tag 193 | -------------------------- */ 194 | /* Dropdown 195 | -------------------------- */ 196 | /* Badge 197 | -------------------------- */ 198 | /* Card 199 | --------------------------*/ 200 | /* Slider 201 | --------------------------*/ 202 | /* Steps 203 | --------------------------*/ 204 | /* Steps 205 | --------------------------*/ 206 | /* Rate 207 | --------------------------*/ 208 | /* DatePicker 209 | --------------------------*/ 210 | /* Loading 211 | --------------------------*/ 212 | /* Scrollbar 213 | --------------------------*/ 214 | /* Carousel 215 | --------------------------*/ 216 | /* Collapse 217 | --------------------------*/ 218 | } -------------------------------------------------------------------------------- /theme/option.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-select-dropdown{} 92 | 93 | .el-select-dropdown__item{ 94 | font-size: 14px; 95 | padding: 8px 10px; 96 | position: relative; 97 | white-space: nowrap; 98 | overflow: hidden; 99 | text-overflow: ellipsis; 100 | color: rgb(72, 90, 106); 101 | height: 36px; 102 | line-height: 1.5; 103 | box-sizing: border-box; 104 | cursor: pointer 105 | } 106 | 107 | .el-select-dropdown__item.hover{ 108 | background-color: rgb(228, 233, 241) 109 | } 110 | 111 | .el-select-dropdown__item.selected{ 112 | color: #fff; 113 | background-color: #3399CC 114 | } 115 | 116 | .el-select-dropdown__item.selected.hover{ 117 | background-color: rgb(45, 135, 180) 118 | } 119 | 120 | .el-select-dropdown__item span{ 121 | line-height: 1.5 !important 122 | } 123 | 124 | .el-select-dropdown__item.is-disabled{ 125 | color: rgb(191, 206, 217); 126 | cursor: not-allowed 127 | } 128 | 129 | .el-select-dropdown__item.is-disabled:hover{ 130 | background-color: #fff 131 | } 132 | :root{ 133 | /* Transition 134 | -------------------------- */ 135 | /* Colors 136 | -------------------------- */ 137 | /* Link 138 | -------------------------- */ 139 | /* Border 140 | -------------------------- */ 141 | /* Box-shadow 142 | -------------------------- */ 143 | /* Fill 144 | -------------------------- */ 145 | /* Font 146 | -------------------------- */ 147 | /* Size 148 | -------------------------- */ 149 | /* z-index 150 | -------------------------- */ 151 | /* Disable base 152 | -------------------------- */ 153 | /* Icon 154 | -------------------------- */ 155 | /* Checkbox 156 | -------------------------- */ 157 | /* Radio 158 | -------------------------- */ 159 | /* Select 160 | -------------------------- */ 161 | /* Alert 162 | -------------------------- */ 163 | /* Message Box 164 | -------------------------- */ 165 | /* Message 166 | -------------------------- */ 167 | /* Notification 168 | -------------------------- */ 169 | /* Input 170 | -------------------------- */ 171 | /* Cascader 172 | -------------------------- */ 173 | /* Group 174 | -------------------------- */ 175 | /* Tab 176 | -------------------------- */ 177 | /* Button 178 | -------------------------- */ 179 | /* cascader 180 | -------------------------- */ 181 | /* Switch 182 | -------------------------- */ 183 | /* Dialog 184 | -------------------------- */ 185 | /* Table 186 | -------------------------- */ 187 | /* Pagination 188 | -------------------------- */ 189 | /* Popover 190 | -------------------------- */ 191 | /* Tooltip 192 | -------------------------- */ 193 | /* Tag 194 | -------------------------- */ 195 | /* Dropdown 196 | -------------------------- */ 197 | /* Badge 198 | -------------------------- */ 199 | /* Card 200 | --------------------------*/ 201 | /* Slider 202 | --------------------------*/ 203 | /* Steps 204 | --------------------------*/ 205 | /* Steps 206 | --------------------------*/ 207 | /* Rate 208 | --------------------------*/ 209 | /* DatePicker 210 | --------------------------*/ 211 | /* Loading 212 | --------------------------*/ 213 | /* Scrollbar 214 | --------------------------*/ 215 | /* Carousel 216 | --------------------------*/ 217 | /* Collapse 218 | --------------------------*/ 219 | } -------------------------------------------------------------------------------- /theme/row.css: -------------------------------------------------------------------------------- 1 | .el-row:before, .el-row:after{ 2 | display: table; 3 | content: "" 4 | } 5 | .el-row:after{ 6 | clear: both 7 | }@charset "UTF-8"; 8 | :root{ 9 | /* Transition 10 | -------------------------- */ 11 | /* Colors 12 | -------------------------- */ 13 | /* Link 14 | -------------------------- */ 15 | /* Border 16 | -------------------------- */ 17 | /* Box-shadow 18 | -------------------------- */ 19 | /* Fill 20 | -------------------------- */ 21 | /* Font 22 | -------------------------- */ 23 | /* Size 24 | -------------------------- */ 25 | /* z-index 26 | -------------------------- */ 27 | /* Disable base 28 | -------------------------- */ 29 | /* Icon 30 | -------------------------- */ 31 | /* Checkbox 32 | -------------------------- */ 33 | /* Radio 34 | -------------------------- */ 35 | /* Select 36 | -------------------------- */ 37 | /* Alert 38 | -------------------------- */ 39 | /* Message Box 40 | -------------------------- */ 41 | /* Message 42 | -------------------------- */ 43 | /* Notification 44 | -------------------------- */ 45 | /* Input 46 | -------------------------- */ 47 | /* Cascader 48 | -------------------------- */ 49 | /* Group 50 | -------------------------- */ 51 | /* Tab 52 | -------------------------- */ 53 | /* Button 54 | -------------------------- */ 55 | /* cascader 56 | -------------------------- */ 57 | /* Switch 58 | -------------------------- */ 59 | /* Dialog 60 | -------------------------- */ 61 | /* Table 62 | -------------------------- */ 63 | /* Pagination 64 | -------------------------- */ 65 | /* Popover 66 | -------------------------- */ 67 | /* Tooltip 68 | -------------------------- */ 69 | /* Tag 70 | -------------------------- */ 71 | /* Dropdown 72 | -------------------------- */ 73 | /* Badge 74 | -------------------------- */ 75 | /* Card 76 | --------------------------*/ 77 | /* Slider 78 | --------------------------*/ 79 | /* Steps 80 | --------------------------*/ 81 | /* Steps 82 | --------------------------*/ 83 | /* Rate 84 | --------------------------*/ 85 | /* DatePicker 86 | --------------------------*/ 87 | /* Loading 88 | --------------------------*/ 89 | /* Scrollbar 90 | --------------------------*/ 91 | /* Carousel 92 | --------------------------*/ 93 | /* Collapse 94 | --------------------------*/ 95 | } 96 | 97 | .el-row{ 98 | position: relative; 99 | box-sizing: border-box 100 | } 101 | 102 | .el-row--flex{ 103 | display: -ms-flexbox; 104 | display: flex 105 | } 106 | 107 | .el-row--flex:before, .el-row--flex:after{ 108 | display: none 109 | } 110 | 111 | .el-row--flex.is-align-bottom{ 112 | -ms-flex-align: end; 113 | align-items: flex-end 114 | } 115 | 116 | .el-row--flex.is-align-middle{ 117 | -ms-flex-align: center; 118 | align-items: center 119 | } 120 | 121 | .el-row--flex.is-justify-space-around{ 122 | -ms-flex-pack: distribute; 123 | justify-content: space-around 124 | } 125 | 126 | .el-row--flex.is-justify-space-between{ 127 | -ms-flex-pack: justify; 128 | justify-content: space-between 129 | } 130 | 131 | .el-row--flex.is-justify-end{ 132 | -ms-flex-pack: end; 133 | justify-content: flex-end 134 | } 135 | 136 | .el-row--flex.is-justify-center{ 137 | -ms-flex-pack: center; 138 | justify-content: center 139 | } 140 | :root{ 141 | /* Transition 142 | -------------------------- */ 143 | /* Colors 144 | -------------------------- */ 145 | /* Link 146 | -------------------------- */ 147 | /* Border 148 | -------------------------- */ 149 | /* Box-shadow 150 | -------------------------- */ 151 | /* Fill 152 | -------------------------- */ 153 | /* Font 154 | -------------------------- */ 155 | /* Size 156 | -------------------------- */ 157 | /* z-index 158 | -------------------------- */ 159 | /* Disable base 160 | -------------------------- */ 161 | /* Icon 162 | -------------------------- */ 163 | /* Checkbox 164 | -------------------------- */ 165 | /* Radio 166 | -------------------------- */ 167 | /* Select 168 | -------------------------- */ 169 | /* Alert 170 | -------------------------- */ 171 | /* Message Box 172 | -------------------------- */ 173 | /* Message 174 | -------------------------- */ 175 | /* Notification 176 | -------------------------- */ 177 | /* Input 178 | -------------------------- */ 179 | /* Cascader 180 | -------------------------- */ 181 | /* Group 182 | -------------------------- */ 183 | /* Tab 184 | -------------------------- */ 185 | /* Button 186 | -------------------------- */ 187 | /* cascader 188 | -------------------------- */ 189 | /* Switch 190 | -------------------------- */ 191 | /* Dialog 192 | -------------------------- */ 193 | /* Table 194 | -------------------------- */ 195 | /* Pagination 196 | -------------------------- */ 197 | /* Popover 198 | -------------------------- */ 199 | /* Tooltip 200 | -------------------------- */ 201 | /* Tag 202 | -------------------------- */ 203 | /* Dropdown 204 | -------------------------- */ 205 | /* Badge 206 | -------------------------- */ 207 | /* Card 208 | --------------------------*/ 209 | /* Slider 210 | --------------------------*/ 211 | /* Steps 212 | --------------------------*/ 213 | /* Steps 214 | --------------------------*/ 215 | /* Rate 216 | --------------------------*/ 217 | /* DatePicker 218 | --------------------------*/ 219 | /* Loading 220 | --------------------------*/ 221 | /* Scrollbar 222 | --------------------------*/ 223 | /* Carousel 224 | --------------------------*/ 225 | /* Collapse 226 | --------------------------*/ 227 | } -------------------------------------------------------------------------------- /theme/collapse.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-collapse{ 92 | border: 1px solid rgb(223, 231, 236); 93 | border-radius: 0; 94 | } 95 | 96 | .el-collapse-item{} 97 | 98 | .el-collapse-item:last-child{ 99 | margin-bottom: -1px; 100 | } 101 | 102 | .el-collapse-item.is-active .el-collapse-item__header__arrow{ 103 | transform: rotate(90deg); 104 | } 105 | 106 | .el-collapse-item__header{ 107 | height: 43px; 108 | line-height: 43px; 109 | padding-left: 15px; 110 | background-color: #fff; 111 | color: rgb(72, 90, 106); 112 | cursor: pointer; 113 | border-bottom: 1px solid rgb(223, 231, 236); 114 | font-size: 13px; 115 | } 116 | 117 | .el-collapse-item__header__arrow{ 118 | margin-right: 8px; 119 | transition: transform .3s; 120 | } 121 | 122 | .el-collapse-item__wrap{ 123 | will-change: height; 124 | background-color: rgb(251, 253, 254); 125 | transition: height .3s cubic-bezier(0.215, 0.61, 0.355, 1); 126 | overflow: hidden; 127 | box-sizing: border-box; 128 | border-bottom: 1px solid rgb(223, 231, 236); 129 | } 130 | 131 | .el-collapse-item__content{ 132 | padding: 10px 15px; 133 | font-size: 13px; 134 | color: rgb(31, 48, 61); 135 | line-height: 1.769230769230769; 136 | }:root{ 137 | /* Transition 138 | -------------------------- */ 139 | /* Colors 140 | -------------------------- */ 141 | /* Link 142 | -------------------------- */ 143 | /* Border 144 | -------------------------- */ 145 | /* Box-shadow 146 | -------------------------- */ 147 | /* Fill 148 | -------------------------- */ 149 | /* Font 150 | -------------------------- */ 151 | /* Size 152 | -------------------------- */ 153 | /* z-index 154 | -------------------------- */ 155 | /* Disable base 156 | -------------------------- */ 157 | /* Icon 158 | -------------------------- */ 159 | /* Checkbox 160 | -------------------------- */ 161 | /* Radio 162 | -------------------------- */ 163 | /* Select 164 | -------------------------- */ 165 | /* Alert 166 | -------------------------- */ 167 | /* Message Box 168 | -------------------------- */ 169 | /* Message 170 | -------------------------- */ 171 | /* Notification 172 | -------------------------- */ 173 | /* Input 174 | -------------------------- */ 175 | /* Cascader 176 | -------------------------- */ 177 | /* Group 178 | -------------------------- */ 179 | /* Tab 180 | -------------------------- */ 181 | /* Button 182 | -------------------------- */ 183 | /* cascader 184 | -------------------------- */ 185 | /* Switch 186 | -------------------------- */ 187 | /* Dialog 188 | -------------------------- */ 189 | /* Table 190 | -------------------------- */ 191 | /* Pagination 192 | -------------------------- */ 193 | /* Popover 194 | -------------------------- */ 195 | /* Tooltip 196 | -------------------------- */ 197 | /* Tag 198 | -------------------------- */ 199 | /* Dropdown 200 | -------------------------- */ 201 | /* Badge 202 | -------------------------- */ 203 | /* Card 204 | --------------------------*/ 205 | /* Slider 206 | --------------------------*/ 207 | /* Steps 208 | --------------------------*/ 209 | /* Steps 210 | --------------------------*/ 211 | /* Rate 212 | --------------------------*/ 213 | /* DatePicker 214 | --------------------------*/ 215 | /* Loading 216 | --------------------------*/ 217 | /* Scrollbar 218 | --------------------------*/ 219 | /* Carousel 220 | --------------------------*/ 221 | /* Collapse 222 | --------------------------*/ 223 | } -------------------------------------------------------------------------------- /theme/breadcrumb.css: -------------------------------------------------------------------------------- 1 | .el-breadcrumb:before, .el-breadcrumb:after{ 2 | display: table; 3 | content: "" 4 | } 5 | .el-breadcrumb:after{ 6 | clear: both 7 | }@charset "UTF-8"; 8 | :root{ 9 | /* Transition 10 | -------------------------- */ 11 | /* Colors 12 | -------------------------- */ 13 | /* Link 14 | -------------------------- */ 15 | /* Border 16 | -------------------------- */ 17 | /* Box-shadow 18 | -------------------------- */ 19 | /* Fill 20 | -------------------------- */ 21 | /* Font 22 | -------------------------- */ 23 | /* Size 24 | -------------------------- */ 25 | /* z-index 26 | -------------------------- */ 27 | /* Disable base 28 | -------------------------- */ 29 | /* Icon 30 | -------------------------- */ 31 | /* Checkbox 32 | -------------------------- */ 33 | /* Radio 34 | -------------------------- */ 35 | /* Select 36 | -------------------------- */ 37 | /* Alert 38 | -------------------------- */ 39 | /* Message Box 40 | -------------------------- */ 41 | /* Message 42 | -------------------------- */ 43 | /* Notification 44 | -------------------------- */ 45 | /* Input 46 | -------------------------- */ 47 | /* Cascader 48 | -------------------------- */ 49 | /* Group 50 | -------------------------- */ 51 | /* Tab 52 | -------------------------- */ 53 | /* Button 54 | -------------------------- */ 55 | /* cascader 56 | -------------------------- */ 57 | /* Switch 58 | -------------------------- */ 59 | /* Dialog 60 | -------------------------- */ 61 | /* Table 62 | -------------------------- */ 63 | /* Pagination 64 | -------------------------- */ 65 | /* Popover 66 | -------------------------- */ 67 | /* Tooltip 68 | -------------------------- */ 69 | /* Tag 70 | -------------------------- */ 71 | /* Dropdown 72 | -------------------------- */ 73 | /* Badge 74 | -------------------------- */ 75 | /* Card 76 | --------------------------*/ 77 | /* Slider 78 | --------------------------*/ 79 | /* Steps 80 | --------------------------*/ 81 | /* Steps 82 | --------------------------*/ 83 | /* Rate 84 | --------------------------*/ 85 | /* DatePicker 86 | --------------------------*/ 87 | /* Loading 88 | --------------------------*/ 89 | /* Scrollbar 90 | --------------------------*/ 91 | /* Carousel 92 | --------------------------*/ 93 | /* Collapse 94 | --------------------------*/ 95 | } 96 | 97 | .el-breadcrumb{ 98 | font-size: 13px; 99 | line-height: 1 100 | } 101 | 102 | .el-breadcrumb__separator{ 103 | margin: 0 8px; 104 | color: rgb(191, 206, 217) 105 | } 106 | 107 | .el-breadcrumb__item{ 108 | float: left 109 | } 110 | 111 | .el-breadcrumb__item:last-child .el-breadcrumb__item__inner, .el-breadcrumb__item:last-child .el-breadcrumb__item__inner a{} 112 | 113 | .el-breadcrumb__item:last-child .el-breadcrumb__item__inner, .el-breadcrumb__item:last-child .el-breadcrumb__item__inner:hover, .el-breadcrumb__item:last-child .el-breadcrumb__item__inner a, .el-breadcrumb__item:last-child .el-breadcrumb__item__inner a:hover{ 114 | color: rgb(151, 171, 190); 115 | cursor: text 116 | } 117 | 118 | .el-breadcrumb__item:last-child .el-breadcrumb__separator{ 119 | display: none 120 | } 121 | 122 | .el-breadcrumb__item__inner{} 123 | 124 | .el-breadcrumb__item__inner, .el-breadcrumb__item__inner a{ 125 | transition: color .15s linear; 126 | color: rgb(72, 90, 106) 127 | } 128 | 129 | .el-breadcrumb__item__inner:hover, .el-breadcrumb__item__inner a:hover{ 130 | color: #3399CC; 131 | cursor: pointer 132 | } 133 | :root{ 134 | /* Transition 135 | -------------------------- */ 136 | /* Colors 137 | -------------------------- */ 138 | /* Link 139 | -------------------------- */ 140 | /* Border 141 | -------------------------- */ 142 | /* Box-shadow 143 | -------------------------- */ 144 | /* Fill 145 | -------------------------- */ 146 | /* Font 147 | -------------------------- */ 148 | /* Size 149 | -------------------------- */ 150 | /* z-index 151 | -------------------------- */ 152 | /* Disable base 153 | -------------------------- */ 154 | /* Icon 155 | -------------------------- */ 156 | /* Checkbox 157 | -------------------------- */ 158 | /* Radio 159 | -------------------------- */ 160 | /* Select 161 | -------------------------- */ 162 | /* Alert 163 | -------------------------- */ 164 | /* Message Box 165 | -------------------------- */ 166 | /* Message 167 | -------------------------- */ 168 | /* Notification 169 | -------------------------- */ 170 | /* Input 171 | -------------------------- */ 172 | /* Cascader 173 | -------------------------- */ 174 | /* Group 175 | -------------------------- */ 176 | /* Tab 177 | -------------------------- */ 178 | /* Button 179 | -------------------------- */ 180 | /* cascader 181 | -------------------------- */ 182 | /* Switch 183 | -------------------------- */ 184 | /* Dialog 185 | -------------------------- */ 186 | /* Table 187 | -------------------------- */ 188 | /* Pagination 189 | -------------------------- */ 190 | /* Popover 191 | -------------------------- */ 192 | /* Tooltip 193 | -------------------------- */ 194 | /* Tag 195 | -------------------------- */ 196 | /* Dropdown 197 | -------------------------- */ 198 | /* Badge 199 | -------------------------- */ 200 | /* Card 201 | --------------------------*/ 202 | /* Slider 203 | --------------------------*/ 204 | /* Steps 205 | --------------------------*/ 206 | /* Steps 207 | --------------------------*/ 208 | /* Rate 209 | --------------------------*/ 210 | /* DatePicker 211 | --------------------------*/ 212 | /* Loading 213 | --------------------------*/ 214 | /* Scrollbar 215 | --------------------------*/ 216 | /* Carousel 217 | --------------------------*/ 218 | /* Collapse 219 | --------------------------*/ 220 | } -------------------------------------------------------------------------------- /theme/scrollbar.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-scrollbar{ 92 | overflow: hidden; 93 | position: relative; 94 | } 95 | 96 | .el-scrollbar:hover .el-scrollbar__bar, .el-scrollbar:active .el-scrollbar__bar, .el-scrollbar:focus .el-scrollbar__bar{ 97 | opacity: 1; 98 | transition: opacity 340ms ease-out; 99 | } 100 | 101 | .el-scrollbar__wrap{ 102 | overflow: scroll; 103 | } 104 | 105 | .el-scrollbar__wrap--hidden-default{} 106 | 107 | .el-scrollbar__wrap--hidden-default::-webkit-scrollbar{ 108 | width: 0; 109 | height: 0; 110 | } 111 | 112 | .el-scrollbar__thumb{ 113 | position: relative; 114 | display: block; 115 | width: 0; 116 | height: 0; 117 | cursor: pointer; 118 | border-radius: inherit; 119 | background-color: rgba(151, 171, 190, 0.3); 120 | transition: .3s background-color; 121 | } 122 | 123 | .el-scrollbar__thumb:hover{ 124 | background-color: rgba(151, 171, 190, 0.5); 125 | } 126 | 127 | .el-scrollbar__bar{ 128 | position: absolute; 129 | right: 2px; 130 | bottom: 2px; 131 | z-index: 1; 132 | border-radius: 4px; 133 | opacity: 0; 134 | transition: opacity 120ms ease-out; 135 | } 136 | 137 | .el-scrollbar__bar.is-horizontal{ 138 | height: 6px; 139 | left: 2px; 140 | } 141 | 142 | .el-scrollbar__bar.is-horizontal > div{ 143 | height: 100%; 144 | } 145 | 146 | .el-scrollbar__bar.is-vertical{ 147 | width: 6px; 148 | top: 2px; 149 | } 150 | 151 | .el-scrollbar__bar.is-vertical > div{ 152 | width: 100%; 153 | } 154 | :root{ 155 | /* Transition 156 | -------------------------- */ 157 | /* Colors 158 | -------------------------- */ 159 | /* Link 160 | -------------------------- */ 161 | /* Border 162 | -------------------------- */ 163 | /* Box-shadow 164 | -------------------------- */ 165 | /* Fill 166 | -------------------------- */ 167 | /* Font 168 | -------------------------- */ 169 | /* Size 170 | -------------------------- */ 171 | /* z-index 172 | -------------------------- */ 173 | /* Disable base 174 | -------------------------- */ 175 | /* Icon 176 | -------------------------- */ 177 | /* Checkbox 178 | -------------------------- */ 179 | /* Radio 180 | -------------------------- */ 181 | /* Select 182 | -------------------------- */ 183 | /* Alert 184 | -------------------------- */ 185 | /* Message Box 186 | -------------------------- */ 187 | /* Message 188 | -------------------------- */ 189 | /* Notification 190 | -------------------------- */ 191 | /* Input 192 | -------------------------- */ 193 | /* Cascader 194 | -------------------------- */ 195 | /* Group 196 | -------------------------- */ 197 | /* Tab 198 | -------------------------- */ 199 | /* Button 200 | -------------------------- */ 201 | /* cascader 202 | -------------------------- */ 203 | /* Switch 204 | -------------------------- */ 205 | /* Dialog 206 | -------------------------- */ 207 | /* Table 208 | -------------------------- */ 209 | /* Pagination 210 | -------------------------- */ 211 | /* Popover 212 | -------------------------- */ 213 | /* Tooltip 214 | -------------------------- */ 215 | /* Tag 216 | -------------------------- */ 217 | /* Dropdown 218 | -------------------------- */ 219 | /* Badge 220 | -------------------------- */ 221 | /* Card 222 | --------------------------*/ 223 | /* Slider 224 | --------------------------*/ 225 | /* Steps 226 | --------------------------*/ 227 | /* Steps 228 | --------------------------*/ 229 | /* Rate 230 | --------------------------*/ 231 | /* DatePicker 232 | --------------------------*/ 233 | /* Loading 234 | --------------------------*/ 235 | /* Scrollbar 236 | --------------------------*/ 237 | /* Carousel 238 | --------------------------*/ 239 | /* Collapse 240 | --------------------------*/ 241 | } -------------------------------------------------------------------------------- /theme/select-dropdown.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-select-dropdown{ 92 | position: absolute; 93 | z-index: 1001; 94 | border: solid 1px rgb(209, 221, 229); 95 | border-radius: 0px; 96 | background-color: #fff; 97 | box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); 98 | box-sizing: border-box; 99 | margin: 5px 0; 100 | } 101 | 102 | .el-select-dropdown .el-scrollbar.is-empty .el-select-dropdown__list{ 103 | padding: 0; 104 | } 105 | 106 | .el-select-dropdown.is-multiple{} 107 | 108 | .el-select-dropdown.is-multiple .el-select-dropdown__item.selected{ 109 | color: #3399CC; 110 | background-color: #fff; 111 | } 112 | 113 | .el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover{ 114 | background-color: rgb(228, 233, 241); 115 | } 116 | 117 | .el-select-dropdown.is-multiple .el-select-dropdown__item.selected::after{ 118 | position: absolute; 119 | right: 10px; 120 | font-family: 'element-icons'; 121 | content: "\E608"; 122 | font-size: 11px; 123 | -webkit-font-smoothing: antialiased; 124 | -moz-osx-font-smoothing: grayscale; 125 | } 126 | 127 | .el-select-dropdown__empty{ 128 | padding: 10px 0; 129 | margin: 0; 130 | text-align: center; 131 | color: #999; 132 | font-size: 14px; 133 | } 134 | 135 | .el-select-dropdown__wrap{ 136 | max-height: 274px; 137 | width: 100%; 138 | } 139 | 140 | .el-select-dropdown__list{ 141 | list-style: none; 142 | padding: 6px 0; 143 | margin: 0; 144 | box-sizing: border-box; 145 | } 146 | :root{ 147 | /* Transition 148 | -------------------------- */ 149 | /* Colors 150 | -------------------------- */ 151 | /* Link 152 | -------------------------- */ 153 | /* Border 154 | -------------------------- */ 155 | /* Box-shadow 156 | -------------------------- */ 157 | /* Fill 158 | -------------------------- */ 159 | /* Font 160 | -------------------------- */ 161 | /* Size 162 | -------------------------- */ 163 | /* z-index 164 | -------------------------- */ 165 | /* Disable base 166 | -------------------------- */ 167 | /* Icon 168 | -------------------------- */ 169 | /* Checkbox 170 | -------------------------- */ 171 | /* Radio 172 | -------------------------- */ 173 | /* Select 174 | -------------------------- */ 175 | /* Alert 176 | -------------------------- */ 177 | /* Message Box 178 | -------------------------- */ 179 | /* Message 180 | -------------------------- */ 181 | /* Notification 182 | -------------------------- */ 183 | /* Input 184 | -------------------------- */ 185 | /* Cascader 186 | -------------------------- */ 187 | /* Group 188 | -------------------------- */ 189 | /* Tab 190 | -------------------------- */ 191 | /* Button 192 | -------------------------- */ 193 | /* cascader 194 | -------------------------- */ 195 | /* Switch 196 | -------------------------- */ 197 | /* Dialog 198 | -------------------------- */ 199 | /* Table 200 | -------------------------- */ 201 | /* Pagination 202 | -------------------------- */ 203 | /* Popover 204 | -------------------------- */ 205 | /* Tooltip 206 | -------------------------- */ 207 | /* Tag 208 | -------------------------- */ 209 | /* Dropdown 210 | -------------------------- */ 211 | /* Badge 212 | -------------------------- */ 213 | /* Card 214 | --------------------------*/ 215 | /* Slider 216 | --------------------------*/ 217 | /* Steps 218 | --------------------------*/ 219 | /* Steps 220 | --------------------------*/ 221 | /* Rate 222 | --------------------------*/ 223 | /* DatePicker 224 | --------------------------*/ 225 | /* Loading 226 | --------------------------*/ 227 | /* Scrollbar 228 | --------------------------*/ 229 | /* Carousel 230 | --------------------------*/ 231 | /* Collapse 232 | --------------------------*/ 233 | } -------------------------------------------------------------------------------- /theme/loading.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-loading-mask{ 92 | position: absolute; 93 | z-index: 10000; 94 | background-color: rgba(255, 255, 255, .9); 95 | margin: 0; 96 | top: 0; 97 | right: 0; 98 | bottom: 0; 99 | left: 0; 100 | transition: opacity 0.3s; 101 | } 102 | 103 | .el-loading-mask.is-fullscreen{ 104 | position: fixed; 105 | } 106 | 107 | .el-loading-mask.is-fullscreen .el-loading-spinner{ 108 | margin-top: -25px; 109 | } 110 | 111 | .el-loading-mask.is-fullscreen .el-loading-spinner .circular{ 112 | width: 50px; 113 | height: 50px; 114 | } 115 | 116 | .el-loading-spinner{ 117 | top: 50%; 118 | margin-top: -21px; 119 | width: 100%; 120 | text-align: center; 121 | position: absolute; 122 | } 123 | 124 | .el-loading-spinner .el-loading-text{ 125 | color: #3399CC; 126 | margin: 3px 0; 127 | font-size: 14px; 128 | } 129 | 130 | .el-loading-spinner .circular{ 131 | width: 42px; 132 | height: 42px; 133 | animation: loading-rotate 2s linear infinite; 134 | } 135 | 136 | .el-loading-spinner .path{ 137 | animation: loading-dash 1.5s ease-in-out infinite; 138 | stroke-dasharray: 90, 150; 139 | stroke-dashoffset: 0; 140 | stroke-width: 2; 141 | stroke: #3399CC; 142 | stroke-linecap: round; 143 | } 144 | 145 | .el-loading-fade-enter, .el-loading-fade-leave-active { 146 | opacity: 0; 147 | } 148 | 149 | @keyframes loading-rotate { 150 | 100% { 151 | transform: rotate(360deg); 152 | } 153 | } 154 | 155 | @keyframes loading-dash { 156 | 0% { 157 | stroke-dasharray: 1, 200; 158 | stroke-dashoffset: 0; 159 | } 160 | 50% { 161 | stroke-dasharray: 90, 150; 162 | stroke-dashoffset: -40px; 163 | } 164 | 100% { 165 | stroke-dasharray: 90, 150; 166 | stroke-dashoffset: -120px; 167 | } 168 | } 169 | :root{ 170 | /* Transition 171 | -------------------------- */ 172 | /* Colors 173 | -------------------------- */ 174 | /* Link 175 | -------------------------- */ 176 | /* Border 177 | -------------------------- */ 178 | /* Box-shadow 179 | -------------------------- */ 180 | /* Fill 181 | -------------------------- */ 182 | /* Font 183 | -------------------------- */ 184 | /* Size 185 | -------------------------- */ 186 | /* z-index 187 | -------------------------- */ 188 | /* Disable base 189 | -------------------------- */ 190 | /* Icon 191 | -------------------------- */ 192 | /* Checkbox 193 | -------------------------- */ 194 | /* Radio 195 | -------------------------- */ 196 | /* Select 197 | -------------------------- */ 198 | /* Alert 199 | -------------------------- */ 200 | /* Message Box 201 | -------------------------- */ 202 | /* Message 203 | -------------------------- */ 204 | /* Notification 205 | -------------------------- */ 206 | /* Input 207 | -------------------------- */ 208 | /* Cascader 209 | -------------------------- */ 210 | /* Group 211 | -------------------------- */ 212 | /* Tab 213 | -------------------------- */ 214 | /* Button 215 | -------------------------- */ 216 | /* cascader 217 | -------------------------- */ 218 | /* Switch 219 | -------------------------- */ 220 | /* Dialog 221 | -------------------------- */ 222 | /* Table 223 | -------------------------- */ 224 | /* Pagination 225 | -------------------------- */ 226 | /* Popover 227 | -------------------------- */ 228 | /* Tooltip 229 | -------------------------- */ 230 | /* Tag 231 | -------------------------- */ 232 | /* Dropdown 233 | -------------------------- */ 234 | /* Badge 235 | -------------------------- */ 236 | /* Card 237 | --------------------------*/ 238 | /* Slider 239 | --------------------------*/ 240 | /* Steps 241 | --------------------------*/ 242 | /* Steps 243 | --------------------------*/ 244 | /* Rate 245 | --------------------------*/ 246 | /* DatePicker 247 | --------------------------*/ 248 | /* Loading 249 | --------------------------*/ 250 | /* Scrollbar 251 | --------------------------*/ 252 | /* Carousel 253 | --------------------------*/ 254 | /* Collapse 255 | --------------------------*/ 256 | } -------------------------------------------------------------------------------- /theme/alert.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-alert{ 92 | width: 100%; 93 | padding: 8px 16px; 94 | margin: 0; 95 | box-sizing: border-box; 96 | border-radius: 0px; 97 | position: relative; 98 | background-color: #fff; 99 | overflow: hidden; 100 | color: #fff; 101 | opacity: 1; 102 | display: table; 103 | transition: opacity .2s; 104 | } 105 | 106 | .el-alert .el-alert__description{ 107 | color: #fff; 108 | font-size: 12px; 109 | margin: 5px 0 0 0; 110 | } 111 | 112 | .el-alert--success{ 113 | background-color: #669933; 114 | } 115 | 116 | .el-alert--info{ 117 | background-color: #99CCFF; 118 | } 119 | 120 | .el-alert--warning{ 121 | background-color: #FFCC00; 122 | } 123 | 124 | .el-alert--error{ 125 | background-color: #cf0000; 126 | } 127 | 128 | .el-alert__content{ 129 | display: table-cell; 130 | padding: 0 8px; 131 | } 132 | 133 | .el-alert__icon{ 134 | font-size: 16px; 135 | width: 16px; 136 | display: table-cell; 137 | color: #fff; 138 | vertical-align: middle; 139 | } 140 | 141 | .el-alert__icon.is-big{ 142 | font-size: 28px; 143 | width: 28px; 144 | } 145 | 146 | .el-alert__title{ 147 | font-size: 13px; 148 | line-height: 18px; 149 | } 150 | 151 | .el-alert__title.is-bold{ 152 | font-weight: 700; 153 | } 154 | 155 | .el-alert__closebtn{ 156 | font-size: 12px; 157 | color: #fff; 158 | opacity: 1; 159 | top: 12px; 160 | right: 15px; 161 | position: absolute; 162 | cursor: pointer; 163 | } 164 | 165 | .el-alert__closebtn.is-customed{ 166 | font-style: normal; 167 | font-size: 13px; 168 | top: 9px; 169 | } 170 | 171 | .el-alert-fade-enter, .el-alert-fade-leave-active { 172 | opacity: 0; 173 | } 174 | :root{ 175 | /* Transition 176 | -------------------------- */ 177 | /* Colors 178 | -------------------------- */ 179 | /* Link 180 | -------------------------- */ 181 | /* Border 182 | -------------------------- */ 183 | /* Box-shadow 184 | -------------------------- */ 185 | /* Fill 186 | -------------------------- */ 187 | /* Font 188 | -------------------------- */ 189 | /* Size 190 | -------------------------- */ 191 | /* z-index 192 | -------------------------- */ 193 | /* Disable base 194 | -------------------------- */ 195 | /* Icon 196 | -------------------------- */ 197 | /* Checkbox 198 | -------------------------- */ 199 | /* Radio 200 | -------------------------- */ 201 | /* Select 202 | -------------------------- */ 203 | /* Alert 204 | -------------------------- */ 205 | /* Message Box 206 | -------------------------- */ 207 | /* Message 208 | -------------------------- */ 209 | /* Notification 210 | -------------------------- */ 211 | /* Input 212 | -------------------------- */ 213 | /* Cascader 214 | -------------------------- */ 215 | /* Group 216 | -------------------------- */ 217 | /* Tab 218 | -------------------------- */ 219 | /* Button 220 | -------------------------- */ 221 | /* cascader 222 | -------------------------- */ 223 | /* Switch 224 | -------------------------- */ 225 | /* Dialog 226 | -------------------------- */ 227 | /* Table 228 | -------------------------- */ 229 | /* Pagination 230 | -------------------------- */ 231 | /* Popover 232 | -------------------------- */ 233 | /* Tooltip 234 | -------------------------- */ 235 | /* Tag 236 | -------------------------- */ 237 | /* Dropdown 238 | -------------------------- */ 239 | /* Badge 240 | -------------------------- */ 241 | /* Card 242 | --------------------------*/ 243 | /* Slider 244 | --------------------------*/ 245 | /* Steps 246 | --------------------------*/ 247 | /* Steps 248 | --------------------------*/ 249 | /* Rate 250 | --------------------------*/ 251 | /* DatePicker 252 | --------------------------*/ 253 | /* Loading 254 | --------------------------*/ 255 | /* Scrollbar 256 | --------------------------*/ 257 | /* Carousel 258 | --------------------------*/ 259 | /* Collapse 260 | --------------------------*/ 261 | } -------------------------------------------------------------------------------- /theme/notification.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-notification{ 92 | width: 330px; 93 | padding: 20px; 94 | box-sizing: border-box; 95 | border-radius: 0px; 96 | position: fixed; 97 | right: 16px; 98 | background-color: #fff; 99 | box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); 100 | transition: opacity 0.3s, transform .3s, right .3s, top 0.4s; 101 | overflow: hidden; 102 | } 103 | 104 | .el-notification .el-icon-circle-check{ 105 | color: #669933; 106 | } 107 | 108 | .el-notification .el-icon-circle-cross{ 109 | color: #cf0000; 110 | } 111 | 112 | .el-notification .el-icon-information{ 113 | color: #99CCFF; 114 | } 115 | 116 | .el-notification .el-icon-warning{ 117 | color: #FFCC00; 118 | } 119 | 120 | .el-notification__group{ 121 | margin-left: 0; 122 | } 123 | 124 | .el-notification__group.is-with-icon{ 125 | margin-left: 55px; 126 | } 127 | 128 | .el-notification__title{ 129 | font-weight: 400; 130 | font-size: 16px; 131 | color: rgb(31, 48, 61); 132 | } 133 | 134 | .el-notification__content{ 135 | font-size: 14px; 136 | line-height: 21px; 137 | margin: 10px 0 0 0; 138 | color: rgb(131, 148, 165); 139 | text-align: justify; 140 | } 141 | 142 | .el-notification__icon{ 143 | width: 40px; 144 | height: 40px; 145 | font-size: 40px; 146 | float: left; 147 | position: relative; 148 | top: 3px; 149 | } 150 | 151 | .el-notification__closeBtn{ 152 | top: 20px; 153 | right: 20px; 154 | position: absolute; 155 | cursor: pointer; 156 | color: rgb(191, 206, 217); 157 | font-size: 14px; 158 | } 159 | 160 | .el-notification__closeBtn:hover{ 161 | color: rgb(151, 171, 190); 162 | } 163 | 164 | .el-notification-fade-enter { 165 | transform: translateX(100%); 166 | right: 0; 167 | } 168 | 169 | .el-notification-fade-leave-active { 170 | opacity: 0; 171 | } 172 | :root{ 173 | /* Transition 174 | -------------------------- */ 175 | /* Colors 176 | -------------------------- */ 177 | /* Link 178 | -------------------------- */ 179 | /* Border 180 | -------------------------- */ 181 | /* Box-shadow 182 | -------------------------- */ 183 | /* Fill 184 | -------------------------- */ 185 | /* Font 186 | -------------------------- */ 187 | /* Size 188 | -------------------------- */ 189 | /* z-index 190 | -------------------------- */ 191 | /* Disable base 192 | -------------------------- */ 193 | /* Icon 194 | -------------------------- */ 195 | /* Checkbox 196 | -------------------------- */ 197 | /* Radio 198 | -------------------------- */ 199 | /* Select 200 | -------------------------- */ 201 | /* Alert 202 | -------------------------- */ 203 | /* Message Box 204 | -------------------------- */ 205 | /* Message 206 | -------------------------- */ 207 | /* Notification 208 | -------------------------- */ 209 | /* Input 210 | -------------------------- */ 211 | /* Cascader 212 | -------------------------- */ 213 | /* Group 214 | -------------------------- */ 215 | /* Tab 216 | -------------------------- */ 217 | /* Button 218 | -------------------------- */ 219 | /* cascader 220 | -------------------------- */ 221 | /* Switch 222 | -------------------------- */ 223 | /* Dialog 224 | -------------------------- */ 225 | /* Table 226 | -------------------------- */ 227 | /* Pagination 228 | -------------------------- */ 229 | /* Popover 230 | -------------------------- */ 231 | /* Tooltip 232 | -------------------------- */ 233 | /* Tag 234 | -------------------------- */ 235 | /* Dropdown 236 | -------------------------- */ 237 | /* Badge 238 | -------------------------- */ 239 | /* Card 240 | --------------------------*/ 241 | /* Slider 242 | --------------------------*/ 243 | /* Steps 244 | --------------------------*/ 245 | /* Steps 246 | --------------------------*/ 247 | /* Rate 248 | --------------------------*/ 249 | /* DatePicker 250 | --------------------------*/ 251 | /* Loading 252 | --------------------------*/ 253 | /* Scrollbar 254 | --------------------------*/ 255 | /* Carousel 256 | --------------------------*/ 257 | /* Collapse 258 | --------------------------*/ 259 | } -------------------------------------------------------------------------------- /theme/message.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | :root{ 3 | /* Transition 4 | -------------------------- */ 5 | /* Colors 6 | -------------------------- */ 7 | /* Link 8 | -------------------------- */ 9 | /* Border 10 | -------------------------- */ 11 | /* Box-shadow 12 | -------------------------- */ 13 | /* Fill 14 | -------------------------- */ 15 | /* Font 16 | -------------------------- */ 17 | /* Size 18 | -------------------------- */ 19 | /* z-index 20 | -------------------------- */ 21 | /* Disable base 22 | -------------------------- */ 23 | /* Icon 24 | -------------------------- */ 25 | /* Checkbox 26 | -------------------------- */ 27 | /* Radio 28 | -------------------------- */ 29 | /* Select 30 | -------------------------- */ 31 | /* Alert 32 | -------------------------- */ 33 | /* Message Box 34 | -------------------------- */ 35 | /* Message 36 | -------------------------- */ 37 | /* Notification 38 | -------------------------- */ 39 | /* Input 40 | -------------------------- */ 41 | /* Cascader 42 | -------------------------- */ 43 | /* Group 44 | -------------------------- */ 45 | /* Tab 46 | -------------------------- */ 47 | /* Button 48 | -------------------------- */ 49 | /* cascader 50 | -------------------------- */ 51 | /* Switch 52 | -------------------------- */ 53 | /* Dialog 54 | -------------------------- */ 55 | /* Table 56 | -------------------------- */ 57 | /* Pagination 58 | -------------------------- */ 59 | /* Popover 60 | -------------------------- */ 61 | /* Tooltip 62 | -------------------------- */ 63 | /* Tag 64 | -------------------------- */ 65 | /* Dropdown 66 | -------------------------- */ 67 | /* Badge 68 | -------------------------- */ 69 | /* Card 70 | --------------------------*/ 71 | /* Slider 72 | --------------------------*/ 73 | /* Steps 74 | --------------------------*/ 75 | /* Steps 76 | --------------------------*/ 77 | /* Rate 78 | --------------------------*/ 79 | /* DatePicker 80 | --------------------------*/ 81 | /* Loading 82 | --------------------------*/ 83 | /* Scrollbar 84 | --------------------------*/ 85 | /* Carousel 86 | --------------------------*/ 87 | /* Collapse 88 | --------------------------*/ 89 | } 90 | 91 | .el-message{ 92 | box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); 93 | min-width: 300px; 94 | padding: 10px 12px; 95 | box-sizing: border-box; 96 | border-radius: 0px; 97 | position: fixed; 98 | left: 50%; 99 | top: 20px; 100 | transform: translateX(-50%); 101 | background-color: #fff; 102 | transition: opacity 0.3s, transform .4s; 103 | overflow: hidden; 104 | } 105 | 106 | .el-message .el-icon-circle-check{ 107 | color: #669933; 108 | } 109 | 110 | .el-message .el-icon-circle-cross{ 111 | color: #cf0000; 112 | } 113 | 114 | .el-message .el-icon-information{ 115 | color: #99CCFF; 116 | } 117 | 118 | .el-message .el-icon-warning{ 119 | color: #FFCC00; 120 | } 121 | 122 | .el-message__group{ 123 | margin-left: 38px; 124 | position: relative; 125 | height: 20px; 126 | } 127 | 128 | .el-message__group p{ 129 | font-size: 14px; 130 | line-height: 20px; 131 | margin: 0 34px 0 0; 132 | white-space: nowrap; 133 | color: rgb(131, 148, 165); 134 | text-align: justify; 135 | display: inline-block; 136 | vertical-align: middle; 137 | } 138 | 139 | .el-message__group.is-with-icon{ 140 | margin-left: 0; 141 | } 142 | 143 | .el-message__img{ 144 | width: 40px; 145 | height: 40px; 146 | position: absolute; 147 | left: 0; 148 | top: 0; 149 | } 150 | 151 | .el-message__icon{ 152 | vertical-align: middle; 153 | margin-right: 8px; 154 | } 155 | 156 | .el-message__closeBtn{ 157 | top: 3px; 158 | right: 0; 159 | position: absolute; 160 | cursor: pointer; 161 | color: rgb(191, 206, 217); 162 | font-size: 14px; 163 | } 164 | 165 | .el-message__closeBtn:hover{ 166 | color: rgb(151, 171, 190); 167 | } 168 | 169 | .el-message-fade-enter, .el-message-fade-leave-active { 170 | opacity: 0; 171 | transform: translate(-50%, -100%); 172 | } 173 | :root{ 174 | /* Transition 175 | -------------------------- */ 176 | /* Colors 177 | -------------------------- */ 178 | /* Link 179 | -------------------------- */ 180 | /* Border 181 | -------------------------- */ 182 | /* Box-shadow 183 | -------------------------- */ 184 | /* Fill 185 | -------------------------- */ 186 | /* Font 187 | -------------------------- */ 188 | /* Size 189 | -------------------------- */ 190 | /* z-index 191 | -------------------------- */ 192 | /* Disable base 193 | -------------------------- */ 194 | /* Icon 195 | -------------------------- */ 196 | /* Checkbox 197 | -------------------------- */ 198 | /* Radio 199 | -------------------------- */ 200 | /* Select 201 | -------------------------- */ 202 | /* Alert 203 | -------------------------- */ 204 | /* Message Box 205 | -------------------------- */ 206 | /* Message 207 | -------------------------- */ 208 | /* Notification 209 | -------------------------- */ 210 | /* Input 211 | -------------------------- */ 212 | /* Cascader 213 | -------------------------- */ 214 | /* Group 215 | -------------------------- */ 216 | /* Tab 217 | -------------------------- */ 218 | /* Button 219 | -------------------------- */ 220 | /* cascader 221 | -------------------------- */ 222 | /* Switch 223 | -------------------------- */ 224 | /* Dialog 225 | -------------------------- */ 226 | /* Table 227 | -------------------------- */ 228 | /* Pagination 229 | -------------------------- */ 230 | /* Popover 231 | -------------------------- */ 232 | /* Tooltip 233 | -------------------------- */ 234 | /* Tag 235 | -------------------------- */ 236 | /* Dropdown 237 | -------------------------- */ 238 | /* Badge 239 | -------------------------- */ 240 | /* Card 241 | --------------------------*/ 242 | /* Slider 243 | --------------------------*/ 244 | /* Steps 245 | --------------------------*/ 246 | /* Steps 247 | --------------------------*/ 248 | /* Rate 249 | --------------------------*/ 250 | /* DatePicker 251 | --------------------------*/ 252 | /* Loading 253 | --------------------------*/ 254 | /* Scrollbar 255 | --------------------------*/ 256 | /* Carousel 257 | --------------------------*/ 258 | /* Collapse 259 | --------------------------*/ 260 | } -------------------------------------------------------------------------------- /theme/form.css: -------------------------------------------------------------------------------- 1 | .el-form-item__content:before, .el-form-item__content:after{ 2 | display: table; 3 | content: ""; 4 | } 5 | .el-form-item__content:after{ 6 | clear: both; 7 | } 8 | .el-form-item:before, .el-form-item:after{ 9 | display: table; 10 | content: ""; 11 | } 12 | .el-form-item:after{ 13 | clear: both; 14 | }@charset "UTF-8"; 15 | :root{ 16 | /* Transition 17 | -------------------------- */ 18 | /* Colors 19 | -------------------------- */ 20 | /* Link 21 | -------------------------- */ 22 | /* Border 23 | -------------------------- */ 24 | /* Box-shadow 25 | -------------------------- */ 26 | /* Fill 27 | -------------------------- */ 28 | /* Font 29 | -------------------------- */ 30 | /* Size 31 | -------------------------- */ 32 | /* z-index 33 | -------------------------- */ 34 | /* Disable base 35 | -------------------------- */ 36 | /* Icon 37 | -------------------------- */ 38 | /* Checkbox 39 | -------------------------- */ 40 | /* Radio 41 | -------------------------- */ 42 | /* Select 43 | -------------------------- */ 44 | /* Alert 45 | -------------------------- */ 46 | /* Message Box 47 | -------------------------- */ 48 | /* Message 49 | -------------------------- */ 50 | /* Notification 51 | -------------------------- */ 52 | /* Input 53 | -------------------------- */ 54 | /* Cascader 55 | -------------------------- */ 56 | /* Group 57 | -------------------------- */ 58 | /* Tab 59 | -------------------------- */ 60 | /* Button 61 | -------------------------- */ 62 | /* cascader 63 | -------------------------- */ 64 | /* Switch 65 | -------------------------- */ 66 | /* Dialog 67 | -------------------------- */ 68 | /* Table 69 | -------------------------- */ 70 | /* Pagination 71 | -------------------------- */ 72 | /* Popover 73 | -------------------------- */ 74 | /* Tooltip 75 | -------------------------- */ 76 | /* Tag 77 | -------------------------- */ 78 | /* Dropdown 79 | -------------------------- */ 80 | /* Badge 81 | -------------------------- */ 82 | /* Card 83 | --------------------------*/ 84 | /* Slider 85 | --------------------------*/ 86 | /* Steps 87 | --------------------------*/ 88 | /* Steps 89 | --------------------------*/ 90 | /* Rate 91 | --------------------------*/ 92 | /* DatePicker 93 | --------------------------*/ 94 | /* Loading 95 | --------------------------*/ 96 | /* Scrollbar 97 | --------------------------*/ 98 | /* Carousel 99 | --------------------------*/ 100 | /* Collapse 101 | --------------------------*/ 102 | } 103 | 104 | .el-form{} 105 | 106 | .el-form--label-left{} 107 | 108 | .el-form--label-left .el-form-item__label{ 109 | text-align: left; 110 | } 111 | 112 | .el-form--label-top{} 113 | 114 | .el-form--label-top .el-form-item__label{ 115 | float: none; 116 | display: inline-block; 117 | padding: 0 0 10px 0; 118 | } 119 | 120 | .el-form--inline{} 121 | 122 | .el-form--inline .el-form-item{ 123 | display: inline-block; 124 | margin-right: 10px; 125 | vertical-align: top; 126 | } 127 | 128 | .el-form-item{ 129 | margin-bottom: 22px; 130 | } 131 | 132 | .el-form-item .el-form-item{ 133 | margin-bottom: 0; 134 | } 135 | 136 | .el-form-item .el-form-item .el-form-item__content{ 137 | margin-left: 0 !important; 138 | } 139 | 140 | .el-form-item.is-error{} 141 | 142 | .el-form-item.is-error .el-input__inner, .el-form-item.is-error .el-textarea__inner{ 143 | border-color: #cf0000; 144 | } 145 | 146 | .el-form-item.is-required .el-form-item__label:before{ 147 | content: '*'; 148 | color: #cf0000; 149 | margin-right: 4px; 150 | } 151 | 152 | .el-form-item__label{ 153 | text-align: right; 154 | vertical-align: middle; 155 | float: left; 156 | font-size: 14px; 157 | color: rgb(72, 90, 106); 158 | line-height: 1; 159 | padding: 11px 12px 11px 0; 160 | box-sizing: border-box; 161 | } 162 | 163 | .el-form-item__content{ 164 | line-height: 36px; 165 | position: relative; 166 | font-size: 14px; 167 | } 168 | 169 | .el-form-item__error{ 170 | color: #cf0000; 171 | font-size: 12px; 172 | line-height: 1; 173 | padding-top: 4px; 174 | position: absolute; 175 | top: 100%; 176 | left: 0; 177 | } 178 | :root{ 179 | /* Transition 180 | -------------------------- */ 181 | /* Colors 182 | -------------------------- */ 183 | /* Link 184 | -------------------------- */ 185 | /* Border 186 | -------------------------- */ 187 | /* Box-shadow 188 | -------------------------- */ 189 | /* Fill 190 | -------------------------- */ 191 | /* Font 192 | -------------------------- */ 193 | /* Size 194 | -------------------------- */ 195 | /* z-index 196 | -------------------------- */ 197 | /* Disable base 198 | -------------------------- */ 199 | /* Icon 200 | -------------------------- */ 201 | /* Checkbox 202 | -------------------------- */ 203 | /* Radio 204 | -------------------------- */ 205 | /* Select 206 | -------------------------- */ 207 | /* Alert 208 | -------------------------- */ 209 | /* Message Box 210 | -------------------------- */ 211 | /* Message 212 | -------------------------- */ 213 | /* Notification 214 | -------------------------- */ 215 | /* Input 216 | -------------------------- */ 217 | /* Cascader 218 | -------------------------- */ 219 | /* Group 220 | -------------------------- */ 221 | /* Tab 222 | -------------------------- */ 223 | /* Button 224 | -------------------------- */ 225 | /* cascader 226 | -------------------------- */ 227 | /* Switch 228 | -------------------------- */ 229 | /* Dialog 230 | -------------------------- */ 231 | /* Table 232 | -------------------------- */ 233 | /* Pagination 234 | -------------------------- */ 235 | /* Popover 236 | -------------------------- */ 237 | /* Tooltip 238 | -------------------------- */ 239 | /* Tag 240 | -------------------------- */ 241 | /* Dropdown 242 | -------------------------- */ 243 | /* Badge 244 | -------------------------- */ 245 | /* Card 246 | --------------------------*/ 247 | /* Slider 248 | --------------------------*/ 249 | /* Steps 250 | --------------------------*/ 251 | /* Steps 252 | --------------------------*/ 253 | /* Rate 254 | --------------------------*/ 255 | /* DatePicker 256 | --------------------------*/ 257 | /* Loading 258 | --------------------------*/ 259 | /* Scrollbar 260 | --------------------------*/ 261 | /* Carousel 262 | --------------------------*/ 263 | /* Collapse 264 | --------------------------*/ 265 | } --------------------------------------------------------------------------------