diff --git a/client/default.css b/client/default.css
index d79886d..8d3a41a 100644
--- a/client/default.css
+++ b/client/default.css
@@ -164,7 +164,6 @@ canvas.mousemoving {
transition: var(--transform-amimate);
transform: translateX(calc(-100% + 2 * var(--gap) + 24px));
cursor: pointer;
- overflow: hidden;
}
.pallete .color-major.extended {
diff --git a/client/index.html b/client/index.html
index 9e3c3b5..a6f646f 100644
--- a/client/index.html
+++ b/client/index.html
@@ -7,22 +7,22 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/client/tools.js b/client/tools.js
index ddaf2ff..d3e94ae 100644
--- a/client/tools.js
+++ b/client/tools.js
@@ -115,6 +115,29 @@ function init_tools(state) {
tools.forEach((item) => { item.addEventListener('click', () => switch_tool(state, item)); });
color_groups.forEach((item) => {
item.setAttribute('data-last-color', item.lastElementChild.getAttribute('data-color'));
+
+ let longtouch_timer = null;
+
+ item.addEventListener('touchstart', (e) => {
+ longtouch_timer = setTimeout(() => {
+ extend_major_color(state, item);
+ }, 500);
+ });
+
+ item.addEventListener('touchmove', (e) => {
+ if (longtouch_timer) {
+ clearTimeout(longtouch_timer);
+ }
+ longtouch_timer = null;
+ });
+
+ item.addEventListener('touchend', (e) => {
+ if (longtouch_timer) {
+ clearTimeout(longtouch_timer);
+ }
+ longtouch_timer = null;
+ });
+
item.addEventListener('click', (e) => {
if (e.ctrlKey) {
extend_major_color(state, item);