UNPKG

antd-mobile

Version:
67 lines (66 loc) 1.47 kB
.adm-floating-panel { --border-radius: 8px; --header-height: 28px; --z-index: var(--adm-floating-panel-z-index, 900); position: fixed; z-index: var(--z-index); left: 0; width: 100vw; display: flex; flex-direction: column; touch-action: none; } .adm-floating-panel-mask { display: block; width: 100%; height: 100vh; position: absolute; left: 0; top: -100vh; background: transparent; } .adm-floating-panel::after { content: ''; display: block; position: absolute; height: 100vh; width: 100vw; background: var(--adm-color-background); } .adm-floating-panel .adm-floating-panel-header { flex: none; height: var(--header-height); display: flex; justify-content: center; align-items: center; cursor: -webkit-grab; cursor: grab; -webkit-user-select: none; user-select: none; background-color: var(--adm-color-background); border-top-left-radius: var(--border-radius); border-top-right-radius: var(--border-radius); } .adm-floating-panel .adm-floating-panel-header .adm-floating-panel-bar { height: 3px; width: 20px; border-radius: 10px; background: var(--adm-color-light); } .adm-floating-panel .adm-floating-panel-content { flex: 1; overflow-y: scroll; background: var(--adm-color-background); } .adm-floating-panel-top { top: 0; } .adm-floating-panel-top::after { top: -100vh; } .adm-floating-panel-bottom { bottom: 0; } .adm-floating-panel-bottom::after { bottom: -100vh; }