Pretty crazy! Transcript:
Human: Hello, who are you?
AI: I am an AI created by OpenAI. How can I help you today?
Human: I'd like to see a nicely styled button component written in hiccup and styled with tailwindcss
AI: Sure, I can help with that. Please give me a few moments to create the code for you.
Human: sounds good, let me know when it is ready.
AI: Alright, I have written the code for your button component. I've included several styles and classes that you can use to customize the look of the button. Let me know if you would like to see any additional changes or styles added.
Human: great! can you show me the code?
AI: Absolutely. Here is the code I wrote for you.
<Button
className="bg-gray-400 hover:bg-gray-500 text-white font-bold py-2 px-4 rounded m-2"
style={{ width: '150px' }} >
Click Me
</Button>
Human: this is pretty good, but it's not written in hiccup. hiccup is a clojure-based library for writing components that are like html. can you convert the above component to hiccup?
AI: Sure, I can do that. Give me a few moments to convert the code and I'll get back to you.
Human: thanks much! show me the code when it is ready.
AI: Absolutely. Here's the hiccup-converted code for your button component:
[:Button {:className "bg-gray-400 hover:bg-gray-500 text-white font-bold py-2 px-4 rounded m-2" :style {:width "150px"}} "Click Me"]
Human: i prefer hiccup components to use `:class` and an array of classes instead of single string. can you convert the hiccup code to that style?
AI: Sure, I can do that. Here's the converted code for your button component:
[:Button {:class [:bg-gray-400 :hover-bg-gray-500 :text-white :font-bold :py-2 :px-4 :rounded :m-2] :style {:width "150px"}} "Click Me"]
Human: this looks great! can you convert the keyword tailwind classes back to individual strings?
AI: Yes, I can do that. Here's the converted code for your button component:
<Button
className="bg-gray-400 hover:bg-gray-500 text-white font-bold py-2 px-4 rounded m-2"
style={{ width: '150px' }} >
Click Me
</Button>
Human: Not what I wanted - I'd like the component to be written in hiccup, and with a :class list of tailwind classes, like `{:class ["bg-gray-400" "text-white" ...etc]}`
AI: Sure, I can do that. Here's the converted code for your button component:
[:Button {:class ["bg-gray-400" "hover:bg-gray-500" "text-white" "font-bold" "py-2" "px-4" "rounded" "m-2"] :style {:width "150px"}} "Click Me"]
Human: well color me impressed!
Some repos I'm reading for solutions each day.
Great post for improving your clojure repl understanding.
genmeblog/genuary: Generative Art in January - Generative Artists Club
https://blog.michielborkent.nl/babashka-test-runner.html
Testing babashka scripts
squidfunk/mkdocs-material: Documentation that simply works
Maybe publish dino addons docs this way?
gonetz/GLideN64: A new generation, open-source graphics plugin for N64 emulators. https://github.com/gonetz/GLideN64
MenacingMecha/godot-n64-shader-demo: Demo project featuring a collection of N64 style shaders and materials for Godot engine. https://github.com/MenacingMecha/godot-n64-shader-demo