logan/ThePlaceHolders
1
0
Fork 0
mirror of https://github.com/adanrsantos/ThePlaceHolders.git synced 2024-12-16 05:50:39 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

Tweaked canvas css and html.

Browse source
This commit is contained in:
reddishquill371 2024-11-06 18:15:24 -06:00
parent cb296a5fe4
commit 5966c70b1a
2 changed files with 16 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
static/canvas.css
View file

@ -1,3 +1,8 @@
:root {
--utsa-orange: #f15a22;
--utsa-blue: #0c2340;
}
* {
padding: 0;
margin: 0;
@ -12,10 +17,11 @@ html, body {
flex-direction: column;
justify-content: center;
align-items: center;
background-color: var(--utsa-orange);
}
.navbarCont {
background-color: grey;
background-color: var(--utsa-blue);
width: 100%;
text-align: center;
margin-bottom: 10px;
@ -36,9 +42,9 @@ html, body {
justify-content: space-around;
align-items: center;
border-top: solid black 1px;
background-color: var(--utsa-blue);
width: 100%;
height: 60px;
z-index: 10;
height:auto;
}
.toolbarItems {
@ -46,7 +52,7 @@ html, body {
flex-direction: column;
justify-content: center;
font-weight: 900;
color: blue;
color: white;
text-align: center;
height: 100%;
width: 100px;
@ -64,7 +70,7 @@ html, body {
canvas {
background-color: lightblue;
background-color: white;
margin: 20px;
image-rendering: pixelated;
}

10
static/canvas.html
View file

@ -13,12 +13,12 @@
<body>
<div class="wrapper">
<div class="navbarCont">
<h1>ThePlaceHolders</h1>
<h1 style="color: white;">ThePlaceHolders</h1>
</div>
<!--note to self: below IS the canvas-->
<div class="canvasCont">
<canvas id="canvas" width="500" height="500" style="border:1px solid #000000;" alt="canvas"></canvas>
<div id="toolbar" class="toolbar">
<!--<div class="canvasCont">-->
<canvas id="canvas" width="1000" height="500" style="border:1px solid #000000;" alt="canvas"></canvas>
<div id="toolbar" class="d-flex align-items-center toolbar">
<div class="toolbarItems">
<button id="zoomOut">-</button>
</div>
@ -30,7 +30,7 @@
<button onclick="zoomIn"id="zoomIn">+</button>
</div>
</div>
</div>
<!--</div>-->
<!--note to self: above IS the canvas-->
</div>
<script src="./canvas.js"></script>