| Type: | Package |
| Title: | Customise the Appearance of 'shinydashboard' Applications using Themes |
| Version: | 1.1.6 |
| Maintainer: | Nik Lilovski <nik.lilovski@outlook.com> |
| Description: | Allows manual creation of themes and logos to be used in applications created using the 'shinydashboard' package. Removes the need to change the underlying css code by wrapping it into a set of convenient R functions. |
| URL: | https://github.com/nik01010/dashboardthemes |
| BugReports: | https://github.com/nik01010/dashboardthemes/issues |
| Depends: | R (≥ 3.2.3) |
| Imports: | htmltools (≥ 0.3.5) |
| Suggests: | testthat, lintr, knitr, rmarkdown, glue, covr |
| License: | MIT + file LICENSE |
| Encoding: | UTF-8 |
| RoxygenNote: | 7.2.0 |
| VignetteBuilder: | knitr |
| NeedsCompilation: | no |
| Packaged: | 2022-07-13 17:57:45 UTC; Nik |
| Author: | Nik Lilovski [aut, cre] |
| Repository: | CRAN |
| Date/Publication: | 2022-07-13 18:20:02 UTC |
cssGradientThreeColors
Description
Generates CSS code for a gradient with three colors
Usage
cssGradientThreeColors(
direction = "down",
colorStart,
colorMiddle,
colorEnd,
colorStartPos = 0,
colorMiddlePos = 50,
colorEndPos = 100
)
Arguments
direction |
String. Direction of the gradient (down/right). Defaults to down. |
colorStart |
String. Start (top/left) colour of the gradient. |
colorMiddle |
String. Middle colour of the gradient. |
colorEnd |
String. End (bottom/right) colour of the gradient. |
colorStartPos |
Numeric. Position of the start colour. Defaults to 0. |
colorMiddlePos |
Numeric. Position of the middle colour. Defaults to 50. |
colorEndPos |
Numeric. Position of the end colour; defaults to 100. |
Value
CSS code. Gradient with three colors.
See Also
shinyDashboardThemeDIY, shinyDashboardLogoDIY,
Examples
cssGradientThreeColors(
direction = "right"
,colorStart = "rgba(44,222,235,1)"
,colorMiddle = "rgba(44,222,235,1)"
,colorEnd = "rgba(0,255,213,1)"
,colorStartPos = 0
,colorMiddlePos = 30
,colorEndPos = 100
)
dashboardthemes: a package for custom themes in shinydashboard applications
Description
The dashboardthemes package provides two main important features:
Using new pre-defined themes and logos for dashboards.
Creating custom themes and logos for dashboards.
Available functions
The available functions are:
-
shinyDashboardThemes: Calls a custom theme created using shinyDashboardThemeDIY. -
shinyDashboardLogo: Calls a custom logo created using shinyDashboardLogoDIY. -
shinyDashboardThemeDIY: Creates a custom theme object. -
shinyDashboardLogoDIY: Creates a custom logo object. Inspired from here. -
cssGradientThreeColors: Creates a three colour gradient to be used in themes.
logo_blue_gradient
Description
Blue Gradient logo for a shinydashboard application
Usage
logo_blue_gradient(boldText = "Shiny", mainText = "App", badgeText = "v1.1")
Arguments
boldText |
String. Bold text for the logo. |
mainText |
String. Main text for the logo. |
badgeText |
String. Text for the logo badge. |
Value
Object produced by shinyDashboardLogoDIY
See Also
logo_flat_red
Description
Flat Red logo for a shinydashboard application
Usage
logo_flat_red(boldText = "Shiny", mainText = "App", badgeText = "v1.1")
Arguments
boldText |
String. Bold text for the logo. |
mainText |
String. Main text for the logo. |
badgeText |
String. Text for the logo badge. |
Value
Object produced by shinyDashboardLogoDIY
See Also
logo_grey_dark
Description
Grey Dark logo for a shinydashboard application
Usage
logo_grey_dark(boldText = "Shiny", mainText = "App", badgeText = "v1.1")
Arguments
boldText |
String. Bold text for the logo. |
mainText |
String. Main text for the logo. |
badgeText |
String. Text for the logo badge. |
Value
Object produced by shinyDashboardLogoDIY
See Also
logo_grey_light
Description
Grey Light logo for a shinydashboard application
Usage
logo_grey_light(boldText = "Shiny", mainText = "App", badgeText = "v1.1")
Arguments
boldText |
String. Bold text for the logo. |
mainText |
String. Main text for the logo. |
badgeText |
String. Text for the logo badge. |
Value
Object produced by shinyDashboardLogoDIY
See Also
logo_onenote
Description
OneNote logo for a shinydashboard application
Usage
logo_onenote(boldText = "Shiny", mainText = "App", badgeText = "v1.1")
Arguments
boldText |
String. Bold text for the logo. |
mainText |
String. Main text for the logo. |
badgeText |
String. Text for the logo badge. |
Value
Object produced by shinyDashboardLogoDIY
See Also
logo_poor_mans_flatly
Description
Poor Man's Flatly logo for a shinydashboard application
Usage
logo_poor_mans_flatly(boldText = "Shiny", mainText = "App", badgeText = "v1.1")
Arguments
boldText |
String. Bold text for the logo. |
mainText |
String. Main text for the logo. |
badgeText |
String. Text for the logo badge. |
Value
Object produced by shinyDashboardLogoDIY
See Also
logo_purple_gradient
Description
Purple Gradient logo for a shinydashboard application
Usage
logo_purple_gradient(boldText = "Shiny", mainText = "App", badgeText = "v1.1")
Arguments
boldText |
String. Bold text for the logo. |
mainText |
String. Main text for the logo. |
badgeText |
String. Text for the logo badge. |
Value
Object produced by shinyDashboardLogoDIY
See Also
shinyDashboardLogo
Description
Calls a custom logo object created using shinyDashboardLogoDIY
Usage
shinyDashboardLogo(
theme,
boldText = "Shiny",
mainText = "App",
badgeText = "v1.1"
)
Arguments
theme |
String. Name of theme to be used |
boldText |
String. Bold text for the logo. |
mainText |
String. Main text for the logo. |
badgeText |
String. Text for the logo badge. |
Value
HTML code. Logo for shinydashboard's sidebar.
Note
This logo design was inspired from http://www.dataseries.org/.
See Also
shinyDashboardLogoDIY, shinyDashboardThemes
Examples
#...
### ui
#ui <- dashboardPage(
### ui header
#dashboardHeader(
### changing logo
title = shinyDashboardLogo(
theme = "blue_gradient",
boldText = "Shiny",
mainText = "App",
badgeText = "v1.1"
)
#...
shinyDashboardLogoDIY
Description
Creates a custom logo object for a shinydashboard application
Usage
shinyDashboardLogoDIY(
boldText,
mainText,
textSize = 15,
badgeText,
badgeTextColor,
badgeTextSize = 2,
badgeBackColor,
badgeBorderRadius = 3
)
Arguments
boldText |
String. Bold text for the logo. |
mainText |
String. Main text for the logo. |
textSize |
Numeric. Text size for the logo. Defaults to 15. |
badgeText |
String. Text for the logo badge. |
badgeTextColor |
String. Text color of the logo badge. |
badgeTextSize |
Numeric. Text color of the logo badge. Defaults to 2. |
badgeBackColor |
String. Background color of the logo badge. |
badgeBorderRadius |
Numeric. Border radius of the logo badge. Defaults to 3. |
Value
HTML code. Logo for shinydashboard's sidebar.
Note
This logo design was inspired from http://www.dataseries.org/.
See Also
shinyDashboardLogo, cssGradientThreeColors
Examples
customLogo <- shinyDashboardLogoDIY(
boldText = "SD"
,mainText = "Themes"
,textSize = 16
,badgeText = "v1.1"
,badgeTextColor = "white"
,badgeTextSize = 2
,badgeBackColor = "#40E0D0"
,badgeBorderRadius = 3
)
shinyDashboardThemeDIY
Description
Creates a custom theme object for a shinydashboard application
Usage
shinyDashboardThemeDIY(
appFontFamily,
appFontColor,
logoBackColor,
bodyBackColor,
headerButtonBackColor,
headerButtonIconColor,
headerButtonBackColorHover,
headerButtonIconColorHover,
headerBackColor,
headerBoxShadowColor,
headerBoxShadowSize,
sidebarBackColor,
sidebarPadding,
sidebarShadowRadius,
sidebarShadowColor,
sidebarMenuBackColor,
sidebarMenuPadding,
sidebarMenuBorderRadius,
sidebarUserTextColor,
sidebarSearchBackColor,
sidebarSearchIconColor,
sidebarSearchBorderColor,
sidebarTabTextColor,
sidebarTabTextSize,
sidebarTabBorderStyle,
sidebarTabBorderColor,
sidebarTabBorderWidth,
sidebarTabBackColorSelected,
sidebarTabTextColorSelected,
sidebarTabRadiusSelected,
sidebarTabTextColorHover,
sidebarTabBackColorHover,
sidebarTabBorderStyleHover,
sidebarTabBorderColorHover,
sidebarTabBorderWidthHover,
sidebarTabRadiusHover,
boxBackColor,
boxBorderRadius,
boxShadowSize,
boxShadowColor,
boxTitleSize,
boxDefaultColor,
boxPrimaryColor,
boxSuccessColor,
boxWarningColor,
boxDangerColor,
tabBoxTabColor,
tabBoxTabTextSize,
tabBoxTabTextColor,
tabBoxTabTextColorSelected,
tabBoxBackColor,
tabBoxHighlightColor,
tabBoxBorderRadius,
buttonBackColor,
buttonTextColor,
buttonBorderColor,
buttonBorderRadius,
buttonBackColorHover,
buttonTextColorHover,
buttonBorderColorHover,
buttonHeight = "auto",
buttonPadding = "6px 12px",
textboxBackColor,
textboxBorderColor,
textboxBorderRadius,
textboxBackColorSelect,
textboxBorderColorSelect,
textboxHeight = "auto",
textboxPadding = "6px 12px",
tableBackColor,
tableBorderColor,
tableBorderTopSize,
tableBorderRowSize,
primaryFontColor = "auto",
successFontColor = "auto",
warningFontColor = "auto",
dangerFontColor = "auto",
infoFontColor = "auto",
boxInfoColor = "auto"
)
Arguments
appFontFamily |
String. Application font. |
appFontColor |
String. Application font colour. |
logoBackColor |
String. Logo background colour. |
bodyBackColor |
String. Main page background colour. |
headerButtonBackColor |
String. Sidebar toggle button background colour. |
headerButtonIconColor |
String. Sidebar toggle button icon colour. |
headerButtonBackColorHover |
String. Sidebar toggle button background colour: hovered. |
headerButtonIconColorHover |
String. Sidebar toggle button icon colour: hovered. |
headerBackColor |
String. Top header background colour. |
headerBoxShadowColor |
String. Top header shadow colour. |
headerBoxShadowSize |
String. Top header shadow size. |
sidebarBackColor |
String. Sidebar background colour. |
sidebarPadding |
Numeric. Sidebar inner padding. |
sidebarShadowRadius |
String. Sidebar shadow radius. |
sidebarShadowColor |
String. Sidebar shadow colour. |
sidebarMenuBackColor |
String. Sidebar menu background colour. |
sidebarMenuPadding |
Numeric. Sidebar menu inner padding. |
sidebarMenuBorderRadius |
Numeric. Sidebar menu shape radius. |
sidebarUserTextColor |
String. Sidebar userbox text colour. |
sidebarSearchBackColor |
String. Sidebar searchbox background colour. |
sidebarSearchIconColor |
String. Sidebar searchbox icon colour. |
sidebarSearchBorderColor |
String. Sidebar searchbox border line colour. |
sidebarTabTextColor |
String. Sidebar tab font colour. |
sidebarTabTextSize |
Numeric. Sidebar tab font size. |
sidebarTabBorderStyle |
String. Sidebar tab border line style. |
sidebarTabBorderColor |
String. Sidebar tab border line colour. |
sidebarTabBorderWidth |
Numeric. Sidebar tab border line width. |
sidebarTabBackColorSelected |
String. Sidebar tab background colour: selected. |
sidebarTabTextColorSelected |
String. Sidebar tab font colour: selected. |
sidebarTabRadiusSelected |
String. Sidebar tab shape radius: selected. |
sidebarTabTextColorHover |
String. Sidebar tab font colour: hovered. |
sidebarTabBackColorHover |
String. Sidebar tab background colour: hovered. |
sidebarTabBorderStyleHover |
String. Sidebar tab border line style: hovered. |
sidebarTabBorderColorHover |
String. Sidebar tab border line colour: hovered. |
sidebarTabBorderWidthHover |
Numeric. Sidebar tab border line width: hovered. |
sidebarTabRadiusHover |
String. Sidebar tab shape radius: hovered. |
boxBackColor |
String. Box background colour. |
boxBorderRadius |
Numeric. Box shape radius. |
boxShadowSize |
String. Box shadow size. |
boxShadowColor |
String. Box shadow colour. |
boxTitleSize |
Numeric. Box title font size. |
boxDefaultColor |
String. Box default highlight colour. |
boxPrimaryColor |
String. Box primary highlight colour. |
boxSuccessColor |
String. Box success highlight colour. |
boxWarningColor |
String. Box warning highlight colour. |
boxDangerColor |
String. Box danger highlight colour. |
tabBoxTabColor |
String. Tab box tab background colour. |
tabBoxTabTextSize |
Numeric. Tab box tab font size. |
tabBoxTabTextColor |
String. Tab box tab font colour. |
tabBoxTabTextColorSelected |
String. Tab box tab font colour: selected. |
tabBoxBackColor |
String. Tab box body background colour. |
tabBoxHighlightColor |
String. Tab box highlight colour. |
tabBoxBorderRadius |
Numeric. Tab box shape radius. |
buttonBackColor |
String. Button background colour. |
buttonTextColor |
String. Button font colour. |
buttonBorderColor |
String. Button border line colour. |
buttonBorderRadius |
Numeric. Button shape radius. |
buttonBackColorHover |
String. Button background colour: hovered. |
buttonTextColorHover |
String. Button font colour: hovered. |
buttonBorderColorHover |
String. Button border line colour: hovered. |
buttonHeight |
Numeric. Button shape height. |
buttonPadding |
String. Button label padding. Defaults to "6px 12px". |
textboxBackColor |
String. Textbox background colour. |
textboxBorderColor |
String. Textbox border line colour. |
textboxBorderRadius |
Numeric. Textbox shape radius. |
textboxBackColorSelect |
String. Textbox background colour: selected. |
textboxBorderColorSelect |
String. Textbox border line colour: selected. |
textboxHeight |
Numeric. Textbox shape height. |
textboxPadding |
String. Textbox text padding. Defaults to "6px 12px". |
tableBackColor |
String. Table background colour. |
tableBorderColor |
String. Table border line colour. |
tableBorderTopSize |
Numeric. Table header line size. |
tableBorderRowSize |
Numeric. Table row separator line size. |
primaryFontColor |
String. Primary status highlight font colour. |
successFontColor |
String. Success status highlight font colour. |
warningFontColor |
String. Warning status highlight font colour. |
dangerFontColor |
String. Danger status highlight font colour. |
infoFontColor |
String. Info status highlight font colour. |
boxInfoColor |
String. Box info highlight colour. |
Value
CSS code. Theme for a shinydashboard application.
See Also
shinyDashboardThemes, shinyDashboardLogoDIY, cssGradientThreeColors
Examples
customTheme <- shinyDashboardThemeDIY(
### general
appFontFamily = "Arial"
,appFontColor = "rgb(0,0,0)"
,primaryFontColor = "rgb(0,0,0)"
,infoFontColor = "rgb(0,0,0)"
,successFontColor = "rgb(0,0,0)"
,warningFontColor = "rgb(0,0,0)"
,dangerFontColor = "rgb(0,0,0)"
,bodyBackColor = "rgb(248,248,248)"
### header
,logoBackColor = "rgb(23,103,124)"
,headerButtonBackColor = "rgb(238,238,238)"
,headerButtonIconColor = "rgb(75,75,75)"
,headerButtonBackColorHover = "rgb(210,210,210)"
,headerButtonIconColorHover = "rgb(0,0,0)"
,headerBackColor = "rgb(238,238,238)"
,headerBoxShadowColor = "#aaaaaa"
,headerBoxShadowSize = "2px 2px 2px"
### sidebar
,sidebarBackColor = cssGradientThreeColors(
direction = "down"
,colorStart = "rgb(20,97,117)"
,colorMiddle = "rgb(56,161,187)"
,colorEnd = "rgb(3,22,56)"
,colorStartPos = 0
,colorMiddlePos = 50
,colorEndPos = 100
)
,sidebarPadding = 0
,sidebarMenuBackColor = "transparent"
,sidebarMenuPadding = 0
,sidebarMenuBorderRadius = 0
,sidebarShadowRadius = "3px 5px 5px"
,sidebarShadowColor = "#aaaaaa"
,sidebarUserTextColor = "rgb(255,255,255)"
,sidebarSearchBackColor = "rgb(55,72,80)"
,sidebarSearchIconColor = "rgb(153,153,153)"
,sidebarSearchBorderColor = "rgb(55,72,80)"
,sidebarTabTextColor = "rgb(255,255,255)"
,sidebarTabTextSize = 13
,sidebarTabBorderStyle = "none none solid none"
,sidebarTabBorderColor = "rgb(35,106,135)"
,sidebarTabBorderWidth = 1
,sidebarTabBackColorSelected = cssGradientThreeColors(
direction = "right"
,colorStart = "rgba(44,222,235,1)"
,colorMiddle = "rgba(44,222,235,1)"
,colorEnd = "rgba(0,255,213,1)"
,colorStartPos = 0
,colorMiddlePos = 30
,colorEndPos = 100
)
,sidebarTabTextColorSelected = "rgb(0,0,0)"
,sidebarTabRadiusSelected = "0px 20px 20px 0px"
,sidebarTabBackColorHover = cssGradientThreeColors(
direction = "right"
,colorStart = "rgba(44,222,235,1)"
,colorMiddle = "rgba(44,222,235,1)"
,colorEnd = "rgba(0,255,213,1)"
,colorStartPos = 0
,colorMiddlePos = 30
,colorEndPos = 100
)
,sidebarTabTextColorHover = "rgb(50,50,50)"
,sidebarTabBorderStyleHover = "none none solid none"
,sidebarTabBorderColorHover = "rgb(75,126,151)"
,sidebarTabBorderWidthHover = 1
,sidebarTabRadiusHover = "0px 20px 20px 0px"
### boxes
,boxBackColor = "rgb(255,255,255)"
,boxBorderRadius = 5
,boxShadowSize = "0px 1px 1px"
,boxShadowColor = "rgba(0,0,0,.1)"
,boxTitleSize = 16
,boxDefaultColor = "rgb(210,214,220)"
,boxPrimaryColor = "rgba(44,222,235,1)"
,boxInfoColor = "rgb(210,214,220)"
,boxSuccessColor = "rgba(0,255,213,1)"
,boxWarningColor = "rgb(244,156,104)"
,boxDangerColor = "rgb(255,88,55)"
,tabBoxTabColor = "rgb(255,255,255)"
,tabBoxTabTextSize = 14
,tabBoxTabTextColor = "rgb(0,0,0)"
,tabBoxTabTextColorSelected = "rgb(0,0,0)"
,tabBoxBackColor = "rgb(255,255,255)"
,tabBoxHighlightColor = "rgba(44,222,235,1)"
,tabBoxBorderRadius = 5
### inputs
,buttonBackColor = "rgb(245,245,245)"
,buttonTextColor = "rgb(0,0,0)"
,buttonBorderColor = "rgb(200,200,200)"
,buttonBorderRadius = 5
,buttonBackColorHover = "rgb(235,235,235)"
,buttonTextColorHover = "rgb(100,100,100)"
,buttonBorderColorHover = "rgb(200,200,200)"
,textboxBackColor = "rgb(255,255,255)"
,textboxBorderColor = "rgb(200,200,200)"
,textboxBorderRadius = 5
,textboxBackColorSelect = "rgb(245,245,245)"
,textboxBorderColorSelect = "rgb(200,200,200)"
### tables
,tableBackColor = "rgb(255,255,255)"
,tableBorderColor = "rgb(240,240,240)"
,tableBorderTopSize = 1
,tableBorderRowSize = 1
)
shinyDashboardThemes
Description
Calls a custom theme object created using shinyDashboardThemeDIY
Usage
shinyDashboardThemes(theme)
Arguments
theme |
String. Name of theme to be used |
Value
CSS code. Theme for shinydashboard.
Available themes
-
blue_gradient: Demonstrates use of gradients, shadows and rounded corners.
-
flat_red: Flat colour theme with red highlights.
-
grey_light: Lightweight grey theme.
-
grey_dark: Demonstrates use of inverted dark colour schemes.
-
onenote: Styled similarly to the OneNote application.
-
poor_mans_flatly: Poor man's version of the Flatly theme.
-
purple_gradient: Demonstrates use of dark gradients and rounded corners.
See Also
shinyDashboardThemeDIY, shinyDashboardLogo
Examples
#...
### ui body
#dashboardBody(
### changing theme
shinyDashboardThemes(
theme = "blue_gradient"
)
### ui tabs
#,tabItems(
# tabItem(
# ...
theme_blue_gradient
Description
Blue Gradient theme for a shinydashboard application
Usage
theme_blue_gradient
Format
An object of class shiny.tag of length 3.
Value
Object produced by shinyDashboardThemeDIY
See Also
theme_flat_red
Description
Flat Red theme for a shinydashboard application
Usage
theme_flat_red
Format
An object of class shiny.tag of length 3.
Value
Object produced by shinyDashboardThemeDIY
See Also
theme_grey_dark
Description
Grey Dark theme for a shinydashboard application
Usage
theme_grey_dark
Format
An object of class shiny.tag of length 3.
Value
Object produced by shinyDashboardThemeDIY
See Also
theme_grey_light
Description
Grey Light theme for a shinydashboard application
Usage
theme_grey_light
Format
An object of class shiny.tag of length 3.
Value
Object produced by shinyDashboardThemeDIY
See Also
theme_onenote
Description
OneNote theme for a shinydashboard application
Usage
theme_onenote
Format
An object of class shiny.tag of length 3.
Value
Object produced by shinyDashboardThemeDIY
See Also
theme_poor_mans_flatly
Description
Poor Man's Flatly theme for a shinydashboard application
Usage
theme_poor_mans_flatly
Format
An object of class shiny.tag of length 3.
Value
Object produced by shinyDashboardThemeDIY
See Also
theme_purple_gradient
Description
Purple Gradient theme for a shinydashboard application
Usage
theme_purple_gradient
Format
An object of class shiny.tag of length 3.
Value
Object produced by shinyDashboardThemeDIY