some style updates (#7603)

* some style updates

* fix a datepicker typo
This commit is contained in:
杨奕 2017-10-20 01:03:34 -05:00 committed by GitHub
parent af46f968ab
commit 7d55d47b67
15 changed files with 40 additions and 37 deletions

View File

@ -142,15 +142,15 @@ The `indeterminate` property can help you to achieve a 'check all' effect.
export default {
data() {
return {
checkAll: true,
checkAll: false,
checkedCities: ['Shanghai', 'Beijing'],
cities: cityOptions,
isIndeterminate: true
};
},
methods: {
handleCheckAllChange(event) {
this.checkedCities = event.target.checked ? cityOptions : [];
handleCheckAllChange(val) {
this.checkedCities = val ? cityOptions : [];
this.isIndeterminate = false;
},
handleCheckedCitiesChange(value) {

View File

@ -55,7 +55,7 @@
}
.bg-border-base {
background-color: #d8dce6;
background-color: #d8dce5;
}
.bg-border-light {
background-color: #dfe4ed;
@ -119,7 +119,7 @@ Neutral colors are for text, background and border colors. You can use different
</el-col>
<el-col :span="6">
<div class="demo-color-box-group">
<div class="demo-color-box bg-border-base">Base Border<div class="value">#D8DCE6</div></div>
<div class="demo-color-box bg-border-base">Base Border<div class="value">#D8DCE5</div></div>
<div class="demo-color-box bg-border-light">Light Border<div class="value">#DFE4ED</div></div>
<div class="demo-color-box bg-border-lighter">Lighter Border<div class="value">#E6EBF5</div></div>
<div class="demo-color-box bg-border-extra-light">Extra Light Border<div class="value">#EDF2FC</div></div>

View File

@ -55,7 +55,7 @@
},
createStateFilter(queryString) {
return (state) => {
return (state.value.indexOf(queryString.toLowerCase()) === 0);
return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
handleSelect(item) {
@ -436,7 +436,7 @@ You can get some recommended tips based on the current input.
},
createFilter(queryString) {
return (link) => {
return (link.value.indexOf(queryString.toLowerCase()) === 0);
return (link.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
loadAll() {
@ -520,7 +520,7 @@ Customize how suggestions are displayed.
},
createFilter(queryString) {
return (link) => {
return (link.value.indexOf(queryString.toLowerCase()) === 0);
return (link.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
loadAll() {
@ -593,7 +593,7 @@ Search data from server-side.
},
createFilter(queryString) {
return (link) => {
return (link.value.indexOf(queryString.toLowerCase()) === 0);
return (link.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
handleSelect(item) {

View File

@ -140,15 +140,15 @@
export default {
data() {
return {
checkAll: true,
checkAll: false,
checkedCities: ['上海', '北京'],
cities: cityOptions,
isIndeterminate: true
};
},
methods: {
handleCheckAllChange(event) {
this.checkedCities = event.target.checked ? cityOptions : [];
handleCheckAllChange(val) {
this.checkedCities = val ? cityOptions : [];
this.isIndeterminate = false;
},
handleCheckedCitiesChange(value) {

View File

@ -55,7 +55,7 @@
}
.bg-border-base {
background-color: #d8dce6;
background-color: #d8dce5;
}
.bg-border-light {
background-color: #dfe4ed;
@ -120,7 +120,7 @@ Element 主要品牌颜色是鲜艳、友好的蓝色。
</el-col>
<el-col :span="6">
<div class="demo-color-box-group">
<div class="demo-color-box bg-border-base">一级边框<div class="value">#D8DCE6</div></div>
<div class="demo-color-box bg-border-base">一级边框<div class="value">#D8DCE5</div></div>
<div class="demo-color-box bg-border-light">二级边框<div class="value">#DFE4ED</div></div>
<div class="demo-color-box bg-border-lighter">三级边框<div class="value">#E6EBF5</div></div>
<div class="demo-color-box bg-border-extra-light">四级边框<div class="value">#EDF2FC</div></div>

View File

@ -96,7 +96,7 @@
},
createStateFilter(queryString) {
return (state) => {
return (state.value.indexOf(queryString.toLowerCase()) === 0);
return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
handleSelect(item) {
@ -465,7 +465,7 @@ export default {
},
createFilter(queryString) {
return (restaurant) => {
return (restaurant.value.indexOf(queryString.toLowerCase()) === 0);
return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
loadAll() {
@ -594,7 +594,7 @@ export default {
},
createFilter(queryString) {
return (restaurant) => {
return (restaurant.value.indexOf(queryString.toLowerCase()) === 0);
return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
loadAll() {
@ -749,7 +749,7 @@ export default {
},
createStateFilter(queryString) {
return (state) => {
return (state.value.indexOf(queryString.toLowerCase()) === 0);
return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
handleSelect(item) {

View File

@ -349,7 +349,7 @@
},
handleLeave() {
this.$emit('dodestory');
this.$emit('dodestroy');
document.body.removeEventListener('keydown', this.handleKeydown);
},

View File

@ -158,6 +158,7 @@
}
@include when(round) {
border-radius: 20px;
padding: 12px 23px;
}
}

View File

@ -58,7 +58,7 @@ $--background-color-base: #f5f7fa;
-------------------------- */
$--border-width-base: 1px;
$--border-style-base: solid;
$--border-color-base: #d8dce6 !default;
$--border-color-base: #d8dce5 !default;
$--border-color-light: #dfe4ed !default;
$--border-color-lighter: #e6ebf5 !default;
$--border-color-extra-light: #edf2fc !default;
@ -121,8 +121,8 @@ $--checkbox-input-border: $--border-base;
$--checkbox-input-border-color: $--border-color-base;
$--checkbox-icon-color: $--color-white;
$--checkbox-disabled-input-border-color: $--disabled-border-base;
$--checkbox-disabled-input-fill: $--disabled-fill-base;
$--checkbox-disabled-input-border-color: $--border-color-base;
$--checkbox-disabled-input-fill: #edf2fc;
$--checkbox-disabled-icon-color: $--color-text-placeholder;
$--checkbox-disabled-checked-input-fill: $--border-color-extra-light;
@ -138,8 +138,8 @@ $--checkbox-input-border-color-hover: $--color-primary;
$--checkbox-bordered-padding: 9px 20px 9px 10px;
$--checkbox-bordered-medium-padding: 7px 20px 7px 10px;
$--checkbox-bordered-small-padding: 4px 20px 6px 10px;
$--checkbox-bordered-mini-padding: 2px 20px 4px 10px;
$--checkbox-bordered-small-padding: 3px 15px 7px 10px;
$--checkbox-bordered-mini-padding: 1px 15px 5px 10px;
$--checkbox-bordered-medium-input-height: 14px;
$--checkbox-bordered-medium-input-width: 14px;
$--checkbox-bordered-small-input-height: 12px;
@ -184,8 +184,8 @@ $--radio-input-border-color-hover: $--color-primary;
$--radio-bordered-padding: 10px 20px 10px 10px;
$--radio-bordered-medium-padding: 8px 20px 8px 10px;
$--radio-bordered-small-padding: 6px 20px 6px 10px;
$--radio-bordered-mini-padding: 4px 20px 4px 10px;
$--radio-bordered-small-padding: 6px 15px 6px 10px;
$--radio-bordered-mini-padding: 4px 15px 4px 10px;
$--radio-bordered-medium-input-height: 14px;
$--radio-bordered-medium-input-width: 14px;
$--radio-bordered-small-input-height: 12px;
@ -271,10 +271,11 @@ $--msgbox-danger-color: $--color-danger;
-------------------------- */
$--message-shadow: $--box-shadow-base;
$--message-min-width: 380px;
$--message-background-color: #edf2fc;
$--message-padding: 15px 15px 15px 20px;
$--message-content-color: $--color-text-regular;
$--message-close-color: $--color-text-placeholder;
$--message-close-size: 14px;
$--message-close-size: 16px;
$--message-close-hover-color: $--color-text-secondary;
$--message-success-color: $--color-success;
@ -390,12 +391,12 @@ $--button-font-size: 14px;
$--button-font-weight: $--font-weight-primary;
$--button-border-radius: $--border-radius-base;
$--button-padding-vertical: 12px;
$--button-padding-horizontal: 18px;
$--button-padding-horizontal: 20px;
$--button-medium-font-size: 14px;
$--button-medium-border-radius: $--border-radius-base;
$--button-medium-padding-vertical: 10px;
$--button-medium-padding-horizontal: 18px;
$--button-medium-padding-horizontal: 20px;
$--button-small-font-size: 12px;
$--button-small-border-radius: #{$--border-radius-base - 1};
@ -411,9 +412,9 @@ $--button-default-color: $--color-text-regular;
$--button-default-fill: $--color-white;
$--button-default-border: $--border-color-base;
$--button-disabled-color: $--color-text-secondary;
$--button-disabled-color: $--color-text-placeholder;
$--button-disabled-fill: $--color-white;
$--button-disabled-border: $--border-color-base;
$--button-disabled-border: $--border-color-lighter;
$--button-primary-border: $--color-primary;
$--button-primary-color: $--color-white;

View File

@ -170,6 +170,7 @@
margin-right: 5px;
width: 24px;
text-align: center;
font-size: 18px;
}
& * {
vertical-align: middle;
@ -244,6 +245,7 @@
margin-right: 5px;
width: 24px;
text-align: center;
font-size: 18px;
}
}

View File

@ -12,7 +12,7 @@
left: 50%;
top: 20px;
transform: translateX(-50%);
background-color: $--color-info-lighter;
background-color: $--message-background-color;
transition: opacity 0.3s, transform .4s;
overflow: hidden;
padding: $--message-padding;

View File

@ -116,6 +116,7 @@
box-sizing: border-box;
border-color: transparent;
margin: 3px 0 3px 6px;
background-color: #f0f2f5;
&__close.el-icon-close {
background-color: $--color-text-placeholder;

View File

@ -1,10 +1,9 @@
import { Route } from 'vue-router'
import { ElementUIComponent } from './component'
/** Breadcrumb Item Component */
export declare class ElBreadcrumbItem extends ElementUIComponent {
/** Target route of the link, same as to of vue-router */
to: string | Route
to: string | object
/** If true, the navigation will not leave a history record */
replace: boolean

2
types/cascader.d.ts vendored
View File

@ -53,5 +53,5 @@ export declare class ElCascader extends ElementUIComponent {
size: ElementUIComponentSize
/** Hook function before filtering with the value to be filtered as its parameter */
beforeFilter: (value: string) => boolean | Promise
beforeFilter: (value: string) => boolean | Promise<any>
}

View File

@ -1,4 +1,3 @@
import { Route } from 'vue-router'
import { ElementUIComponent } from './component'
/** Menu Item Component */
@ -7,5 +6,5 @@ export declare class ElMenuItem extends ElementUIComponent {
index: string
/** Vue Router object */
route: Route
route: object
}