turtl help screen

8c8e56ba · Bob Mottram · c792e8b4 · 8c8e56ba
Commit 8c8e56ba authored 6 years ago by Bob Mottram
--- a/webadmin/EN/help_turtl.html
+++ b/webadmin/EN/help_turtl.html
+<!DOCTYPE html>
+<html lang="en">
+  <meta charset="utf-8">
+  <style>
+    body {
+        margin: 0;
+        font-family: Arial;
+        background-color: white;
+        color: black;
+    }
+
+    * {
+        box-sizing: border-box;
+    }
+
+    a, u {
+        text-decoration: none;
+        color: #72a7cf;
+        font-weight: bold;
+    }
+
+    a:visited{
+        color: #72a7cf;
+        font-weight: bold;
+    }
+
+    #headerpic {
+        width: 60%;
+        height: auto;
+        margin-right : auto;
+        margin-left : auto;
+        min-width : 220px;
+    }
+
+    .header {
+        text-align: center;
+        padding: 32px;
+    }
+
+    .headertext {
+        text-align: center;
+        font-size: 120%;
+        font-weight: bold;
+    }
+
+    .subheadertext {
+        margin-left : 10%;
+        text-align: left;
+        font-size: 110%;
+        font-weight: bold;
+    }
+
+    .subheaderports {
+        margin-left : 10%;
+        text-align: left;
+        font-size: 110%;
+        font-weight: bold;
+    }
+
+    .helptext {
+        width: 80%;
+        text-align: left;
+        font-size: 100%;
+        margin-left : 10%;
+    }
+
+    .codetext {
+        font-family: Courier;
+        width: 80%;
+        text-align: left;
+        font-size: 100%;
+        margin-left : 10%;
+    }
+
+    .portstext {
+        width: 80%;
+        text-align: left;
+        font-size: 100%;
+        margin-left : 10%;
+    }
+
+    .row {
+        display: -ms-flexbox;
+        display: flex;
+        -ms-flex-wrap: wrap;
+        flex-wrap: wrap;
+        padding: 0 4px;
+    }
+
+    .column {
+        -ms-flex: 25%;
+        flex: 15%;
+        max-width: 25%;
+        padding: 0 4px;
+    }
+
+    .column img {
+        margin-top: 8px;
+        vertical-align: middle;
+    }
+
+    @media screen and (max-width: 800px) {
+        .column {
+            -ms-flex: 50%;
+            flex: 50%;
+            max-width: 50%;
+        }
+    }
+
+    @media screen and (max-width: 200px) {
+        .column {
+            -ms-flex: 100%;
+            flex: 100%;
+            max-width: 100%;
+        }
+    }
+  </style>
+  <body>
+
+    <div class="header">
+      <a href="app_turtl.html"><img id="headerpic" class="img-responsive" src="images/logo.png" alt="Freedombone"></a>
+    </div>
+
+    <p class="headertext" translate="yes">Turtl</p>
+
+    <p class="helptext" translate="yes">Turtl is a system for privately creating and sharing notes and images, similar to Evernote. It can be set up so that a small number of users on the server can share their notes in a convenient way. It doesn't have any web user interface, and you need to install native clients on mobile or laptop/desktop machines.</p>
+
+    <p class="helptext" translate="yes">Since the data at rest is stored in PGP encrypted format this is a good system to use in cases where security really is a critical factor.</p>
+
+    <p class="subheaderports" translate="yes">Ports</p>
+
+    <p class="portstext" translate="yes">Forward port 80 and 443 from your internet router</p>
+
+    <p class="subheadertext" translate="yes">Installation</p>
+
+    <p class="helptext" translate="yes">Go to https://turtlapp.com/download and you'll then be able to download the appropriate app for your laptop or phone.</p>
+
+    <p class="helptext" translate="yes">Run the downloaded native app then at the bottom of the screen select "advanced settings" and enter your turl domain name, then register a new account. The password can be anything you choose, but since the client side encryption depends upon having a good password make it a long random string generated by a password manager such as KeepassX.</p>
+
+    <p class="helptext" translate="yes">You should then be able to log in and start using the app. You might also want to invite any other users of your Freedombone system to also sign up using the turtl domain name which you specified during installation.</p>
+  </body>
+</html>