fix card fill on storm explorer

app/server.R

@@ -8,12 +8,12 @@ server <- function(input, output, session) {
         data = trimws(paste(
           ifelse(
             as.logical(.data[[col_names[3]]]),
-            '<span class="badge badge-primary">Fatality</span>',
+            "Fatality",
             ""
           ),
           ifelse(
             as.logical(.data[[col_names[4]]]),
-            '<span class="badge badge-success">Cost</span>',
+            "Cost",
             ""
           )
         ))
@@ -630,54 +630,24 @@ server <- function(input, output, session) {
     )
 
   output$growth_map <- renderLeaflet({
-    req(
+    leaflet() %>%
-      growth_counties(),
+      addProviderTiles("Stadia.AlidadeSmooth")
-      input$growth_trend_map_slider,
+  })
-      input$growth_map_metric
+
-    )
+  observe({
+    req(growth_counties())
 
     counties_data <- growth_counties()
     combined_geom <- st_union(counties_data)
     growth_bbox <- st_bbox(combined_geom)
 
-    growth_year <- input$growth_trend_map_slider
+    leafletProxy("growth_map") %>%
-    growth_county_year <- counties_data %>%
-      filter(year == growth_year)
-
-    map <- leaflet() %>%
-      addProviderTiles("Stadia.AlidadeSmooth") %>%
       fitBounds(
         lng1 = growth_bbox[["xmin"]],
         lng2 = growth_bbox[["xmax"]],
         lat1 = growth_bbox[["ymin"]],
         lat2 = growth_bbox[["ymax"]]
       )
-
-    if (input$growth_map_metric == "Population") {
-      map <- map %>%
-        addPolygons(
-          data = growth_county_year,
-          group = "counties",
-          fillColor = "red",
-          color = "red",
-          fillOpacity = ~population_opacity,
-          weight = 1,
-          popup = ~name
-        )
-    } else {
-      map <- map %>%
-        addPolygons(
-          data = growth_county_year,
-          group = "counties",
-          fillColor = "blue",
-          color = "blue",
-          fillOpacity = ~housing_opacity,
-          weight = 1,
-          popup = ~name
-        )
-    }
-
-    return(map)
   })
 
   observe({

app/ui.R

@@ -80,12 +80,11 @@ ui <- page_navbar(
   ),
   nav_panel(
     title = "Storm Explorer",
-    navset_underline(
+    navset_card_underline(
       nav_item(strong(textOutput("selected_storm_name_year"))),
       nav_panel(
         "Track",
-        layout_columns(
+        layout_column_wrap(
-          col_widths = 6,
           card(
             full_screen = TRUE,
             card_body(
@@ -178,7 +177,12 @@ ui <- page_navbar(
               )
             ),
             card(
-              leafletOutput("growth_map", height = "100%")
+              height = 500,
+              card_body(
+                class = "p-0",
+
+                leafletOutput("growth_map", height = "100%")
+              )
             ),
             card(
               fluidRow(