Updated documentation styling (#1660)

pqrs-org · Jun 15, 2024 · b4d2113 · b4d2113
1 parent 0c61eb3
commit b4d2113
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 51 deletions.
diff --git a/public/extra_descriptions/google_chrome.html b/public/extra_descriptions/google_chrome.html
@@ -1,11 +1,5 @@
 <link rel="stylesheet" href="../../vendor/css/bootstrap.min.css"/>
 
-<style>
-  .fixed-width {
-    width: 250px;
-  }
-</style>
-
 <p style="margin-top: 20px; font-weight: bold">
  Hyper Key
 </p>
@@ -16,14 +10,14 @@
 
 <table class="table">
   <tr>
-    <td class="fixed-width">Caps Lock</td>
+    <td style="width: 350px;">Caps Lock</td>
     <td>
       Maps to left control + left shift + right command (⌃⇧⌘).
       The Caps lock is disabled.
     </td>
   </tr>
   <tr>
-    <td class="fixed-width">Double-tap right shift</td>
+    <td style="width: 350px;">Double-tap right shift</td>
     <td>Caps lock toggle</td>
   </tr>
 </table>
@@ -34,7 +28,7 @@
 
 <table class="table">
   <tr>
-    <td class="fixed-width">Caps lock hyper key + a</td>
+    <td style="width: 350px;">Caps lock hyper key + a</td>
     <td>Search Tabs</td>
   </tr>
 </table>
@@ -45,7 +39,7 @@
 
 <table class="table">
   <tr>
-    <td class="fixed-width">Caps lock hyper key + q</td>
+    <td style="width: 350px;">Caps lock hyper key + q</td>
     <td>Switch between Google Chrome profiles</td>
   </tr>
 </table>
@@ -56,23 +50,23 @@
 
 <table class="table">
   <tr>
-    <td class="fixed-width">Caps lock hyper key + 1</td>
+    <td style="width: 350px;">Caps lock hyper key + 1</td>
     <td>Developer Tools</td>
   </tr>
   <tr>
-    <td class="fixed-width">Caps lock hyper key + 2</td>
+    <td style="width: 350px;">Caps lock hyper key + 2</td>
     <td>Developer Console</td>
   </tr>
   <tr>
-    <td class="fixed-width">Caps lock hyper key + 3</td>
+    <td style="width: 350px;">Caps lock hyper key + 3</td>
     <td>Developer Elements Panel</td>
   </tr>
   <tr>
-    <td class="fixed-width">Caps lock hyper key + q</td>
+    <td style="width: 350px;">Caps lock hyper key + q</td>
     <td>Toggle device toolbar (when you already have a developer panel open)</td>
   </tr>
   <tr>
-    <td class="fixed-width">Right cmd</td>
+    <td style="width: 350px;">Right cmd</td>
     <td>Toggle Zen mode</td>
   </tr>
 </table>
diff --git a/public/extra_descriptions/premiere_pro.html b/public/extra_descriptions/premiere_pro.html
@@ -1,18 +1,12 @@
 <link rel="stylesheet" href="../../vendor/css/bootstrap.min.css"/>
 
-<style>
-  .fixed-width {
-    width: 250px;
-  }
-</style>
-
 <p style="margin-top: 20px; font-weight: bold">
  Scroll the timeline with mouse button 3
 </p>
 
 <table class="table">
   <tr>
-    <td class="fixed-width">Mouse button 3</td>
+    <td style="width: 350px;">Mouse button 3</td>
     <td>
       Hold in button 3 to scroll the timeline horizontally. This automatically selects the hand tool. When you release button 3, it goes back to the selection tool.
     </td>
@@ -25,11 +19,11 @@
 
 <table class="table">
   <tr>
-    <td class="fixed-width">Button 1 (left-click)</td>
+    <td style="width: 350px;">Button 1 (left-click)</td>
     <td>Makes a cut on the timeline</td>
   </tr>
   <tr>
-    <td class="fixed-width">Button 2 (right-click)</td>
+    <td style="width: 350px;">Button 2 (right-click)</td>
     <td>Ripple edit to the previous cut on the timeline</td>
   </tr>
 </table>
diff --git a/public/extra_descriptions/slack.html b/public/extra_descriptions/slack.html
@@ -10,14 +10,14 @@
 
 <table class="table">
   <tr>
-    <td style="width: 300px;">Caps Lock</td>
+    <td style="width: 350px;">Caps Lock</td>
     <td>
       Maps to left control + left shift + right command (⌃⇧⌘).
       The Caps lock is disabled.
     </td>
   </tr>
   <tr>
-    <td style="width: 300px;">Double-tap right shift</td>
+    <td style="width: 350px;">Double-tap right shift</td>
     <td>Caps lock toggle</td>
   </tr>
 </table>
@@ -28,19 +28,19 @@
 
 <table class="table">
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + 1</td>
+    <td style="width: 350px;">Caps Lock Hyper key + 1</td>
     <td>Quick search</td>
   </tr>
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + 2</td>
+    <td style="width: 350px;">Caps Lock Hyper key + 2</td>
     <td>Navigate to activity</td>
   </tr>
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + 3</td>
+    <td style="width: 350px;">Caps Lock Hyper key + 3</td>
     <td>Navigate to DMs</td>
   </tr>
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + 4</td>
+    <td style="width: 350px;">Caps Lock Hyper key + 4</td>
     <td>Navigate to all unread messages</td>
   </tr>
 </table>
@@ -51,23 +51,23 @@
 
 <table class="table">
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + q</td>
+    <td style="width: 350px;">Caps Lock Hyper key + q</td>
     <td>Format selection as quote</td>
   </tr>
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + a</td>
+    <td style="width: 350px;">Caps Lock Hyper key + a</td>
     <td>Code format</td>
   </tr>
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + s</td>
+    <td style="width: 350px;">Caps Lock Hyper key + s</td>
     <td>Code block</td>
   </tr>
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + d</td>
+    <td style="width: 350px;">Caps Lock Hyper key + d</td>
     <td>Add hyperlink</td>
   </tr>
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + f</td>
+    <td style="width: 350px;">Caps Lock Hyper key + f</td>
     <td>Upload file</td>
   </tr>
 </table>
@@ -78,11 +78,11 @@
 
 <table class="table">
   <tr>
-    <td style="width: 300px;">Caps Lock Hyper key + e</td>
+    <td style="width: 350px;">Caps Lock Hyper key + e</td>
     <td>Set status</td>
   </tr>
   <tr>
-    <td style="width: 300px;">Slack: Caps Lock Hyper key + w</td>
+    <td style="width: 350px;">Slack: Caps Lock Hyper key + w</td>
     <td>Toggle sidebar</td>
   </tr>
 </table>
diff --git a/public/extra_descriptions/vs_code.html b/public/extra_descriptions/vs_code.html
@@ -1,11 +1,5 @@
 <link rel="stylesheet" href="../../vendor/css/bootstrap.min.css"/>
 
-<style>
-  .fixed-width {
-    width: 250px;
-  }
-</style>
-
 <p style="margin-top: 20px; font-weight: bold">
  Hyper Key
 </p>
@@ -16,14 +10,14 @@
 
 <table class="table">
   <tr>
-    <td class="fixed-width">Caps Lock</td>
+    <td style="width: 350px;">Caps Lock</td>
     <td>
       Maps to left control + left shift + right command (⌃⇧⌘).
       The Caps lock is disabled.
     </td>
   </tr>
   <tr>
-    <td class="fixed-width">Double-tap right shift</td>
+    <td style="width: 350px;">Double-tap right shift</td>
     <td>Caps lock toggle</td>
   </tr>
 </table>
@@ -34,11 +28,11 @@
 
 <table class="table">
   <tr>
-    <td class="fixed-width">Caps Lock Hyper Key + a</td>
+    <td style="width: 350px;">Caps Lock Hyper Key + a</td>
     <td>Quick open (search for a file)</td>
   </tr>
   <tr>
-    <td class="fixed-width">Caps Lock Hyper Key + s</td>
+    <td style="width: 350px;">Caps Lock Hyper Key + s</td>
     <td>Navigate symbols (search symbols)</td>
   </tr>
 </table>
@@ -49,19 +43,19 @@
 
 <table class="table">
   <tr>
-    <td class="fixed-width">Double-tap left ctrl</td>
+    <td style="width: 350px;">Double-tap left ctrl</td>
     <td>Toggle sidebar</td>
   </tr>
   <tr>
-    <td class="fixed-width">Double-tap left option</td>
+    <td style="width: 350px;">Double-tap left option</td>
     <td>Toggle terminal</td>
   </tr>
   <tr>
-    <td class="fixed-width">Double-tap left cmd</td>
+    <td style="width: 350px;">Double-tap left cmd</td>
     <td>Toggle Zen mode</td>
   </tr>
   <tr>
-    <td class="fixed-width">Right cmd</td>
+    <td style="width: 350px;">Right cmd</td>
     <td>Toggle Zen mode</td>
   </tr>
 </table>