jslightham/Collision-Simulator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

made responsive for tablets

Browse Source
This commit is contained in:
jslightham
2020-05-26 23:34:01 -04:00
parent f80c989af8
commit 89d4b200a0
3 changed files with 14 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
index.html
View File

@@ -44,18 +44,18 @@
<h1>Collision Simulator</h1>
<h4>Project by Johnathon Slightham</h4>
<div class="container-fluid">
<div class="container-fixed">
<div class="row justify-content-start">
<div class="col-xl-6 col-md-4 col-sm-4" id="quote-2-high">
<div class="card bg-light" style="min-width: 790px;">
<div class=" col-sm-12 col-md-12 col-lg-10 col-xl-8" id="quote-2-high">
<div class="card bg-light" >
<h4 class="card-header">Simulation</h4>
<p class="card-text"><center><canvas id="myCanvas" width="750" height="750" style="border: solid 2px black;">Your browser does not support HTML 5</canvas> </center></p>
</div>
</div>
<div class="col-lg-3 col-md-8 col-sm-8">
<div class="col-lg-3 col-md-4 col-sm-4 fix">
<div class="row justify-content-start" id="top-row">
<div class="col mb-10">
<div class="card bg-light">
<div class="col mb-3 fix">
<div class="card bg-light fix">
<h4 class="card-header mb-3">Modifiers</h4>
<p class="card-text">Coefficient of Kinetic Friction: <input type="number" value="0.00005" step="0.000001" id="fr" onchange="frChange()" class="numinput" style="width: 100px;"> <br>
<!-- Coefficient of Static Friction: <input type="number" value="0.005" step="0.000001" id="sfr" onchange="sfrChange()" class="numinput"> <br> /!-->

2
main.js
View File

@@ -74,7 +74,7 @@ function main(elem){
//canvas.addEventListener("onmouseup", doMouseUp, false);
// Loop through each particle every 10 milliseconds, create measurements every 1 second
setInterval(loop, 10);
setInterval(loop, 20);
setInterval(measureData, 1000);
}

7
style.css
View File

@@ -74,3 +74,10 @@ ul {
text-align: center;
list-style-position: inside;
}
@media screen and (max-width: 1873px) {
.fix{
margin-top: 10px;
min-width: 75%;
}
}