From 1784dc777d6a5c0ebd1cd616d1e88a72bceb2efc Mon Sep 17 00:00:00 2001
From: arza <arza@arza.us>
Date: Sat, 23 Sep 2017 22:24:17 +0300
Subject: [PATCH] Add table headers and widen input fields in qute://settings

---
 qutebrowser/html/settings.html | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/qutebrowser/html/settings.html b/qutebrowser/html/settings.html
index 217e052af..b370c0d91 100644
--- a/qutebrowser/html/settings.html
+++ b/qutebrowser/html/settings.html
@@ -17,6 +17,9 @@ pre { margin: 2px; }
 th, td { border: 1px solid grey; padding: 0px 5px; }
 th { background: lightgrey; }
 th pre { color: grey; text-align: left; }
+input { width: 98%; }
+.setting { width: 75%; }
+.value { width: 25%; text-align: center; }
 .noscript, .noscript-text { color:red; }
 .noscript-text { margin-bottom: 5cm; }
 .option_description { margin: .5ex 0; color: grey; font-size: 80%; font-style: italic; white-space: pre-line; }
@@ -26,15 +29,19 @@ th pre { color: grey; text-align: left; }
 <noscript><h1 class="noscript">View Only</h1><p class="noscript-text">Changing settings requires javascript to be enabled!</p></noscript>
 <header><h1>{{ title }}</h1></header>
 <table>
+    <tr>
+        <th>Setting</th>
+        <th>Value</th>
+    </tr>
   {% for option in configdata.DATA.values() %}
     <tr>
       <!-- FIXME: convert to string properly -->
-      <td>{{ option.name }} (Current: {{ confget(option.name) | string |truncate(100) }})
+      <td class="setting">{{ option.name }} (Current: {{ confget(option.name) | string |truncate(100) }})
         {% if option.description %}
           <p class="option_description">{{ option.description|e }}</p>
         {% endif %}
       </td>
-      <td>
+      <td class="value">
         <input type="text"
           id="input-{{ option.name }}"
           onblur="cset('{{ option.name }}', this.value)"