diff --git a/drawing-app/index.html b/drawing-app/index.html index e05034e..0881c30 100644 --- a/drawing-app/index.html +++ b/drawing-app/index.html @@ -11,7 +11,7 @@
- 30 + 25 diff --git a/drawing-app/script.js b/drawing-app/script.js index 3b5103b..ecb3709 100644 --- a/drawing-app/script.js +++ b/drawing-app/script.js @@ -10,7 +10,7 @@ const colorElement = document.getElementById('color') const clearBtn = document.getElementById('clear') -let size = 20; +let size = 25; let isCurrentlyPressed = false; let color = 'black'; let x = undefined; @@ -82,7 +82,7 @@ function drawLine(x1, y1, x2, y2) { ctx.moveTo(x1, y1) ctx.lineTo(x2, y2) ctx.strokeStyle = color; - ctx.lineWidth = size; + ctx.lineWidth = size * 2; ctx.stroke() } diff --git a/drawing-app/style.css b/drawing-app/style.css index c2b15c9..dd7f6cb 100644 --- a/drawing-app/style.css +++ b/drawing-app/style.css @@ -5,7 +5,7 @@ } body { - background-color: #ecd1d1; + background-color: #f5f5f5; font-family: "Poppins", sans-serif; margin: 0; display: flex; @@ -18,14 +18,14 @@ body { canvas { width: 800px; height: 800px; - border: 7px solid pink; + border: 7px solid #ecd1d1; background-color: #f5f5f5; } .toolbox { padding: 1rem; width: 800px; - background-color: whitesmoke; + background-color: #ecd1d1; display: flex; } @@ -40,6 +40,7 @@ canvas { display: inline-flex; align-items: center; justify-content: center; + color: white } .toolbox > *:last-child {