From 713d2c14e5476b3512e846ade32d1320bd051492 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=A9mie=20Astori?= <jeremie@astori.fr>
Date: Fri, 22 Sep 2017 21:59:45 -0400
Subject: [PATCH 1/2] Reduce message size on mobile and increase a bit UI text

---
 client/css/style.css | 39 +++++++++++++++++++++++++++------------
 1 file changed, 27 insertions(+), 12 deletions(-)

diff --git a/client/css/style.css b/client/css/style.css
index 63e45bc6..ae1fc124 100644
--- a/client/css/style.css
+++ b/client/css/style.css
@@ -456,14 +456,18 @@ kbd {
 
 #sidebar button,
 #sidebar .chan,
-#sidebar .sign-out {
-	border: 1px solid transparent;
-	border-radius: 2px;
+#sidebar .sign-out,
+#sidebar .empty {
 	color: #99a2b4;
-	cursor: pointer;
 	font-size: 14px;
 }
 
+#sidebar button,
+#sidebar .chan,
+#sidebar .sign-out {
+	cursor: pointer;
+}
+
 #sidebar button:hover,
 #sidebar .chan:hover,
 #sidebar .active {
@@ -486,11 +490,8 @@ kbd {
 }
 
 #sidebar .empty {
-	color: #9ca5b4;
 	line-height: 1.6;
-	font-size: 12px;
-	margin-top: 20px;
-	padding: 20px 40px;
+	padding: 40px 20px;
 	text-align: center;
 }
 
@@ -1385,7 +1386,6 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
 
 #connect .tls {
 	float: left;
-	font-size: 14px;
 	margin-top: 6px;
 }
 
@@ -1452,10 +1452,14 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
 	display: table-row;
 }
 
+#help .help-item,
+#help .about {
+	font-size: 14px;
+}
+
 #help .help-item .subject,
 #help .help-item .description {
 	display: table-cell;
-	font-size: 14px;
 	padding-bottom: 15px;
 }
 
@@ -1469,7 +1473,6 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
 }
 
 #help .about {
-	font-size: 14px;
 	line-height: 1.8;
 }
 
@@ -2004,8 +2007,20 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
 		margin-top: 60px !important;
 	}
 
+	#sidebar button,
+	#sidebar .chan,
+	#sidebar .sign-out,
+	#sidebar .empty,
+	#windows label,
+	#windows .header .topic,
+	#settings .error,
+	#help .help-item,
+	#help .about,
+	#loading,
+	#context-menu,
+	.textcomplete-menu,
 	.messages .msg {
-		font-size: 16px;
+		font-size: 15px;
 	}
 
 	#sidebar,

From 4dc3769b18c509ec631cfc312250773ae7570e40 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=A9mie=20Astori?= <jeremie@astori.fr>
Date: Fri, 22 Sep 2017 23:39:06 -0400
Subject: [PATCH 2/2] Make channel list links clickable on full width, simplify
 code

- Close button and badge are now positioned using the same method. Previously one was float and the other was absolutely positioned.
- Increase the close button size to match 2.4.0, as it was made smaller when moving to the native font stack.
- Removed link margins on left/right of the channel links, and the `1px` gap between links.
- Removed hack/fix for drag-and-drop now made unnecessary
---
 client/css/style.css | 48 ++++++++++++++++++--------------------------
 1 file changed, 20 insertions(+), 28 deletions(-)

diff --git a/client/css/style.css b/client/css/style.css
index ae1fc124..9a4c1f36 100644
--- a/client/css/style.css
+++ b/client/css/style.css
@@ -475,7 +475,7 @@ kbd {
 }
 
 #sidebar .networks {
-	padding: 20px 30px 0;
+	padding-top: 20px;
 	touch-action: pan-y;
 }
 
@@ -498,17 +498,9 @@ kbd {
 #sidebar .chan,
 #sidebar .chan-placeholder {
 	display: block;
-	margin: 1px -10px;
-	padding: 6px 10px 8px 36px;
-	position: relative;
-	text-align: left;
+	padding: 8px 25px;
 	transition: color 0.2s;
-	width: 180px;
-	left: auto !important; /* Fix for drag'n'drop not recalculating left position */
-}
-
-#sidebar .chan-placeholder {
-	padding-bottom: 10px;
+	width: 100%;
 }
 
 #sidebar .chan:first-child {
@@ -524,16 +516,12 @@ kbd {
 
 #sidebar .chan::before,
 #chat .title::before {
-	float: left;
-	margin-top: 3px;
 	margin-right: 12px;
-	text-align: center;
 }
 
 #sidebar .chan::before {
-	position: absolute;
-	top: 4px;
-	left: 10px;
+	float: left;
+	line-height: 18px;
 }
 
 #chat .title::before {
@@ -559,19 +547,27 @@ kbd {
 	content: " ";
 }
 
+#sidebar .badge,
+#sidebar .close {
+	float: right;
+	margin-left: 5px;
+	margin-right: -5px;
+}
+
 #sidebar .badge {
 	background: rgba(255, 255, 255, 0.06);
 	border-radius: 3px;
 	color: #afb6c0;
 	font-size: 10px;
 	margin-top: 1px;
-	margin-right: -5px;
-	margin-left: 5px;
 	padding: 3px 6px;
-	float: right;
 	transition: opacity 0.2s, background-color 0.2s, color 0.2s;
 }
 
+#sidebar .badge:empty {
+	display: none;
+}
+
 #sidebar .badge.highlight {
 	background: #fff;
 	color: #49505a;
@@ -584,22 +580,18 @@ kbd {
 
 #sidebar .close {
 	border-radius: 3px;
-	margin-right: 5px;
+	width: 18px;
+	height: 18px;
 	visibility: hidden;
 	opacity: 0;
-	position: absolute;
-	z-index: 2;
-	right: 0;
 	transition: opacity 0.2s, background-color 0.2s;
 }
 
 #sidebar .close::before {
-	font-size: 18px;
+	font-size: 20px;
 	font-weight: normal;
 	display: inline-block;
-	line-height: 18px;
-	width: 18px;
-	height: 18px;
+	line-height: 16px;
 	text-align: center;
 	content: "×";
 	color: #fff;