| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374 |
- .app-drawer {
- --el-mask-color: rgba(0, 0, 0, .25);
- &__wrapper {
- display: flex;
- flex-direction: column;
- max-height: 100vh;
- min-width: 360px;
- color: #fff;
- border-radius: 4px;
- background: linear-gradient(#084258 0, #102e45 38px, #102e45 100%);
- box-shadow: 0 0 20px 0 rgba(0, 0, 0, .15);
- overflow: hidden;
- }
- &__header {
- position: relative;
- height: 38px;
- line-height: 38px;
- text-align: center;
- h1 {
- font-size: 16px;
- }
- .el-icon {
- position: absolute;
- top: 50%;
- right: 24px;
- transform: translate3d(0, -50%, 0);
- font-size: 16px;
- cursor: pointer;
- }
- }
- &__body {
- flex: 1;
- line-height: normal;
- background-color: #0f1a25;
- padding: 24px;
- padding-bottom: 0;
- &:last-child {
- padding-bottom: 24px;
- }
- }
- &__footer {
- text-align: center;
- background-color: #0f1a25;
- padding: 24px;
- }
- &.border &__wrapper {
- padding: 8px;
- padding-top: 0;
- }
- &.border &__header {
- .el-icon {
- left: 10px;
- right: auto;
- }
- }
- &.border &__body {
- padding: 20px;
- }
- &.border &__footer {
- padding: 20px;
- padding-top: 0;
- }
- }
|