/
argonCard.R
127 lines (119 loc) · 4.16 KB
/
argonCard.R
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
#' Create a Boostrap 4 card
#'
#' Build an argon card
#'
#' @param ... Body content.
#' @param title Card title.
#' @param src Card external link.
#' @param hover_lift Whether to apply a lift effect on hover. FALSE by default.
#' Not compatible with floating.
#' @param shadow Whether to apply a shadow effect. FALSE by default.
#' @param shadow_size Card shadow size. Only if shadow is TRUE. NULL by default.
#' @param hover_shadow Only if shadow is TRUE. Whether to enlarge the shadow on hover. FALSE by default.
#' @param border_level Border level. O by default.
#' @param icon Card icon. Expect \link{argonIcon} or \link[shiny]{icon}.
#' @param btn_text Button text. src arg must not be NULL so that this button appears.
#' @param status Card status. See \url{https://demos.creative-tim.com/argon-design-system/docs/foundation/colors.html}.
#' @param background_color Card background color. NULL by default. See \url{https://demos.creative-tim.com/argon-design-system/docs/foundation/colors.html}.
#' @param gradient Whether to apply a gradient effect on the card background. FALSE by default.
#' @param floating Whether to animate the card by a vertical floating movement. FALSE by default.
#' Not compatible with hover_lift.
#' @param width Card width. Between 1 and 12.
#'
#' @examples
#' if (interactive()) {
#' library(argonR)
#' argonCard(
#' status = "primary",
#' width = 12,
#' title = "Card 1",
#' hover_lift = TRUE,
#' shadow = TRUE,
#' icon = argonIcon("check-bold"),
#' src = "#",
#' "Argon is a great free UI package based on Bootstrap 4
#' that includes the most important components and features."
#' )
#' }
#'
#'
#' @author David Granjon, \email{dgranjon@@ymail.com}
#'
#' @export
argonCard <- function(..., title = NULL, src = NULL, hover_lift = FALSE,
shadow = FALSE, shadow_size = NULL, hover_shadow = FALSE,
border_level = 0, icon = NULL, btn_text = "More",
status = "primary", background_color = NULL, gradient = FALSE,
floating = FALSE, width = 6) {
# set vertical space between card to 3 (cf BS4 spacing rules)
cardCl <- "card my-3"
# floating effect needs to be applied before shadow
if (floating) {
if (!hover_lift) cardCl <- paste0(cardCl, " floating")
}
if (shadow) {
if (!is.null(shadow_size)) {
cardCl <- paste0(cardCl, " shadow-", shadow_size)
} else {
cardCl <- paste0(cardCl, " shadow")
}
}
if (hover_lift) {
if(!floating) cardCl <- paste0(cardCl, " card-lift--hover")
}
if (shadow) {
if (hover_shadow) cardCl <- paste0(cardCl, " shadow-lg--hover")
}
if (!is.null(border_level)) cardCl <- paste0(cardCl, " border-", border_level)
if (gradient) {
if (!is.null(background_color)) cardCl <- paste0(cardCl, " bg-gradient-", background_color)
} else {
if (!is.null(background_color)) cardCl <- paste0(cardCl, " bg-", background_color)
}
iconCl <- "icon icon-shape rounded-circle mb-4"
if (!is.null(status)) iconCl <- paste0(iconCl, " icon-shape-", status)
cardTag <- htmltools::tags$div(
class = cardCl,
# header
if (!is.null(title)) {
htmltools::tags$div(
class = if (!is.null(background_color)) {
"card-header bg-transparent"
} else {
"card-header"
},
htmltools::tags$div(
class = "row align-items-center m-2",
# icon
if(!is.null(icon)) {
argonIconWrapper(
iconTag = icon,
circle = TRUE,
size = "sm",
shadow = TRUE,
status = status,
hover_shadow = FALSE
)
},
# title
htmltools::tags$h6(class = paste0("text-", status, " text-uppercase my-0 mx-1"), title)
)
)
},
htmltools::tags$div(
class = "card-body",
# content
htmltools::tags$p(class = "description", ...),
# external button
if (!is.null(src)) {
htmltools::a(
class = paste0("btn btn-", status, " mt-4"),
href = src,
target = "_blank",
btn_text
)
}
)
)
argonColumn(width = width, cardTag)
}