48 lines
1.1 KiB
Plaintext
48 lines
1.1 KiB
Plaintext
.resize-box {
|
|
position: relative;
|
|
width: 100%;
|
|
/* background: #fff; // 由外层控制 */
|
|
/* border-radius: 6px; // 由外层控制 */
|
|
/* border: 1px solid #eee; // 可选 */
|
|
will-change: height;
|
|
transform: translateZ(0);
|
|
-webkit-transform: translateZ(0);
|
|
overflow: hidden; /* 也可以加一层保险 */
|
|
}
|
|
|
|
.resize-box.resizing {
|
|
transition: none !important;
|
|
}
|
|
|
|
.resize-handle {
|
|
position: absolute;
|
|
bottom: -10px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
width: 60px;
|
|
height: 20px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: transparent;
|
|
z-index: 100;
|
|
touch-action: none;
|
|
}
|
|
|
|
.resize-line {
|
|
width: 20px;
|
|
height: 2px;
|
|
background: #D8D8D8;
|
|
border-radius: 1px;
|
|
position: relative;
|
|
}
|
|
|
|
.resize-dots {
|
|
position: absolute;
|
|
top: -4px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
width: 10px;
|
|
height: 10px;
|
|
background: radial-gradient(circle, #999 1px, transparent 1px) 0 0 / 3px 3px;
|
|
} |