Invisible warning header text

[thiekus]

Hi, i have installed your themes and looks awesome! But the problem header text for warning cards is invisible, unless you block select that text. It happens to all variants of theme & I use gitea 1.21.0. Thank you!

[markjoshwel]

i bumped into a similar issue for admonitions, not sure if it also affects this particular issue too but i thought i'd give my two cents in case they were linked:

seems like it comes from the catpuccin theme not defining -1 and -2 dark variants, but i doubt that would help anyways as the base gitea theme uses questionable variables to get the colours for warning text + admonitions

i "fixed" / patched it on my gitea install by find-and replacing root: { to @import("custom.css"); <newline> root: { on all catppuccin theme files with the following content:

blockquote.attention-note {
  border-left-color: var(--color-blue-light);
}
strong.attention-note, svg.attention-note {
  color: var(--color-blue);
}

blockquote.attention-tip {
  border-left-color: var(--color-success-border);
}
strong.attention-tip, svg.attention-tip {
  color: var(--color-success-bg);
}

blockquote.attention-important {
  border-left-color: var(--color-purple-light);
}
strong.attention-important, svg.attention-important {
  color: var(--color-purple);
}

blockquote.attention-warning {
  border-left-color: var(--color-warning-border);
}
strong.attention-warning, svg.attention-warning {
  color: var(--color-warning-bg);
}

blockquote.attention-caution {
  border-left-color: var(--color-red-light);
}
strong.attention-caution, svg.attention-caution {
  color: var(--color-red);
}

and for context, between my patch and the gitea default css as a diff:

diff --git a/gitea b/catppuccin-fix
index 7d13643..6027e1f 100644
--- a/gitea
+++ b/catppuccin-fix
@@ -1,34 +1,34 @@
 blockquote.attention-note {
-  border-left-color: var(--color-blue-dark-1);
+  border-left-color: var(--color-blue-light);
 }
 strong.attention-note, svg.attention-note {
-  color: var(--color-blue-dark-1);
+  color: var(--color-blue);
 }

 blockquote.attention-tip {
-  border-left-color: var(--color-success-text);
+  border-left-color: var(--color-success-border);
 }
 strong.attention-tip, svg.attention-tip {
-  color: var(--color-success-text);
+  color: var(--color-success-bg);
 }

 blockquote.attention-important {
-  border-left-color: var(--color-violet-dark-1);
+  border-left-color: var(--color-purple-light);
 }
 strong.attention-important, svg.attention-important {
-  color: var(--color-violet-dark-1);
+  color: var(--color-purple);
 }

 blockquote.attention-warning {
-  border-left-color: var(--color-warning-text);
+  border-left-color: var(--color-warning-border);
 }
 strong.attention-warning, svg.attention-warning {
-  color: var(--color-warning-text);
+  color: var(--color-warning-bg);
 }

 blockquote.attention-caution {
-  border-left-color: var(--color-red-dark-1);
+  border-left-color: var(--color-red-light);
 }
 strong.attention-caution, svg.attention-caution {
-  color: var(--color-red-dark-1);
+  color: var(--color-red);
 }

default gitea: