refactor: wrapped related widgets in section tags

pharmaverse · Jan 9, 2025 · ef5a952 · ef5a952
1 parent 8125f45
commit ef5a952
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 6 deletions.
diff --git a/inst/shiny/modules/column_mapping.R b/inst/shiny/modules/column_mapping.R
@@ -109,11 +109,17 @@ column_mapping_ui <- function(id) {
           class = "column-mapping-output",
           span("Additional Grouping Variables")
         )
-      ),
+      )
+    ),
+    tags$section(
+      class = "column-mapping-section",
       h5("Sample Variables"),
       .column_mapping_widget(ns, "ANALYTE", "Analyte"),
       .column_mapping_widget(ns, "PCSPEC", "Matrix"),
-      .column_mapping_widget(ns, "AVAL", "Analysis value in numeric format."),
+      .column_mapping_widget(ns, "AVAL", "Analysis value in numeric format.")
+    ),
+    tags$section(
+      class = "column-mapping-section",
       h5("Dose Variables"),
       .column_mapping_widget(ns, "DOSNO", "Numeric format."),
       .column_mapping_widget(
@@ -125,12 +131,18 @@ column_mapping_ui <- function(id) {
         ns, "ADOSEDUR",
         "Duration of dose administration.\nOnly required for infusion studies,
         otherwise select NA"
-      ),
+      )
+    ),
+    tags$section(
+      class = "column-mapping-section",
       h5("Time Variables"),
       .column_mapping_widget(ns, "AFRLT", "Numeric format"),
       .column_mapping_widget(ns, "ARRLT", "Numeric format"),
       .column_mapping_widget(ns, "NFRLT", "Numeric format"),
-      .column_mapping_widget(ns, "NRRLT", "Numeric format"),
+      .column_mapping_widget(ns, "NRRLT", "Numeric format")
+    ),
+    tags$section(
+      class = "column-mapping-section",
       h5("Unit Variables"),
       .column_mapping_widget(ns, "AVALU", "Unit of analysis value."),
       .column_mapping_widget(ns, "DOSEU", "Unit of dose amount."),

diff --git a/inst/shiny/www/style.css b/inst/shiny/www/style.css
@@ -37,9 +37,10 @@
   color: grey;
 }
 
-.column-mapping-section {
-  margin-bottom: 1rem;
+.column-mapping-section h5 {
+  font-weight: bold;
 }
+
 /* Style adjustments for headings */
 h5 {
   margin-bottom: -1.5rem;