66 lines
879 B
CSS
66 lines
879 B
CSS
body {
|
|
text-align: center;
|
|
}
|
|
|
|
#canvas {
|
|
border: solid black 2px;
|
|
border-radius: 10px;
|
|
background-color: wheat;
|
|
margin: 2em;
|
|
}
|
|
|
|
#toggleButtons {
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
#toggleButtons * {
|
|
padding: 0.2em 0.4em;
|
|
margin: 0em 0.2em;
|
|
border-radius: 10px;
|
|
color: white;
|
|
font-size: 2em;
|
|
}
|
|
|
|
#response {
|
|
font-size: 2em;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
#clear {
|
|
font-size: 1.4em;
|
|
padding: 0.5em 1em;
|
|
border-radius: 10px;
|
|
color: white;
|
|
background-color: #222222;
|
|
}
|
|
|
|
@media screen and (max-width: 600px) {
|
|
body {
|
|
margin: 0;
|
|
}
|
|
|
|
#canvas {
|
|
border: solid black 2px;
|
|
border-radius: 10px;
|
|
background-color: wheat;
|
|
margin: 1em 0;
|
|
width: 80%;
|
|
}
|
|
|
|
#toggleButtons {
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
#toggleButtons * {
|
|
font-size: 1em;
|
|
}
|
|
|
|
#response {
|
|
font-size: 1em;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
#clear{
|
|
font-size: 0.7em;
|
|
}
|
|
} |