From 4ac41283880fdbdf9bf0b82e255004a300d62e8b Mon Sep 17 00:00:00 2001 From: siikamiika Date: Sun, 10 Nov 2019 03:15:55 +0200 Subject: search page checkbox styling Change checkboxes to color-inverting icons --- ext/mixed/css/display-dark.css | 6 ++++++ ext/mixed/css/display-default.css | 6 ++++++ ext/mixed/css/display.css | 16 ++++++++++++++++ 3 files changed, 28 insertions(+) (limited to 'ext/mixed/css') diff --git a/ext/mixed/css/display-dark.css b/ext/mixed/css/display-dark.css index 34a0ccd1..681d248c 100644 --- a/ext/mixed/css/display-dark.css +++ b/ext/mixed/css/display-dark.css @@ -48,3 +48,9 @@ hr { border-top-color: #2f2f2f; } .expression-rare, .expression-rare .kanji-link { color: #666666; } + +.icon-checkbox:checked + label { + /* invert colors */ + background-color: #d4d4d4; + color: #1e1e1e; +} diff --git a/ext/mixed/css/display-default.css b/ext/mixed/css/display-default.css index 176c5387..add0a9c8 100644 --- a/ext/mixed/css/display-default.css +++ b/ext/mixed/css/display-default.css @@ -48,3 +48,9 @@ hr { border-top-color: #eeeeee; } .expression-rare, .expression-rare .kanji-link { color: #999999; } + +.icon-checkbox:checked + label { + /* invert colors */ + background-color: #333333; + color: #ffffff; +} diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css index 7793ddeb..7ee6f5ac 100644 --- a/ext/mixed/css/display.css +++ b/ext/mixed/css/display.css @@ -73,6 +73,22 @@ ol, ul { } +/* + * Search page + */ + +.icon-checkbox { + display: none; +} + +.icon-checkbox + label { + cursor: pointer; + font-size: 22px; + padding: 2px; + user-select: none; +} + + /* * Entries */ -- cgit v1.2.3