1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859 |
- @import "../styles/mixins/index.less";
- @import "../styles/themes/index.less";
- .@{wux-prefix}-floating-panel {
- position: fixed;
- z-index: @z-index-floating-panel;
- bottom: 0;
- left: 0;
- width: 100vw;
- display: flex;
- flex-direction: column;
- touch-action: none;
- &::after {
- content: "";
- display: block;
- position: absolute;
- bottom: -100vh;
- height: 100vh;
- width: 100vw;
- background: @floating-panel-bg;
- }
- &__hd {
- flex: none;
- height: @floating-panel-hd-size;
- display: flex;
- justify-content: center;
- align-items: center;
- cursor: grab;
- user-select: none;
- background-color: @floating-panel-bg;
- border-top-left-radius: @floating-panel-hd-radius;
- border-top-right-radius: @floating-panel-hd-radius;
- }
- &__bar {
- height: 3px;
- width: 20px;
- border-radius: 10px;
- background: @floating-panel-bar-bg;
- }
- &__bd {
- flex: 1 1;
- overflow-y: scroll;
- background: @floating-panel-bg;
- }
- &__mask {
- display: block;
- width: 100%;
- height: 100vh;
- position: absolute;
- left: 0;
- top: -100vh;
- background: 0 0;
- }
- }
|