ADD: initialize paper and simple shape drag

2025-10-29 20:47:52 +01:00
parent 49d2862329
commit 53b928827c
2 changed files with 209 additions and 1 deletions
--- a/style.css
+++ b/style.css
@@ -0,0 +1,64 @@
+ .shape-wrapper {
+     display: grid;
+     grid-template-columns: repeat(2, 1fr);
+     grid-template-rows: repeat(2, auto);
+     gap: 30px 10px;
+     padding-bottom: 40px;
+ }
+
+ #shape-rectangle {
+     width: 80px;
+     height: 48px;
+ }
+
+ #shape-ellipse {
+     width: 80px;
+     height: 48px;
+     border-radius: 50%;
+ }
+
+ #shape-diamond {
+     height: 48px;
+     width: 48px;
+     transform: rotate(45deg) translateX(15px);
+ }
+
+ #shape-text {
+     width: 80px;
+     height: 48px;
+     border-style: dashed;
+     color: #ffffff;
+     font-size: 14px;
+     display: flex;
+     align-items: center;
+     justify-content: center;
+ }
+
+ .shape {
+     background: transparent;
+     border: 1px solid white;
+ }
+
+ .toolbar {
+     background: #3498db;
+     color: white;
+     padding: 20px;
+     display: flex;
+     flex-wrap: wrap;
+     flex-direction: column;
+     gap: 10px;
+     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+     position: absolute;
+     width: 300px;
+     left: 0px;
+     top: 0px;
+     height: 100vh;
+     z-index: 9;
+     border-top-right-radius: 30px;
+     border-bottom-right-radius: 30px;
+ }
+
+ .toolbar-wrapper {
+     padding-bottom: 30px;
+     padding: 20px;
+ }