AwsmBuff
AwsmBuff
DDeno
Created by AwsmBuff on 3/7/2024 in #help
TailwindCSS: Class-Strings build with variables
Since TailwindCSS does not support classes with variables (like I used before with twind), how would you color 10 elements with a Tailwind class but the color is retrieved from a list? For example: dark:bg-${color}-200 but the color is different for every button. I would use much more classes like text-color etc. so it was the easiest to do it with a variable that changes with every element.
12 replies
DDeno
Created by AwsmBuff on 7/18/2023 in #help
Signal Arrays do not work with HTML-Elements?
I tried to debug my problem for a while until I realized that this works:
import { useSignal } from "@preact/signals";

export default function Island() {
const activated = useSignal(false);
return (
<button
onClick={() => {
activated.value = !activated.value;
}}
class={activated.value ? "bg-blue-800" : "bg-red-800"}
>
Test
</button>
);
}
import { useSignal } from "@preact/signals";

export default function Island() {
const activated = useSignal(false);
return (
<button
onClick={() => {
activated.value = !activated.value;
}}
class={activated.value ? "bg-blue-800" : "bg-red-800"}
>
Test
</button>
);
}
but this does not:
import { useSignal } from "@preact/signals";

export default function Island() {
const activated = useSignal([false]);
return (
<button
onClick={() => {
activated.value[0] = !activated.value[0];
}}
class={activated.value[0] ? "bg-blue-800" : "bg-red-800"}
>
Test
</button>
);
}
import { useSignal } from "@preact/signals";

export default function Island() {
const activated = useSignal([false]);
return (
<button
onClick={() => {
activated.value[0] = !activated.value[0];
}}
class={activated.value[0] ? "bg-blue-800" : "bg-red-800"}
>
Test
</button>
);
}
17 replies
DDeno
Created by AwsmBuff on 4/22/2023 in #help
How to display data from a Handler on every page?
Hi, I am having the problem, that the PageProps are not accessible in the _app.tsx and I have not figured out how to access PageProps in a component (in the /components folder). If I give a component the PageProps parameter, Deno complains that I am not giving an argument in the calling file. Can someone help me with that? It is probably something that is done all the time in a project. In the end I just want to get something with a handler from a server and then display it in a component but as I stated, I do not know how to access that because I want to display it on every page using the app-wrapper. TL;DR: I want to make a HTTP Request and display the response on every page. How?
1 replies
DDeno
Created by AwsmBuff on 3/16/2023 in #help
Fresh: How to make Styles global with twindv1?
With the new twind-Plugin (v1), does anybody know how to do global styles? It was preflight before, but it does not seem to work like that anymore. I am trying for quite some time now to use injectGlobal and searching about both versions (through repos, documentations and forums) but I can not make it. Does anyone have an example or a suggestion do it in another way? 🥺 A solution would safe me hours of trial-and-error.
2 replies