started toolbox

DanielRedacted · Aug 16, 2024 · 47108df · 47108df
1 parent dc0b43a
commit 47108df
Show file tree

Hide file tree

Showing 4 changed files with 275 additions and 10 deletions.
diff --git a/Socials.html b/Socials.html
@@ -12,24 +12,15 @@
     <link rel="stylesheet" href="styles.css">
     <style>
         body {
-            display:flex;
-            align-content: center;
-            justify-content: center;
-            text-align: center;
-
-            overflow: hidden;
         }
 
         #page {
             flex:1;
-            background-color: white;
 
             display: flex;
             flex-direction: column;
             align-items: center;
             justify-content: space-evenly;
-
-            margin:auto;
         }
 
         #link {
@@ -77,6 +68,7 @@
                 width: 100%;
                 max-width: 6in;
                 aspect-ratio: 1.618/1;
+                max-height: 100%;
                 padding: 16px;
                 overflow: hidden;
 
@@ -90,6 +82,7 @@
 
             #qr {
                 max-width: 50%;
+                height: auto;
                 aspect-ratio: 1/1;
                 object-fit: contain;
                 order: 1;

diff --git a/index.html b/index.html
@@ -10,6 +10,32 @@
     <link rel="manifest" href="/site.webmanifest">
 
     <link rel="stylesheet" href="styles.css">
+    <style>
+        #page {
+            width:100%;
+            max-width: 8.5in;
+
+            padding: 0.5in;
+            margin: auto;
+        }
+        span {
+            display:flex;
+            flex-direction: row;
+            justify-content: center;
+            align-content: center;
+        }
+
+        #menu a {
+            padding: 0 6pt;
+            margin: auto;
+            height: 24pt;
+        }
+        #menu a:hover {
+            background-color:black; 
+            color:white; 
+            /* padding: 0 3pt; */
+        }
+    </style>
 </head>
 <body>
     <div id="header">
@@ -18,6 +44,12 @@
             <p style="font-size:12pt;">@DanielRedacted</p>
         </div>
         <span style="flex:1;"></span>
+        <span id="menu" style="flex:1;">
+            <a href="">About</a>
+            <a href="">Awareness</a>
+            <a href="">Toolbox</a>
+        </span>
+        <span style="flex:1;"></span>
         <div id="top-socials" class="socials">
 
             <a title="X" href="https://x.com/DanielRedacted" target="_blank">
@@ -167,7 +199,7 @@ <h4>transitive verb</h4>
             </ol>
             <p>example: █ ████ ███!</p>
             <br><br>
-            <p>note: Governments, Companies, Medical Institutions, and Journalists use <b class="redacted">Redaction</b> to protect sensitive and confidential information, personal data, and identities. You should too.</p><br>
+            <p>note: Governments, Companies, Medical Institutions, and Journalists use <b class="redacted">redaction</b> to protect sensitive and confidential information, personal data, and identities. You should too.</p><br>
             <p>Think before you post.</p>
         </fieldset>
 

diff --git a/styles.css b/styles.css
@@ -30,8 +30,24 @@ body {
 
     font-family: Helvetica, Arial, sans-serif;
     font-size: 12pt;
+
+
+    display:flex;
+    align-content: center;
+    justify-content: center;
+
+    overflow: hidden;
+}
+
+a {
+    text-decoration: none;
+    color: inherit;
 }
+
 #page {
+    background-color: white;
+
+    margin:auto;
 }
 /* @media print {
     body {