diff options
Diffstat (limited to 'treegenerator.html')
| -rw-r--r-- | treegenerator.html | 36 |
1 files changed, 26 insertions, 10 deletions
diff --git a/treegenerator.html b/treegenerator.html index f1a58dd..b627a42 100644 --- a/treegenerator.html +++ b/treegenerator.html @@ -4,22 +4,38 @@ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <link rel="stylesheet" href="css/style.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> + <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/p5.js"></script> </head> <body> <div id="navbar"></div> <script src="navbar.js"></script> + <h2>Tree Generator</h2> - Angle: - <input type="number" id="angle" step="0.01" value="1"> - <br> - Angle decay: - <input type="number" id="angledecay" step="0.01" value="0.1"> - <br> - Size: - <input type="number" id="size" min="0" max="700" value="400"><br> - <button onclick="saveTree();">Save image</button><br><br> - <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/p5.js"></script> + <div class="container-fluid"> + <div class="row"> + <div class="input-group input-group-md col-lg-3 col-md-6 col-sm-8 col-xs-10 with-margin"> + <span class="input-group-addon">Angle</span> + <input id="angle" class="form-control" type="number" step="0.01" value="1"> + </div> + </div> + + <div class="row"> + <div class="input-group input-group-md col-lg-3 col-md-6 col-sm-8 col-xs-10 with-margin"> + <span class="input-group-addon">Angle decay</span> + <input id="angledecay" class="form-control" type="number" step="0.01" value="0.1"> + </div> + </div> + + <div class="row"> + <div class="input-group input-group-md col-lg-3 col-md-6 col-sm-8 col-xs-10 with-margin"> + <span class="input-group-addon">Size</span> + <input id="size" class="form-control" type="number" step="20" value="400"> + </div> + </div> + </div> + <button class="btn btn-sm btn-primary" onclick="saveTree();">Save image</button><br> + <script src="js/treegenerator.js"></script> </body> </html> |