Skip to content

Commit cc1adee

Browse files
committed
drawing app complete
1 parent 6b47d3c commit cc1adee

File tree

3 files changed

+7
-6
lines changed

3 files changed

+7
-6
lines changed

drawing-app/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
<canvas id="canvas" width='800px' height='800px'></canvas>
1212
<div class='toolbox'>
1313
<button id='increase'>+</button>
14-
<span id='size'>30</span>
14+
<span id='size'>25</span>
1515
<button id='decrease'>-</button>
1616
<input type='color' id='color' />
1717
<button id='clear'>🧼</button>

drawing-app/script.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ const colorElement = document.getElementById('color')
1010
const clearBtn = document.getElementById('clear')
1111

1212

13-
let size = 20;
13+
let size = 25;
1414
let isCurrentlyPressed = false;
1515
let color = 'black';
1616
let x = undefined;
@@ -82,7 +82,7 @@ function drawLine(x1, y1, x2, y2) {
8282
ctx.moveTo(x1, y1)
8383
ctx.lineTo(x2, y2)
8484
ctx.strokeStyle = color;
85-
ctx.lineWidth = size;
85+
ctx.lineWidth = size * 2;
8686
ctx.stroke()
8787
}
8888

drawing-app/style.css

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
}
66

77
body {
8-
background-color: #ecd1d1;
8+
background-color: #f5f5f5;
99
font-family: "Poppins", sans-serif;
1010
margin: 0;
1111
display: flex;
@@ -18,14 +18,14 @@ body {
1818
canvas {
1919
width: 800px;
2020
height: 800px;
21-
border: 7px solid pink;
21+
border: 7px solid #ecd1d1;
2222
background-color: #f5f5f5;
2323
}
2424

2525
.toolbox {
2626
padding: 1rem;
2727
width: 800px;
28-
background-color: whitesmoke;
28+
background-color: #ecd1d1;
2929
display: flex;
3030
}
3131

@@ -40,6 +40,7 @@ canvas {
4040
display: inline-flex;
4141
align-items: center;
4242
justify-content: center;
43+
color: white
4344
}
4445

4546
.toolbox > *:last-child {

0 commit comments

Comments
 (0)