element-plus/website/demo-styles/avatar.scss
kooriookami d9b7ef56ea
style(docs): Optimized style of documentation (#3010)
* style(docs): use css var

* style: update

* style: demo-icon use grid layout

* style: remove demo-block.vue style scoped

* docs: remove strange character
2021-08-26 09:57:56 +08:00

62 lines
1.0 KiB
SCSS

.demo-avatar {
&.demo-basic {
text-align: center;
.demo-basic--circle,
.demo-basic--square {
display: flex;
justify-content: space-between;
align-items: center;
.block {
flex: 1;
}
.block:not(:last-child) {
border-right: 1px solid var(--el-border-color-base);
}
}
}
.sub-title {
margin-bottom: 10px;
font-size: 14px;
color: var(--el-text-color-secondary);
}
.#{$namespace}-col:not(:last-child) {
border-right: 1px solid var(--el-border-color-base);
}
.demo-type {
display: flex;
> div {
flex: 1;
text-align: center;
}
> div:not(:last-child) {
border-right: 1px solid var(--el-border-color-base);
}
}
.demo-fit {
display: flex;
text-align: center;
justify-content: space-between;
.block {
flex: 1;
display: flex;
flex-direction: column;
flex-grow: 0;
}
.title {
margin-bottom: 10px;
font-size: 14px;
color: var(--el-text-color-secondary);
}
}
}