use ascii

This commit is contained in:
Adam Jeniski 2026-01-01 23:45:41 -05:00
parent cfbfb1e9b6
commit c9650744ed
2 changed files with 3 additions and 3 deletions

View File

@ -58,7 +58,7 @@ npm run preview
## Interface
The canvas displays an 8×8 grid where each cell is 40 pixels. Move your mouse over the grid to control point B and watch the rectangle areas update in real-time below the visualization.
The canvas displays an 8x8 grid where each cell is 40 pixels. Move your mouse over the grid to control point B and watch the rectangle areas update in real-time below the visualization.
The calculation cards show:
- Current position of point B

View File

@ -206,7 +206,7 @@
<p>Corner: ({blueRect.x1}, {blueRect.y1})</p>
<p>Width = |{blueRect.x1} - {userPoint.x.toFixed(2)}| = {blueWidth.toFixed(2)}</p>
<p>Height = |{blueRect.y1} - {userPoint.y.toFixed(2)}| = {blueHeight.toFixed(2)}</p>
<p class="area">Area = {blueWidth.toFixed(2)} × {blueHeight.toFixed(2)} = <strong>{blueArea.toFixed(2)}</strong></p>
<p class="area">Area = {blueWidth.toFixed(2)} x {blueHeight.toFixed(2)} = <strong>{blueArea.toFixed(2)}</strong></p>
</div>
<div class="rect-calc red" class:largest={redArea > blueArea}>
@ -214,7 +214,7 @@
<p>Corner: ({redRect.x1}, {redRect.y1})</p>
<p>Width = |{redRect.x1} - {userPoint.x.toFixed(2)}| = {redWidth.toFixed(2)}</p>
<p>Height = |{redRect.y1} - {userPoint.y.toFixed(2)}| = {redHeight.toFixed(2)}</p>
<p class="area">Area = {redWidth.toFixed(2)} × {redHeight.toFixed(2)} = <strong>{redArea.toFixed(2)}</strong></p>
<p class="area">Area = {redWidth.toFixed(2)} x {redHeight.toFixed(2)} = <strong>{redArea.toFixed(2)}</strong></p>
</div>
</div>
</main>