deploy: 5d846a5

css/chrome.css

@@ -269,8 +269,14 @@ pre > .buttons button {
         /* On mobile, make it easier to tap buttons. */
         padding: 0.3rem 1rem;
     }
+
+    .sidebar-resize-indicator {
+        /* Hide resize indicator on devices with limited accuracy */
+        display: none;
+    }
 }
 pre > code {
+    display: block;
     padding: 1rem;
 }
 
@@ -422,22 +428,35 @@ ul#searchresults span.teaser em {
     position: absolute;
     cursor: col-resize;
     width: 0;
-    right: 0;
+    right: calc(var(--sidebar-resize-indicator-width) * -1);
     top: 0;
     bottom: 0;
+    display: flex;
+    align-items: center;
+}
+
+.sidebar-resize-handle .sidebar-resize-indicator {
+    width: 100%;
+    height: 12px;
+    background-color: var(--icons);
+    margin-inline-start: var(--sidebar-resize-indicator-space);
+}
+
+[dir=rtl] .sidebar .sidebar-resize-handle {
+    left: calc(var(--sidebar-resize-indicator-width) * -1);
+    right: unset;
 }
-[dir=rtl] .sidebar .sidebar-resize-handle { right:  unset; left: 0; }
 .js .sidebar .sidebar-resize-handle {
     cursor: col-resize;
-    width: 5px;
+    width: calc(var(--sidebar-resize-indicator-width) - var(--sidebar-resize-indicator-space));
 }
 /* sidebar-hidden */
 #sidebar-toggle-anchor:not(:checked) ~ .sidebar {
-    transform: translateX(calc(0px - var(--sidebar-width)));
+    transform: translateX(calc(0px - var(--sidebar-width) - var(--sidebar-resize-indicator-width)));
     z-index: -1;
 }
 [dir=rtl] #sidebar-toggle-anchor:not(:checked) ~ .sidebar {
-    transform: translateX(var(--sidebar-width));
+    transform: translateX(calc(var(--sidebar-width) + var(--sidebar-resize-indicator-width)));
 }
 .sidebar::-webkit-scrollbar {
     background: var(--sidebar-bg);
@@ -448,15 +467,15 @@ ul#searchresults span.teaser em {
 
 /* sidebar-visible */
 #sidebar-toggle-anchor:checked ~ .page-wrapper {
-    transform: translateX(var(--sidebar-width));
+    transform: translateX(calc(var(--sidebar-width) + var(--sidebar-resize-indicator-width)));
 }
 [dir=rtl] #sidebar-toggle-anchor:checked ~ .page-wrapper {
-    transform: translateX(calc(0px - var(--sidebar-width)));
+    transform: translateX(calc(0px - var(--sidebar-width) - var(--sidebar-resize-indicator-width)));
 }
 @media only screen and (min-width: 620px) {
     #sidebar-toggle-anchor:checked ~ .page-wrapper {
         transform: none;
-        margin-inline-start: var(--sidebar-width);
+        margin-inline-start: calc(var(--sidebar-width) + var(--sidebar-resize-indicator-width));
     }
     [dir=rtl] #sidebar-toggle-anchor:checked ~ .page-wrapper {
         transform: none;

css/print.css

@@ -7,7 +7,7 @@
 }
 
 #page-wrapper.page-wrapper {
-    transform: none;
+    transform: none !important;
     margin-inline-start: 0px;
     overflow-y: initial;
 }

css/variables.css

@@ -3,6 +3,8 @@
 
 :root {
     --sidebar-width: 300px;
+    --sidebar-resize-indicator-width: 8px;
+    --sidebar-resize-indicator-space: 2px;
     --page-padding: 15px;
     --content-max-width: 750px;
     --menu-bar-height: 50px;

developers/development-docker.html

@@ -195,7 +195,7 @@ <h2 id="running"><a class="header" href="#running">Running</a></h2>
 <p>First copy the variables,</p>
 <p>Set <code>HATSU_DOMAIN</code> to your prepared domain
 (e.g. <code>hatsu.example.com</code> without <code>https://</code>)</p>
-<p>and <code>HATSU_TEST_ACCOUNT</code> to your desired user domain
+<p>and <code>HATSU_PRIMARY_ACCOUNT</code> to your desired user domain
 (e.g. <code>blog.example.com</code> without <code>https://</code>)</p>
 <pre><code class="language-bash"># copy env example
 cp .env.example .env

developers/development-local.html

@@ -194,7 +194,7 @@ <h2 id="running"><a class="header" href="#running">Running</a></h2>
 <p>First copy the variables,</p>
 <p>Set <code>HATSU_DOMAIN</code> to your prepared domain
 (e.g. <code>hatsu.example.com</code> without <code>https://</code>)</p>
-<p>and <code>HATSU_TEST_ACCOUNT</code> to your desired user domain
+<p>and <code>HATSU_PRIMARY_ACCOUNT</code> to your desired user domain
 (e.g. <code>blog.example.com</code> without <code>https://</code>)</p>
 <pre><code class="language-bash"># copy env example
 cp .env.example .env

print.html

@@ -479,7 +479,7 @@ <h2 id="running"><a class="header" href="#running">Running</a></h2>
 <p>First copy the variables,</p>
 <p>Set <code>HATSU_DOMAIN</code> to your prepared domain
 (e.g. <code>hatsu.example.com</code> without <code>https://</code>)</p>
-<p>and <code>HATSU_TEST_ACCOUNT</code> to your desired user domain
+<p>and <code>HATSU_PRIMARY_ACCOUNT</code> to your desired user domain
 (e.g. <code>blog.example.com</code> without <code>https://</code>)</p>
 <pre><code class="language-bash"># copy env example
 cp .env.example .env
@@ -510,7 +510,7 @@ <h2 id="running-1"><a class="header" href="#running-1">Running</a></h2>
 <p>First copy the variables,</p>
 <p>Set <code>HATSU_DOMAIN</code> to your prepared domain
 (e.g. <code>hatsu.example.com</code> without <code>https://</code>)</p>
-<p>and <code>HATSU_TEST_ACCOUNT</code> to your desired user domain
+<p>and <code>HATSU_PRIMARY_ACCOUNT</code> to your desired user domain
 (e.g. <code>blog.example.com</code> without <code>https://</code>)</p>
 <pre><code class="language-bash"># copy env example
 cp .env.example .env