Octavia/odin-etch-a-sketch
Watch
1
0
Fork
You've already forked odin-etch-a-sketch
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make canvas responsive

Browse source
This commit is contained in:
lolabird 2023-11-12 00:22:14 -07:00
commit 51a8a79dff
1 changed files with 5 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

8
style.css
View file

@ -45,6 +45,7 @@ footer {
.pen-input, .grid-input { .pen-input, .grid-input {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between;
margin: 20px; margin: 20px;
} }
@ -67,6 +68,7 @@ footer {
.col-picker, .background-col-picker { .col-picker, .background-col-picker {
margin: 5px; margin: 5px;
width: 100px; width: 100px;
padding: 0 10px;
} }
.color-label { .color-label {
@ -75,7 +77,7 @@ footer {
} }
.color-input { .color-input {
width: 120% width: 120%;
} }
button { button {
@ -87,8 +89,8 @@ button {
.container{ .container{
border: 1px solid #bbb; border: 1px solid #bbb;
height: 500px; max-width: 500px;
width: 500px; aspect-ratio: 1/1;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
background: rgb(180, 254, 235); background: rgb(180, 254, 235);