forked from lthn/blockchain
changed color scheme for buttons and tabs
This commit is contained in:
parent
60c2d96c73
commit
d26fefb74a
8 changed files with 140 additions and 40 deletions
|
|
@ -33,6 +33,13 @@ button {
|
|||
background-color: themed(disabledButtonHoverColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(disabledButtonFocusColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.blue-button:not(:disabled) {
|
||||
|
|
@ -54,6 +61,13 @@ button {
|
|||
background-color: themed(blueButtonHoverColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(blueButtonFocusColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.green-button:not(:disabled) {
|
||||
|
|
@ -69,6 +83,13 @@ button {
|
|||
background-color: themed(greenButtonHoverColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(greenButtonFocusColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.turquoise-button:not(:disabled) {
|
||||
|
|
@ -84,6 +105,13 @@ button {
|
|||
background-color: themed(turquoiseButtonHoverColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(turquoiseButtonFocusColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.transparent-button {
|
||||
|
|
|
|||
|
|
@ -13,26 +13,31 @@ $themes: (
|
|||
greenTextColor: #5cda9d,
|
||||
redTextColor: #fe5252,
|
||||
blueButtonBackgroundColor: #4db1ff,
|
||||
blueButtonHoverColor: #60b9ff,
|
||||
disabledButtonBackgroundColor: #90a4ae,
|
||||
disabledButtonHoverColor: #9bb0ba,
|
||||
blueButtonHoverColor: #82d7ff,
|
||||
blueButtonFocusColor: #59b5fd,
|
||||
disabledButtonBackgroundColor: #9cadb7,
|
||||
disabledButtonHoverColor: #b7d1e0,
|
||||
disabledButtonFocusColor: #a7b9c2,
|
||||
greenButtonBackgroundColor: #5cda9d,
|
||||
greenButtonHoverColor: #5ce2a1,
|
||||
greenButtonHoverColor: #8dfcc6,
|
||||
greenButtonFocusColor: #62e0b2,
|
||||
turquoiseButtonBackgroundColor: #4dd0e1,
|
||||
turquoiseButtonHoverColor: #52d9ea,
|
||||
turquoiseButtonHoverColor: #87f4f5,
|
||||
turquoiseButtonFocusColor: #42d5e8,
|
||||
transparentButtonBorderColor: #2b3644,
|
||||
inputBackgroundColor: #171e27,
|
||||
selectHoverColor: rgba(58, 72, 90, 0.5),
|
||||
selectHoverColor: rgba(58, 69, 85, 0.5),
|
||||
selectSelectedColor: rgba(43, 54, 68, 0.5),
|
||||
switchBackgroundColor: #000000,
|
||||
accountBackgroundColor: rgba(43, 54, 68, 0.5),
|
||||
accountHoverBackgroundColor: rgba(58, 72, 90, 0.5),
|
||||
accountHoverBackgroundColor: rgba(58, 69, 85, 0.5),
|
||||
accountMainTextColor: #e0e0e0,
|
||||
accountOptionalTextColor: #556576,
|
||||
accountIndicatorTextColor: #111921,
|
||||
accountSwitchBackgroundColor: #000000,
|
||||
accountIndicatorBackgroundColor: #4db1ff,
|
||||
tabInactiveBackgroundColor: rgba(23, 31, 39, 0.5),
|
||||
tabHoverBackgroundColor: rgba(58, 69, 85, 0.5),
|
||||
tableBackgroundColor: #18202a,
|
||||
messageMyBackgroundColor: #2a3544,
|
||||
messageBuddyBackgroundColor: #18202a,
|
||||
|
|
@ -47,7 +52,7 @@ $themes: (
|
|||
),
|
||||
gray: (
|
||||
bodyBackgroundColor: #101417,
|
||||
sidebarBackgroundColor: rgba(23, 25, 27, 0.5),
|
||||
sidebarBackgroundColor: rgba(28, 30, 33, 0.5),
|
||||
sidebarBorderColor: #2e3337,
|
||||
onlineColor: #47cf8d,
|
||||
offlineColor: #ff5252,
|
||||
|
|
@ -59,26 +64,31 @@ $themes: (
|
|||
greenTextColor: #47cf8d,
|
||||
redTextColor: #fe5252,
|
||||
blueButtonBackgroundColor: #42a5f5,
|
||||
blueButtonHoverColor: #4dafff,
|
||||
blueButtonHoverColor: #86d6ff,
|
||||
blueButtonFocusColor: #5fb6fc,
|
||||
disabledButtonBackgroundColor: #79848f,
|
||||
disabledButtonHoverColor: #85909b,
|
||||
disabledButtonHoverColor: #a1aebb,
|
||||
disabledButtonFocusColor: #8a959f,
|
||||
greenButtonBackgroundColor: #47cf8d,
|
||||
greenButtonHoverColor: #49d993,
|
||||
greenButtonHoverColor: #7bf6c6,
|
||||
greenButtonFocusColor: #5cdc9e,
|
||||
turquoiseButtonBackgroundColor: #3ec5d7,
|
||||
turquoiseButtonHoverColor: #43cee0,
|
||||
turquoiseButtonHoverColor: #72edfe,
|
||||
turquoiseButtonFocusColor: #50d0e1,
|
||||
transparentButtonBorderColor: #2f3438,
|
||||
inputBackgroundColor: #292d31,
|
||||
selectHoverColor: rgba(70, 76, 81, 0.5),
|
||||
selectHoverColor: rgba(58, 62, 66, 0.5),
|
||||
selectSelectedColor: rgba(37, 40, 43, 0.5),
|
||||
switchBackgroundColor: #000000,
|
||||
accountBackgroundColor: rgba(37, 40, 43, 0.5),
|
||||
accountHoverBackgroundColor: rgba(70, 76, 81, 0.5),
|
||||
accountHoverBackgroundColor: rgba(58, 62, 66, 0.5),
|
||||
accountMainTextColor: #e0e0e0,
|
||||
accountOptionalTextColor: #565c62,
|
||||
accountIndicatorTextColor: #1a1a1a,
|
||||
accountSwitchBackgroundColor: #000000,
|
||||
accountIndicatorBackgroundColor: #42a5f5,
|
||||
tabInactiveBackgroundColor: rgba(23, 25, 27, 0.5),
|
||||
tabInactiveBackgroundColor: rgba(28, 30, 33, 0.5),
|
||||
tabHoverBackgroundColor: rgba(58, 62, 66, 0.5),
|
||||
tableBackgroundColor: #25292d,
|
||||
messageMyBackgroundColor: #30363c,
|
||||
messageBuddyBackgroundColor: #25292d,
|
||||
|
|
@ -105,13 +115,17 @@ $themes: (
|
|||
greenTextColor: #46c172,
|
||||
redTextColor: #ff5252,
|
||||
blueButtonBackgroundColor: #2c95f1,
|
||||
blueButtonHoverColor: #379ffa,
|
||||
blueButtonHoverColor: #5cb3ff,
|
||||
blueButtonFocusColor: #379ffa,
|
||||
disabledButtonBackgroundColor: #90a4ae,
|
||||
disabledButtonHoverColor: #9baeb7,
|
||||
disabledButtonHoverColor: #aebec6,
|
||||
disabledButtonFocusColor: #a7b9c2,
|
||||
greenButtonBackgroundColor: #46c172,
|
||||
greenButtonHoverColor: #46ca75,
|
||||
greenButtonHoverColor: #5ad586,
|
||||
greenButtonFocusColor: #53c77c,
|
||||
turquoiseButtonBackgroundColor: #26b6c7,
|
||||
turquoiseButtonHoverColor: #2bbdcf,
|
||||
turquoiseButtonHoverColor: #52cbd9,
|
||||
turquoiseButtonFocusColor: #31becf,
|
||||
transparentButtonBorderColor: #ebebeb,
|
||||
inputBackgroundColor: #e6e6e6,
|
||||
selectHoverColor: rgba(240, 240, 240, 0.5),
|
||||
|
|
@ -125,6 +139,7 @@ $themes: (
|
|||
accountSwitchBackgroundColor: #ffffff,
|
||||
accountIndicatorBackgroundColor: #ffffff,
|
||||
tabInactiveBackgroundColor: rgba(224, 224, 224, 0.5),
|
||||
tabHoverBackgroundColor: #ffffff,
|
||||
tableBackgroundColor: #ffffff,
|
||||
messageMyBackgroundColor: #fff,
|
||||
messageBuddyBackgroundColor: #ededed,
|
||||
|
|
|
|||
|
|
@ -76,6 +76,13 @@ app-wallet {
|
|||
background-color: themed(contentBackgroundColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover:not(.active) {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(tabHoverBackgroundColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -33,6 +33,13 @@ button {
|
|||
background-color: themed(disabledButtonHoverColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(disabledButtonFocusColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.blue-button:not(:disabled) {
|
||||
|
|
@ -54,6 +61,13 @@ button {
|
|||
background-color: themed(blueButtonHoverColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(blueButtonFocusColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.green-button:not(:disabled) {
|
||||
|
|
@ -69,6 +83,13 @@ button {
|
|||
background-color: themed(greenButtonHoverColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(greenButtonFocusColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.turquoise-button:not(:disabled) {
|
||||
|
|
@ -84,6 +105,13 @@ button {
|
|||
background-color: themed(turquoiseButtonHoverColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(turquoiseButtonFocusColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.transparent-button {
|
||||
|
|
|
|||
|
|
@ -13,26 +13,31 @@ $themes: (
|
|||
greenTextColor: #5cda9d,
|
||||
redTextColor: #fe5252,
|
||||
blueButtonBackgroundColor: #4db1ff,
|
||||
blueButtonHoverColor: #60b9ff,
|
||||
disabledButtonBackgroundColor: #90a4ae,
|
||||
disabledButtonHoverColor: #9bb0ba,
|
||||
blueButtonHoverColor: #82d7ff,
|
||||
blueButtonFocusColor: #59b5fd,
|
||||
disabledButtonBackgroundColor: #9cadb7,
|
||||
disabledButtonHoverColor: #b7d1e0,
|
||||
disabledButtonFocusColor: #a7b9c2,
|
||||
greenButtonBackgroundColor: #5cda9d,
|
||||
greenButtonHoverColor: #5ce2a1,
|
||||
greenButtonHoverColor: #8dfcc6,
|
||||
greenButtonFocusColor: #62e0b2,
|
||||
turquoiseButtonBackgroundColor: #4dd0e1,
|
||||
turquoiseButtonHoverColor: #52d9ea,
|
||||
turquoiseButtonHoverColor: #87f4f5,
|
||||
turquoiseButtonFocusColor: #42d5e8,
|
||||
transparentButtonBorderColor: #2b3644,
|
||||
inputBackgroundColor: #171e27,
|
||||
selectHoverColor: rgba(58, 72, 90, 0.5),
|
||||
selectHoverColor: rgba(58, 69, 85, 0.5),
|
||||
selectSelectedColor: rgba(43, 54, 68, 0.5),
|
||||
switchBackgroundColor: #000000,
|
||||
accountBackgroundColor: rgba(43, 54, 68, 0.5),
|
||||
accountHoverBackgroundColor: rgba(58, 72, 90, 0.5),
|
||||
accountHoverBackgroundColor: rgba(58, 69, 85, 0.5),
|
||||
accountMainTextColor: #e0e0e0,
|
||||
accountOptionalTextColor: #556576,
|
||||
accountIndicatorTextColor: #111921,
|
||||
accountSwitchBackgroundColor: #000000,
|
||||
accountIndicatorBackgroundColor: #4db1ff,
|
||||
tabInactiveBackgroundColor: rgba(23, 31, 39, 0.5),
|
||||
tabHoverBackgroundColor: rgba(58, 69, 85, 0.5),
|
||||
tableBackgroundColor: #18202a,
|
||||
messageMyBackgroundColor: #2a3544,
|
||||
messageBuddyBackgroundColor: #18202a,
|
||||
|
|
@ -47,7 +52,7 @@ $themes: (
|
|||
),
|
||||
gray: (
|
||||
bodyBackgroundColor: #101417,
|
||||
sidebarBackgroundColor: rgba(23, 25, 27, 0.5),
|
||||
sidebarBackgroundColor: rgba(28, 30, 33, 0.5),
|
||||
sidebarBorderColor: #2e3337,
|
||||
onlineColor: #47cf8d,
|
||||
offlineColor: #ff5252,
|
||||
|
|
@ -59,26 +64,31 @@ $themes: (
|
|||
greenTextColor: #47cf8d,
|
||||
redTextColor: #fe5252,
|
||||
blueButtonBackgroundColor: #42a5f5,
|
||||
blueButtonHoverColor: #4dafff,
|
||||
blueButtonHoverColor: #86d6ff,
|
||||
blueButtonFocusColor: #5fb6fc,
|
||||
disabledButtonBackgroundColor: #79848f,
|
||||
disabledButtonHoverColor: #85909b,
|
||||
disabledButtonHoverColor: #a1aebb,
|
||||
disabledButtonFocusColor: #8a959f,
|
||||
greenButtonBackgroundColor: #47cf8d,
|
||||
greenButtonHoverColor: #49d993,
|
||||
greenButtonHoverColor: #7bf6c6,
|
||||
greenButtonFocusColor: #5cdc9e,
|
||||
turquoiseButtonBackgroundColor: #3ec5d7,
|
||||
turquoiseButtonHoverColor: #43cee0,
|
||||
turquoiseButtonHoverColor: #72edfe,
|
||||
turquoiseButtonFocusColor: #50d0e1,
|
||||
transparentButtonBorderColor: #2f3438,
|
||||
inputBackgroundColor: #292d31,
|
||||
selectHoverColor: rgba(70, 76, 81, 0.5),
|
||||
selectHoverColor: rgba(58, 62, 66, 0.5),
|
||||
selectSelectedColor: rgba(37, 40, 43, 0.5),
|
||||
switchBackgroundColor: #000000,
|
||||
accountBackgroundColor: rgba(37, 40, 43, 0.5),
|
||||
accountHoverBackgroundColor: rgba(70, 76, 81, 0.5),
|
||||
accountHoverBackgroundColor: rgba(58, 62, 66, 0.5),
|
||||
accountMainTextColor: #e0e0e0,
|
||||
accountOptionalTextColor: #565c62,
|
||||
accountIndicatorTextColor: #1a1a1a,
|
||||
accountSwitchBackgroundColor: #000000,
|
||||
accountIndicatorBackgroundColor: #42a5f5,
|
||||
tabInactiveBackgroundColor: rgba(23, 25, 27, 0.5),
|
||||
tabInactiveBackgroundColor: rgba(28, 30, 33, 0.5),
|
||||
tabHoverBackgroundColor: rgba(58, 62, 66, 0.5),
|
||||
tableBackgroundColor: #25292d,
|
||||
messageMyBackgroundColor: #30363c,
|
||||
messageBuddyBackgroundColor: #25292d,
|
||||
|
|
@ -105,13 +115,17 @@ $themes: (
|
|||
greenTextColor: #46c172,
|
||||
redTextColor: #ff5252,
|
||||
blueButtonBackgroundColor: #2c95f1,
|
||||
blueButtonHoverColor: #379ffa,
|
||||
blueButtonHoverColor: #5cb3ff,
|
||||
blueButtonFocusColor: #379ffa,
|
||||
disabledButtonBackgroundColor: #90a4ae,
|
||||
disabledButtonHoverColor: #9baeb7,
|
||||
disabledButtonHoverColor: #aebec6,
|
||||
disabledButtonFocusColor: #a7b9c2,
|
||||
greenButtonBackgroundColor: #46c172,
|
||||
greenButtonHoverColor: #46ca75,
|
||||
greenButtonHoverColor: #5ad586,
|
||||
greenButtonFocusColor: #53c77c,
|
||||
turquoiseButtonBackgroundColor: #26b6c7,
|
||||
turquoiseButtonHoverColor: #2bbdcf,
|
||||
turquoiseButtonHoverColor: #52cbd9,
|
||||
turquoiseButtonFocusColor: #31becf,
|
||||
transparentButtonBorderColor: #ebebeb,
|
||||
inputBackgroundColor: #e6e6e6,
|
||||
selectHoverColor: rgba(240, 240, 240, 0.5),
|
||||
|
|
@ -125,6 +139,7 @@ $themes: (
|
|||
accountSwitchBackgroundColor: #ffffff,
|
||||
accountIndicatorBackgroundColor: #ffffff,
|
||||
tabInactiveBackgroundColor: rgba(224, 224, 224, 0.5),
|
||||
tabHoverBackgroundColor: #ffffff,
|
||||
tableBackgroundColor: #ffffff,
|
||||
messageMyBackgroundColor: #fff,
|
||||
messageBuddyBackgroundColor: #ededed,
|
||||
|
|
|
|||
|
|
@ -76,6 +76,13 @@ app-wallet {
|
|||
background-color: themed(contentBackgroundColor);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover:not(.active) {
|
||||
|
||||
@include themify($themes) {
|
||||
background-color: themed(tabHoverBackgroundColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue