mirror of
https://github.com/zuiidea/antd-admin
synced 2026-10-31 06:23:47 +00:00
add theme
This commit is contained in:
zuiidea
@@ -1,8 +0,0 @@
|
||||
{
|
||||
"plugins": [
|
||||
["import", {
|
||||
"libraryName": "antd",
|
||||
"style": "css"
|
||||
}]
|
||||
]
|
||||
}
|
||||
+46
-44
@@ -1,44 +1,46 @@
|
||||
{
|
||||
"private": true,
|
||||
"entry": {
|
||||
"index": "./src/index.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"antd": "^2.3.1",
|
||||
"classnames": "^2.2.5",
|
||||
"dva": "1.0.0",
|
||||
"js-cookie": "^2.1.3",
|
||||
"qs": "^6.2.0",
|
||||
"react": "^15.1.0",
|
||||
"react-dom": "^15.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"atool-build": "^0.7.6",
|
||||
"babel-eslint": "^6.0.4",
|
||||
"babel-plugin-dev-expression": "^0.2.1",
|
||||
"babel-plugin-dva-hmr": "^0.1.0",
|
||||
"babel-plugin-import": "^1.0.1",
|
||||
"babel-plugin-transform-runtime": "^6.9.0",
|
||||
"babel-runtime": "^6.9.2",
|
||||
"dora": "0.3.x",
|
||||
"dora-plugin-proxy": "^0.7.0",
|
||||
"dora-plugin-webpack": "0.6.x",
|
||||
"dora-plugin-webpack-hmr": "^0.1.0",
|
||||
"eslint": "^2.13.1",
|
||||
"eslint-config-airbnb": "^9.0.1",
|
||||
"eslint-plugin-import": "^1.8.1",
|
||||
"eslint-plugin-jsx-a11y": "^1.4.2",
|
||||
"eslint-plugin-react": "^5.1.1",
|
||||
"glob": "^7.0.5",
|
||||
"mockjs": "^1.0.1-beta3",
|
||||
"redbox-react": "^1.2.10",
|
||||
"robe-ajax": "^1.0.0",
|
||||
"watchjs": "^0.0.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "dora --plugins \"proxy,webpack,webpack-hmr\"",
|
||||
"dev": "dora --plugins \"webpack,webpack-hmr\"",
|
||||
"lint": "eslint --fix --ext .js,.jsx src/components/layout",
|
||||
"build": "atool-build"
|
||||
}
|
||||
}
|
||||
{
|
||||
"private": true,
|
||||
"entry": {
|
||||
"index": "./src/index.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"antd": "^2.3.1",
|
||||
"classnames": "^2.2.5",
|
||||
"dva": "1.0.0",
|
||||
"js-cookie": "^2.1.3",
|
||||
"qs": "^6.2.0",
|
||||
"react": "^15.1.0",
|
||||
"react-dom": "^15.1.0",
|
||||
"recharts": "^0.19.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"atool-build": "^0.7.6",
|
||||
"babel-eslint": "^6.0.4",
|
||||
"babel-plugin-dev-expression": "^0.2.1",
|
||||
"babel-plugin-dva-hmr": "^0.1.0",
|
||||
"babel-plugin-import": "^1.0.1",
|
||||
"babel-plugin-transform-runtime": "^6.9.0",
|
||||
"babel-runtime": "^6.9.2",
|
||||
"dora": "0.3.x",
|
||||
"dora-plugin-proxy": "^0.7.0",
|
||||
"dora-plugin-webpack": "0.6.x",
|
||||
"dora-plugin-webpack-hmr": "^0.1.0",
|
||||
"eslint": "^2.13.1",
|
||||
"eslint-config-airbnb": "^9.0.1",
|
||||
"eslint-plugin-import": "^1.8.1",
|
||||
"eslint-plugin-jsx-a11y": "^1.4.2",
|
||||
"eslint-plugin-react": "^5.1.1",
|
||||
"glob": "^7.0.5",
|
||||
"mockjs": "^1.0.1-beta3",
|
||||
"redbox-react": "^1.2.10",
|
||||
"robe-ajax": "^1.0.0",
|
||||
"watchjs": "^0.0.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "dora --plugins \"proxy,webpack,webpack-hmr\"",
|
||||
"dev": "dora --plugins \"webpack,webpack-hmr\"",
|
||||
"lint": "eslint --fix --ext .js,.jsx src/components/layout",
|
||||
"build": "atool-build"
|
||||
},
|
||||
"theme": "./src/theme.js"
|
||||
}
|
||||
|
||||
@@ -1,9 +1,16 @@
|
||||
@import "../vars.less";
|
||||
.numberCard{
|
||||
box-shadow: 2px 2px 10px 0 rgba(0,0,0,0.01);
|
||||
box-shadow: @shadow-1;
|
||||
padding: 32px;
|
||||
font-family: monospace;
|
||||
background-color: #fff;
|
||||
margin-bottom: 24px;
|
||||
cursor: pointer;
|
||||
transition: @transition-ease-in;
|
||||
&:hover{
|
||||
box-shadow: @shadow-2;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
.iconWarp{
|
||||
font-size: 54px;
|
||||
float: left;
|
||||
@@ -26,9 +33,3 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text-overflow(){
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,19 @@
|
||||
import React, { PropTypes } from 'react'
|
||||
import { Icon } from 'antd'
|
||||
import styles from './numberCard.less'
|
||||
import {LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend} from 'recharts'
|
||||
|
||||
function Sales(props) {
|
||||
const { icon, color, title, number } = props
|
||||
return (
|
||||
<div className={styles.numberCard}>
|
||||
<Icon className={styles.iconWarp} style={{ color }} type={icon} />
|
||||
<div className={styles.content}>
|
||||
<p className={styles.title}>{title || 'No Title'}</p>
|
||||
<p className={styles.number}>{number || '10,000'}</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Sales
|
||||
@@ -101,3 +101,5 @@ body {
|
||||
:global .ant-form-item-control{
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
@import "../skin.less";
|
||||
|
||||
@@ -46,9 +46,9 @@
|
||||
}
|
||||
|
||||
.bread {
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
padding: 0 16px;
|
||||
height: 64px;
|
||||
line-height: 64px;
|
||||
padding: 0 24px;
|
||||
margin-bottom: -24px;
|
||||
}
|
||||
|
||||
@@ -59,15 +59,16 @@
|
||||
height: 100vh;
|
||||
|
||||
.container {
|
||||
margin: 24px 16px;
|
||||
margin: 24px;
|
||||
|
||||
.content {
|
||||
min-height: e("calc(100vh - 168px)");
|
||||
min-height: e("calc(100vh - 184px)");
|
||||
position: relative;
|
||||
:global .content-inner{
|
||||
background: #fff;
|
||||
padding: 24px;
|
||||
min-height: e("calc(100vh - 168px)");
|
||||
box-shadow: @shadow-1;
|
||||
min-height: e("calc(100vh - 184px)");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,11 @@
|
||||
@import "./vars.less";
|
||||
:global{
|
||||
.ant-card{
|
||||
box-shadow: @shadow-1;
|
||||
transition: @transition-ease-in;
|
||||
&:hover{
|
||||
box-shadow: @shadow-2;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
+191
-173
@@ -1,173 +1,191 @@
|
||||
@import "../../node_modules/antd/lib/style/themes/default.less";
|
||||
// // Prefix
|
||||
// @ant-prefix : ant;
|
||||
//
|
||||
// // Color
|
||||
// @primary-color : #2db7f5;
|
||||
// @info-color : #2db7f5;
|
||||
// @success-color : #87d068;
|
||||
// @error-color : #f50;
|
||||
// @warning-color : #fa0;
|
||||
// @normal-color : #d9d9d9;
|
||||
//
|
||||
// // ------ Base & Require ------
|
||||
// @body-background : #fff;
|
||||
// @font-family : -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif;
|
||||
// @code-family : Consolas,Menlo,Courier,monospace;
|
||||
// @text-color : #666;
|
||||
// @heading-color : #404040;
|
||||
// @font-size-base : 12px;
|
||||
// @line-height-base : 1.5;
|
||||
// @line-height-computed : floor((@font-size-base * @line-height-base));
|
||||
// @border-radius-base : 6px;
|
||||
// @border-radius-sm : 4px;
|
||||
//
|
||||
// // ICONFONT
|
||||
// @iconfont-css-prefix : anticon;
|
||||
// @icon-url : "https://at.alicdn.com/t/font_1473840929_824008";
|
||||
//
|
||||
// // LINK
|
||||
// @link-color : #2db7f5;
|
||||
// @link-hover-color : tint(@link-color, 20%);
|
||||
// @link-active-color : shade(@link-color, 5%);
|
||||
// @link-hover-decoration : none;
|
||||
//
|
||||
// // Disabled cursor for form controls and buttons.
|
||||
// @cursor-disabled : not-allowed;
|
||||
//
|
||||
// // Animation
|
||||
// @ease-out : cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||
// @ease-in : cubic-bezier(0.55, 0.055, 0.675, 0.19);
|
||||
// @ease-in-out : cubic-bezier(0.645, 0.045, 0.355, 1);
|
||||
// @ease-out-back : cubic-bezier(0.12, 0.4, 0.29, 1.46);
|
||||
// @ease-in-back : cubic-bezier(0.71, -0.46, 0.88, 0.6);
|
||||
// @ease-in-out-back : cubic-bezier(0.71, -0.46, 0.29, 1.46);
|
||||
// @ease-out-circ : cubic-bezier(0.08, 0.82, 0.17, 1);
|
||||
// @ease-in-circ : cubic-bezier(0.6, 0.04, 0.98, 0.34);
|
||||
// @ease-in-out-circ : cubic-bezier(0.78, 0.14, 0.15, 0.86);
|
||||
// @ease-out-quint : cubic-bezier(0.23, 1, 0.32, 1);
|
||||
// @ease-in-quint : cubic-bezier(0.755, 0.05, 0.855, 0.06);
|
||||
// @ease-in-out-quint : cubic-bezier(0.86, 0, 0.07, 1);
|
||||
//
|
||||
// // Border color
|
||||
// @border-color-base : #d9d9d9; // base border outline a component
|
||||
// @border-color-split : #e9e9e9; // split border inside a component
|
||||
//
|
||||
// // Outline
|
||||
// @outline-blur-size : 0;
|
||||
// @outline-width : 2px;
|
||||
// @outline-color : @primary-color;
|
||||
//
|
||||
// // Background color
|
||||
// @background-color-base : #f7f7f7; // basic gray background
|
||||
//
|
||||
// // Shadow
|
||||
// @shadow-color : rgba(100, 100, 100, .2);
|
||||
// @box-shadow-base : @shadow-1-down;
|
||||
// @shadow-1-up : 0 -1px 6px @shadow-color;
|
||||
// @shadow-1-down : 0 1px 6px @shadow-color;
|
||||
// @shadow-1-left : -1px 0 6px @shadow-color;
|
||||
// @shadow-1-right : 1px 0 6px @shadow-color;
|
||||
// @shadow-2 : 0 1px 8px @shadow-color;
|
||||
//
|
||||
// // Buttons
|
||||
// @btn-font-weight : 500;
|
||||
// @btn-border-radius-base : @border-radius-base;
|
||||
// @btn-border-radius-sm : @border-radius-sm;
|
||||
//
|
||||
// @btn-primary-color : #fff;
|
||||
// @btn-primary-bg : @primary-color;
|
||||
// @btn-group-border : shade(@primary-color, 5%);
|
||||
//
|
||||
// @btn-default-color : @text-color;
|
||||
// @btn-default-bg : @background-color-base;
|
||||
// @btn-default-border : @border-color-base;
|
||||
//
|
||||
// @btn-ghost-color : @text-color;
|
||||
// @btn-ghost-bg : transparent;
|
||||
// @btn-ghost-border : @border-color-base;
|
||||
//
|
||||
// @btn-disable-color : #ccc;
|
||||
// @btn-disable-bg : @background-color-base;
|
||||
// @btn-disable-border : @border-color-base;
|
||||
//
|
||||
// @btn-padding-base : 4px 15px;
|
||||
//
|
||||
// @btn-font-size-lg : 14px;
|
||||
// @btn-padding-lg : 4px 15px 5px 15px;
|
||||
//
|
||||
// @btn-padding-sm : 1px 7px;
|
||||
//
|
||||
// @btn-circle-size : 28px;
|
||||
// @btn-circle-size-lg : 32px;
|
||||
// @btn-circle-size-sm : 22px;
|
||||
//
|
||||
// // Media queries breakpoints
|
||||
// // Extra small screen / phone
|
||||
// @screen-xs : 480px;
|
||||
// @screen-xs-min : @screen-xs;
|
||||
// @screen-xs-max : (@screen-xs-min - 1);
|
||||
//
|
||||
// // Small screen / tablet
|
||||
// @screen-sm : 768px;
|
||||
// @screen-sm-min : @screen-sm;
|
||||
// @screen-sm-max : (@screen-sm-min - 1);
|
||||
//
|
||||
// // Medium screen / desktop
|
||||
// @screen-md : 992px;
|
||||
// @screen-md-min : @screen-md;
|
||||
// @screen-md-max : (@screen-md-min - 1);
|
||||
//
|
||||
// // Large screen / wide desktop
|
||||
// @screen-lg : 1200px;
|
||||
// @screen-lg-min : @screen-lg;
|
||||
// @screen-lg-max : (@screen-lg-min - 1);
|
||||
//
|
||||
// // Layout and Grid system
|
||||
// @grid-columns : 24;
|
||||
// @grid-gutter-width : 0;
|
||||
//
|
||||
// // Container sizes
|
||||
// @container-sm : (720px + @grid-gutter-width);
|
||||
// @container-md : (940px + @grid-gutter-width);
|
||||
// @container-lg : (1140px + @grid-gutter-width);
|
||||
//
|
||||
// // z-index list
|
||||
// @zindex-affix : 10;
|
||||
// @zindex-back-top : 10;
|
||||
// @zindex-modal-mask : 1000;
|
||||
// @zindex-modal : 1000;
|
||||
// @zindex-notification : 1010;
|
||||
// @zindex-message : 1010;
|
||||
// @zindex-popover : 1030;
|
||||
// @zindex-picker : 1050;
|
||||
// @zindex-dropdown : 1050;
|
||||
// @zindex-tooltip : 1060;
|
||||
//
|
||||
// // Form
|
||||
// // --------------------------------
|
||||
// // Legend
|
||||
// @legend-color : #999;
|
||||
// @legend-border-color : @border-color-base;
|
||||
// // Label
|
||||
// @label-required-color : #f50;
|
||||
// @label-color : @text-color;
|
||||
// // Input
|
||||
// @input-height-base: 28px;
|
||||
// @input-height-lg: 32px;
|
||||
// @input-height-sm: 22px;
|
||||
//
|
||||
// @input-padding-horizontal : 7px;
|
||||
// @input-padding-vertical-base : 4px;
|
||||
// @input-padding-vertical-sm : 1px;
|
||||
// @input-padding-vertical-lg : 6px;
|
||||
//
|
||||
// @input-placeholder-color : #ccc;
|
||||
// @input-color : @text-color;
|
||||
// @input-border-color : @border-color-base;
|
||||
// @input-bg : #fff;
|
||||
//
|
||||
// @input-hover-border-color : @primary-color;
|
||||
// @input-disabled-bg : @background-color-base;
|
||||
//
|
||||
// @form-item-margin-bottom : 24px;
|
||||
// @import "../../node_modules/antd/lib/style/themes/default.less";
|
||||
// Prefix
|
||||
@ant-prefix : ant;
|
||||
|
||||
// Color
|
||||
@primary-color : #2db7f5;
|
||||
@info-color : #2db7f5;
|
||||
@success-color : #87d068;
|
||||
@error-color : #f50;
|
||||
@warning-color : #fa0;
|
||||
@normal-color : #d9d9d9;
|
||||
|
||||
// ------ Base & Require ------
|
||||
@body-background : #fff;
|
||||
@font-family : -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif;
|
||||
@code-family : Consolas,Menlo,Courier,monospace;
|
||||
@text-color : #666;
|
||||
@heading-color : #404040;
|
||||
@font-size-base : 12px;
|
||||
@line-height-base : 1.5;
|
||||
@line-height-computed : floor((@font-size-base * @line-height-base));
|
||||
@border-radius-base : 6px;
|
||||
@border-radius-sm : 4px;
|
||||
|
||||
// ICONFONT
|
||||
@iconfont-css-prefix : anticon;
|
||||
@icon-url : "https://at.alicdn.com/t/font_1473840929_824008";
|
||||
|
||||
// LINK
|
||||
@link-color : #2db7f5;
|
||||
@link-hover-color : tint(@link-color, 20%);
|
||||
@link-active-color : shade(@link-color, 5%);
|
||||
@link-hover-decoration : none;
|
||||
|
||||
// Disabled cursor for form controls and buttons.
|
||||
@cursor-disabled : not-allowed;
|
||||
|
||||
// Animation
|
||||
@ease-out : cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||
@ease-in : cubic-bezier(0.55, 0.055, 0.675, 0.19);
|
||||
@ease-in-out : cubic-bezier(0.645, 0.045, 0.355, 1);
|
||||
@ease-out-back : cubic-bezier(0.12, 0.4, 0.29, 1.46);
|
||||
@ease-in-back : cubic-bezier(0.71, -0.46, 0.88, 0.6);
|
||||
@ease-in-out-back : cubic-bezier(0.71, -0.46, 0.29, 1.46);
|
||||
@ease-out-circ : cubic-bezier(0.08, 0.82, 0.17, 1);
|
||||
@ease-in-circ : cubic-bezier(0.6, 0.04, 0.98, 0.34);
|
||||
@ease-in-out-circ : cubic-bezier(0.78, 0.14, 0.15, 0.86);
|
||||
@ease-out-quint : cubic-bezier(0.23, 1, 0.32, 1);
|
||||
@ease-in-quint : cubic-bezier(0.755, 0.05, 0.855, 0.06);
|
||||
@ease-in-out-quint : cubic-bezier(0.86, 0, 0.07, 1);
|
||||
|
||||
// Border color
|
||||
@border-color-base : #d9d9d9; // base border outline a component
|
||||
@border-color-split : #e9e9e9; // split border inside a component
|
||||
|
||||
// Outline
|
||||
@outline-blur-size : 0;
|
||||
@outline-width : 2px;
|
||||
@outline-color : @primary-color;
|
||||
|
||||
// Background color
|
||||
@background-color-base : #f7f7f7; // basic gray background
|
||||
|
||||
// Shadow
|
||||
@shadow-color : rgba(100, 100, 100, .2);
|
||||
@box-shadow-base : @shadow-1-down;
|
||||
@shadow-1-up : 0 -1px 6px @shadow-color;
|
||||
@shadow-1-down : 0 1px 6px @shadow-color;
|
||||
@shadow-1-left : -1px 0 6px @shadow-color;
|
||||
@shadow-1-right : 1px 0 6px @shadow-color;
|
||||
@shadow-2 : 0 1px 8px @shadow-color;
|
||||
|
||||
// Buttons
|
||||
@btn-font-weight : 500;
|
||||
@btn-border-radius-base : @border-radius-base;
|
||||
@btn-border-radius-sm : @border-radius-sm;
|
||||
|
||||
@btn-primary-color : #fff;
|
||||
@btn-primary-bg : @primary-color;
|
||||
@btn-group-border : shade(@primary-color, 5%);
|
||||
|
||||
@btn-default-color : @text-color;
|
||||
@btn-default-bg : @background-color-base;
|
||||
@btn-default-border : @border-color-base;
|
||||
|
||||
@btn-ghost-color : @text-color;
|
||||
@btn-ghost-bg : transparent;
|
||||
@btn-ghost-border : @border-color-base;
|
||||
|
||||
@btn-disable-color : #ccc;
|
||||
@btn-disable-bg : @background-color-base;
|
||||
@btn-disable-border : @border-color-base;
|
||||
|
||||
@btn-padding-base : 4px 15px;
|
||||
|
||||
@btn-font-size-lg : 14px;
|
||||
@btn-padding-lg : 4px 15px 5px 15px;
|
||||
|
||||
@btn-padding-sm : 1px 7px;
|
||||
|
||||
@btn-circle-size : 28px;
|
||||
@btn-circle-size-lg : 32px;
|
||||
@btn-circle-size-sm : 22px;
|
||||
|
||||
// Media queries breakpoints
|
||||
// Extra small screen / phone
|
||||
@screen-xs : 480px;
|
||||
@screen-xs-min : @screen-xs;
|
||||
@screen-xs-max : (@screen-xs-min - 1);
|
||||
|
||||
// Small screen / tablet
|
||||
@screen-sm : 768px;
|
||||
@screen-sm-min : @screen-sm;
|
||||
@screen-sm-max : (@screen-sm-min - 1);
|
||||
|
||||
// Medium screen / desktop
|
||||
@screen-md : 992px;
|
||||
@screen-md-min : @screen-md;
|
||||
@screen-md-max : (@screen-md-min - 1);
|
||||
|
||||
// Large screen / wide desktop
|
||||
@screen-lg : 1200px;
|
||||
@screen-lg-min : @screen-lg;
|
||||
@screen-lg-max : (@screen-lg-min - 1);
|
||||
|
||||
// Layout and Grid system
|
||||
@grid-columns : 24;
|
||||
@grid-gutter-width : 0;
|
||||
|
||||
// Container sizes
|
||||
@container-sm : (720px + @grid-gutter-width);
|
||||
@container-md : (940px + @grid-gutter-width);
|
||||
@container-lg : (1140px + @grid-gutter-width);
|
||||
|
||||
// z-index list
|
||||
@zindex-affix : 10;
|
||||
@zindex-back-top : 10;
|
||||
@zindex-modal-mask : 1000;
|
||||
@zindex-modal : 1000;
|
||||
@zindex-notification : 1010;
|
||||
@zindex-message : 1010;
|
||||
@zindex-popover : 1030;
|
||||
@zindex-picker : 1050;
|
||||
@zindex-dropdown : 1050;
|
||||
@zindex-tooltip : 1060;
|
||||
|
||||
// Form
|
||||
// --------------------------------
|
||||
// Legend
|
||||
@legend-color : #999;
|
||||
@legend-border-color : @border-color-base;
|
||||
// Label
|
||||
@label-required-color : #f50;
|
||||
@label-color : @text-color;
|
||||
// Input
|
||||
@input-height-base: 28px;
|
||||
@input-height-lg: 32px;
|
||||
@input-height-sm: 22px;
|
||||
|
||||
@input-padding-horizontal : 7px;
|
||||
@input-padding-vertical-base : 4px;
|
||||
@input-padding-vertical-sm : 1px;
|
||||
@input-padding-vertical-lg : 6px;
|
||||
|
||||
@input-placeholder-color : #ccc;
|
||||
@input-color : @text-color;
|
||||
@input-border-color : @border-color-base;
|
||||
@input-bg : #fff;
|
||||
|
||||
@input-hover-border-color : @primary-color;
|
||||
@input-disabled-bg : @background-color-base;
|
||||
|
||||
@form-item-margin-bottom : 24px;
|
||||
|
||||
/*========================*/
|
||||
/*=======Antd Admin=======*/
|
||||
/*========================*/
|
||||
|
||||
// Shadow
|
||||
@shadow-1 : 4px 4px 20px 0 rgba(0,0,0,0.01);
|
||||
@shadow-2 : 4px 4px 40px 0 rgba(0,0,0,0.05);
|
||||
|
||||
//transition
|
||||
@transition-ease-in : all .3s @ease-in;
|
||||
|
||||
//mix
|
||||
.text-overflow(){
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
+1
-1
@@ -9,8 +9,8 @@ import Sider from '../components/layout/sider'
|
||||
import styles from '../components/layout/main.less'
|
||||
import '../components/layout/common.less'
|
||||
import {Spin,message} from 'antd'
|
||||
|
||||
function App({children, location, dispatch, app}) {
|
||||
console.log(children);
|
||||
const {login, loading, loginButtonLoading, user} = app
|
||||
const loginProps = {
|
||||
loading,
|
||||
|
||||
+10
-5
@@ -1,12 +1,10 @@
|
||||
import React, {PropTypes} from 'react'
|
||||
import {Link} from 'dva/router'
|
||||
import {Row, Col, Icon} from 'antd'
|
||||
import {Row, Col, Icon, Card} from 'antd'
|
||||
import NumberCard from '../components/dashboard/numberCard'
|
||||
import Sales from '../components/dashboard/sales'
|
||||
|
||||
const [colorGreen,
|
||||
colorBlue,
|
||||
colorPurple,
|
||||
colorRed] = ['#64ea91', '#8fc9fb', '#d897eb', '#f69899']
|
||||
const [colorGreen,colorBlue,colorPurple,colorRed] = ['#64ea91', '#8fc9fb', '#d897eb', '#f69899']
|
||||
|
||||
const numberCardData = [
|
||||
{
|
||||
@@ -44,6 +42,13 @@ function Dashboard() {
|
||||
<Row gutter={24}>
|
||||
{numberCards}
|
||||
</Row>
|
||||
<Row gutter={24}>
|
||||
<Col lg={18} md={24}>
|
||||
<Card bordered={false} bodyStyle={{padding:0}}>
|
||||
<Sales />
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
module.exports = () => {
|
||||
return {
|
||||
'@primary-color': '#1DA57A',
|
||||
'@link-color': '#1DA57A',
|
||||
'@border-radius-base': '2px',
|
||||
};
|
||||
};
|
||||
+21
-17
@@ -1,41 +1,45 @@
|
||||
const fs = require('fs');
|
||||
const path = require('path');
|
||||
const fs = require('fs')
|
||||
const path = require('path')
|
||||
|
||||
module.exports = function(webpackConfig, env) {
|
||||
webpackConfig.babel.plugins.push('transform-runtime');
|
||||
webpackConfig.babel.plugins.push('transform-runtime')
|
||||
webpackConfig.babel.plugins.push(['import', {
|
||||
libraryName: 'antd',
|
||||
style: true,
|
||||
}])
|
||||
|
||||
// Support hmr
|
||||
if (env === 'development') {
|
||||
webpackConfig.devtool = '#eval';
|
||||
webpackConfig.devtool = '#eval'
|
||||
webpackConfig.babel.plugins.push(['dva-hmr', {
|
||||
entries: [
|
||||
'./src/index.js',
|
||||
],
|
||||
}]);
|
||||
}])
|
||||
} else {
|
||||
webpackConfig.babel.plugins.push('dev-expression');
|
||||
webpackConfig.babel.plugins.push('dev-expression')
|
||||
}
|
||||
|
||||
// Support CSS Modules
|
||||
// Parse all less files as css module.
|
||||
webpackConfig.module.loaders.forEach(function(loader, index) {
|
||||
if (typeof loader.test === 'function' && loader.test.toString().indexOf('\\.less$') > -1) {
|
||||
loader.include = /node_modules/;
|
||||
loader.test = /\.less$/;
|
||||
loader.include = /node_modules/
|
||||
loader.test = /\.less$/
|
||||
}
|
||||
if (loader.test.toString() === '/\\.module\\.less$/') {
|
||||
loader.exclude = /node_modules/;
|
||||
loader.test = /\.less$/;
|
||||
loader.exclude = /node_modules/
|
||||
loader.test = /\.less$/
|
||||
}
|
||||
if (typeof loader.test === 'function' && loader.test.toString().indexOf('\\.css$') > -1) {
|
||||
loader.include = /node_modules/;
|
||||
loader.test = /\.css$/;
|
||||
loader.include = /node_modules/
|
||||
loader.test = /\.css$/
|
||||
}
|
||||
if (loader.test.toString() === '/\\.module\\.css$/') {
|
||||
loader.exclude = /node_modules/;
|
||||
loader.test = /\.css$/;
|
||||
loader.exclude = /node_modules/
|
||||
loader.test = /\.css$/
|
||||
}
|
||||
});
|
||||
})
|
||||
|
||||
return webpackConfig;
|
||||
};
|
||||
return webpackConfig
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user