From 8cc01c58f305f9601f4b5c33bf808ff56a194e99 Mon Sep 17 00:00:00 2001
From: Matthew Crossman <matt@crossman.page>
Date: Sun, 31 Jan 2021 09:52:18 +1100
Subject: [PATCH] Move the subs list into the navbar.

---
 static/style.css      | 36 +++++++++++++-----------------------
 templates/base.html   | 13 +++++++------
 templates/post.html   |  2 +-
 templates/search.html |  2 +-
 templates/user.html   |  2 +-
 templates/utils.html  |  4 ++--
 templates/wiki.html   |  2 +-
 7 files changed, 26 insertions(+), 35 deletions(-)

diff --git a/static/style.css b/static/style.css
index 674aaf1..651d3a8 100644
--- a/static/style.css
+++ b/static/style.css
@@ -73,7 +73,7 @@ body {
 
 nav {
 	display: grid;
-	grid-template-areas: "logo searchbox code";
+	grid-template-areas: "logo searchbox links";
 
 	justify-content: space-between;
 	align-items: center;
@@ -95,11 +95,12 @@ nav {
 nav * { color: var(--text); }
 nav #reddit, #code { color: var(--accent); }
 nav #logo { grid-area: logo; }
-nav #code { grid-area: code; }
-nav #version { opacity: 50%; }
+nav #links { grid-area: links; }
+
+nav #version { opacity: 50%; vertical-align: -2px; }
+nav #libreddit { vertical-align: -2px; }
 
 #settings_link {
-	font-size: 18px;
 	margin-left: 10px;
 	opacity: 0.8;
 }
@@ -257,27 +258,18 @@ aside {
 /* Subscribed subreddit list */
 
 #subscriptions_container {
-	display: flex;
-	max-width: 1000px;
-	margin: 0 auto;
-	padding: 10px 20px;
-}
-
-#subscriptions_container.narrow {
-	max-width: 750px;
-}
-
-.wide #subscriptions_container, .wide #subscriptions_container.narrow {
-	max-width: calc(100% - 40px);
+	display: inline-block;
+	margin-left: 10px;
 }
 
 #subscriptions {
-	display: inline-block;
 	position: relative;
 	border-radius: 5px;
+	border: var(--panel-border);
 	background-color: var(--outside);
 	align-items: center;
 	box-sizing: border-box;
+	font-size: 15px;
 }
 
 #subscriptions > summary {
@@ -1052,7 +1044,7 @@ td, th {
 }
 
 @media screen and (max-width: 800px) {
-	body { padding-top: 100px }
+	body { padding-top: 120px }
 
 	main {
 		flex-direction: column-reverse;
@@ -1062,15 +1054,13 @@ td, th {
 	}
 	
 	nav {
-		grid-template-areas: 'logo code' 'searchbox searchbox';
+		grid-template-areas: 'logo links' 'searchbox searchbox';
 		padding: 10px;
 		width: calc(100% - 20px);
 	}
 
-	#subscriptions_container { 
-		padding: 10px;
-		justify-content: center;
-	}
+	#version { display: none; }
+
 	#subscriptions { position: unset; }
 
 	#sub_list {
diff --git a/templates/base.html b/templates/base.html
index e333e05..7b3ddee 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -16,18 +16,19 @@
 		{% if prefs.theme != "system" %} {{ prefs.theme }}{% endif %}">
 		<!-- NAVIGATION BAR -->
 		<nav>
-			<p id="logo">
+			<div id="logo">
 				<a id="libreddit" href="/">
 					<span id="lib">lib</span><span id="reddit">reddit.</span>
 				</a>
 				<span id="version">v{{ env!("CARGO_PKG_VERSION") }}</span>
-				<a id="settings_link" href="/settings">settings</a>
-			</p>
+				{% block subscriptions %}{% endblock %}
+			</div>
 			{% block search %}{% endblock %}
-			<a id="code" href="https://github.com/spikecodes/libreddit">code</a>
+			<div id="links">
+				<a id="settings_link" href="/settings">settings</a>
+				<a id="code" href="https://github.com/spikecodes/libreddit">code</a>
+			</div>
 		</nav>
-
-		{% block subscriptions %}{% endblock %}
 		
 		<!-- MAIN CONTENT -->
 		{% block body %}
diff --git a/templates/post.html b/templates/post.html
index a8db811..619005e 100644
--- a/templates/post.html
+++ b/templates/post.html
@@ -14,7 +14,7 @@
 {% endblock %}
 
 {% block subscriptions %}
-	{% call utils::sub_list(post.community.as_str(), "narrow") %}
+	{% call utils::sub_list(post.community.as_str()) %}
 {% endblock %}
 
 <!-- OPEN COMMENT MACRO -->
diff --git a/templates/search.html b/templates/search.html
index 33e644a..37edfc6 100644
--- a/templates/search.html
+++ b/templates/search.html
@@ -4,7 +4,7 @@
 {% block title %}Libreddit: search results - {{ params.q }}{% endblock %}
 
 {% block subscriptions %}
-	{% call utils::sub_list("", "narrow") %}
+	{% call utils::sub_list("") %}
 {% endblock %}
 
 {% block content %}
diff --git a/templates/user.html b/templates/user.html
index 2f5f250..c19a3ca 100644
--- a/templates/user.html
+++ b/templates/user.html
@@ -8,7 +8,7 @@
 {% block title %}{{ user.name.replace("u/", "") }} (u/{{ user.name }}) - Libreddit{% endblock %}
 
 {% block subscriptions %}
-	{% call utils::sub_list("", "wide") %}
+	{% call utils::sub_list("") %}
 {% endblock %}
 
 {% block body %}
diff --git a/templates/utils.html b/templates/utils.html
index f036045..0c59aa3 100644
--- a/templates/utils.html
+++ b/templates/utils.html
@@ -40,9 +40,9 @@
 {% endfor %}
 {%- endmacro %}
 
-{% macro sub_list(current, width) -%}
+{% macro sub_list(current) -%}
 {% if prefs.subs.len() > 0 %}
-	<div id="subscriptions_container" class="{{ width }}">
+	<div id="subscriptions_container">
 		<details id="subscriptions">
 			<summary>Subscriptions</summary>
 			<div id="sub_list">
diff --git a/templates/wiki.html b/templates/wiki.html
index 0a05fb3..882f228 100644
--- a/templates/wiki.html
+++ b/templates/wiki.html
@@ -11,7 +11,7 @@
 {% endblock %}
 
 {% block subscriptions %}
-	{% call utils::sub_list(sub.as_str(), "narrow") %}
+	{% call utils::sub_list(sub.as_str()) %}
 {% endblock %}
 
 {% block body %}