/*
Typographic color definitions.
*/
.win-ui-dark body {
color: #FFF;
background-color: #1D1D1D;
}
html,
body {
color: #333;
background-color: #FFF;
}
/*
This class reverses the colors on the subtree to which it is applied.
*/
.win-ui-dark {
color: #FFF;
background-color: #1D1D1D;
}
/*
Text selection color
*/
::selection, select:focus::-ms-value {
background-color: rgb(87, 41, 193);
color: #FFF;
}
/*
Text input, checkbox, radio, and select control colors.
*/
.win-ui-dark input[type=text], .win-ui-dark input[type=password],
.win-ui-dark input[type=email], .win-ui-dark input[type=number],
.win-ui-dark input[type=tel], .win-ui-dark input[type=url],
.win-ui-dark input[type=search], .win-ui-dark textarea, .win-ui-dark .win-textarea,
.win-ui-dark select, .win-ui-dark input::-ms-check {
background-clip: border-box;
background-color: rgba(255, 255, 255, 0.8);
border-color: transparent;
color: #000;
}
.win-ui-dark input[type=text]:hover, .win-ui-dark input[type=password]:hover,
.win-ui-dark input[type=email]:hover, .win-ui-dark input[type=number]:hover,
.win-ui-dark input[type=tel]:hover, .win-ui-dark input[type=url]:hover,
.win-ui-dark input[type=search]:hover, .win-ui-dark textarea:hover,
.win-ui-dark .win-textarea:hover, .win-ui-dark select:hover, .win-ui-dark input:hover::-ms-check {
background-clip: border-box;
background-color: rgba(255, 255, 255, 0.87);
border-color: transparent;
color: #000;
}
.win-ui-dark input:hover:active::-ms-check { /* only checkbox and radio have press state */
background-color: #FFF;
}
.win-ui-dark input[type=text]:focus, .win-ui-dark input[type=text]:active,
.win-ui-dark input[type=password]:focus, .win-ui-dark input[type=password]:active,
.win-ui-dark input[type=email]:focus, .win-ui-dark input[type=email]:active,
.win-ui-dark input[type=number]:focus, .win-ui-dark input[type=number]:active,
.win-ui-dark input[type=tel]:focus, .win-ui-dark input[type=tel]:active,
.win-ui-dark input[type=url]:focus, .win-ui-dark input[type=url]:active,
.win-ui-dark input[type=search]:focus, .win-ui-dark input[type=search]:active,
.win-ui-dark textarea:focus, .win-ui-dark textarea:active,
.win-ui-dark .win-textarea:focus, .win-ui-dark .win-textarea:active,
.win-ui-dark select:focus, .win-ui-dark select:active {
background-clip: border-box;
background-color: #FFF;
border-color: transparent;
color: #000;
}
.win-ui-dark input[type=text]:disabled, .win-ui-dark input[type=password]:disabled,
.win-ui-dark input[type=email]:disabled, .win-ui-dark input[type=number]:disabled,
.win-ui-dark input[type=tel]:disabled, .win-ui-dark input[type=url]:disabled,
.win-ui-dark input[type=search]:disabled, .win-ui-dark input[type=file]::-ms-value,
.win-ui-dark textarea:disabled, .win-ui-dark .win-textarea:disabled, .win-ui-dark select:disabled,
.win-ui-dark input:disabled::-ms-check, .win-ui-dark input:disabled:active::-ms-check {
background-color: transparent;
border-color: rgba(255, 255, 255, 0.4);
color: rgba(255, 255, 255, 0.4);
}
.win-ui-dark input:disabled::-ms-check, .win-ui-dark input:disabled:active::-ms-check { /* checkbox and radio have filled disabled state in dark */
background-clip: border-box;
background-color: rgba(255, 255, 255, 0.4);
border-color: transparent;
color: rgba(0, 0, 0, 0.4);
}
input[type=text], input[type=password],
input[type=email], input[type=number],
input[type=tel], input[type=url],
input[type=search], select, textarea,
.win-textarea, input::-ms-check {
background-color: rgba(255, 255, 255, 0.8);
border-color: rgba(0, 0, 0, 0.27);
color: #000;
}
input[type=text]:hover, input[type=password]:hover,
input[type=email]:hover, input[type=number]:hover,
input[type=tel]:hover, input[type=url]:hover,
input[type=search]:hover, textarea:hover,
select:hover, .win-textarea:hover, input:hover::-ms-check {
background-color: rgba(255, 255, 255, 0.87);
border-color: rgba(0, 0, 0, 0.44);
color: #000;
}
input[type=text]:focus, input[type=text]:active,
input[type=password]:focus, input[type=password]:active,
input[type=email]:focus, input[type=email]:active,
input[type=number]:focus, input[type=number]:active,
input[type=tel]:focus, input[type=tel]:active,
input[type=url]:focus, input[type=url]:active,
input[type=search]:focus, input[type=search]:active,
textarea:focus, textarea:active,
.win-textarea:focus, .win-textarea:active,
select:focus, select:active {
background-color: #FFF;
border-color: rgba(0, 0, 0, 0.6);
color: #000;
}
input:hover:active::-ms-check { /* only checkbox and radio have press state */
background-clip: border-box;
background-color: #000;
border-color: transparent;
color: #FFF;
}
input[type=text]:disabled, input[type=password]:disabled,
input[type=email]:disabled, input[type=number]:disabled,
input[type=tel]:disabled, input[type=url]:disabled,
input[type=search]:disabled, textarea:disabled,
.win-textarea:disabled, select:disabled,
input:disabled::-ms-check, input:disabled:active::-ms-check {
background-color: rgba(202, 202, 202, 0.4);
border-color: rgba(0, 0, 0, 0.15);
color: rgba(0, 0, 0, 0.4);
}
/*
Placeholder text.
*/
.win-ui-dark input[type]:-ms-input-placeholder, input[type]:-ms-input-placeholder,
.win-ui-dark textarea:-ms-input-placeholder, textarea:-ms-input-placeholder {
color: rgba(0, 0, 0, 0.6); /* same in dark and light */
}
.win-ui-dark input[type]:disabled:-ms-input-placeholder, .win-ui-dark textarea:disabled:-ms-input-placeholder {
color: rgba(255, 255, 255, 0.22);
}
input[type]:disabled:-ms-input-placeholder, textarea:disabled:-ms-input-placeholder {
color: rgba(0, 0, 0, 0.22);
}
/*
Invalid style.
*/
input[type]:invalid {
outline-color: rgb(255, 128, 51);
outline-width: 2px;
}
/*
Option for select control (all colors are same for both light and dark).
*/
option:checked, select:focus::-ms-value {
color: #FFF;
background-color: rgb(70, 23, 180);
}
option:hover {
color: #000;
background-color: rgb(197, 197, 197);
}
select:focus option:hover {
color: #000;
background-color: rgb(222, 222, 222);
}
option:checked:hover, select:focus option:checked:hover {
color: #FFF;
background-color: rgb(95, 55, 190);
}
option:hover:active, select:focus option:hover:active{
color: #000;
background-color: rgb(211, 211, 211);
}
.win-ui-dark option:checked:disabled, .win-ui-dark option:checked:disabled:active,
.win-ui-dark optgroup:disabled option:checked, .win-ui-dark optgroup:disabled option:checked:active,
.win-ui-dark select:disabled option:checked, .win-ui-dark select:disabled option:checked:active,
.win-ui-dark select:disabled:focus::-ms-value {
background-color: rgba(255, 255, 255, 0.4);
color: rgba(0, 0, 0, 0.6);
}
option:checked:disabled, option:checked:disabled:active,
optgroup:disabled option:checked, optgroup:disabled option:checked:active,
select:disabled option:checked, select:disabled option:checked:active,
select:disabled:focus::-ms-value {
background-color: rgba(0, 0, 0, 0.55);
color: rgba(255, 255, 255, 0.6);
}
/*
Button control colors.
*/
.win-ui-dark button, .win-ui-dark input[type=button], .win-ui-dark input[type=submit],
.win-ui-dark input[type=reset], .win-ui-dark input[type=file]::-ms-browse {
background-color: transparent;
border-color: #FFF;
color: #FFF;
}
.win-ui-dark button[type=submit], .win-ui-dark input[type=submit] {
background-color: rgb(70, 23, 180);
}
.win-ui-dark button:hover, .win-ui-dark input[type=button]:hover, .win-ui-dark input[type=reset]:hover,
.win-ui-dark input[type=file]::-ms-browse:hover {
background-color: rgba(255, 255, 255, 0.13);
}
.win-ui-dark button[type=submit]:hover, .win-ui-dark input[type=submit]:hover {
background-color: rgb(95, 55, 190);
}
.win-ui-dark button:hover:active, .win-ui-dark button[type=submit]:hover:active,
.win-ui-dark input[type=button]:hover:active, .win-ui-dark input[type=reset]:hover:active,
.win-ui-dark input[type=submit]:hover:active, .win-ui-dark input[type=file]::-ms-browse:hover:active {
background-clip: border-box;
background-color: #FFF;
border-color: transparent;
color: #000;
}
.win-ui-dark button:disabled, .win-ui-dark button[type=submit]:disabled,
.win-ui-dark input[type=button]:disabled, .win-ui-dark input[type=reset]:disabled,
.win-ui-dark input[type=submit]:disabled, .win-ui-dark input[type=file]:disabled::-ms-browse,
.win-ui-dark button:disabled:active, .win-ui-dark button[type=submit]:disabled:active,
.win-ui-dark input[type=button]:disabled:active, .win-ui-dark input[type=reset]:disabled:active,
.win-ui-dark input[type=submit]:disabled:active, .win-ui-dark input[type=file]:disabled::-ms-browse:active {
background-color: transparent;
border-color: rgba(255, 255, 255, 0.4);
color: rgba(255, 255, 255, 0.4);
}
button, input[type=button], input[type=submit],
input[type=reset], input[type=file]::-ms-browse {
background-color: rgba(182, 182, 182, 0.7);
border-color: rgba(0, 0, 0, 0.2);
color: #000;
}
button[type=submit], input[type=submit]{
background-clip: border-box;
background-color: rgb(70, 23, 180);
border-color: transparent;
color: #FFF;
}
button:hover, input[type=button]:hover, input[type=reset]:hover,
input[type=file]::-ms-browse:hover {
background-color: rgba(205, 205, 205, 0.82);
border-color: rgba(164, 164, 164, 0.45);
}
button[type=submit]:hover, input[type=submit]:hover {
background-clip: border-box;
background-color: rgb(95, 55, 190);
border-color: transparent;
color: #FFF;
}
button:hover:active, button[type=submit]:hover:active,
input[type=button]:hover:active, input[type=reset]:hover:active,
input[type=submit]:hover:active, input[type=file]::-ms-browse:hover:active {
background-clip: border-box;
background-color: #000;
border-color: transparent;
color: #FFF;
}
button:disabled, button[type=submit]:disabled,
input[type=button]:disabled, input[type=reset]:disabled,
input[type=submit]:disabled, input[type=file]:disabled::-ms-browse,
button:disabled:active, button[type=submit]:disabled:active,
input[type=button]:disabled:active, input[type=reset]:disabled:active,
input[type=submit]:disabled:active, input[type=file]:disabled::-ms-browse:active {
background-color: rgba(202, 202, 202, 0.4);
border-color: rgba(0, 0, 0, 0.08);
color: rgba(0, 0, 0, 0.4);
}
input[type=file]:disabled::-ms-browse, input[type=file]:disabled::-ms-browse:active {
border-color: rgba(0, 0, 0, 0.15);
}
/*
File upload control colors.
*/
input[type=file] {
background-color: transparent;
border-color: transparent;
color: transparent;
}
/*
Headers colors.
*/
.accent-color,
header h1,
header h2,
table th {color: #24A0DA;}
.accent-bg {background:#24A0DA;}
a#user-info h3,
a#user-info h4 { color: rgb(0, 130, 135); }
a#user-info:hover { background-color: rgb(0, 130, 135); }
a#user-info:hover h3,
a#user-info:hover h4 { color: #FFF; }
/*
Link colors.
*/
.win-ui-dark a {
color: rgb(156, 114, 255);
}
.win-ui-dark a:hover:active {
color: rgba(156, 114, 255, 0.6);
}
.win-ui-dark a:hover {
color: rgba(156, 114, 255, 0.8);
}
.win-ui-dark a[disabled], .win-ui-dark a[disabled]:active { /* :disabled pseudo-class doesn't apply to a, even though disabled attribute stops navigation */
color: rgba(255, 255, 255, 0.4);
}
a {
color: rgb(79, 26, 203);
}
a:hover:active {
color: rgba(79, 26, 203, 0.6);
}
a:hover {
color: rgba(79, 26, 203, 0.8);
}
a[disabled], a[disabled]:active { /* :disabled pseudo-class doesn't apply to a, even though disabled attribute stops navigation */
color: rgba(0, 0, 0, 0.4);
}
/*
Range control colors.
*/
input[type=range], input[type=range]::-ms-track {
background-color: transparent;
}
/*
Progress control colors.
*/
.win-ui-dark.progress.progress-indeterminate {
background-color: #1D1D1D;
}
.progress {
background-color: #D4D4D4;
color: rgb(70, 23, 180);
}
/*
FlipView control colors.
*/
.win-flipview .win-navbutton {
background-color: rgba(213, 213, 213, 0.35);
color: rgba(0, 0, 0, 0.60);
}
.win-flipview .win-navbutton:hover {
background-color: rgba(215, 215, 215, 0.94);
color: rgba(0, 0, 0, 1.0);
}
.win-flipview .win-navbutton:hover:active {
background-color: rgba(41, 41, 41, 0.74);
color: rgba(255, 255, 255, 1.0);
}
/*
ListView control colors.
*/
.win-ui-dark .win-listview .win-container:hover {
background-color: rgba(255, 255, 255, 0.3);
outline: rgba(255, 255, 255, 0.3) solid 3px;
}
.win-ui-dark .win-listview .win-focusedoutline {
outline: #FFF solid 2px;
}
.win-listview .win-container:hover {
background-color: rgba(0, 0, 0, 0.3);
outline: rgba(0, 0, 0, 0.3) solid 3px;
}
.win-listview .win-focusedoutline {
outline: #000 solid 2px;
}
.win-listview .win-container.win-selected:hover {
background-color: rgb(95, 55, 190);
}
.win-listview .win-container.win-swipe:hover {
background-color: transparent;
outline: none;
}
.win-listview .win-selected {
color: #FFF;
}
.win-container.win-selected .win-selectionborder {
border-color: rgb(70, 23, 180);
}
.win-container.win-selected:hover .win-selectionborder {
border-color: rgb(95, 55, 190);
}
.win-selected .win-selectionbackground {
background-color: rgb(70, 23, 180);
}
.win-selected:hover .win-selectionbackground {
background-color: rgb(95, 55, 190);
}
.win-selectioncheckmark {
color: #FFF;
}
.win-ui-dark .win-selectionhint {
color: #FFF;
}
.win-selectionhint {
color: rgb(70, 23, 180);
}
.win-selectioncheckmarkbackground {
border-top-color: rgb(70, 23, 180);
border-right-color: rgb(70, 23, 180);
border-left-color: transparent;
border-bottom-color: transparent;
}
.win-container.win-selected:hover .win-selectioncheckmarkbackground {
border-top-color: rgb(95, 55, 190);
border-right-color: rgb(95, 55, 190);
border-left-color: transparent;
border-bottom-color: transparent;
}
.win-listview.win-rtl .win-selectioncheckmarkbackground {
border-left-color: rgb(70, 23, 180);
border-right-color: transparent;
}
.win-listview.win-rtl .win-container.win-selected:hover .win-selectioncheckmarkbackground {
border-left-color: rgb(95, 55, 190);
border-right-color: transparent;
}
/*
Back button control colors.
*/
.win-ui-dark .win-backbutton {
background-color: transparent;
border-color: #FFF;
color: #FFF;
}
.win-ui-dark .win-backbutton:hover {
background-color: rgba(255, 255, 255, 0.13);
border-color: #FFF;
}
.win-ui-dark .win-backbutton:hover:active {
background-color: #FFF;
border-color: #FFF;
color: #000;
}
.win-ui-dark .win-backbutton:disabled, .win-ui-dark .win-backbutton:disabled:active {
background-color: transparent;
border-color: rgba(255, 255, 255, 0.4);
color: rgba(255, 255, 255, 0.4);
}
.win-backbutton {
background-color: transparent;
border-color: #000;
color: #000;
}
.win-backbutton:hover {
background-color: rgba(0, 0, 0, 0.13);
border-color: #000;
color: #000;
text-decoration: none;
}
.win-backbutton:hover:active {
background-color: #000;
border-color: #000;
color: #FFF;
}
.win-backbutton:disabled, .win-backbutton:disabled:active {
background-color: transparent;
border-color: rgba(0, 0, 0, 0.4);
color: rgba(0, 0, 0, 0.4);
}
/*
Command button colors.
*/
button.win-command {
background-color: transparent;
border-color: transparent;
}
button.win-command:hover {
background-color: transparent;
border-color: transparent;
}
button.win-command:active {
background-color: transparent;
color: inherit;
}
button.win-command:hover:active {
background-color: transparent;
color: inherit;
}
button.win-command:disabled {
border-color: transparent;
background-color: transparent;
}
.win-ui-dark button.win-command:focus {
border-color: #FFF;
}
button.win-command:focus {
border-color: #000;
}
button.win-hidefocus:focus {
outline: none;
}
button.win-command.win-hidefocus:focus {
border-color: transparent;
}
.win-ui-dark .win-commandimage {
color: #FFF;
}
.win-ui-dark button:hover:active .win-commandimage {
color: #000;
}
.win-ui-dark button:disabled .win-commandimage,
.win-ui-dark button:disabled:active .win-commandimage {
color: rgba(255, 255, 255, 0.4);
}
.win-ui-dark button[aria-checked=true] .win-commandimage,
.win-ui-dark button[aria-checked=true]:active .win-commandimage {
color: #000;
}
.win-ui-dark button[aria-checked=true]:hover .win-commandimage,
.win-ui-dark button[aria-checked=true]:hover:active .win-commandimage {
color: #FFF;
}
.win-ui-dark button[aria-checked=true]:disabled .win-commandimage,
.win-ui-dark button[aria-checked=true]:disabled:active .win-commandimage {
color: rgba(0, 0, 0, 0.4);
}
.win-commandimage {
color: #000;
}
button:hover:active .win-commandimage {
color: #FFF;
}
button:disabled .win-commandimage,
button:disabled:active .win-commandimage {
color: rgba(0, 0, 0, 0.4);
}
button[aria-checked=true] .win-commandimage,
button[aria-checked=true]:active .win-commandimage {
color: #FFF;
}
button[aria-checked=true]:hover .win-commandimage,
button[aria-checked=true]:hover:active .win-commandimage {
color: #000;
}
button[aria-checked=true]:disabled .win-commandimage,
button[aria-checked=true]:disabled:active .win-commandimage {
color: #FFF;
}
/*
Command ring colors.
*/
.win-ui-dark .win-commandring.active,
.win-ui-dark .win-commandring.active {
background-color: #FFF;
color: #000;
}
.win-ui-dark .win-commandring, .win-ui-dark a:active .win-commandring,
.win-ui-dark .win-commandring, .win-ui-dark button:active .win-commandring {
background-color: transparent;
border-color: #FFF;
}
.win-ui-dark a:hover .win-commandring,
.win-ui-dark button:hover .win-commandring {
background-color: rgba(255, 255, 255, 0.13);
border-color: #FFF;
color: #FFF;
}
.win-ui-dark a:hover:active .win-commandring,
.win-ui-dark button:hover:active .win-commandring {
background-color: #FFF;
border-color: #FFF;
}
.win-ui-dark a:disabled .win-commandring,
.win-ui-dark a:disabled:active .win-commandring,
.win-ui-dark button:disabled .win-commandring,
.win-ui-dark button:disabled:active .win-commandring {
background-color: transparent;
border-color: rgba(255, 255, 255, 0.4);
}
.win-ui-dark a[aria-checked=true] .win-commandring,
.win-ui-dark a[aria-checked=true]:active .win-commandring,
.win-ui-dark button[aria-checked=true] .win-commandring,
.win-ui-dark button[aria-checked=true]:active .win-commandring {
background-color: #FFF;
border-color: #FFF;
}
.win-ui-dark a.active .win-commandring,
.win-ui-dark button.active .win-commandring,
.win-ui-dark a[aria-checked=true]:hover .win-commandring,
.win-ui-dark button[aria-checked=true]:hover .win-commandring {
background-color: rgba(255, 255, 255, 0.13);
border-color: #FFF;
}
.win-ui-dark a[aria-checked=true]:hover:active .win-commandring,
.win-ui-dark button[aria-checked=true]:hover:active .win-commandring {
background-color: transparent;
border-color: #FFF;
}
.win-ui-dark a[aria-checked=true]:disabled .win-commandring,
.win-ui-dark a[aria-checked=true]:disabled:active .win-commandring,
.win-ui-dark button[aria-checked=true]:disabled .win-commandring,
.win-ui-dark button[aria-checked=true]:disabled:active .win-commandring {
background-color: #FFF;
border-color: #FFF;
}
.win-commandring, a:active .win-commandring,
.win-commandring, button:active .win-commandring {
background-color: transparent;
border-color: #000;
}
a:hover .win-commandring,
button:hover .win-commandring {
background-color: rgba(0, 0, 0, 0.13);
border-color: #000;
}
a:hover:active .win-commandring,
button:hover:active .win-commandring {
background-color: #000;
border-color: #000;
}
a:disabled .win-commandring,
a:disabled:active .win-commandring,
button:disabled .win-commandring,
button:disabled:active .win-commandring {
background-color: transparent;
border-color: rgba(0, 0, 0, 0.4);
}
a[aria-checked=true] .win-commandring,
a[aria-checked=true]:active .win-commandring,
button[aria-checked=true] .win-commandring,
button[aria-checked=true]:active .win-commandring {
background-color: #000;
border-color: #000;
}
a[aria-checked=true]:hover .win-commandring,
button[aria-checked=true]:hover .win-commandring {
background-color: rgba(0, 0, 0, 0.13);
border-color: #000;
}
a[aria-checked=true]:hover:active .win-commandring,
button[aria-checked=true]:hover:active .win-commandring {
background-color: rgba(255, 255, 255, 0.13);
border-color: #000;
}
a[aria-checked=true]:disabled .win-commandring,
a[aria-checked=true]:disabled:active .win-commandring,
button[aria-checked=true]:disabled .win-commandring,
button[aria-checked=true]:disabled:active .win-commandring {
background-color: rgba(0, 0, 0, 0.4);
border-color: rgba(0, 0, 0, 0.4);
}
/*
Command button labels colors.
*/
a.win-command .win-label,
button.win-command .win-label {
color: #000;
}
.win-ui-dark a.win-command .win-label,
.win-ui-dark button.win-command .win-label {
color: #FFF;
}
.win-ui-dark a.win-command:disabled .win-label,
.win-ui-dark a.win-command:disabled:active .win-label,
.win-ui-dark button.win-command:disabled .win-label,
.win-ui-dark button.win-command:disabled:active .win-label {
color: rgba(255, 255, 255, 0.4);
}
a.win-command:disabled .win-label,
a.win-command:disabled:active .win-label,
button.win-command:disabled .win-label,
button.win-command:disabled:active .win-label {
color: rgba(0, 0, 0, 0.4);
}
/*
AppBarCommand (and MenuCommand) separator.
*/
hr.win-command {
/* Same color in both light and dark. */
background-color: rgb(123, 123, 123);
}
/*
AppBar control colors.
*/
.win-ui-dark.win-appbar, .win-ui-dark .win-appbar {
background-color: #000;
border-color: #000;
}
.win-appbar {
background-color: #FFF;
border-color: #FFF;
}
/*
Flyout control colors, flyout normally has light theme.
*/
.win-flyout {
border-color: rgb(42, 42, 42);
background-color: #FFF;
}
.win-settingsflyout {
border-color: rgba(0, 0, 0, 0.24);
background-color: #FFF;
}
.win-ui-dark.win-flyout, .win-ui-dark .win-flyout {
border-color: rgb(42, 42, 42);
background-color: #000;
}
.win-ui-dark.win-settingsflyout, .win-ui-dark .win-settingsflyout {
border-color: rgba(255, 255, 255, 0.24);
background-color: #000;
}
/*
Menu button colors, menu is always light theme.
*/
.win-menu button {
background-color: transparent;
color: #000;
}
.win-menu button:focus,
.win-menu button:active {
background-color: rgb(222, 222, 222);
}
.win-menu button:hover:active {
color: #FFF;
background-color: #000;
}
.win-menu button:disabled,
.win-menu button:disabled:active {
background-color: transparent;
color: rgba(0, 0, 0, 0.1);
}
.win-ui-dark.win-menu button, .win-ui-dark .win-menu button {
background-color: transparent;
color: #FFF;
}
.win-ui-dark.win-menu button:focus, .win-ui-dark .win-menu button:focus,
.win-ui-dark.win-menu button:active, .win-ui-dark .win-menu button:active {
background-color: rgb(222, 222, 222);
}
.win-ui-dark.win-menu button:hover:active, .win-ui-dark .win-menu button:hover:active {
color: #000;
background-color: #FFF;
}
.win-ui-dark.win-menu button:disabled, .win-ui-dark .win-menu button:disabled,
.win-ui-dark.win-menu button:disabled:active, .win-ui-dark .win-menu button:disabled:active {
background-color: transparent;
color: rgba(255, 255, 255, 0.1);
}
/*
Rating control colors.
*/
.win-ui-dark .win-rating .win-star.win-user.win-full,
.win-ui-dark .win-rating .win-star.win-user.win-full.win-disabled {
color: rgb(91, 46, 197);
}
.win-ui-dark .win-rating .win-star.win-tentative.win-full {
color: rgb(129, 82, 239);
}
.win-ui-dark .win-rating .win-star.win-average.win-full,
.win-ui-dark .win-rating .win-star.win-average.win-full.win-disabled {
color: #FFF;
}
.win-ui-dark .win-rating .win-star.win-empty {
color: rgba(255, 255, 255, 0.35);
}
.win-rating .win-star.win-user.win-full,
.win-rating .win-star.win-user.win-full.win-disabled {
color: rgb(70, 23, 180);
}
.win-rating .win-star.win-tentative.win-full {
color: rgb(114, 65, 228);
}
.win-rating .win-star.win-average.win-full,
.win-rating .win-star.win-average.win-full.win-disabled {
color: #000;
}
.win-rating .win-star.win-empty {
color: rgba(0, 0, 0, 0.35);
}
/*
Toggleswitch control colors.
*/
.win-ui-dark .win-toggleswitch .win-title {
color: #FFF;
}
.win-ui-dark .win-toggleswitch .win-title.win-disabled {
color: rgba(255, 255, 255, 0.4);
}
.win-toggleswitch .win-title {
color: #000;
}
.win-toggleswitch .win-title.win-disabled {
color: rgba(0, 0, 0, 0.4);
}
.win-ui-dark .win-toggleswitch .win-label {
color: #FFF;
}
.win-ui-dark .win-toggleswitch .win-label.win-disabled {
color: rgba(255, 255, 255, 0.4);
}
.win-toggleswitch .win-label {
color: #000;
}
.win-toggleswitch .win-label.win-disabled {
color: rgba(0, 0, 0, 0.4);
}
.win-toggleswitch .win-switch::-ms-track {
background-color: transparent;
}
.win-ui-dark .win-toggleswitch .win-switch::-ms-track {
border-color: rgba(255, 255, 255, 0.35);
}
.win-ui-dark .win-toggleswitch .win-switch::-ms-fill-upper {
background-color: rgba(255, 255, 255, 0.26);
}
.win-ui-dark .win-toggleswitch .win-switch:hover::-ms-fill-upper {
background-color: rgba(255, 255, 255, 0.29);
}
.win-ui-dark .win-toggleswitch .win-switch:active::-ms-fill-upper {
background-color: rgba(255, 255, 255, 0.35);
}
.win-ui-dark .win-toggleswitch .win-switch:disabled::-ms-track {
border-color: rgba(255, 255, 255, 0.2);
}
.win-ui-dark .win-toggleswitch .win-switch:disabled::-ms-fill-lower,
.win-ui-dark .win-toggleswitch .win-switch:disabled::-ms-fill-upper {
background-color: rgba(255, 255, 255, 0.12);
}
.win-toggleswitch .win-switch::-ms-track {
border-color: rgba(0, 0, 0, 0.35);
}
.win-toggleswitch .win-switch::-ms-fill-upper {
background-color: rgba(0, 0, 0, 0.26);
}
.win-toggleswitch .win-switch:hover::-ms-fill-upper {
background-color: rgba(0, 0, 0, 0.29);
}
.win-toggleswitch .win-switch:active::-ms-fill-upper {
background-color: rgba(0, 0, 0, 0.35);
}
.win-toggleswitch .win-switch:disabled::-ms-track {
border-color: rgba(0, 0, 0, 0.2);
}
.win-toggleswitch .win-switch:disabled::-ms-fill-lower,
.win-toggleswitch .win-switch:disabled::-ms-fill-upper {
background-color: rgba(0, 0, 0, 0.12);
}
/*
Tooltip control colors.
*/
.win-tooltip {
background-color: #FFF;
border-color: rgb(128, 128, 128);
color: rgba(0, 0, 0, 0.6);
}
/*
Label colors.
*/
label {
/*color: rgba(0, 0, 0, 0.6);*/
}
.win-ui-dark label {
color: #FFF;
}
/*
Workaround appbar icon touch colors for Consumer Preview
*/
.win-ui-dark a:active .win-commandimage,
.win-ui-dark button:active .win-commandimage {
color: #000;
}
.win-ui-dark a[aria-selected=true]:active .win-commandimage,
.win-ui-dark button[aria-selected=true]:active .win-commandimage {
color: #FFF;
}
.win-ui-dark a:active .win-commandring,
.win-ui-dark button:active .win-commandring {
background-color: #FFF;
border-color: #FFF;
}
.win-ui-dark a[aria-selected=true]:active .win-commandring,
.win-ui-dark button[aria-selected=true]:active .win-commandring {
background-color: transparent;
border-color: #FFF;
}
a:active .win-commandimage,
button:active .win-commandimage {
color: #FFF;
}
a[aria-selected=true]:active .win-commandimage,
button[aria-selected=true]:active .win-commandimage {
color: #000;
}
a:active .win-commandring,
button:active .win-commandring {
background-color: #000;
border-color: #000;
}
a[aria-selected=true]:active .win-commandring,
button[aria-selected=true]:active .win-commandring {
background-color: rgba(255, 255, 255, 0.13);
border-color: #000;
}
/* Bootstrap Metro button
-------------------------------------------------- */
input.btn, button.btn, a.btn {
font-family: "Open Sans",Tahoma,Arial,Helvetica,Sans-Serif;
}
.btn {
/*font-size: 11pt;*/
background-color: rgba(182, 182, 182, 0.7);
border-color: rgba(0, 0, 0, 0.2);
color: #000;
background-image: none;
background-repeat: no-repeat;
border: 2px solid #cccccc;
text-shadow: none;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
filter: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.btn:hover,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled] {
background-color: #e6e6e6;
*background-color: #d9d9d9;
}
.btn:active,
.btn.active {
background-color: #cccccc;
}
.btn:first-child {
*margin-left: 0;
}
.btn:hover {
background-color: rgba(205, 205, 205, 0.82);
border-color: rgba(205, 205, 205, 0.82);
-webkit-transition: none;
-moz-transition: none;
-ms-transition: none;
-o-transition: none;
transition: none;
}
.btn:focus {
outline: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.btn.active,
.btn:active {
background-color: #000;
border-color:#000;
color: #FFF;
}
.btn.disabled,
.btn[disabled] {
background-color: rgba(202, 202, 202, 0.4);
border-color: rgba(0, 0, 0, 0.08);
color: rgba(0, 0, 0, 0.4);
}
.btn-primary {
background-color: #59008C;
border-color: #59008C;
color: #FFF;
background-image: none;
background-repeat: no-repeat;
filter: none;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary[disabled] {
background-color: #781096;
border-color: #781096;
color: #CCC;
}
.btn-primary:active,
.btn-primary.active {
background-color: #781096;
border-color: #781096;
}
.btn-warning {
background-color: #faa732;
border-color: #faa732;
background-image: none;
background-repeat: no-repeat;
filter: none;
}
.btn-warning:hover,
.btn-warning:active,
.btn-warning.active,
.btn-warning.disabled,
.btn-warning[disabled] {
background-color: #f89406;
border-color: #f89406;
}
.btn-warning:active,
.btn-warning.active {
background-color: #c67605;
border-color: #c67605;
}
.btn-danger {
background-color: #da4f49;
border-color: #da4f49;
background-image: none;
background-repeat: no-repeat;
filter: none;
}
.btn-danger:hover,
.btn-danger:active,
.btn-danger.active,
.btn-danger.disabled,
.btn-danger[disabled] {
background-color: #bd362f;
border-color: #bd362f;
}
.btn-danger:active,
.btn-danger.active {
background-color: #942a25;
border-color: #942a25;
}
.btn-success {
background-color: #5bb75b;
border-color: #5bb75b;
background-image: none;
background-repeat: no-repeat;
filter: none;
}
.btn-success:hover,
.btn-success:active,
.btn-success.active,
.btn-success.disabled,
.btn-success[disabled] {
background-color: #51a351;
border-color: #51a351;
}
.btn-success:active,
.btn-success.active {
background-color: #408140;
border-color: #408140;
}
.btn-info {
background-color: #49afcd;
border-color: #49afcd;
background-image: none;
background-repeat: no-repeat;
filter: none;
}
.btn-info:hover,
.btn-info:active,
.btn-info.active,
.btn-info.disabled,
.btn-info[disabled] {
background-color: #2f96b4;
border-color: #2f96b4;
}
.btn-info:active,
.btn-info.active {
background-color: #24748c;
border-color: #24748c;
}
.btn-inverse {
background-color: #414141;
border-color: #414141;
background-image: none;
background-repeat: no-repeat;
filter: none;
}
.btn-inverse:hover,
.btn-inverse:active,
.btn-inverse.active,
.btn-inverse.disabled,
.btn-inverse[disabled] {
background-color: #222222;
border-color: #222222;
}
.btn-inverse:active,
.btn-inverse.active {
background-color: #080808;
border-color: #080808;
}
.dropdown-menu {
border: 2px solid #bababa;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.alert .close {
color: #FFF;
/*opacity: 0.4;*/
/*filter: alpha(opacity=40);*/
}
.well {
background-color: #FFF;
}
|
Download
