Deploying to gh-pages from @ c1bca1d 🚀

404.html

@@ -91,7 +91,9 @@
  <div class="sidebar-scrollbox">
  <ol class="chapter"><li class="chapter-item expanded "><a href="getting_started.html"><strong aria-hidden="true">1.</strong> Getting started</a></li></ol>
  </div>
- <div id="sidebar-resize-handle" class="sidebar-resize-handle"></div>
+ <div id="sidebar-resize-handle" class="sidebar-resize-handle">
+ <div class="sidebar-resize-indicator"></div>
+ </div>
  </nav>
 
  <!-- Track and set sidebar scroll position -->

css/chrome.css

@@ -1,7 +1,5 @@
 /* CSS for UI elements (a.k.a. chrome) */
 
-@import 'variables.css';
-
 html {
  scrollbar-color: var(--scrollbar) var(--bg);
 }
@@ -269,8 +267,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 +426,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 +465,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/general.css

@@ -1,7 +1,5 @@
 /* Base styles and content styles */
 
-@import 'variables.css';
-
 :root {
  /* Browser default font-size is 16px, this way 1 rem = 10px */
  font-size: 62.5%;

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;

getting_started.html

@@ -90,7 +90,9 @@
  <div class="sidebar-scrollbox">
  <ol class="chapter"><li class="chapter-item expanded "><a href="getting_started.html" class="active"><strong aria-hidden="true">1.</strong> Getting started</a></li></ol>
  </div>
- <div id="sidebar-resize-handle" class="sidebar-resize-handle"></div>
+ <div id="sidebar-resize-handle" class="sidebar-resize-handle">
+ <div class="sidebar-resize-indicator"></div>
+ </div>
  </nav>
 
  <!-- Track and set sidebar scroll position -->
@@ -182,7 +184,7 @@ <h2 id="creating-a-new-project-using-the-template"><a class="header" href="#crea
 <h2 id="adding-the-vizia-dependency"><a class="header" href="#adding-the-vizia-dependency">Adding the Vizia dependency</a></h2>
 <p>The template creates a nih-plug project without a GUI, so first we need to change the dependencies to include vizia into the project.</p>
 <p>Open the <code>Cargo.toml</code> file and add the following below the <code>nih_plug</code> dependency:</p>
-<pre><code class="language-toml">nih_plug_vizia = { git = &quot;https://github.com/robbert-vdh/nih-plug.git&quot; }
+<pre><code class="language-toml">nih_plug_vizia = { git = "https://github.com/robbert-vdh/nih-plug.git" }
 </code></pre>
 <p>Note that the git URL is the same as the <code>nih_plug</code> dependency above it as both crates are from the same repository.</p>
 <h2 id="adding-a-basic-vizia-gui"><a class="header" href="#adding-a-basic-vizia-gui">Adding a basic Vizia GUI</a></h2>
@@ -201,11 +203,12 @@ <h2 id="adding-a-basic-vizia-gui"><a class="header" href="#adding-a-basic-vizia-
  ViziaState::new(|| (200, 150)),
  ViziaTheming::Custom,
  move |cx, _| {
- Label::new(cx, &quot;Hello Plugin GUI&quot;);
+ Label::new(cx, "Hello Plugin GUI");
  },
  )
 }
 <span class="boring">}</span></code></pre></pre>
+<p><em>Make sure to change instances of <code>ViziaPlug</code> to the name of your plugin.</em></p>
 <p>The <code>create_vizia_editor</code> function creates the vizia GUI window with a size determined by the <code>ViziaState</code>. For now this state is hard-coded but later we'll move it to the plugin parameters so that the window state is remembered between successive openings of the window.</p>
 <p>Within the closure passed to the <code>create_vizia_editor</code> function is where we create the vizia GUI and add some controls. In this case we've added a simple label to begin with.</p>
 <p>To actually add the GUI to the plugin we need to add an <code>editor</code> method to the implementation of the<code>Plugin</code> trait for the <code>ViziaPlug</code> type. Add the following to the <code>lib.rs</code> file below the <code>process()</code> method:</p>
@@ -220,14 +223,14 @@ <h2 id="building-the-plugin"><a class="header" href="#building-the-plugin">Build
 <p>The plugin can be compiled with the following:</p>
 <pre><code class="language-shell">cargo xtask bundle vizia_plug --release
 </code></pre>
-<p>This will create both clap and vst versions of the plugin in the <code>target/bundled</code> directory. Simply move the <code>.vst</code> and/or <code>.clap</code> files to the appropriate folder(s) so that they can be found by the Digital Audio Workstation (DAW). </p>
+<p>This will create both clap and vst versions of the plugin in the <code>target/bundled</code> directory. Simply move the <code>.vst</code> and/or <code>.clap</code> files to the appropriate folder(s) so that they can be found by the Digital Audio Workstation (DAW).</p>
 <h2 id="running-the-plugin-standalone"><a class="header" href="#running-the-plugin-standalone">Running the plugin standalone</a></h2>
 <p>For testing purposes it can be useful to run the plugin standalone, which does not require a host.</p>
 <p>To run the plugin standalone, first add the <code>standalone</code> feature to the <code>nih_plug</code> dependency in the <code>Cargo.toml</code> file:</p>
-<pre><code class="language-toml">nih_plug = { git = &quot;https://github.com/robbert-vdh/nih-plug.git&quot;, features = [&quot;assert_process_allocs&quot;, &quot;standalone&quot;] }
+<pre><code class="language-toml">nih_plug = { git = "https://github.com/robbert-vdh/nih-plug.git", features = ["assert_process_allocs", "standalone"] }
 </code></pre>
-<p>Next, also in the <code>Cargo.toml</code> file, change the <code>crate-type</code> to include <code>&quot;lib&quot;</code>, like so:</p>
-<pre><code class="language-toml">crate-type = [&quot;cdylib&quot;, &quot;lib&quot;]
+<p>Next, also in the <code>Cargo.toml</code> file, change the <code>crate-type</code> to include <code>"lib"</code>, like so:</p>
+<pre><code class="language-toml">crate-type = ["cdylib", "lib"]
 </code></pre>
 <p>Then, add a <code>main.rs</code> file to the <code>src</code> directory with the following:</p>
 <pre><pre class="playground"><code class="language-rust">use nih_plug::prelude::*;
@@ -240,6 +243,7 @@ <h2 id="running-the-plugin-standalone"><a class="header" href="#running-the-plug
 <p>For the above to work the <code>ViziaPlug</code> struct must be made public.</p>
 <p>Finally, use <code>cargo run</code> to build and run the standalone version of the plugin:</p>
 <img src="./img/hello_gui.png" alt="" width="300"/>
+
  </main>
 
  <nav class="nav-wrapper" aria-label="Page navigation">

index.html

@@ -90,7 +90,9 @@
  <div class="sidebar-scrollbox">
  <ol class="chapter"><li class="chapter-item expanded "><a href="getting_started.html" class="active"><strong aria-hidden="true">1.</strong> Getting started</a></li></ol>
  </div>
- <div id="sidebar-resize-handle" class="sidebar-resize-handle"></div>
+ <div id="sidebar-resize-handle" class="sidebar-resize-handle">
+ <div class="sidebar-resize-indicator"></div>
+ </div>
  </nav>
 
  <!-- Track and set sidebar scroll position -->
@@ -182,7 +184,7 @@ <h2 id="creating-a-new-project-using-the-template"><a class="header" href="#crea
 <h2 id="adding-the-vizia-dependency"><a class="header" href="#adding-the-vizia-dependency">Adding the Vizia dependency</a></h2>
 <p>The template creates a nih-plug project without a GUI, so first we need to change the dependencies to include vizia into the project.</p>
 <p>Open the <code>Cargo.toml</code> file and add the following below the <code>nih_plug</code> dependency:</p>
-<pre><code class="language-toml">nih_plug_vizia = { git = &quot;https://github.com/robbert-vdh/nih-plug.git&quot; }
+<pre><code class="language-toml">nih_plug_vizia = { git = "https://github.com/robbert-vdh/nih-plug.git" }
 </code></pre>
 <p>Note that the git URL is the same as the <code>nih_plug</code> dependency above it as both crates are from the same repository.</p>
 <h2 id="adding-a-basic-vizia-gui"><a class="header" href="#adding-a-basic-vizia-gui">Adding a basic Vizia GUI</a></h2>
@@ -201,11 +203,12 @@ <h2 id="adding-a-basic-vizia-gui"><a class="header" href="#adding-a-basic-vizia-
  ViziaState::new(|| (200, 150)),
  ViziaTheming::Custom,
  move |cx, _| {
- Label::new(cx, &quot;Hello Plugin GUI&quot;);
+ Label::new(cx, "Hello Plugin GUI");
  },
  )
 }
 <span class="boring">}</span></code></pre></pre>
+<p><em>Make sure to change instances of <code>ViziaPlug</code> to the name of your plugin.</em></p>
 <p>The <code>create_vizia_editor</code> function creates the vizia GUI window with a size determined by the <code>ViziaState</code>. For now this state is hard-coded but later we'll move it to the plugin parameters so that the window state is remembered between successive openings of the window.</p>
 <p>Within the closure passed to the <code>create_vizia_editor</code> function is where we create the vizia GUI and add some controls. In this case we've added a simple label to begin with.</p>
 <p>To actually add the GUI to the plugin we need to add an <code>editor</code> method to the implementation of the<code>Plugin</code> trait for the <code>ViziaPlug</code> type. Add the following to the <code>lib.rs</code> file below the <code>process()</code> method:</p>
@@ -220,14 +223,14 @@ <h2 id="building-the-plugin"><a class="header" href="#building-the-plugin">Build
 <p>The plugin can be compiled with the following:</p>
 <pre><code class="language-shell">cargo xtask bundle vizia_plug --release
 </code></pre>
-<p>This will create both clap and vst versions of the plugin in the <code>target/bundled</code> directory. Simply move the <code>.vst</code> and/or <code>.clap</code> files to the appropriate folder(s) so that they can be found by the Digital Audio Workstation (DAW). </p>
+<p>This will create both clap and vst versions of the plugin in the <code>target/bundled</code> directory. Simply move the <code>.vst</code> and/or <code>.clap</code> files to the appropriate folder(s) so that they can be found by the Digital Audio Workstation (DAW).</p>
 <h2 id="running-the-plugin-standalone"><a class="header" href="#running-the-plugin-standalone">Running the plugin standalone</a></h2>
 <p>For testing purposes it can be useful to run the plugin standalone, which does not require a host.</p>
 <p>To run the plugin standalone, first add the <code>standalone</code> feature to the <code>nih_plug</code> dependency in the <code>Cargo.toml</code> file:</p>
-<pre><code class="language-toml">nih_plug = { git = &quot;https://github.com/robbert-vdh/nih-plug.git&quot;, features = [&quot;assert_process_allocs&quot;, &quot;standalone&quot;] }
+<pre><code class="language-toml">nih_plug = { git = "https://github.com/robbert-vdh/nih-plug.git", features = ["assert_process_allocs", "standalone"] }
 </code></pre>
-<p>Next, also in the <code>Cargo.toml</code> file, change the <code>crate-type</code> to include <code>&quot;lib&quot;</code>, like so:</p>
-<pre><code class="language-toml">crate-type = [&quot;cdylib&quot;, &quot;lib&quot;]
+<p>Next, also in the <code>Cargo.toml</code> file, change the <code>crate-type</code> to include <code>"lib"</code>, like so:</p>
+<pre><code class="language-toml">crate-type = ["cdylib", "lib"]
 </code></pre>
 <p>Then, add a <code>main.rs</code> file to the <code>src</code> directory with the following:</p>
 <pre><pre class="playground"><code class="language-rust">use nih_plug::prelude::*;
@@ -240,6 +243,7 @@ <h2 id="running-the-plugin-standalone"><a class="header" href="#running-the-plug
 <p>For the above to work the <code>ViziaPlug</code> struct must be made public.</p>
 <p>Finally, use <code>cargo run</code> to build and run the standalone version of the plugin:</p>
 <img src="./img/hello_gui.png" alt="" width="300"/>
+
  </main>
 
  <nav class="nav-wrapper" aria-label="Page navigation">

print.html

@@ -91,7 +91,9 @@
  <div class="sidebar-scrollbox">
  <ol class="chapter"><li class="chapter-item expanded "><a href="getting_started.html"><strong aria-hidden="true">1.</strong> Getting started</a></li></ol>
  </div>
- <div id="sidebar-resize-handle" class="sidebar-resize-handle"></div>
+ <div id="sidebar-resize-handle" class="sidebar-resize-handle">
+ <div class="sidebar-resize-indicator"></div>
+ </div>
  </nav>
 
  <!-- Track and set sidebar scroll position -->
@@ -183,7 +185,7 @@ <h2 id="creating-a-new-project-using-the-template"><a class="header" href="#crea
 <h2 id="adding-the-vizia-dependency"><a class="header" href="#adding-the-vizia-dependency">Adding the Vizia dependency</a></h2>
 <p>The template creates a nih-plug project without a GUI, so first we need to change the dependencies to include vizia into the project.</p>
 <p>Open the <code>Cargo.toml</code> file and add the following below the <code>nih_plug</code> dependency:</p>
-<pre><code class="language-toml">nih_plug_vizia = { git = &quot;https://github.com/robbert-vdh/nih-plug.git&quot; }
+<pre><code class="language-toml">nih_plug_vizia = { git = "https://github.com/robbert-vdh/nih-plug.git" }
 </code></pre>
 <p>Note that the git URL is the same as the <code>nih_plug</code> dependency above it as both crates are from the same repository.</p>
 <h2 id="adding-a-basic-vizia-gui"><a class="header" href="#adding-a-basic-vizia-gui">Adding a basic Vizia GUI</a></h2>
@@ -202,11 +204,12 @@ <h2 id="adding-a-basic-vizia-gui"><a class="header" href="#adding-a-basic-vizia-
  ViziaState::new(|| (200, 150)),
  ViziaTheming::Custom,
  move |cx, _| {
- Label::new(cx, &quot;Hello Plugin GUI&quot;);
+ Label::new(cx, "Hello Plugin GUI");
  },
  )
 }
 <span class="boring">}</span></code></pre></pre>
+<p><em>Make sure to change instances of <code>ViziaPlug</code> to the name of your plugin.</em></p>
 <p>The <code>create_vizia_editor</code> function creates the vizia GUI window with a size determined by the <code>ViziaState</code>. For now this state is hard-coded but later we'll move it to the plugin parameters so that the window state is remembered between successive openings of the window.</p>
 <p>Within the closure passed to the <code>create_vizia_editor</code> function is where we create the vizia GUI and add some controls. In this case we've added a simple label to begin with.</p>
 <p>To actually add the GUI to the plugin we need to add an <code>editor</code> method to the implementation of the<code>Plugin</code> trait for the <code>ViziaPlug</code> type. Add the following to the <code>lib.rs</code> file below the <code>process()</code> method:</p>
@@ -221,14 +224,14 @@ <h2 id="building-the-plugin"><a class="header" href="#building-the-plugin">Build
 <p>The plugin can be compiled with the following:</p>
 <pre><code class="language-shell">cargo xtask bundle vizia_plug --release
 </code></pre>
-<p>This will create both clap and vst versions of the plugin in the <code>target/bundled</code> directory. Simply move the <code>.vst</code> and/or <code>.clap</code> files to the appropriate folder(s) so that they can be found by the Digital Audio Workstation (DAW). </p>
+<p>This will create both clap and vst versions of the plugin in the <code>target/bundled</code> directory. Simply move the <code>.vst</code> and/or <code>.clap</code> files to the appropriate folder(s) so that they can be found by the Digital Audio Workstation (DAW).</p>
 <h2 id="running-the-plugin-standalone"><a class="header" href="#running-the-plugin-standalone">Running the plugin standalone</a></h2>
 <p>For testing purposes it can be useful to run the plugin standalone, which does not require a host.</p>
 <p>To run the plugin standalone, first add the <code>standalone</code> feature to the <code>nih_plug</code> dependency in the <code>Cargo.toml</code> file:</p>
-<pre><code class="language-toml">nih_plug = { git = &quot;https://github.com/robbert-vdh/nih-plug.git&quot;, features = [&quot;assert_process_allocs&quot;, &quot;standalone&quot;] }
+<pre><code class="language-toml">nih_plug = { git = "https://github.com/robbert-vdh/nih-plug.git", features = ["assert_process_allocs", "standalone"] }
 </code></pre>
-<p>Next, also in the <code>Cargo.toml</code> file, change the <code>crate-type</code> to include <code>&quot;lib&quot;</code>, like so:</p>
-<pre><code class="language-toml">crate-type = [&quot;cdylib&quot;, &quot;lib&quot;]
+<p>Next, also in the <code>Cargo.toml</code> file, change the <code>crate-type</code> to include <code>"lib"</code>, like so:</p>
+<pre><code class="language-toml">crate-type = ["cdylib", "lib"]
 </code></pre>
 <p>Then, add a <code>main.rs</code> file to the <code>src</code> directory with the following:</p>
 <pre><pre class="playground"><code class="language-rust">use nih_plug::prelude::*;
@@ -241,6 +244,7 @@ <h2 id="running-the-plugin-standalone"><a class="header" href="#running-the-plug
 <p>For the above to work the <code>ViziaPlug</code> struct must be made public.</p>
 <p>Finally, use <code>cargo run</code> to build and run the standalone version of the plugin:</p>
 <img src="./img/hello_gui.png" alt="" width="300"/>
+
  </main>
 
  <nav class="nav-wrapper" aria-label="Page navigation">