Skip to content

ZhangJianFrontEnd
ZhangJianFrontEnd
Commit 834da9d6 by xiaxiansheng
Options

Merge branch '20210714' into 'master' 

20210714

See merge request vue-project/basic!2
parents 51c55a75 eba6b6a2
Showing with 3 additions and 734 deletions
runner @ fd7fc1d9
Subproject commit d295deac16c7024d3df80eabf415f5080f83fdfa Subproject commit fd7fc1d9b5f208d456799083dd39d5d01dfd7a26
src/App.vue
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
</template> </template>
<script> <script>
import { refreshScale } from 'runner/public/utils/refreshSize' import { refreshScale } from 'runner/common/utils/refreshSize'
export default { export default {
name: 'app', name: 'app',
......
src/assets/fonts/fonts.less deleted 100644 → 0
/* 数字字体包 */
@font-face {
font-family: "CenturyGothic";
src: url('./CenturyGothic.TTF');
font-weight: normal;
font-style: normal;
}
/* UI文字字体包 */
@font-face {
font-family: "Alibaba PuHuiTi35";
src: url('./AlibabaPuHuiTi-2-35-Thin.TTF');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Alibaba PuHuiTi45";
src: url('./AlibabaPuHuiTi-2-45-Light.TTF');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Alibaba PuHuiTi55";
src: url('./AlibabaPuHuiTi-2-55-Regular.TTF');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Alibaba PuHuiTi65";
src: url('./AlibabaPuHuiTi-2-65-Medium.TTF');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Alibaba PuHuiTi75";
src: url('./AlibabaPuHuiTi-2-75-SemiBold.TTF');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "DS-Digital-B";
src: url('./DS-DIGIB-2.TTF');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "DS-Digital-I";
src: url('./DS-DIGII-3.TTF');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "DS-Digital-T";
src: url('./DS-DIGIT-4.TTF');
font-weight: normal;
font-style: normal;
}
src/assets/styles/less/Less-mixins.less deleted 100644 → 0
/**
* Less-mixins.less - CSS Snippets
* 合并less输出到一个css --- 引入页面的CSS名称.css
* @author xiaxiansheng@adinnet.cn
*/
// 文件路径
@lessPatch: "../../";
@cssPatch: ""; //nav bar logo
// Clearfix - 清除浮动
.clearfix() {
&:before,
&:after {
content: " "; // 1
display: table; // 2
}
&:after {
clear: both;
}
}
// 垂直居中
.table-cell () {
display: table-cell;
vertical-align: middle;
}
// 快速浮动
.pull-left {
float: left !important;
}
.pull-right {
float: right !important;
}
// 展示与隐藏
.show {
display: block !important;
}
.hidden {
display: none !important;
visibility: hidden !important;
}
.invisible {
visibility: hidden;
}
// 水平居中
.text-align(@textAlign) {
text-align: @textAlign;
}
// 垂直居中
.vertical-align(@dir) {
vertical-align: @dir;
}
// 元素垂直居中(IE9+)
.verticalCenter(@position) {
position: @position;
top: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
// 元素垂直居中
.vertical-center(){ // 居中元素的父级
font-size: 0;
text-align: center;
&:before{
content: "";
display: inline-block;
width: 0;
height: 100%;
vertical-align: middle;
}
.ele-middle{ // 需要居中的元素
display: inline-block;
font-size: medium;
*text-align: left; // 解决低版本的IE文字居右的问题
vertical-align: middle;
}
}
// text-overflow - 单行文本溢出显示省略号
.text-overflow() {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
// multiLine-overflow - 多行溢出显示省略号(webkit)
.multiLine-overflow(@lineClamp: 2) {
display: -webkit-box; // 必须结合的属性,将对象作为弹性伸缩盒子模型显示
-webkit-line-clamp: @lineClamp; // 设置显示多少行
-webkit-box-orient: vertical; // 必须结合的属性,设置或检索伸缩盒对象的子元素的排列方式
overflow : hidden;
text-overflow: ellipsis; // 可以用来多行文本的情况下，用省略号“…”隐藏超出范围的文本
}
// 三角箭头 - 未实际测试
// .caret {
// display: inline-block;
// width: 0;
// height: 0;
// margin-left: 2px;
// vertical-align: middle;
// border-top: @caret-width-base dashed;
// border-top: @caret-width-base solid ~"\9"; // IE8
// border-right: @caret-width-base solid transparent;
// border-left: @caret-width-base solid transparent;
// }
// // Reverse the caret
// .caret {
// border-top: 0;
// border-bottom: @caret-width-base dashed;
// border-bottom: @caret-width-base solid ~"\9"; // IE8
// content: "";
// }
// 只在一边或两边显示盒子阴影
.box-shadow() {
background-color: #FF8020;
width: 160px;
height: 90px;
margin-top: -45px;
margin-left: -80px;
position: absolute;
top: 50%;
left: 50%;
&:after {
content: "";
width: 150px;
height: 1px;
margin-top: 88px;
margin-left: -75px;
display: block;
position: absolute;
left: 50%;
z-index: -1;
-webkit-box-shadow: 0px 0px 8px 2px #000000;
-moz-box-shadow: 0px 0px 8px 2px #000000;
box-shadow: 0px 0px 8px 2px #000000;
}
}
// 用CSS动画实现省略号动画
.loading:after {
overflow: hidden;
display: inline-block;
vertical-align: bottom;
animation: ellipsis 2s infinite;
content: "\2026"; /* ascii code for the ellipsis character */
}
@keyframes ellipsis {
from {
width: 2px;
}
to {
width: 15px;
}
}
// Border-radius - 圆角
.border-radius(@radius) {
border-radius: @radius;
}
.border-top-radius(@radius) {
border-top-right-radius: @radius;
border-top-left-radius: @radius;
}
.border-right-radius(@radius) {
border-bottom-right-radius: @radius;
border-top-right-radius: @radius;
}
.border-bottom-radius(@radius) {
border-bottom-right-radius: @radius;
border-bottom-left-radius: @radius;
}
.border-left-radius(@radius) {
border-bottom-left-radius: @radius;
border-top-left-radius: @radius;
}
// center-block - 块元素水平居中
.center-block() {
display: block;
margin-left: auto;
margin-right: auto;
}
// hide-text - 隐藏文本
.hide-text() {
font: ~"0/0" a;
color: transparent;
text-shadow: none;
background-color: transparent;
border: 0;
}
// hide-text - 隐藏文本 v3.0.1
.text-hide() {
.hide-text();
}
// User select - 选中文字
.user-select(@select) {
-webkit-user-select: @select;
-moz-user-select: @select;
-ms-user-select: @select; // IE10+
user-select: @select;
}
// img-responsive - 响应式图片
.img-responsive() {
display: block;
max-width: 100%;
height: auto;
}
// Retina图片显示
.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) {
background-image: url("@{file-1x}");
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and ( min--moz-device-pixel-ratio: 2),
only screen and ( -o-min-device-pixel-ratio: 2/1),
only screen and ( min-device-pixel-ratio: 2),
only screen and ( min-resolution: 192dpi),
only screen and ( min-resolution: 2dppx) {
background-image: url("@{file-2x}");
background-size: @width-1x @height-1x;
}
}
// Opcity
.opacity(@opacity) {
opacity: @opacity;
// IE8 filter
@opacity-ie: (@opacity * 100);
filter: ~"alpha(opacity=@{opacity-ie})";
}
// Reset filters for IE - 清除IE9-的渐变背景
.reset-filter() {
filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
}
// reset-text - 重置默认文本
.reset-text() {
font-family: @font-family-base;
// We deliberately do NOT reset font-size.
font-style: normal;
font-weight: normal;
letter-spacing: normal;
line-break: auto;
line-height: @line-height-base;
text-align: left; // Fallback for where `start` is not supported
text-align: start;
text-decoration: none;
text-shadow: none;
text-transform: none;
white-space: normal;
word-break: normal;
word-spacing: normal;
word-wrap: normal;
}
// size - 设置元素尺寸
// size1 - 宽高不等
.size(@width; @height) {
width: @width;
height: @height;
}
// size2 - 宽高相等(正方形)
.square(@size) {
.size(@size; @size);
}
// WebKit-style focus
.tab-focus() {
// Default
outline: thin dotted;
// WebKit
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
// bg-variant - 背景色及其操作状态
.bg-variant(@color) {
background-color: @color;
a&:hover,
a&:focus {
background-color: darken(@color, 10%);
}
}
// Vendor Prefixes
//
// All vendor mixins are deprecated as of v3.2.0 due to the introduction of
// Autoprefixer in our Gruntfile. They will be removed in v4.
// - Animations
// - Backface visibility
// - Box shadow
// - Box sizing
// - Content columns
// - Hyphens
// - Placeholder text
// - Transformations
// - Transitions
// - User Select
// Animations - CSS3动画
.animation(@animation) {
-webkit-animation: @animation;
-o-animation: @animation;
animation: @animation;
}
.animation-name(@name) {
-webkit-animation-name: @name;
animation-name: @name;
}
.animation-duration(@duration) {
-webkit-animation-duration: @duration;
animation-duration: @duration;
}
.animation-timing-function(@timing-function) {
-webkit-animation-timing-function: @timing-function;
animation-timing-function: @timing-function;
}
.animation-delay(@delay) {
-webkit-animation-delay: @delay;
animation-delay: @delay;
}
.animation-iteration-count(@iteration-count) {
-webkit-animation-iteration-count: @iteration-count;
animation-iteration-count: @iteration-count;
}
.animation-direction(@direction) {
-webkit-animation-direction: @direction;
animation-direction: @direction;
}
.animation-fill-mode(@fill-mode) {
-webkit-animation-fill-mode: @fill-mode;
animation-fill-mode: @fill-mode;
}
// Backface visibility
// Prevent browsers from flickering when using CSS 3D transforms.
// Default value is `visible`, but can be changed to `hidden`
.backface-visibility(@visibility){
-webkit-backface-visibility: @visibility;
-moz-backface-visibility: @visibility;
backface-visibility: @visibility;
}
// Drop shadows
//
// Note: Deprecated `.box-shadow()` as of v3.1.0 since all of Bootstrap's
// supported browsers that have box shadow capabilities now support it.
.box-shadow(@shadow) {
-webkit-box-shadow: @shadow; // iOS <4.3 & Android <4.1
box-shadow: @shadow;
}
// Box sizing
.box-sizing(@boxmodel) {
-webkit-box-sizing: @boxmodel;
-moz-box-sizing: @boxmodel;
box-sizing: @boxmodel;
}
// CSS3 Content Columns
.content-columns(@column-count; @column-gap: @grid-gutter-width) {
-webkit-column-count: @column-count;
-moz-column-count: @column-count;
column-count: @column-count;
-webkit-column-gap: @column-gap;
-moz-column-gap: @column-gap;
column-gap: @column-gap;
}
// Optional hyphenation
.hyphens(@mode: auto) {
word-wrap: break-word;
-webkit-hyphens: @mode;
-moz-hyphens: @mode;
-ms-hyphens: @mode; // IE10+
-o-hyphens: @mode;
hyphens: @mode;
}
// Placeholder text - 表单占位符
.placeholder(@color: @input-color-placeholder) {
// Firefox
&::-moz-placeholder {
color: @color;
opacity: 1; // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526
}
&:-ms-input-placeholder { color: @color; } // Internet Explorer 10+
&::-webkit-input-placeholder { color: @color; } // Safari and Chrome
}
// Transformations - 2D转换
.scale(@ratio) {
-webkit-transform: scale(@ratio);
-ms-transform: scale(@ratio); // IE9 only
-o-transform: scale(@ratio);
transform: scale(@ratio);
}
.scale(@ratioX; @ratioY) {
-webkit-transform: scale(@ratioX, @ratioY);
-ms-transform: scale(@ratioX, @ratioY); // IE9 only
-o-transform: scale(@ratioX, @ratioY);
transform: scale(@ratioX, @ratioY);
}
.scaleX(@ratio) {
-webkit-transform: scaleX(@ratio);
-ms-transform: scaleX(@ratio); // IE9 only
-o-transform: scaleX(@ratio);
transform: scaleX(@ratio);
}
.scaleY(@ratio) {
-webkit-transform: scaleY(@ratio);
-ms-transform: scaleY(@ratio); // IE9 only
-o-transform: scaleY(@ratio);
transform: scaleY(@ratio);
}
.skew(@x; @y) {
-webkit-transform: skewX(@x) skewY(@y);
-ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+
-o-transform: skewX(@x) skewY(@y);
transform: skewX(@x) skewY(@y);
}
.translate(@x; @y) {
-webkit-transform: translate(@x, @y);
-ms-transform: translate(@x, @y); // IE9 only
-o-transform: translate(@x, @y);
transform: translate(@x, @y);
}
.translate3d(@x; @y; @z) {
-webkit-transform: translate3d(@x, @y, @z);
transform: translate3d(@x, @y, @z);
}
.rotate(@degrees) {
-webkit-transform: rotate(@degrees);
-ms-transform: rotate(@degrees); // IE9 only
-o-transform: rotate(@degrees);
transform: rotate(@degrees);
}
.rotateX(@degrees) {
-webkit-transform: rotateX(@degrees);
-ms-transform: rotateX(@degrees); // IE9 only
-o-transform: rotateX(@degrees);
transform: rotateX(@degrees);
}
.rotateY(@degrees) {
-webkit-transform: rotateY(@degrees);
-ms-transform: rotateY(@degrees); // IE9 only
-o-transform: rotateY(@degrees);
transform: rotateY(@degrees);
}
.perspective(@perspective) {
-webkit-perspective: @perspective;
-moz-perspective: @perspective;
perspective: @perspective;
}
.perspective-origin(@perspective) {
-webkit-perspective-origin: @perspective;
-moz-perspective-origin: @perspective;
perspective-origin: @perspective;
}
.transform-origin(@origin) {
-webkit-transform-origin: @origin;
-moz-transform-origin: @origin;
-ms-transform-origin: @origin; // IE9 only
transform-origin: @origin;
}
// Transitions - 过渡
.transition(@transition) {
-webkit-transition: @transition;
-o-transition: @transition;
transition: @transition;
}
.transition-property(@transition-property) {
-webkit-transition-property: @transition-property;
transition-property: @transition-property;
}
.transition-delay(@transition-delay) {
-webkit-transition-delay: @transition-delay;
transition-delay: @transition-delay;
}
.transition-duration(@transition-duration) {
-webkit-transition-duration: @transition-duration;
transition-duration: @transition-duration;
}
.transition-timing-function(@timing-function) {
-webkit-transition-timing-function: @timing-function;
transition-timing-function: @timing-function;
}
.transition-transform(@transition) {
-webkit-transition: -webkit-transform @transition;
-moz-transition: -moz-transform @transition;
-o-transition: -o-transform @transition;
transition: transform @transition;
}
src/assets/styles/less/common.less deleted 100644 → 0
/**
* common.less 通用less
*/
@import "../reset.css";
@import './Less-mixins.less';
@import '../../fonts/fonts.less';
@headerHeight: 67px;
.clearfix {
.clearfix();
}
.img-responsive {
.img-responsive();
}
src/assets/styles/less/layout.less deleted 100644 → 0
@leftSize: 530px;
@rightSize: 530px;
.layout-main {
// height: ~"calc(100% - 90px)";
.center, .left, .right {
float: left;
height: 100%;
}
.left {
position: relative;
width: @leftSize;
margin-left: -100%;
padding-left: 30px;
box-sizing: border-box;
padding-right: 30px;
}
.right {
position: relative;
padding-right: 30px;
padding-left: 20px;
width: @rightSize;
margin-left: -@rightSize;
font-size: 16px;
box-sizing: border-box;
padding-right: 30px;
box-sizing: border-box;
}
.center {
width: 100%;
box-sizing: border-box;
.content {
position: relative;
height: 100%;
margin-left: @leftSize;
margin-right: @rightSize;
box-sizing: border-box;
}
}
}
src/assets/styles/reset.css deleted 100644 → 0
/**
* Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
* http://cssreset.com
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, input {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font-weight: 400;
vertical-align: baseline;
outline: none;
font-style:normal
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, menu, nav, section {
display: block;
}
body {
-webkit-font-smoothing: antialiased;
line-height: 1;
font-family: Arial, "Microsoft Yahei";
-webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: none;
}
a {
text-decoration: none;
-webkit-backface-visibility: hidden;
}
li {
list-style: none;
}
input {
outline: none;
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
-webkit-appearance: none;
}
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 100px white inset;
}
html, body {
width: 100%;
height: 100%;
scroll-behavior: smooth;
}
input, textarea {
user-select: text;
}
* {
-webkit-tap-highlight-color: transparent;
outline: none;
}
*:not(input,textarea) {
-webkit-touch-callout: none;
-webkit-user-select: none;
box-sizing: border-box;
}
src/index.js
...@@ -5,7 +5,7 @@ import App from './App.vue' ...@@ -5,7 +5,7 @@ import App from './App.vue'
import createStore from './store' // Vuex import createStore from './store' // Vuex
import createRouter from './router/router' import createRouter from './router/router'
import axiosServer from 'runner/request' import axiosServer from 'runner/request'
import UsePlugin from 'runner/public/plugins' import UsePlugin from 'runner/common/plugins'
import customPlugin from './public/plugins' import customPlugin from './public/plugins'
import utils from 'utils' import utils from 'utils'
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment