Add Styling to right card
This commit is contained in:
@@ -55,18 +55,47 @@ auswahlmöglichkeiten <- crime_json %>%
|
||||
#User interface definitions
|
||||
ui <- function() {
|
||||
page_fillable(
|
||||
h1("Kriminalstatistik Hamburg",
|
||||
style = "color: #006400;",
|
||||
class = "ms-4 display-4"),# ms-4 sorgt für den Abstand links
|
||||
navset_card_tab(
|
||||
nav_panel("Karte",
|
||||
page_sidebar(
|
||||
layout_columns(
|
||||
leafletOutput("hhmap"),
|
||||
card(
|
||||
textOutput("txt_map_selection_bezirk"),
|
||||
textOutput("txt_map_selection_stadtteil"),
|
||||
div(
|
||||
# h3 oder div dient als Block-Element und richtet seinen Inhalt (das span) rechtsbündig aus
|
||||
style = "text-align: right; width: 100%; ",
|
||||
|
||||
# Der Text wird in ein span verpackt und erhält die Border.
|
||||
# Ein span nimmt nur den Platz ein, den der Inhalt benötigt (inline).
|
||||
tags$span(
|
||||
"2024",
|
||||
tableOutput("tbl_2024"),
|
||||
style = "
|
||||
border: 1px solid rgba(40,70,94,0.1);
|
||||
border-radius: 5px;
|
||||
padding: 5px 10px 5px 10px;
|
||||
background-color: #eeeeee;
|
||||
"
|
||||
# padding ist der abstand an leerer Fläche in der reihenfolge top right bottom left
|
||||
# farbe rgba ist die exakte Farbe der Trennlinien und Card-Umrandungen aus der App
|
||||
)
|
||||
),
|
||||
col_widths = c(7, 5),
|
||||
div(
|
||||
class = "d-flex align-items-end gap-2",
|
||||
h5(strong("Bezirk:"), style = "margin-bottom: 0;"),
|
||||
textOutput("txt_map_selection_bezirk"),
|
||||
),
|
||||
div(
|
||||
class = "d-flex align-items-end gap-2",
|
||||
h5(strong("Stadtteil:"), style = "margin-bottom: 0;"),
|
||||
textOutput("txt_map_selection_stadtteil"),
|
||||
),
|
||||
plotOutput("grph_top3"),
|
||||
#tableOutput("tbl_2024"),
|
||||
),
|
||||
col_widths = c(8, 4),
|
||||
),
|
||||
sidebar = sidebar(
|
||||
radioButtons(
|
||||
|
||||
Reference in New Issue
Block a user