样式+拖拽逻辑修改
This commit is contained in:
@@ -236,7 +236,9 @@ export class DraggableResizableWindow {
|
|||||||
|
|
||||||
private onMouseDownDrag = (e: MouseEvent) => {
|
private onMouseDownDrag = (e: MouseEvent) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
if (e.target !== this.handle) return;
|
if (!this.handle?.contains(e.target as Node)) return;
|
||||||
|
const target = e.target as HTMLElement;
|
||||||
|
if (target.classList.contains('btn')) return;
|
||||||
if (this.getResizeDirection(e)) return;
|
if (this.getResizeDirection(e)) return;
|
||||||
|
|
||||||
this.startX = e.clientX;
|
this.startX = e.clientX;
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
/* 窗体容器 */
|
/* 窗体容器 */
|
||||||
.window {
|
.window {
|
||||||
width: 400px;
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
border: 1px solid #666;
|
border: 1px solid #666;
|
||||||
box-shadow: 0 0 10px rgba(0,0,0,0.5);
|
box-shadow: 0 0 10px rgba(0,0,0,0.5);
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
@@ -10,12 +11,21 @@
|
|||||||
|
|
||||||
/* 标题栏 */
|
/* 标题栏 */
|
||||||
.title-bar {
|
.title-bar {
|
||||||
color: white;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
display: block;
|
||||||
|
padding: 0 5px;
|
||||||
|
flex-grow: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
.window-controls {
|
.window-controls {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 2px;
|
gap: 2px;
|
||||||
|
|||||||
Reference in New Issue
Block a user