[WGL/P] Styling and wording changes

2 files changed, 18 insertions, 9 deletions

diff --git a/Year 2/Computer Graphics with WebGL/Project/Project.html b/Year 2/Computer Graphics with WebGL/Project/Project.html
index 02a2818..970e805 100644
--- a/Year 2/Computer Graphics with WebGL/Project/Project.html
+++ b/Year 2/Computer Graphics with WebGL/Project/Project.html
@@ -24,6 +24,11 @@ canvas {
 	/* cursor: none; */

 }

 

+.indent {

+	padding-left: 1em;

+	box-sizing: border-box;

+	margin: 0;

+}

 .hide {

 	display: none;

 }

@@ -177,22 +182,26 @@ body > div {
 				Escape will remove your controls and bring you back here.

 			</p>

 			<h2>Level</h2>

-			<p>

+			<div>

 				<select id="level-select"></select>

 				<p id="level-description"></p>

 				<p>

-					Pause movement: <input type="checkbox" id="pause-movement">

+					Pause animation: <input type="checkbox" id="pause-movement">

 				</p>

-			</p>

+			</div>

 			<h2>Settings</h2>

-			<p>

-				Debugging colors: <input type="checkbox" id="debug-mode"><br>

-				Toggle coordinates: <input type="checkbox" id="coordinates-cb"><br>

-				Toggle fps: <input type="checkbox" id="fps-cb"><br>

+			<div>

+				Show (ray marching) debugging colors: <input type="checkbox" id="debug-mode"><br>

+				<p class="indent">

+				Works only with enabled ray marching.

+				Green for the center of the black hole (past event horizon), red for ray didn't hit anything.

+				</p><br>

+				Show coordinates: <input type="checkbox" id="coordinates-cb"><br>

+				Show fps: <input type="checkbox" id="fps-cb"><br>

 				Disable ray marching: <input type="checkbox" id="disable-ray-marching"><br>

 				Only horizontal mouse movement: <input type="checkbox" id="only-horizontal"><br>

 				Only vertical mouse movement: <input type="checkbox" id="only-vertical">

-			</p>

+			</div>

 		</div>

 	</div>

 	<div id="coordinates"></div>

diff --git a/Year 2/Computer Graphics with WebGL/Project/level.js b/Year 2/Computer Graphics with WebGL/Project/level.js
index 24944ad..5a5a22a 100644
--- a/Year 2/Computer Graphics with WebGL/Project/level.js
+++ b/Year 2/Computer Graphics with WebGL/Project/level.js
@@ -57,7 +57,7 @@ function createLevels() {
 
 	var l2 = new Level(
 		"Star gets closer to event horizon",
-		"As the star passes by behind the black hole, we can see it approaching the event horizon, however, it will never truly reach it and dissapear (at least until it's width becomes smaller than a pixel).",
+		"As the star passes by behind the black hole, we can see it approaching the event horizon, however, it will never pass it and continue becoming thinner and taller (at least until we can calculate and show it).",
 		[1014,0,892]);
 	l2.addStar([1070,0,1000], 10, (t, star) => vecSum(star.center, [-t,0,0]));
 	l2.addBlackHole([1000,0,900], 30, undefined);