github
/
element
mirror of https://github.com/ElemeFE/element
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #980 from Leopoldthecoder/style-remove 

i18n: remove redundant styles
pull/1068/head^2
杨奕 2016-11-13 12:03:35 +08:00 committed by GitHub
parent 332c15946e 7af57c84c5
commit 455850d70c
24 changed files with 5 additions and 498 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/components/demo-block.vue
View File

@ -212,7 +212,7 @@
},
blockClass() {
return `demo-${ this.$router.currentRoute.path.split('/').pop() }`;
return `demo-${ this.lang } demo-${ this.$router.currentRoute.path.split('/').pop() }`;
},
iconClass() {

9
examples/docs/en-US/alert.md
View File

@ -7,15 +7,6 @@
}
}
</script>
<style>
.demo-box.demo-alert .el-alert {
margin: 20px 0 0;
}
.demo-box.demo-alert .el-alert:first-child {
margin: 0;
}
</style>
## Alert

6
examples/docs/en-US/badge.md
View File

@ -1,9 +1,3 @@
<style>
.demo-badge.demo-box .el-dropdown {
vertical-align: middle;
}
</style>
## Badge
A number or status mark on buttons and icons.

41
examples/docs/en-US/button.md
View File

@ -22,47 +22,6 @@
}
}
</script>
<style>
.demo-box.demo-button {
.el-row {
margin-bottom: 10px;
}
.el-button + .el-button {
margin-left: 10px;
}
.el-button-group {
margin-bottom: 20px;
.el-button + .el-button {
margin-left: 0;
}
}
}
.demo-box.demo-button .intro-block {
padding: 0;
}
.demo-button .intro-block .block {
padding: 30px 24px;
overflow: hidden;
border-bottom: solid 1px #EFF2F6;
&:last-child {
border-bottom: none;
}
}
.demo-button .intro-block .demonstration {
font-size: 14px;
color: #8492a6;
line-height: 44px;
}
.demo-button .intro-block .wrapper {
float: right;
margin-right: 20px;
}
</style>
## Button

12
examples/docs/en-US/checkbox.md
View File

@ -13,18 +13,6 @@
};
</script>
<style>
.demo-box.demo-checkbox {
.checkbox {
margin-right: 5px;
& + .checkbox {
margin-left: 10px;
}
}
}
</style>
## Checkbox
A group of options for multiple choices.

86
examples/docs/en-US/color.md
View File

@ -1,89 +1,3 @@
<style>
.demo-color-box {
border-radius: 4px;
padding: 20px;
height: 74px;
box-sizing: border-box;
color: #fff;
font-size: 14px;
& .value {
font-size: 12px;
opacity: 0.69;
line-height: 24px;
}
}
.demo-color-box-group {
.demo-color-box {
border-radius: 0;
}
.demo-color-box:first-child {
border-radius: 4px 4px 0 0;
}
.demo-color-box:last-child {
border-radius: 0 0 4px 4px;
}
}
.bg-blue-light {
background-color: #58b7ff;
}
.bg-blue,
.bg-info {
background-color: #20a0ff;
}
.bg-blue-dark {
background-color: #1d8ce0;
}
.bg-success {
background-color: #13CE66;
}
.bg-warning {
background-color: #f7ba2a;
}
.bg-danger {
background-color: #ff4949;
}
.bg-black {
background-color: #1f2d3d;
}
.bg-black-light {
background-color: #324057;
}
.bg-black-lighter {
background-color: #475669;
}
.bg-silver {
background-color: #8492a6;
}
.bg-silver-light {
background-color: #99a9bf;
}
.bg-silver-lighter {
background-color: #c0ccda;
}
.bg-gray {
background-color: #d3dce6;
}
.bg-gray-light {
background-color: #e5e9f2;
}
.bg-gray-lighter {
background-color: #eff2f7;
}
.bg-white-dark {
background-color: #f9fafc;
}
.color-gray {
color: #5e6d82;
}
</style>
## Color
Element uses a specific set of palettes to specify colors to provide a consistent look and feel for the products you build.

24
examples/docs/en-US/date-picker.md
View File

@ -63,30 +63,6 @@
};
</script>
<style>
.demo-block.demo-date-picker .source {
padding: 0;
display: flex;
}
.demo-date-picker .block {
padding: 30px 0;
text-align: center;
border-right: solid 1px #EFF2F6;
flex: 1;
&:last-child {
border-right: none;
}
}
.demo-date-picker .demonstration {
display: block;
color: #8492a6;
font-size: 14px;
margin-bottom: 20px;
}
</style>
## DatePicker
Use Date Picker for date input.

24
examples/docs/en-US/datetime-picker.md
View File

@ -72,30 +72,6 @@
};
</script>
<style>
.demo-block.demo-datetime-picker .source {
padding: 0;
display: flex;
}
.demo-datetime-picker .block {
padding: 30px 0;
text-align: center;
border-right: solid 1px #EFF2F6;
flex: 1;
&:last-child {
border-right: none;
}
}
.demo-datetime-picker .demonstration {
display: block;
color: #8492a6;
font-size: 14px;
margin-bottom: 20px;
}
</style>
## DateTimePicker
Select date and time in one picker.

21
examples/docs/en-US/dialog.md
View File

@ -36,7 +36,7 @@
resource: '',
desc: ''
},
formLabelWidth: '80px'
formLabelWidth: '120px'
};
},
methods: {
@ -47,25 +47,6 @@
};
</script>
<style>
.demo-box.demo-dialog {
.dialog-footer button:first-child {
margin-right: 10px;
}
.full-image {
width: 100%;
}
.el-dialog__wrapper {
margin: 0;
}
.el-select {
width: 300px;
}
.el-input {
width: 300px;
}
}
</style>
## Dialog
Informs users while preserving the current page state.

40
examples/docs/en-US/dropdown.md
View File

@ -1,43 +1,3 @@
<style>
.demo-box {
.el-dropdown {
vertical-align: top;
& + .el-dropdown {
margin-left: 15px;
}
}
.el-dropdown-link {
cursor: pointer;
color: #20a0ff;
}
.el-icon-caret-bottom {
font-size: 12px;
}
}
.block-col-2 {
margin: -24px;
.el-col {
padding: 30px 0;
text-align: center;
border-right: 1px solid #eff2f6;
&:last-child {
border-right: 0;
}
}
}
.demo-dropdown .demonstration {
display: block;
color: #8492a6;
font-size: 14px;
margin-bottom: 20px;
}
</style>
<script>
export default {
methods: {

2
examples/docs/en-US/form.md
View File

@ -200,7 +200,7 @@
</script>
<style>
.demo-form {
.demo-form.demo-en-US {
.el-select .el-input {
width: 360px;
}

55
examples/docs/en-US/icon.md
View File

@ -9,61 +9,6 @@
}
}
</script>
<style>
.demo-icon .source > i {
font-size: 24px;
color: #8492a6;
margin: 0 20px;
font-size: 1.5em;
vertical-align: middle;
}
.demo-icon .source > button {
margin: 0 20px;
}
.icon-list {
overflow: hidden;
list-style: none;
padding: 0;
border: solid 1px #eaeefb;
border-radius: 4px;
}
.icon-list li {
float: left;
width: 16.66%;
text-align: center;
height: 120px;
line-height: 120px;
color: #666;
font-size: 13px;
transition: color .15s linear;
border-right: 1px solid #eee;
border-bottom: 1px solid #eee;
margin-right: -1px;
margin-bottom: -1px;
@utils-vertical-center;
& span {
display: inline-block;
line-height: normal;
vertical-align: middle;
font-family: 'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',SimSun,sans-serif;
color: #99a9bf;
}
& i {
display: block;
font-size: 24px;
margin-bottom: 15px;
color: #8492a6;
}
&:hover {
color: rgb(92, 182, 255);
}
}
</style>
## Icon

8
examples/docs/en-US/input-number.md
View File

@ -14,13 +14,7 @@
}
};
</script>
<style>
.demo-box.demo-input-number {
.el-input-number + .el-input-number {
margin-left: 10px;
}
}
</style>
## InputNumber
Input numerical values with a customizable range.

31
examples/docs/en-US/layout.md
View File

@ -1,34 +1,3 @@
<style>
.demo-layout {
.el-row {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
}
}
.el-col {
border-radius: 4px;
}
.bg-purple-dark {
background: #99a9bf;
}
.bg-purple {
background: #d3dce6;
}
.bg-purple-light {
background: #e5e9f2;
}
.grid-content {
border-radius: 4px;
min-height: 36px;
}
.row-bg {
padding: 10px 0;
background-color: #f9fafc;
}
}
</style>
## Layout
Quickly and easily create layouts with the basic 24-column.

6
examples/docs/en-US/loading.md
View File

@ -1,9 +1,3 @@
<style>
.demo-loading .el-table {
border: none;
}
</style>
<script>
export default {
data() {

30
examples/docs/en-US/menu.md
View File

@ -1,33 +1,3 @@
<style>
.demo-box.demo-menu {
.el-menu-demo {
padding-left: 55px;
}
.el-menu-vertical-demo {
width: 200px;
min-height: 400px;
}
.line {
height: 1px;
background-color: #e0e6ed;
margin: 35px -24px;
}
h5 {
font-size: 14px;
color: #8492a6;
margin-top: 10px;
}
.tac {
text-align: center;
.el-menu-vertical-demo {
display: inline-block;
text-align: left;
}
}
}
</style>
<script>
export default {
methods: {

8
examples/docs/en-US/message.md
View File

@ -57,14 +57,6 @@
};
</script>
<style>
.demo-box.demo-message {
.el-button + .el-button {
margin-left: 10px;
}
}
</style>
## Message
Used to show feedback after an activity. The difference with Notification is that the latter is often used to show a system level passive notification.

8
examples/docs/en-US/notification.md
View File

@ -53,14 +53,6 @@
};
</script>
<style>
.demo-box.demo-notification {
.el-button + .el-button {
margin-left: 10px;
}
}
</style>
## Notification
Displays a global notification message at the upper right corner of the page.

50
examples/docs/en-US/pagination.md
View File

@ -128,56 +128,6 @@ Add more modules based on your scenario.
}
}
</script>
<style>
.demo-pagination .source.first {
padding: 0;
}
.demo-pagination .first .block {
padding: 30px 0;
text-align: center;
border-right: solid 1px #EFF2F6;
float: left;
width: 50%;
box-sizing: border-box;
&:last-child {
border-right: none;
}
}
.demo-pagination .first .demonstration {
display: block;
color: #8492a6;
font-size: 14px;
margin-bottom: 20px;
}
.demo-pagination .source.last {
padding: 0;
}
.demo-pagination .last .block {
padding: 30px 24px;
border-bottom: solid 1px #EFF2F6;
&:last-child {
border-bottom: none;
}
}
.demo-pagination .last .demonstration {
font-size: 14px;
color: #8492a6;
line-height: 44px;
}
.demo-pagination .last .demonstration + .el-pagination {
float: right;
width: 70%;
margin: 5px 20px 0 0;
}
</style>
### Attributes
| Attribute | Description | Type | Accepted Values | Default |

14
examples/docs/en-US/popover.md
View File

@ -99,20 +99,6 @@
};
</script>
<style>
.demo-box.demo-popover {
.el-popover + .el-popover {
margin-left: 10px;
}
.el-input {
width: 360px;
}
.el-button {
margin-left: 10px;
}
}
</style>
## Popover
### Basic usage

8
examples/docs/en-US/time-picker.md
View File

@ -1,11 +1,3 @@
<style>
.demo-box {
.el-date-editor + .el-date-editor {
margin-left: 10px;
}
}
</style>
## TimePicker
Use Time Picker for time input.

2
examples/docs/zh-CN/form.md
View File

@ -200,7 +200,7 @@
</script>
<style>
.demo-form {
.demo-form.demo-zh-CN {
.el-select .el-input {
width: 360px;
}

8
examples/docs/zh-CN/message.md
View File

@ -57,14 +57,6 @@
};
</script>
<style>
.demo-box.demo-message {
.el-button + .el-button {
margin-left: 10px;
}
}
</style>
## Message 消息提示
常用于主动操作后的反馈提示。与 Notification 的区别是后者更多用于系统级通知的被动提醒。

8
examples/docs/zh-CN/notification.md
View File

@ -53,14 +53,6 @@
};
</script>
<style>
.demo-box.demo-notification {
.el-button + .el-button {
margin-left: 10px;
}
}
</style>
## Notification 通知
悬浮出现在页面右上角，显示全局的通知提醒消息。