drowl87/hextra_mirror
1
0
Fork 1
mirror of https://github.com/imfing/hextra.git synced 2025-05-13 16:36:26 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: correct tabs button color on hover in dark mode (#526)

Browse Source 
* fix: tabs toggle button color in dark mode

* chore: update css
This commit is contained in:
Xin 2024-12-28 15:51:35 +00:00 committed by GitHub
parent 79bb4504a0
commit e532637cbc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
assets/css/compiled/main.css
View File

@ -3258,6 +3258,14 @@ body:is(html[class~="dark"] *) {
--tw-ring-opacity: 1;
--tw-ring-color: hsl(var(--primary-hue) var(--primary-saturation) calc(calc(var(--primary-lightness) / 50) * 32) / var(--tw-ring-opacity));
}
.data-\[state\=selected\]\:dark\:hx-border-primary-500:is(html[class~="dark"] *)[data-state="selected"] {
--tw-border-opacity: 1;
border-color: hsl(var(--primary-hue) var(--primary-saturation) calc(calc(var(--primary-lightness) / 50) * 50) / var(--tw-border-opacity));
}
.data-\[state\=selected\]\:dark\:hx-text-primary-600:is(html[class~="dark"] *)[data-state="selected"] {
--tw-text-opacity: 1;
color: hsl(var(--primary-hue) var(--primary-saturation) calc(calc(var(--primary-lightness) / 50) * 45) / var(--tw-text-opacity));
}
@media (prefers-contrast: more) {
.contrast-more\:dark\:hx-border-current:is(html[class~="dark"] *) {

2
exampleSite/hugo_stats.json
View File

@ -197,6 +197,8 @@
"dark:placeholder:hx-text-gray-400",
"data-[state=closed]:hx-hidden",
"data-[state=open]:hx-hidden",
"data-[state=selected]:dark:hx-border-primary-500",
"data-[state=selected]:dark:hx-text-primary-600",
"data-[state=selected]:hx-block",
"data-[state=selected]:hx-border-primary-500",
"data-[state=selected]:hx-text-primary-600",

2
layouts/shortcodes/tabs.html
View File

@ -9,7 +9,7 @@
<div class="hx-mt-4 hx-flex hx-w-max hx-min-w-full hx-border-b hx-border-gray-200 hx-pb-px dark:hx-border-neutral-800">
{{- range $i, $item := $items -}}
<button
class="hextra-tabs-toggle data-[state=selected]:hx-border-primary-500 data-[state=selected]:hx-text-primary-600 hx-mr-2 hx-rounded-t hx-p-2 hx-font-medium hx-leading-5 hx-transition-colors -hx-mb-0.5 hx-select-none hx-border-b-2 hx-border-transparent hx-text-gray-600 hover:hx-border-gray-200 hover:hx-text-black dark:hx-text-gray-200 dark:hover:hx-border-neutral-800 dark:hover:hx-text-white"
class="hextra-tabs-toggle data-[state=selected]:hx-border-primary-500 data-[state=selected]:hx-text-primary-600 data-[state=selected]:dark:hx-border-primary-500 data-[state=selected]:dark:hx-text-primary-600 hx-mr-2 hx-rounded-t hx-p-2 hx-font-medium hx-leading-5 hx-transition-colors -hx-mb-0.5 hx-select-none hx-border-b-2 hx-border-transparent hx-text-gray-600 hover:hx-border-gray-200 hover:hx-text-black dark:hx-text-gray-200 dark:hover:hx-border-neutral-800 dark:hover:hx-text-white"
role="tab"
type="button"
aria-controls="tabs-panel-{{ $i }}"