Title: | W3CSS for 'shiny' |
---|---|
Description: | An implementation of W3 CSS <https://www.w3schools.com/w3css/> for 'shiny'. |
Authors: | Colin Fay [aut, cre] |
Maintainer: | Colin Fay <[email protected]> |
License: | MIT + file LICENSE |
Version: | 0.0.0.9004 |
Built: | 2024-10-31 16:33:05 UTC |
Source: | https://github.com/ThinkR-open/w3css |
Implementation of W3.CSS Buttons, as described in https://www.w3schools.com/w3css/w3css_buttons.asp
w3_actionButton( inputId, label, type = c("btn", "button", "bar", "block", "circle", "ripple"), ... )
w3_actionButton( inputId, label, type = c("btn", "button", "bar", "block", "circle", "ripple"), ... )
inputId |
The |
label |
The contents of the button or linkâusually a text label, but you could also use any other HTML, like an image. |
type |
Class to apply to the button |
... |
Named attributes to be applied to the button or link. |
a UI element
w3_actionButton("ok", "Go")
w3_actionButton("ok", "Go")
Implementation of W3.CSS Animations, as described in https://www.w3schools.com/w3css/w3css_animate.asp
w3_animate_top() w3_animate_bottom() w3_animate_left() w3_animate_right() w3_animate_opacity() w3_animate_zoom() w3_animate_fading() w3_spin()
w3_animate_top() w3_animate_bottom() w3_animate_left() w3_animate_right() w3_animate_opacity() w3_animate_zoom() w3_animate_fading() w3_spin()
A W3 CSS class.
w3_animate_top()
w3_animate_top()
Implementation of W3.CSS Badges, as described in https://www.w3schools.com/w3css/w3css_badges.asp
w3_badge()
w3_badge()
A CSS class.
w3_badge()
w3_badge()
Implementation of W3.CSS borders, as described in www.w3schools.com/w3css/w3css_borders.asp.
w3_border() w3_border_top() w3_border_right() w3_border_bottom() w3_border_left() w3_border_0() w3_border_color(color) w3_hover_border_color(color) w3_bottombar() w3_leftbar(color) w3_rightbar(color) w3_topbar(color)
w3_border() w3_border_top() w3_border_right() w3_border_bottom() w3_border_left() w3_border_0() w3_border_color(color) w3_hover_border_color(color) w3_bottombar() w3_leftbar(color) w3_rightbar(color) w3_topbar(color)
color |
One of W3 css color |
A W3 CSS class.
w3_border() w3_border_top()
w3_border() w3_border_top()
Implementation of W3.CSS colors, as described in www.w3schools.com/w3css/w3css_colors.asp.
w3_color(color) w3_text_color(color) w3_hover_color(color)
w3_color(color) w3_text_color(color) w3_hover_color(color)
color |
One of W3 css color |
A css class
w3_color("red") w3_color("pink") w3_color("blue")
w3_color("red") w3_color("pink") w3_color("blue")
W3.CSS colors
w3_colors
w3_colors
A vector of colors
https://www.w3schools.com/w3css/w3css_colors.asp
Implementation of W3.CSS Containers, as described in https://www.w3schools.com/w3css/w3css_containers.asp
w3_container(..., type = "div")
w3_container(..., type = "div")
... |
Content of the container |
type |
HTML tag to use as a container. Default is |
A tag.
# Simple container w3_container("hey there") # Container with a 'teal'-colored background w3_container("hey there", class = w3_color("teal"))
# Simple container w3_container("hey there") # Container with a 'teal'-colored background w3_container("hey there", class = w3_color("teal"))
Implementation of W3.CSS Dropdowns, as described in https://www.w3schools.com/w3css/w3css_dropdowns.asp
w3_dropdown( button_text = "Hover Over Me!", content = list(), button_class = NULL, content_style = NULL )
w3_dropdown( button_text = "Hover Over Me!", content = list(), button_class = NULL, content_style = NULL )
button_text |
Text to display inside the button |
content |
Content of the dropdown |
button_class |
Additional class to add to the button |
content_style |
Additional style to add to the content tag |
An HTML div tag
w3_dropdown( button_text = "Hover Over Me!", content = "and I'll show you something cool", )
w3_dropdown( button_text = "Hover Over Me!", content = "and I'll show you something cool", )
Implementation of W3.CSS Built-In Responsiveness, as described in https://www.w3schools.com/w3css/w3css_responsive.asp
w3_half(...) w3_third(...) w3_twothird(...) w3_quarter(...) w3_threequarter(...) w3_rest(...) w3_col(...)
w3_half(...) w3_third(...) w3_twothird(...) w3_quarter(...) w3_threequarter(...) w3_rest(...) w3_col(...)
... |
UI elements to include |
a UI element.
w3_half("hey there")
w3_half("hey there")
Implementation of W3.CSS Text, as described in https://www.w3schools.com/w3css/w3css_text.asp
w3_left_align() w3_right_align() w3_center() w3_wide() w3_opacity()
w3_left_align() w3_right_align() w3_center() w3_wide() w3_opacity()
A CSS Class
w3_left_align()
w3_left_align()
Implementation of W3.CSS Lists, as described in https://www.w3schools.com/w3css/w3css_lists.asp
w3_list(..., ul_class = "")
w3_list(..., ul_class = "")
... |
a list tagList |
ul_class |
Additional CSS class for the ul. |
a tagList
w3_list( htmltools::tags$li("one") )
w3_list( htmltools::tags$li("one") )
Implementation of W3.CSS Modal, as described in https://www.w3schools.com/w3css/w3css_modal.asp
w3_modal( inputId, title = "", body = "", footer = "", color = "", display = "none" ) w3_show_modal(inputId, session = shiny::getDefaultReactiveDomain()) w3_hide_modal(inputId, session = shiny::getDefaultReactiveDomain())
w3_modal( inputId, title = "", body = "", footer = "", color = "", display = "none" ) w3_show_modal(inputId, session = shiny::getDefaultReactiveDomain()) w3_hide_modal(inputId, session = shiny::getDefaultReactiveDomain())
inputId |
The |
title , body , footer
|
Content to add in the modal |
color |
W3 CSS Color |
display |
Display style of the modal (either 'none' or 'block') |
session |
The |
a modal UI, or used for side effects.
w3_modal("one modal")
w3_modal("one modal")
Implementation of W3.CSS Padding, as described in https://www.w3schools.com/w3css/w3css_padding.asp
w3_padding(value = c("", 16, 24, 32, 48, 64, "small", "large"))
w3_padding(value = c("", 16, 24, 32, 48, 64, "small", "large"))
value |
The value of the padding. Must be one of "", 16, 24, 32, 48, 64, "small", or "large". |
A CSS class
w3_padding(16)
w3_padding(16)
W3 CSS Page
w3_page(...)
w3_page(...)
... |
Content of the page |
A shiny UI using W3.CSS
w3_page("hey there")
w3_page("hey there")
Implementation of W3.CSS colors, as described in www.w3schools.com/w3css/w3css_panels.asp.
w3_panel(..., with_close = FALSE)
w3_panel(..., with_close = FALSE)
... |
Content of the panel. |
with_close |
Add a close button to the panel. |
A tag.
# Simple container w3_panel("hey there") # Container with a 'teal'-colored background w3_panel("hey there", class = w3_color("teal"))
# Simple container w3_panel("hey there") # Container with a 'teal'-colored background w3_panel("hey there", class = w3_color("teal"))
Implementation of W3.CSS Input, as described in https://www.w3schools.com/w3css/w3css_input.asp
w3_radioButton(inputId, label, choices, choiceNames = NULL) w3_selectInput(inputId, label, choices, selected = NULL) w3_updateSelectInput( inputId, label = NULL, choices = NULL, session = shiny::getDefaultReactiveDomain() ) w3_textInput(inputId, label, placeholder = "") w3_passwordInput(inputId, label, placeholder = "") w3_dateInput(inputId, label, value = Sys.Date(), min = "", max = "") w3_editableListInput(inputId, label, choices, ul_class = "", li_class = "") w3_numericInput( inputId, label, value = NULL, min, max, step = NULL, placeholder = "" ) w3_updateNumericInput( inputId, label = NULL, placeholder = NULL, value = NULL, min = NULL, max = NULL, step = NULL, session = shiny::getDefaultReactiveDomain() ) w3_checkbox(inputId, label, value = FALSE) w3_checkboxGroupInput( inputId, label = NULL, choices, selected = NULL, choiceNames = NULL )
w3_radioButton(inputId, label, choices, choiceNames = NULL) w3_selectInput(inputId, label, choices, selected = NULL) w3_updateSelectInput( inputId, label = NULL, choices = NULL, session = shiny::getDefaultReactiveDomain() ) w3_textInput(inputId, label, placeholder = "") w3_passwordInput(inputId, label, placeholder = "") w3_dateInput(inputId, label, value = Sys.Date(), min = "", max = "") w3_editableListInput(inputId, label, choices, ul_class = "", li_class = "") w3_numericInput( inputId, label, value = NULL, min, max, step = NULL, placeholder = "" ) w3_updateNumericInput( inputId, label = NULL, placeholder = NULL, value = NULL, min = NULL, max = NULL, step = NULL, session = shiny::getDefaultReactiveDomain() ) w3_checkbox(inputId, label, value = FALSE) w3_checkboxGroupInput( inputId, label = NULL, choices, selected = NULL, choiceNames = NULL )
inputId |
The |
label |
Display label for the control, or |
choices |
List of values to select from (if elements of the list are
named then that name rather than the value is displayed to the user). If
this argument is provided, then |
choiceNames |
List of names and values, respectively, that are displayed to the user in the app and correspond to the each choice (for this reason, choiceNames and choiceValues must have the same length). If either of these arguments is provided, then the other must be provided and choices must not be provided. The advantage of using both of these over a named list for choices is that choiceNames allows any type of UI object to be passed through (tag objects, icons, HTML code, ...), instead of just simple text. See Examples. |
selected |
The initially selected value. If not specified, then it
defaults to the first item in |
session |
The |
placeholder |
A character string giving the user a hint as to what can be entered into the control. Internet Explorer 8 and 9 do not support this option. |
value |
Initial value. |
min |
The minimum allowed date. Either a Date object, or a string in
|
max |
The maximum allowed date. Either a Date object, or a string in
|
ul_class , li_class
|
CSS class for the internal elements. |
step |
Interval to use when stepping between min and max |
Input UI elements
w3_actionButton( "w3_actionButton", "Show Modal" )
w3_actionButton( "w3_actionButton", "Show Modal" )