UniversalDashboard/UniversalDashboard.Enterprise/net472/Themes/DarkDefault.psd1
|
# Universal Dashboard DarkDefault Theme # https://material-ui.com/customization/color/ $FontColorDark = "#FFFFFF" $FontColorLight = "#FFFFFF" $BackgroundColorPrimary = "#3c3c3c" $BackgroundColorLighter = "#333333" $BackgroundColorDarker = "#3c3c3c" $BackgroundColorBright = "#333333" $PrimaryColor = "#333333" $PrimaryColorDark = "#212121" $PrimaryFontColor = $FontColorDark $AlternateFontColor = $FontColorLight $PrimaryBackgroundColor = $BackgroundColorPrimary $AlternativeBackgroundColor = $BackgroundColorLighter $AlternativeBackgroundColor2 = $BackgroundColorDarker $AlternativeBackgroundColor3 = $BackgroundColorBright $FontFamily = '"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif' @{ Name = "DarkDefault" Definition = @{ #UD ELEMENTS UDDashboard = @{ BackgroundColor = $PrimaryBackgroundColor FontColor = $PrimaryFontColor } UDNavBar = @{ BackgroundColor = $PrimaryColor FontColor = $AlternateFontColor } UDFooter = @{ BackgroundColor = $PrimaryColor FontColor = $AlternateFontColor "margin-top" = "20px" } UDCard = @{ BackgroundColor = $AlternativeBackgroundColor3 FontColor = $PrimaryFontColor } UDChart = @{ BackgroundColor = $AlternativeBackgroundColor3 FontColor = $PrimaryFontColor } UDMonitor = @{ BackgroundColor = $AlternativeBackgroundColor3 FontColor = $PrimaryFontColor } UDTable = @{ BackgroundColor = $AlternativeBackgroundColor3 FontColor = $PrimaryFontColor } UDGrid = @{ BackgroundColor = $AlternativeBackgroundColor3 FontColor = $PrimaryFontColor } UDCounter = @{ BackgroundColor = $AlternativeBackgroundColor3 FontColor = $PrimaryFontColor } UDInput = @{ BackgroundColor = $AlternativeBackgroundColor3 FontColor = $PrimaryFontColor } UDTabs = @{ BackgroundColor = $AlternativeBackgroundColor3 Height = 'auto' BoxShadow = 'unset' FontFamily = $FontFamily } UDTab = @{ FontColor = $PrimaryColor FontFamily = $FontFamily # No need for backgroundColor it inherit UDTabs backgroundColor } UDTabActive = @{ ActiveFontColor = $AlternateFontColor ActiveBackgroundColor = $PrimaryColor } UDTabIcon = @{ FontColor = $PrimaryColor Height = 'auto' LineHeight = 'inherit' } UDTabActiveIcon = @{ ActiveFontColor = $AlternateFontColor } UDTabIndicator = @{ IndicatorColor = $PrimaryColorDark } #CSS ELEMENTS 'main' = @{ 'padding-left' = "50px" 'padding-right' = "50px" 'padding-top' = "50px" 'padding-bottom' = "50px" } '@media screen and (max-width: 600px)' = @{ 'main' = @{ 'padding-left' = "3px" 'padding-right' = "3px" 'padding-top' = "3px" 'padding-bottom' ="3px" } } 'p' = @{ 'color' = "$PrimaryFontColor !important" } 'a' = @{ 'color' = "$PrimaryFontColor !important" } 'h1, h2, h3, h4, h5, h6' = @{ 'color' = "$PrimaryFontColor !important" } '[type="radio"]:checked + span::after' = @{ 'background-color' = "#FFFFFF" } '.btn' = @{ 'color' = $AlternateFontColor 'background-color' = $PrimaryColor } '.btn:hover' = @{ 'color' = $AlternateFontColor 'background-color' = $PrimaryColorDark } '.btn-floating' = @{ 'background-color' = $PrimaryColor } '.btn-floating:hover' = @{ 'background-color' = $PrimaryColorDark } '.btn-floating:focus, .btn-large:focus, .btn-small:focus, .btn:focus' = @{ 'background-color' = $PrimaryColorDark } '.btn-flat' = @{ 'color' = $PrimaryFontColor } '[type="checkbox"]:checked + span:not(.lever)::before' = @{ "border-right" = "2px solid $PrimaryColor" "border-bottom" = "2px solid $PrimaryColor" } '.pagination li a' = @{ 'color' = $PrimaryColor } '.pagination li.active' = @{ 'color' = "$PrimaryFontColor !important" 'background-color' = $PrimaryColor } '.sidenav' = @{ 'background-color' = $PrimaryColor 'color' = $AlternateFontColor } '.sidenav a:hover' = @{ 'background-color' = $PrimaryColor 'color'= $AlternateFontColor } '.sidenav li>a' = @{ 'color' = $AlternateFontColor 'background-color' = $PrimaryColor } '.sidenav li>a:hover' = @{ 'background-color' = $PrimaryColorDark } '.sidenav.sidenav-fixed' = @{ 'background-color' = $PrimaryColor } '.sidenav .subheader' = @{ 'color'= $AlternateFontColor 'font-size' = 'large' } '.sidenav .divider' = @{ 'background-color' = $PrimaryColorDark } '.sidenav .collapsible-header' = @{ 'color'= $AlternateFontColor 'font-size' = 'large' } '.sidenav .collapsible-header:hover' = @{ 'color'= $AlternateFontColor } '.sidenav li.active' = @{ 'padding-left' = "0px !important" } '.progress' = @{ 'background-color' = $AlternativeBackgroundColor2 } '.progress .determinate, .progress .indeterminate' = @{ 'background-color' = $PrimaryColor 'border-bottom' = "1px solid $PrimaryBackgroundColor" } 'input:not([type]), input[type="date"]:not(.browser-default), input[type="datetime-local"]:not(.browser-default), input[type="datetime"]:not(.browser-default), input[type="email"]:not(.browser-default), input[type="number"]:not(.browser-default), input[type="password"]:not(.browser-default), input[type="search"]:not(.browser-default), input[type="tel"]:not(.browser-default), input[type="text"]:not(.browser-default), input[type="time"]:not(.browser-default), input[type="url"]:not(.browser-default), textarea.materialize-textarea' = @{ 'color'= $PrimaryFontColor 'border-bottom' = "1px solid $PrimaryBackgroundColor" } 'input:not([type]):not([readonly]):focus, input[type=date]:not([readonly]):not(.browser-default):focus, input[type=datetime-local]:not([readonly]):not(.browser-default):focus, input[type=datetime]:not([readonly]):not(.browser-default):focus, input[type=email]:not([readonly]):not(.browser-default):focus, input[type=number]:not([readonly]):not(.browser-default):focus, input[type=password]:not([readonly]):not(.browser-default):focus, input[type=search]:not([readonly]):not(.browser-default):focus, input[type=tel]:not([readonly]):not(.browser-default):focus, input[type=text]:not([readonly]):not(.browser-default):focus, input[type=time]:not([readonly]):not(.browser-default):focus, input[type=url]:not([readonly]):not(.browser-default):focus, textarea:not([readonly]).materialize-textarea:focus' = @{ 'color'= $PrimaryFontColor 'border-bottom' = "1px solid $PrimaryColorDark" } 'input:not([type]):not([readonly]):focus + label, input[type=date]:not([readonly]):not(.browser-default):focus + label, input[type=datetime-local]:not([readonly]):not(.browser-default):focus + label, input[type=datetime]:not([readonly]):not(.browser-default):focus + label, input[type=email]:not([readonly]):not(.browser-default):focus + label, input[type=number]:not([readonly]):not(.browser-default):focus + label, input[type=password]:not([readonly]):not(.browser-default):focus + label, input[type=search]:not([readonly]):not(.browser-default):focus + label, input[type=tel]:not([readonly]):not(.browser-default):focus + label, input[type=text]:not([readonly]):not(.browser-default):focus + label, input[type=time]:not([readonly]):not(.browser-default):focus + label, input[type=url]:not([readonly]):not(.browser-default):focus + label, textarea:not([readonly]).materialize-textarea:focus + label' = @{ 'color'= $PrimaryFontColor } '.switch label' = @{ 'color'= $PrimaryFontColor } '.switch label input[type=checkbox]:checked+.lever' = @{ 'background-color' = $AlternativeBackgroundColor2 } '.switch label input[type=checkbox]:checked+.lever:after' = @{ 'background-color' = $PrimaryColor } '.card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating)' = @{ 'color' = $PrimaryColor '-webkit-transition' = "color .3s ease" 'transition'= "color .3s ease" } '.card .card-action a:not(.btn):not(.btn-floating):not(.btn-large):not(.btn-small):not(.btn-large)' = @{ 'color' = $PrimaryColor '-webkit-transition' = "color .3s ease" 'transition'= "color .3s ease" } '.card .card-action a:not(.btn):not(.btn-floating):not(.btn-large):not(.btn-small):not(.btn-large):hover' = @{ 'color' = $PrimaryColorDark '-webkit-transition' = "color .3s ease" 'transition'= "color .3s ease" } '.dropdown-content' = @{ 'background-color' = $AlternativeBackgroundColor } '.dropdown-content li>a, .dropdown-content li>span' = @{ 'color' = $PrimaryFontColor } '.select-dropdown.dropdown-content li.selected' = @{ 'background-color' = $AlternativeBackgroundColor2 } '.select-wrapper input.select-dropdown' = @{ 'color' = $PrimaryFontColor 'border-bottom' = "1px solid $PrimaryColorDark" 'border-block-end-color' = $PrimaryColorDark } '.select-dropdown li span' = @{ 'color' = $PrimaryFontColor } '[type=radio].with-gap:checked+span:after, [type=radio]:checked+span:after' = @{ 'background-color' = $PrimaryColor } '[type=radio].with-gap:checked+span:after, [type=radio].with-gap:checked+span:before, [type=radio]:checked+span:after' =@{ 'border' = "2px solid $PrimaryColorDark" } '.divider' = @{ 'background-color' = $AlternativeBackgroundColor } 'pre' = @{ 'background-color' = $AlternativeBackgroundColor3 'padding-left' = "5px" 'padding-right' = "5px" 'padding-top' = "5px" 'padding-bottom' = "5px" } '.page-footer .footer-copyright' = @{ 'background-color' = $PrimaryColor } '.modal' = @{ 'color' = $PrimaryFontColor 'background-color' = "$BackgroundColorPrimary" } '.modal h' = @{ 'color' = "$PrimaryFontColor !important" } '.card, .card-panel' = @{ BackgroundColor = $AlternativeBackgroundColor3 FontColor = $PrimaryFontColor } '.collapsible-header'= @{ 'color' = "#FFFFFF" 'background-color' = "$BackgroundColorLighter" 'border-bottom' = '1px solid #1c1c1c;' 'border-bottom-width' = '1px;' 'border-bottom-style' = 'solid;' 'border-bottom-color' = '#1c1c1c;' } '.collapsible' = @{ 'margin' = ".5rem 0 1rem" 'border' = 'none' } '.collapsible-body' = @{ 'border-bottom' = 'none' "background-color" = "$PrimaryColor" } '.collection .collection-item' = @{ "background-color" = "#272C33" 'border-bottom' = '1px solid #1c1c1c;' 'border-bottom-width' = '1px;' 'border-bottom-style' = 'solid;' 'border-bottom-color' = '#1c1c1c;' 'color' = "#FFFFFF" } } } |