Received: from mout.perfora.net (mout.perfora.net [74.208.4.194])
	by mail-b.sr.ht (Postfix) with ESMTPS id A20E0FF0E6
	for <~emersion/alps-dev@lists.sr.ht>; Tue, 28 Jul 2020 13:03:22 +0000 (UTC)
Received: from Zachs-MBP.hsd1.mi.comcast.net.org ([107.5.198.24]) by
 mrelay.perfora.net (mreueus003 [74.208.5.2]) with ESMTPSA (Nemesis) id
 0LgaN1-1kWhoQ28NJ-00nxKS; Tue, 28 Jul 2020 15:03:19 +0200
From: Zach DeCook <zdecook@ccel.org>
To: ~emersion/alps-dev@lists.sr.ht
Cc: Zach DeCook <zdecook@ccel.org>
Subject: [PATCH 3/3] * Alps Theme Mobile: Make sidebar toggle more clickable
Date: Tue, 28 Jul 2020 09:02:13 -0400
Message-Id: <20200728130212.16898-3-zdecook@ccel.org>
X-Mailer: git-send-email 2.27.0
MIME-Version: 1.0
X-Provags-ID: V03:K1:dRCi24D8jRau2YvS4+oF5Rdga3PVNpBVJQTtUh45wOA/5q1REPD
 lUsklhQG3PAl34egrc/RNmqNR47qEGRGxByxsu/olRcSqd1xj3vcNbxqjKHqBBTCxpkyAw4
 nf3AzEDsy20ixh83wIuRHDJqCFdRLGTTC+fB+V6WFEjfIgRfNOPiMqMagRBUMfeDqXAOQnR
 VPP7h82jxgJ906VbJqguw==
X-Spam-Flag: NO
X-UI-Out-Filterresults: notjunk:1;V03:K0:9aOKYMAFtXM=:0/h1gL7kq+pH+tWwZ1xZLF
 H+0OEdLhVl3SmQa3s4GAIb6LKHLqgwlpxXddo++dkchTTcfb4wXq1M+RQuy/0yvhG9EnVmH/S
 WA2xgLkTjZkX3M4QeVS6dcKEWshaSNmOTInitzIaFuPE4IP8OeJORBpvIbhfYFVVhtHQoUBYY
 YM5iv43Qbm+x4DwYc3eaUqE5hvfs/GvMk/rbwPml8GOU5KTi5W/cUydtNyDkJzc1NA7MRtZzV
 CqggfsCLeVMtU2pmPzVTIMkZgA/5Pym8kpcRC7AmV0QNMLD2M2tiGhXKxA6UeTn+aUG66QupR
 op0i3nPHI629QKBFsHBoyNKa6Pz/XuG51sDC6iunEkeTNZCJFBvxGblSDcjiU8eG1AgrEvz76
 y2qrcvoRGyfQ9FVRsYP1gi7EuNIJRi47qv+YPCmmP+Ky+t8zxBqEx1VLBGxWc5KElNI6crVAf
 ISBBiJqCijmDYeiMp4qmuBq6ex1b79nmOq+EhZkEeyBkVBLVt+3YXFK7mFvzEQ5hFpHB0Zz/t
 POAY+dUrpSfDV4dy0wTpxolJ1B//iDi9myJhpAfBw9G0BfzM8s1CBB6w2d9d+/JiuGkif8PcG
 wFpArOyKQsnXfFCog6PXk+5TIVicxNpez74ThCsh3xioo0mfW1EbEGYwkLDZ76MznsEDXxJV0
 n5LbQzx1/pB8wJNoEEaryN8494HAHfH7Z/xgH/L9D8s9lPZCkxIUTQOqwY5/yTjRa+TONEz+k
 FvmVhPUI+AIwfSG2liw9DELzZo+Je6s+AeDbBOvGmyL6auuK7+tGwdMntoininZsIqIiN/BL5
 rFNgnKtYgnI/+e8YF0FEgncUFUb1qVXKtC2MOf29VVf/RM/ZPwAv4Yyj4QioMI6qQBiwSAW
Content-Transfer-Encoding: quoted-printable

---
At some point, this should probably also be added to the email view page,
as well as to Calendar and Contacts (but not the Settings page).

It may be good to do that with some refactoring.
 themes/alps/assets/style.css | 7 +++++--
 themes/alps/mailbox.html     | 3 ++-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/themes/alps/assets/style.css b/themes/alps/assets/style.css
index d431f06..a524759 100644
--- a/themes/alps/assets/style.css
+++ b/themes/alps/assets/style.css
@@ -132,11 +132,14 @@ aside {
   transition: max-width .2s ease-in-out;
 }
 input.menuToggler { display: none; }
+label[for=3DasideToggle] { width: 0; transition: width .2s linear; }
 @media only screen and (max-width: 767px) {
-  /* TODO: Make this accessible */
   input.menuToggler:not(:checked) ~ aside.autohide { max-width: 0; }
-  input.menuToggler { display: block; }
+  label[for=3DasideToggle]:after { content: "\2192"; }
+  input.menuToggler:checked ~ aside.autohide ~ label:after { content: "\=
2190"; }
+  label[for=3DasideToggle]{ width: 130px; background-color: #f6f6f6; }
 }
+
 aside a { width: 100%; display: block; padding: 0.4rem 0 0.4rem 0.5rem; =
}
 aside a.active { font-weight: bold; color: black; text-decoration: none;=
 }
 aside img { display: block; }
diff --git a/themes/alps/mailbox.html b/themes/alps/mailbox.html
index b52a635..0d9e8ab 100644
--- a/themes/alps/mailbox.html
+++ b/themes/alps/mailbox.html
@@ -2,7 +2,7 @@
 {{template "nav.html" .}}
=20
 <div class=3D"page-wrap">
-  <input type=3D"checkbox" class=3D"menuToggler">
+  <input type=3D"checkbox" class=3D"menuToggler" id=3D"asideToggle">
   <aside class=3D'autohide'>
     <!-- the logo image, dimensions 200x32 may be present or not -->
     <a href=3D"/compose" class=3D"new">Compose&nbsp;Mail</a>
@@ -25,6 +25,7 @@
       </a>
     {{end}}
   </aside>
+  <label for=3D"asideToggle"></label>
=20
   <div class=3D"container">
     <form id=3D"messages-form" method=3D"post"></form>
--=20
2.27.0