Add an About section

marian42 · Apr 8, 2019 · 6516253 · 6516253
1 parent 0234546
commit 6516253
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 23 deletions.
diff --git a/app.css b/app.css
@@ -202,11 +202,11 @@ input[type=radio]:checked + label.radiolabel.z:hover, label.radiolabel.z:hover {
     display: table-cell;
     width: 100%;
     border-radius: 5px;
-    padding: 8px;
+    padding: 6px;
     border: 1px solid rgb(21, 98, 212);
-    background-color: rgb(21, 98, 212);
+    background-color:  rgb(219, 219, 219);
     transition: 0.1s;
-    color: white;
+    color: rgb(21, 98, 212);
 }
 
 .group select:hover, .group select:active {
@@ -263,4 +263,9 @@ input[type=radio]:checked + label.radiolabel.z:hover, label.radiolabel.z:hover {
     box-sizing: border-box;
     color: rgb(78, 78, 78);
     user-select: none;
+}
+
+.fineprint, .fineprint a, .fineprint a:visited {
+    font-size: 13px;
+    color: rgb(78, 78, 78);
 }
diff --git a/index.html b/index.html
@@ -4,6 +4,8 @@
 <head>
     <meta charset="utf-8" />
     <title>Part Designer</title>
+    <meta name="author" content="Marian Kleineberg">
+    <meta name="description" content="A free online CAD tool to create custom LEGO&reg; Technic compatible construction parts for 3D printing.">
     <link rel="stylesheet" href="app.css" type="text/css" />
     <link rel="icon" href="favicon.png" type="image/png" sizes="16x16"/>
 </head>
@@ -13,10 +15,18 @@
             <summary>Part</summary>
             <div class="group">
                 <div class="cell"><button id="clear">Clear</button></div>
-                <div class="cell"><button id="randomize">Randomize</button></div>
                 <div class="cell"><button id="share">Share</button></div>
-            </div>            
-            <button id="save">Save STL</button>
+                <div class="cell"><button id="save">Save STL</button></div>
+            </div>
+            <div class="group">
+                <span class="measurementhint">Display style</span>
+                <select id="style">
+                    <option value="0">Contour</option>
+                    <option value="1">Solid</option>
+                    <option value="2">Wireframe</option>
+                    <option value="3">Solid Wireframe</option>
+                </select>
+            </div>
         </details>
         <details id="blockeditor" open>
             <summary>Edit Block</summary>
@@ -72,7 +82,7 @@
         <details id="catalog">
             <summary>Catalog</summary>
         </details>
-        <details open>
+        <details>
             <summary>Measurements</summary>
             <div class="group">
                 <span class="measurementhint">Technic Unit</span>
@@ -168,16 +178,14 @@
         </details>
 
         <details open>
-            <summary>Part Designer</summary>
-            <div class="group">
-                <span class="editorhint">Style</span>
-                <select id="style">
-                    <option value="0">Contour</option>
-                    <option value="1">Solid</option>
-                    <option value="2">Wireframe</option>
-                    <option value="3">Solid Wireframe</option>
-                </select>
-            </div>
+            <summary>About</summary>
+            <p>This is a free online CAD tool to create custom LEGO&reg; Technic compatible construction parts for 3D printing.</p>
+            <p>You can find the source code for this project on <a href="https://github.com/marian42/partdesigner" target="_blank">Github</a>.</p>
+            <p class="fineprint">
+                <a href="https://marian42.de/" target="_blank">marian42.de</a>&nbsp;&middot;&nbsp;
+                <a href="mailto:mail@marian42.de">Contact</a>&nbsp;&middot;&nbsp;
+                <a href="https://marian42.de/page/Imprint" target="_blank">Imprint</a>
+            </p>
         </details>
     </div>
     <div class="canvas-container">

diff --git a/src/editor/Editor.ts b/src/editor/Editor.ts
@@ -77,7 +77,6 @@ class Editor {
 		this.canvas.addEventListener("contextmenu", (event: Event) => event.preventDefault());
 		this.canvas.addEventListener("wheel", (event: MouseWheelEvent) => this.onScroll(event));
 		document.getElementById("clear").addEventListener("click", (event: MouseEvent) => this.clear());
-		document.getElementById("randomize").addEventListener("click", (event: MouseEvent) => this.randomize());
 		document.getElementById("share").addEventListener("click", (event: MouseEvent) => this.share());
 		document.getElementById("save").addEventListener("click", (event: MouseEvent) => this.saveSTL());
 		document.getElementById("remove").addEventListener("click", (event: MouseEvent) => this.remove());
@@ -118,11 +117,6 @@ class Editor {
 		this.updateMesh();
 	}
 
-	private randomize() {
-		this.part.randomize();
-		this.updateMesh();
-	}
-
 	private share() {
 		window.history.pushState({}, document.title, "?part=" + this.part.toString());
 	}
@@ -274,5 +268,6 @@ class Editor {
 	private resetMeasurements() {
 		this.measurements = new Measurements();
 		this.displayMeasurements();
+		this.updateMesh();
 	}
 }