@mdsfe/mds-ui
Version:
A set of enterprise-class Vue UI components.
59 lines (58 loc) • 1.39 kB
CSS
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
/* stylelint-disable declaration-bang-space-before */
/* stylelint-disable declaration-bang-space-before */
.code-box-demo > .mds-layout {
margin-bottom: 48px;
}
.mds-layout {
display: flex;
flex-direction: column;
flex: auto;
}
.mds-layout.mds-layout-has-sider {
flex-direction: row;
}
.mds-layout.mds-layout-has-sider > .mds-layout,
.mds-layout.mds-layout-has-sider > .mds-layout-content {
overflow-x: hidden;
}
.mds-layout-header,
.mds-layout-footer {
flex: 0 0 auto;
}
.mds-layout-content {
flex: auto;
}
.mds-layout-sider {
position: relative;
}
.mds-layout-sider-right {
order: 1;
}
.mds-layout-sider-trigger {
position: fixed;
}
.mds-layout-sider-zero-width > * {
overflow: hidden;
}
.mds-layout-sider-zero-width-trigger {
position: absolute;
top: 64px;
right: -36px;
text-align: center;
width: 36px;
height: 42px;
line-height: 42px;
background: #404040;
color: #fff;
font-size: 18px;
border-radius: 0 4px 4px 0;
cursor: pointer;
transition: background .3s ease;
}
.mds-layout-sider-zero-width-trigger:hover {
background: #535353;
}
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
/* stylelint-disable declaration-bang-space-before */
/* stylelint-disable declaration-bang-space-before */