Extract common styling from bookmarks, history.

3 files changed, 48 insertions, 70 deletions

diff --git a/qutebrowser/html/bookmarks.html b/qutebrowser/html/bookmarks.html
index e6448094a..91301679e 100644
--- a/qutebrowser/html/bookmarks.html
+++ b/qutebrowser/html/bookmarks.html
@@ -1,59 +1,30 @@
-{% extends "base.html" %}
+{% extends "styled.html" %}
 
 {% block style %}
-body {
-    background: #fefefe;
-    font-family: sans-serif;
-    margin: 0 auto;
-    max-width: 1280px;
-    padding-left: 20px;
-    padding-right: 20px;
-}
-
+{{super()}}
 h1 {
-    color: #444;
-    font-weight: normal;
     margin-bottom: 10px;
 }
 
-a {
-    text-decoration: none;
-    color: #2562dc
-}
-
-a:hover {
-    text-decoration: underline;
-}
-
 .url a {
     color: #444;
 }
 
-table {
-    border-collapse: collapse;
-    width: 100%;
-}
-
 th {
     text-align: left;
 }
 
-tbody tr:nth-child(odd) {
-    background-color: #f8f8f8;
-}
-
 .qmarks .name {
     padding-left: 5px;
 }
 
-.empty {
+.empty-msg {
     background-color: #f8f8f8;
     color: #444;
     display: inline-block;
     text-align: center;
     width: 100%;
 }
-
 {% endblock %}
 
 {% block content %}
@@ -72,7 +43,7 @@ tbody tr:nth-child(odd) {
     </tbody>
 </table>
 {% else %}
-<span class="empty">You have no quickmarks</span>
+<span class="empty-msg">You have no quickmarks</span>
 {% endif %}
 
 <h1>Bookmarks</h1>
@@ -89,7 +60,7 @@ tbody tr:nth-child(odd) {
     </tbody>
 </table>
 {% else %}
-<span class="empty">You have no bookmarks</span>
+<span class="empty-msg">You have no bookmarks</span>
 {% endif %}
 
 {% endblock %}
diff --git a/qutebrowser/html/history.html b/qutebrowser/html/history.html
index 4135fc627..94f82182f 100644
--- a/qutebrowser/html/history.html
+++ b/qutebrowser/html/history.html
@@ -1,29 +1,9 @@
-{% extends "base.html" %}
+{% extends "styled.html" %}
 
 {% block style %}
+{{super()}}
 body {
-    background: #fefefe;
-    font-family: sans-serif;
-    margin: 0 auto;
     max-width: 1440px;
-    padding-left: 20px;
-    padding-right: 20px;
-}
-
-h1 {
-    color: #444;
-    font-weight: normal;
-}
-
-table {
-    border-collapse: collapse;
-    width: 100%;
-}
-
-td {
-    max-width: 50%;
-    padding: 2px 5px;
-    text-align: left;
 }
 
 td.title {
@@ -36,19 +16,6 @@ td.time {
     white-space: nowrap;
 }
 
-a {
-    text-decoration: none;
-    color: #2562dc
-}
-
-a:hover {
-    text-decoration: underline;
-}
-
-tr:nth-child(odd) {
-    background-color: #f8f8f8;
-}
-
 .date {
     color: #888;
     font-size: 14pt;
@@ -66,7 +33,6 @@ tr:nth-child(odd) {
     color: #333;
     font-weight: bold;
 }
-
 {% endblock %}
 
 {% block content %}
diff --git a/qutebrowser/html/styled.html b/qutebrowser/html/styled.html
new file mode 100644
index 000000000..e2a608538
--- /dev/null
+++ b/qutebrowser/html/styled.html
@@ -0,0 +1,41 @@
+{% extends "base.html" %}
+
+{% block style %}
+a {
+    text-decoration: none;
+    color: #2562dc
+}
+
+a:hover {
+    text-decoration: underline;
+}
+
+body {
+    background: #fefefe;
+    font-family: sans-serif;
+    margin: 0 auto;
+    max-width: 1280px;
+    padding-left: 20px;
+    padding-right: 20px;
+}
+
+h1 {
+    color: #444;
+    font-weight: normal;
+}
+
+table {
+    border-collapse: collapse;
+    width: 100%;
+}
+
+tbody tr:nth-child(odd) {
+    background-color: #f8f8f8;
+}
+
+td {
+    max-width: 50%;
+    padding: 2px 5px;
+    text-align: left;
+}
+{% endblock %}