Merge pull request #8 from azachwill/devcommit8

devcommit8

_build/blog/posts/announcing-new-r-shiny-ui-components/index.html

@@ -827,7 +827,7 @@ <h3 data-anchor-id="more-to-come">More to come</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"openEffect":"fade","selector":".lightbox","loop":false,"descPosition":"bottom","closeEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"openEffect":"fade","closeEffect":"fade","selector":".lightbox","descPosition":"bottom","loop":false});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/articles/build/tabsets/index.html

@@ -1772,7 +1772,7 @@ <h3 data-anchor-id="tabs-and-reactive-data">Tabs and Reactive Data</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"descPosition":"bottom","selector":".lightbox","closeEffect":"fade","loop":false,"openEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"selector":".lightbox","loop":false,"closeEffect":"fade","openEffect":"fade","descPosition":"bottom"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/customizing-ui/theming.html

@@ -1289,7 +1289,7 @@ <h3 data-anchor-id="your-turn">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"openEffect":"fade","selector":".lightbox","descPosition":"bottom","loop":false,"closeEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"loop":false,"openEffect":"fade","closeEffect":"fade","selector":".lightbox","descPosition":"bottom"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/hello-shiny/getting-started.html

@@ -1208,7 +1208,7 @@ <h3 data-anchor-id="your-turn">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"selector":".lightbox","loop":false,"closeEffect":"fade","descPosition":"bottom","openEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"closeEffect":"fade","selector":".lightbox","openEffect":"fade","loop":false,"descPosition":"bottom"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/hello-shiny/recap.html

@@ -967,7 +967,7 @@ <h3 data-anchor-id="section-3"></h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"closeEffect":"fade","loop":false,"selector":".lightbox","openEffect":"fade","descPosition":"bottom"});
+<script>var lightboxQuarto = GLightbox({"descPosition":"bottom","selector":".lightbox","openEffect":"fade","loop":false,"closeEffect":"fade"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/hello-shiny/server-function.html

@@ -1366,7 +1366,7 @@ <h3 data-anchor-id="your-turn">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"descPosition":"bottom","selector":".lightbox","loop":false,"openEffect":"fade","closeEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"closeEffect":"fade","loop":false,"descPosition":"bottom","selector":".lightbox","openEffect":"fade"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/hello-shiny/user-interface.html

@@ -1419,7 +1419,7 @@ <h3 data-anchor-id="your-turn-1">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"loop":false,"selector":".lightbox","closeEffect":"fade","descPosition":"bottom","openEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"openEffect":"fade","selector":".lightbox","loop":false,"descPosition":"bottom","closeEffect":"fade"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/reactive-flow/reactive-flow.html

@@ -1356,7 +1356,7 @@ <h3 data-anchor-id="your-turn-1">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"descPosition":"bottom","openEffect":"fade","closeEffect":"fade","selector":".lightbox","loop":false});
+<script>var lightboxQuarto = GLightbox({"closeEffect":"fade","selector":".lightbox","loop":false,"openEffect":"fade","descPosition":"bottom"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/reactive-flow/render-functions.html

@@ -1415,7 +1415,7 @@ <h3 data-anchor-id="your-turn-1">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"closeEffect":"fade","selector":".lightbox","loop":false,"descPosition":"bottom","openEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"openEffect":"fade","selector":".lightbox","descPosition":"bottom","closeEffect":"fade","loop":false});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/reactive-flow/ui-inputs.html

@@ -1733,7 +1733,7 @@ <h3 data-anchor-id="your-turn-3">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"closeEffect":"fade","loop":false,"openEffect":"fade","selector":".lightbox","descPosition":"bottom"});
+<script>var lightboxQuarto = GLightbox({"openEffect":"fade","closeEffect":"fade","loop":false,"selector":".lightbox","descPosition":"bottom"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/reactive-flow/ui-outputs.html

@@ -1746,7 +1746,7 @@ <h3 data-anchor-id="your-turn-3">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"selector":".lightbox","closeEffect":"fade","descPosition":"bottom","loop":false,"openEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"descPosition":"bottom","closeEffect":"fade","selector":".lightbox","loop":false,"openEffect":"fade"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/reactivity-essentials/reactive-elements.html

@@ -1388,7 +1388,7 @@ <h3 data-anchor-id="practice-identify-reactive-objects">Practice: Identify react
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"openEffect":"fade","selector":".lightbox","closeEffect":"fade","loop":false,"descPosition":"bottom"});
+<script>var lightboxQuarto = GLightbox({"openEffect":"fade","closeEffect":"fade","descPosition":"bottom","selector":".lightbox","loop":false});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/reactivity-essentials/reactives-observers.html

@@ -1040,7 +1040,7 @@ <h3 data-anchor-id="your-turn">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"openEffect":"fade","loop":false,"selector":".lightbox","descPosition":"bottom","closeEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"descPosition":"bottom","selector":".lightbox","loop":false,"openEffect":"fade","closeEffect":"fade"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/reactivity-essentials/recap.html

@@ -1177,7 +1177,7 @@ <h3 data-anchor-id="your-turn">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"loop":false,"openEffect":"fade","selector":".lightbox","descPosition":"bottom","closeEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"descPosition":"bottom","selector":".lightbox","closeEffect":"fade","loop":false,"openEffect":"fade"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/reactivity-essentials/stop-trigger-delay.html

@@ -1690,7 +1690,7 @@ <h2 data-anchor-id="practice---difference-between-eventreactive-and-observeevent
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"closeEffect":"fade","openEffect":"fade","selector":".lightbox","loop":false,"descPosition":"bottom"});
+<script>var lightboxQuarto = GLightbox({"openEffect":"fade","closeEffect":"fade","loop":false,"descPosition":"bottom","selector":".lightbox"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/build-an-app/reactivity-essentials/using-reactives.html

@@ -1519,7 +1519,7 @@ <h3 data-anchor-id="your-turn-1">Your turn</h3>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"openEffect":"fade","closeEffect":"fade","descPosition":"bottom","selector":".lightbox","loop":false});
+<script>var lightboxQuarto = GLightbox({"descPosition":"bottom","loop":false,"openEffect":"fade","closeEffect":"fade","selector":".lightbox"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/shiny-basics/lesson1/index.html

@@ -1192,7 +1192,7 @@ <h2 data-anchor-id="go-further">Go Further</h2>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"selector":".lightbox","closeEffect":"fade","loop":false,"openEffect":"fade","descPosition":"bottom"});
+<script>var lightboxQuarto = GLightbox({"selector":".lightbox","descPosition":"bottom","openEffect":"fade","closeEffect":"fade","loop":false});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {

_build/r/getstarted/shiny-basics/lesson2/index.html

@@ -522,7 +522,7 @@ <h2 data-anchor-id="layout">Layout</h2>
 <span id="cb2-4"><a href="#cb2-4" aria-hidden="true" tabindex="-1"></a>  <span class="st">"main contents"</span></span>
 <span id="cb2-5"><a href="#cb2-5" aria-hidden="true" tabindex="-1"></a>)</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
 <div class="border my-5">
-<p><a href="images/sidebar-layout1.png" class="lightbox" title="" data-gallery="quarto-lightbox-gallery-1"><img src="images/sidebar-layout1.png" class="img-fluid" alt="Sidebar on the left of the Shiny app"></a></p>
+<p><a href="images/sidebar-layout1.png" class="lightbox" data-gallery="quarto-lightbox-gallery-1" title=""><img src="images/sidebar-layout1.png" class="img-fluid" alt="Sidebar on the left of the Shiny app"></a></p>
 </div>
 <p>You can add additional elements to the main panel of the page by supplying them to <code>page_sidebar</code>.</p>
 <p>By default, the sidebar panel will appear on the left side of your app. You can move it to the right side by giving <code>sidebar</code> the optional argument <code>position = "right"</code>.</p>
@@ -532,7 +532,7 @@ <h2 data-anchor-id="layout">Layout</h2>
 <span id="cb3-4"><a href="#cb3-4" aria-hidden="true" tabindex="-1"></a>  <span class="st">"Main contents"</span></span>
 <span id="cb3-5"><a href="#cb3-5" aria-hidden="true" tabindex="-1"></a>)</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
 <div class="border my-5">
-<p><a href="images/sidebar-layout2.png" class="lightbox" title="" data-gallery="quarto-lightbox-gallery-2"><img src="images/sidebar-layout2.png" class="img-fluid" alt="Sidebar on the right of the Shiny app"></a></p>
+<p><a href="images/sidebar-layout2.png" class="lightbox" data-gallery="quarto-lightbox-gallery-2" title=""><img src="images/sidebar-layout2.png" class="img-fluid" alt="Sidebar on the right of the Shiny app"></a></p>
 </div>
 <p><code>page_sidebar</code> creates a sidebar layout that fills the page, and is a quick way to create a page with a sidebar. If you’d like to create a floating sidebar layout that can appear anywhere on the page, use <code>page_fluid</code> and <code>layout_sidebar</code>.</p>
 <div class="sourceCode" id="cb4"><pre class="sourceCode r code-with-copy"><code class="sourceCode r"><span id="cb4-1"><a href="#cb4-1" aria-hidden="true" tabindex="-1"></a>ui <span class="ot">&lt;-</span> <span class="fu">page_fluid</span>(</span>
@@ -552,7 +552,7 @@ <h2 data-anchor-id="cards">Cards</h2>
 <span id="cb5-4"><a href="#cb5-4" aria-hidden="true" tabindex="-1"></a>  <span class="fu">card</span>()</span>
 <span id="cb5-5"><a href="#cb5-5" aria-hidden="true" tabindex="-1"></a>)</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
 <p><code>card()</code> creates a regular container with borders and padding.</p>
-<p><a href="images/card.png" class="lightbox" title="" data-gallery="quarto-lightbox-gallery-3"><img src="images/card.png" class="border my-5 img-fluid" alt="Example card"></a> Use cards to grouped related information. Add content to a card by supplying arguments to <code>card()</code>.</p>
+<p><a href="images/card.png" class="lightbox" data-gallery="quarto-lightbox-gallery-3" title=""><img src="images/card.png" class="border my-5 img-fluid" alt="Example card"></a> Use cards to grouped related information. Add content to a card by supplying arguments to <code>card()</code>.</p>
 <div class="sourceCode" id="cb6"><pre class="sourceCode r code-with-copy"><code class="sourceCode r"><span id="cb6-1"><a href="#cb6-1" aria-hidden="true" tabindex="-1"></a>ui <span class="ot">&lt;-</span> <span class="fu">page_sidebar</span>(</span>
 <span id="cb6-2"><a href="#cb6-2" aria-hidden="true" tabindex="-1"></a>  <span class="at">title =</span> <span class="st">"title panel"</span>,</span>
 <span id="cb6-3"><a href="#cb6-3" aria-hidden="true" tabindex="-1"></a>  <span class="at">sidebar =</span> <span class="fu">sidebar</span>(<span class="st">"Sidebar"</span>),</span>
@@ -569,7 +569,7 @@ <h2 data-anchor-id="cards">Cards</h2>
 <span id="cb7-6"><a href="#cb7-6" aria-hidden="true" tabindex="-1"></a>    <span class="st">"Card body"</span></span>
 <span id="cb7-7"><a href="#cb7-7" aria-hidden="true" tabindex="-1"></a>  )</span>
 <span id="cb7-8"><a href="#cb7-8" aria-hidden="true" tabindex="-1"></a>)</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
-<p><a href="images/card-header.png" class="lightbox" title="" data-gallery="quarto-lightbox-gallery-4"><img src="images/card-header.png" class="border my-5 img-fluid" alt="Shiny app with a card that includes a card header."></a></p>
+<p><a href="images/card-header.png" class="lightbox" data-gallery="quarto-lightbox-gallery-4" title=""><img src="images/card-header.png" class="border my-5 img-fluid" alt="Shiny app with a card that includes a card header."></a></p>
 <p>See the bslib <a href="https://rstudio.github.io/bslib/articles/cards/">Cards article</a> to learn more about cards.</p>
 </section>
 <section id="value-boxes" class="level2">
@@ -597,13 +597,13 @@ <h2 data-anchor-id="value-boxes">Value boxes</h2>
 <span id="cb9-10"><a href="#cb9-10" aria-hidden="true" tabindex="-1"></a>  <span class="fu">card</span>(<span class="st">"Card"</span>),</span>
 <span id="cb9-11"><a href="#cb9-11" aria-hidden="true" tabindex="-1"></a>  <span class="fu">card</span>(<span class="st">"Another card"</span>)</span>
 <span id="cb9-12"><a href="#cb9-12" aria-hidden="true" tabindex="-1"></a>)</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
-<p><a href="images/value-box.png" class="lightbox" title="" data-gallery="quarto-lightbox-gallery-5"><img src="images/value-box.png" class="border my-5 img-fluid" alt="Shiny app with a value box and two cards."></a> To learn more about value boxes, including how to add multiple value boxes to your app, see the bslib <a href="https://rstudio.github.io/bslib/articles/value-boxes/index.html">Value Boxes article</a>.</p>
+<p><a href="images/value-box.png" class="lightbox" data-gallery="quarto-lightbox-gallery-5" title=""><img src="images/value-box.png" class="border my-5 img-fluid" alt="Shiny app with a value box and two cards."></a> To learn more about value boxes, including how to add multiple value boxes to your app, see the bslib <a href="https://rstudio.github.io/bslib/articles/value-boxes/index.html">Value Boxes article</a>.</p>
 </section>
 <section id="your-turn" class="level2">
 <h2 data-anchor-id="your-turn">Your turn</h2>
 <p>You can use Shiny’s layout, card, and value box functions to create attractive and useful user interfaces. See how well you understand these functions by recreating the Shiny app pictured below. Use the examples in this tutorial to work on it and then test it out.</p>
 <p>Our <code>app.R</code> script is found under the Model Answer button, but don’t just copy and paste it. Make sure you understand how the code works before moving on.</p>
-<p><a href="images/my-shiny-app.png" class="lightbox" title="" data-gallery="quarto-lightbox-gallery-6"><img src="images/my-shiny-app.png" class="border my-5 img-fluid" alt="Example Shiny app"></a></p>
+<p><a href="images/my-shiny-app.png" class="lightbox" data-gallery="quarto-lightbox-gallery-6" title=""><img src="images/my-shiny-app.png" class="border my-5 img-fluid" alt="Example Shiny app"></a></p>
 <section id="model-answer" class="level3">
 <h3 data-anchor-id="model-answer">Model Answer</h3>
 <div class="callout callout-style-default callout-note callout-titled">
@@ -1126,7 +1126,7 @@ <h2 data-anchor-id="recap">Recap</h2>
     </div>
   </div>
 </footer>
-<script>var lightboxQuarto = GLightbox({"closeEffect":"fade","selector":".lightbox","descPosition":"bottom","loop":false,"openEffect":"fade"});
+<script>var lightboxQuarto = GLightbox({"loop":false,"openEffect":"fade","selector":".lightbox","closeEffect":"fade","descPosition":"bottom"});
 (function() {
   let previousOnload = window.onload;
   window.onload = () => {