From 7ec4ef0df06446e229f76ad08090f28ee4a56ed6 Mon Sep 17 00:00:00 2001 From: Florent Chehab Date: Sat, 2 May 2020 15:07:34 +0200 Subject: [PATCH] feat(frontend): cleaned read-only & style * cleaned unsued css classes * Reorganized buttons based on if they are edit related or not * meaningful css when locking for better ui experience * renamed viewOnly to more standard readOnly --- src/css/main.css | 24 +++++++++++-- src/index.html | 83 ++++++++++++++++++++++---------------------- src/js/main.js | 52 +++++++++++++-------------- src/js/whiteboard.js | 42 ++++++++++++---------- 4 files changed, 113 insertions(+), 88 deletions(-) diff --git a/src/css/main.css b/src/css/main.css index f9493fd..9ea45c6 100644 --- a/src/css/main.css +++ b/src/css/main.css @@ -33,6 +33,24 @@ button::-moz-focus-inner { border: 0; } +.whiteboard-edit-group.group-disabled { + background: repeating-linear-gradient( + 45deg, + rgba(255, 166, 0, 0.366) , + rgba(255, 166, 0, 0.366) 10px, + rgba(255, 166, 0, 0.666) 10px, + rgba(255, 166, 0, 0.666) 20px + ); + +} + +/* + * Deactivate all pointer events on all the children + * of a group when it's disabled. + */ +.whiteboard-edit-group.group-disabled > * { + pointer-events: none; +} /* Clear floats (clearfix hack) */ @@ -60,8 +78,8 @@ button { position: relative; } -.whiteboardTool.active { - background: #bfbfbf; +.whiteboard-tool.active:not(:disabled) { + background: #dfdfdf; } #whiteboardThicknessSlider { @@ -94,4 +112,4 @@ button { border: 0px; min-width: 50px; cursor: pointer; -} \ No newline at end of file +} diff --git a/src/index.html b/src/index.html index 5ee8c33..5c6031f 100644 --- a/src/index.html +++ b/src/index.html @@ -14,57 +14,60 @@
- + +
+ +
+ - -
-
- - - - - - - -
-
+
+
+ + + + + +
+
- - -
- -
- - - -