Save your precious little perceivers during night-time study.
HH Dark Mode [Reviews and Lessons] by Tom
![Screenshot of HH Dark Mode [Reviews and Lessons]](https://userstyles.world/preview/14928/5.jpeg)
Details
AuthorTom
LicenseTom's
Categoryhanzihero.com
Created
Updated
Size6.4 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
/* ==UserStyle==
@name HH Dark Mode
@namespace hhdark
@version 1.1
@author Tom
==/UserStyle== */
@-moz-document url-prefix("https://hanzihero.com/reviews"), url-prefix("https://hanzihero.com/lessons"), url-prefix("https://hanzihero.com/extra-study") {
.bg-slate-100 { /* main colour blob */
--tw-bg-opacity: 1;
background-color: rgb(20 20 20/var(--tw-bg-opacity));
}
.text-slate-700 { /* I forgor */
--tw-text-opacity: 1;
color: rgb(256 256 256/var(--tw-text-opacity));
}
.bg-white { /* input field */
--tw-bg-opacity: 1;
/*background-image: url(------);*/
background-repeat:repeat;
background-color: rgb(30 30 30/var(--tw-bg-opacity));
}
.bg-slate-800 { /* question query */
--tw-bg-opacity: 1;
background-color: rgb(50 50 50/var(--tw-bg-opacity));
}
.text-white {
--tw-text-opacity: 1;
color: rgb(238 238 228/var(--tw-text-opacity));
}
.bg-slate-50 {
--tw-bg-opacity: 1;
background-color: rgb(30 30 30/var(--tw-bg-opacity));
}
.border {
border-width: 3px;
border-top-width: 3px;
border-right-width: 3px;
border-bottom-width: 3px;
border-left-width: 3px;
border-radius: 10px;
}
.border-slate-200 {
--tw-border-opacity: 1;
border-color: rgb(30 30 30/var(--tw-border-opacity));
}
.border-slate-300 {
--tw-border-opacity: 1;
border-color: rgb(45 45 45/var(--tw-border-opacity));
}
/* correct, learn more, wrong, ctrl-z*/
.bg-green-500 {
--tw-bg-opacity: 1;
background-color: rgb(71 150 68/var(--tw-bg-opacity)); /* 20 91 65*/
}
.bg-green-400 {
--tw-bg-opacity: 1;
background-color: rgb(71 150 68/var(--tw-bg-opacity));
}
.border-green-400 {
--tw-border-opacity: 1;
border-color: rgb(45 45 45/var(--tw-border-opacity));
}
.tippy-box[data-theme~=emerald] { /* SRS level-up notification */ /* alt: 46 177 131 or 106 185 120 */
background-color: rgb(46 177 80/var(--tw-bg-opacity));
}
.bg-rose-600 {
--tw-bg-opacity: 1;
background-color: rgb(161 51 51/var(--tw-bg-opacity));
}
.bg-amber-500 {
--tw-bg-opacity: 1;
background-color: rgb(161 120 51/var(--tw-bg-opacity));
}
/* body font */
.text-slate-600 {
--tw-text-opacity: 1;
color: rgb(238 238 228/var(--tw-text-opacity));
}
.prose {
--tw-prose-body: #eeeee4;
}
.text-slate-400 {
--tw-text-opacity: 1;
color: rgb(152 152 152/var(--tw-text-opacity));
}
.text-slate-500 {
--tw-text-opacity: 1;
color: rgb(200 200 190/var(--tw-text-opacity));
}
[multiple], [type=date], [type=datetime-local], [type=email], [type=month], [type=number], [type=password], [type=search], [type=tel], [type=text], [type=time], [type=url], [type=week], select, textarea {
--tw-shadow: 0 0 #0000;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: #333;
}
.bg-slate-200 {
--tw-bg-opacity: 1;
background-color: rgb(79 79 79/var(--tw-bg-opacity));
}
.bg-slate-300 {
--tw-bg-opacity: 1;
background-color: rgb(79 79 79/var(--tw-bg-opacity));
}
.hero-chevron-right-solid {
--hero-chevron-right-solid: url(data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M16.28 11.47a.75.75 0 010 1.06l-7.5 7.5a.75.75 0 01-1.06-1.06L14.69 12 7.72 5.03a.75.75 0 011.06-1.06l7.5 7.5z" clip-rule="evenodd"/></svg>);
-webkit-mask: var(--hero-chevron-right-solid);
mask: var(--hero-chevron-right-solid);
filter: invert(100%);
}
.hero-chevron-left-solid {
--hero-chevron-left-solid: url(data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M7.72 12.53a.75.75 0 010-1.06l7.5-7.5a.75.75 0 111.06 1.06L9.31 12l6.97 6.97a.75.75 0 11-1.06 1.06l-7.5-7.5z" clip-rule="evenodd"/></svg>);
-webkit-mask: var(--hero-chevron-left-solid);
mask: var(--hero-chevron-left-solid);
filter: invert(100%);
}
.hover\:bg-slate-100:hover {
--tw-bg-opacity: 1;
background-color: rgb(20 20 20/var(--tw-bg-opacity));
}
.text-slate-800 {
--tw-text-opacity: 1;
color: rgb(238 238 228/var(--tw-text-opacity));
}
.hero-check-solid, .hero-chevron-down {
background-color: #fff;
display: inline-block;
height: 1.25rem;
vertical-align: middle;
width: 1.25rem;
}
}
/* update */
.bg-slate-200 {
--tw-bg-opacity: 1;
background-color: rgb(50 50 50 / var(--tw-bg-opacity));
}
@-moz-document url-prefix("https://hanzihero.com/reviews"), url-prefix("https://hanzihero.com/lessons"), url-prefix("https://hanzihero.com/extra-study") {
/* DELETE THIS SECTION TO REVERT BACK TO DEAFULT HANZIHERO™ COLOURS */
.bg-gradient-to-b {
background-image: linear-gradient(to bottom,var(--tw-gradient-stops));
}
.from-cerise-500 {
--tw-gradient-from: #D24C4C;
--tw-gradient-stops: var(--tw-gradient-from),var(--tw-gradient-to);
}
.to-cerise-600 {
--tw-gradient-to: #D24C4C;
}
.from-blue-500 {
--tw-gradient-from: #3B7FD0;
--tw-gradient-to: #3b82f600;
--tw-gradient-stops: var(--tw-gradient-from),var(--tw-gradient-to);
}
.to-blue-600 {
--tw-gradient-to: #3B7FD0;
}
.from-purple-600 {
--tw-gradient-from: #825ba4;
--tw-gradient-to: #9333ea00;
--tw-gradient-stops: var(--tw-gradient-from),var(--tw-gradient-to);
}
.to-purple-700 {
--tw-gradient-to: #825ba4;
}
.from-sky-400 {
--tw-gradient-from: #6AA5BD;
--tw-gradient-to: #38bdf800;
--tw-gradient-stops: var(--tw-gradient-from),var(--tw-gradient-to);
}
.to-sky-500 {
--tw-gradient-to: #6AA5BD;
}
.bg-slate-900\/75 {
background-color: #030303bf;
}
.bg-green-100 {
--tw-bg-opacity: 1;
background-color: rgb(17 17 17 / var(--tw-bg-opacity));
}
}
@-moz-document url-prefix("https://hanzihero.com/lessons") {
.bg-gradient-to-t {
background-image: none (to top,var(--tw-gradient-stops));
}
/*IGNORE THIS */
.alternative_colors{
--tw-dont_remeber: #2596be;
--tw-character_ind: #9e4f4f;
--tw-ctrl-z: rgb(158 126 79);
}
}