From cd460648cebf722b897425ab19da1aadebf0aa29 Mon Sep 17 00:00:00 2001
From: vedhav <vedhaviyash4@gmail.com>
Date: Mon, 28 Jul 2025 19:29:01 +0530
Subject: [PATCH 1/3] feat: improve spacing

---
 R/init.R               | 4 ++--
 R/module_nested_tabs.R | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/R/init.R b/R/init.R
index 5df6505c94..56fed3f7ed 100644
--- a/R/init.R
+++ b/R/init.R
@@ -219,7 +219,7 @@ init <- function(data,
           ),
           tags$header(
             id = "teal-header",
-            style = "margin: 0.5em",
+            style = "margin: 1em 1em 0 1em;",
             tags$div(id = "teal-header-content")
           ),
           ui_teal(
@@ -228,7 +228,7 @@ init <- function(data,
           ),
           tags$footer(
             id = "teal-footer",
-            style = "margin: 0.5em",
+            style = "margin: 0.5em 1em;",
             tags$div(id = "teal-footer-content"),
             ui_session_info("teal-footer-session_info")
           )
diff --git a/R/module_nested_tabs.R b/R/module_nested_tabs.R
index 5ecf07dbb9..3c3222cd19 100644
--- a/R/module_nested_tabs.R
+++ b/R/module_nested_tabs.R
@@ -586,8 +586,8 @@ srv_teal_module <- function(id,
 }
 
 .modules_breadcrumb <- function(module) {
-  tags$span(
-    style = "color: var(--bs-secondary); font-size: medium;opacity: 0.6; margin-left: 0.5em;",
+  tags$div(
+    style = "color: var(--bs-secondary); font-size: large; opacity: 0.6; margin: 0 0.5em 0.5em 0.5em;",
     paste("Home", module$path, sep = " / ")
   )
 }

From 002c73f25239ffd30d59264873a0f4d8f624720a Mon Sep 17 00:00:00 2001
From: vedhav <vedhaviyash4@gmail.com>
Date: Wed, 30 Jul 2025 18:19:30 +0530
Subject: [PATCH 2/3] feat: disable modal-open buttons when shiny is busy

---
 R/utils.R                                    | 12 ++++++++++--
 inst/css/custom.css                          | 14 ++++++++++++--
 inst/js/busy-disable.js                      |  6 ++++++
 inst/module-navigation/module-navigation.css |  4 ----
 4 files changed, 28 insertions(+), 8 deletions(-)
 create mode 100644 inst/js/busy-disable.js

diff --git a/R/utils.R b/R/utils.R
index 52f5af400b..0528d8284f 100644
--- a/R/utils.R
+++ b/R/utils.R
@@ -514,9 +514,17 @@ pluralize <- function(x, singular, plural = NULL) {
 .expand_button <- function(id, label, icon) {
   tags$span(
     class = "teal expand-button",
-    tags$a(
+    htmltools::htmlDependency(
+      name = "teal-busy-disable",
+      version = utils::packageVersion("teal"),
+      package = "teal",
+      src = "js",
+      script = "busy-disable.js"
+    ),
+    shinyjs::useShinyjs(),
+    tags$button(
       id = id,
-      class = "action-button",
+      class = "action-button teal-busy-disable",
       role = "button",
       style = "text-decoration: none;",
       tags$span(class = "icon", bsicons::bs_icon(icon, class = "text-primary")),
diff --git a/inst/css/custom.css b/inst/css/custom.css
index 46bd4d4e94..c292fc7f37 100644
--- a/inst/css/custom.css
+++ b/inst/css/custom.css
@@ -86,11 +86,21 @@ body > div:has(~ #shiny-modal-wrapper .blur_background) {
   transition: max-width 0.3s ease;
 }
 
-.teal.expand-button a {
+.teal.expand-button button {
+  color: var(--bs-primary);
+  background-color: transparent;
   border: 2px solid transparent;
   padding: 0.5rem;
 }
 
+.teal.expand-button button:disabled {
+  color: var(--bs-dark-text-emphasis);
+}
+
+.teal.expand-button:hover button:disabled {
+  border-bottom: 2px solid var(--bs-dark-bg-subtle);
+}
+
 .teal.expand-button .label {
   opacity: 0;
   transition: opacity 0.2s ease;
@@ -100,7 +110,7 @@ body > div:has(~ #shiny-modal-wrapper .blur_background) {
   max-width: 200px;
 }
 
-.teal.expand-button:hover a {
+.teal.expand-button:hover button {
   border-bottom: 2px solid var(--bs-primary-border-subtle);
 }
 
diff --git a/inst/js/busy-disable.js b/inst/js/busy-disable.js
new file mode 100644
index 0000000000..6c386beca2
--- /dev/null
+++ b/inst/js/busy-disable.js
@@ -0,0 +1,6 @@
+$(document).on("shiny:busy", function () {
+  $(".teal-busy-disable").prop("disabled", true);
+});
+$(document).on("shiny:idle", function () {
+  $(".teal-busy-disable").prop("disabled", false);
+});
diff --git a/inst/module-navigation/module-navigation.css b/inst/module-navigation/module-navigation.css
index 62e608e5c4..722002acf9 100644
--- a/inst/module-navigation/module-navigation.css
+++ b/inst/module-navigation/module-navigation.css
@@ -61,10 +61,6 @@
   position: relative;
 }
 
-.dropdown.nav-item-custom .teal-reporter.outline-button .badge {
-  margin-left: 1em;
-}
-
 .teal.dropdown-button {
   border: 2px solid transparent;
   margin: 0.25em;

From ced7fe76c8de6d74c22f4798836a2d3bf524d32e Mon Sep 17 00:00:00 2001
From: Vedha Viyash <49812166+vedhav@users.noreply.github.com>
Date: Fri, 1 Aug 2025 16:18:03 +0530
Subject: [PATCH 3/3] Update inst/js/busy-disable.js

Signed-off-by: Vedha Viyash <49812166+vedhav@users.noreply.github.com>
---
 inst/js/busy-disable.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/inst/js/busy-disable.js b/inst/js/busy-disable.js
index 6c386beca2..67b730db51 100644
--- a/inst/js/busy-disable.js
+++ b/inst/js/busy-disable.js
@@ -1,3 +1,5 @@
+// Primarily added to make sure the user does not open multiple modals when shiny is busy.
+// https://github.com/rstudio/shiny/issues/4261
 $(document).on("shiny:busy", function () {
   $(".teal-busy-disable").prop("disabled", true);
 });