User:Bluhen/Sandbox: Difference between revisions
added dark mode support
(new feature :D) |
(added dark mode support) |
||
| Line 32: | Line 32: | ||
line-height: 0px; | line-height: 0px; | ||
height: max-content; | height: max-content; | ||
border-radius: 4px; | border-radius: 4px; | ||
margin-top: -1px; | margin-top: -1px; | ||
font-weight: 1000; | font-weight: 1000; | ||
font-size: 12px; | font-size: 12px; | ||
cursor: pointer; | cursor: pointer; | ||
background-color: white; | |||
border:solid 2px #d3dcdd; | |||
color: #f7812b; | |||
} | |||
.dark-mode .info-box { | |||
background-color: #e8e8e8; | |||
border: solid 2px #D8d8d8 !important; | |||
color: #B96120; | |||
} | } | ||
.info-box:hover { | .info-box:hover { | ||
background-color: #dce0e6; | background-color: #dce0e6; | ||
border-color: #dce0e6; | border-color: #dce0e6 !important; | ||
color: grey; | color: grey; | ||
} | |||
.dark-mode .info-box:hover { | |||
background-color: #3b3b3b; | |||
border-color: #3b3b3b !important; | |||
color: #e8e8e8; | |||
} | } | ||
| Line 52: | Line 64: | ||
border: solid 2px #f7812b; | border: solid 2px #f7812b; | ||
color: white; | color: white; | ||
} | |||
.dark-mode .invert { | |||
background-color: #B96120; | |||
border: solid 2px #B96120 !important; | |||
color: #e8e8e8; | |||
} | } | ||
.invert:hover { | .invert:hover { | ||
background-color: white; | background-color: white; | ||
border-color: #f7812b; | border-color: #f7812b !important; | ||
color: #f7812b; | color: #f7812b; | ||
} | |||
.dark-mode .invert:hover { | |||
background-color: #e8e8e8; | |||
border-color: #B96120 !important; | |||
color: #B96120; | |||
} | } | ||
.grayscale { | .grayscale { | ||
background-color: white; | background-color: white; | ||
border: solid 2px grey; | border: solid 2px grey; | ||
color: grey; | |||
} | |||
.dark-mode .grayscale { | |||
background-color: #D8d8d8; | |||
border: solid 2px #4e4e4e !important; | |||
color: #4e4e4e; | |||
} | } | ||
.grayscale:hover { | .grayscale:hover { | ||
background-color: grey; | background-color: grey; | ||
border-color: grey; | border-color: grey !important; | ||
color: white; | color: white; | ||
} | |||
.dark-mode .grayscale:hover { | |||
background-color: #4e4e4e; | |||
border-color: #4e4e4e !important; | |||
color: #e8e8e8; | |||
} | } | ||