Replies: 1 comment
-
This is not the correct usage of UnoCSS classes. UnoCSS classes are just classes, so in fact, you code will become something like this: .slidev-layout.cover h1 {
border-bottom: 1px solid border-amber-500;
}
// Generated by UnoCSS
.border-amber-500 {
border-color: #abcd;
} Which doesn't work, because CSS doesn't allow a class name as a color value. However, I don't know how to get the colors from UnoCSS presets🥲. You can get the actual color in https://unocss.dev/interactive/?s=border-amber-500. |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
I'd like to dynamically style elements of the raw markdown code (styles with
.slidev-layout
classes).For example, sat you'd like
.slidev-layout h1
element to have a 1 px solid border at the bottom with a color chosen dynamically based on some logic in the<setup>
function of the layout. The color I'd like to use is from the@unocss/preset-uno
(e.g.,color-amber-500
). The problem is that unocss runs once at load so i can't do something likein my layout because the v-bind color will not re-evaluate or even evaluate initially, i think.
Alternatively,
won't work because
linecolor
in this case is the atomic CSS value e.g.,border-amber-500
. I guess what I'm thinking is if there is a way in<script setup>
to ask unocss for what the raw css is for the styleborder-amber-500
. That might end up a unocss question. But i guess more generally, this is a question for slidev in the sense of how does one recommend dynamically styling core markdown elements. I feel this can't be that difficult but am at a loss.Thanks!
Beta Was this translation helpful? Give feedback.
All reactions