From 00c74e4bfc11f84a8a618ec670b1533d9dc0ef39 Mon Sep 17 00:00:00 2001
From: yumoqing <yumoqing@gmail.com>
Date: Sun, 28 Sep 2025 12:19:23 +0800
Subject: [PATCH] bugfix

---
 bricks/css/bricks.css | 10 ++++++++++
 bricks/input.js       |  9 +++++----
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/bricks/css/bricks.css b/bricks/css/bricks.css
index ce213e9..304a405 100755
--- a/bricks/css/bricks.css
+++ b/bricks/css/bricks.css
@@ -595,3 +595,13 @@ hr {
 .resp-content {
 	background-color: #f0eed8;
 }
+.droparea {
+	border: 2px dashed #666;
+	border-radius: 10px;
+	color: #666;
+}
+.droparea:hover {
+	border-color: #00aaff;
+	color: #00aaff;
+	background: #f0faff;
+}
diff --git a/bricks/input.js b/bricks/input.js
index 749b168..9f43037 100644
--- a/bricks/input.js
+++ b/bricks/input.js
@@ -495,6 +495,7 @@ bricks.UiImage =class extends bricks.VBox {
 				url:bricks_resource('imgs/camera.svg'),
 				tip:'use cemera to take a picture',
 				rate:2});
+		this.set_css('droparea');
 		this.add_widget(this.camera_w);
 		this.camera_w.bind('click', this.take_photo.bind(this));
 		this.bind('dragover', (event) => {
@@ -504,10 +505,10 @@ bricks.UiImage =class extends bricks.VBox {
       		this.bind(eventName, (e) => e.preventDefault(), false);
 		});
 		this.bind('dragenter', () => {
-			this.css('hover');
+			this.set_css('hover');
 		});
 		this.bind('dragleave', () => {
-			this.css('hover', true);
+			this.set_css('hover', true);
 		});
 		this.bind('drop', this.dropHandle.bind(this));
 		this.input = document.createElement('input');
@@ -547,8 +548,8 @@ bricks.UiImage =class extends bricks.VBox {
 		this.show_image(file);
 	}
 	dropHandle(event){
-		e.preventDefault();
-		this.css('hover', true);
+		event.preventDefault();
+		this.set_css('hover', true);
 		const file = e.dataTransfer.files[0];
 		this.show_image(file);