Lists Kit

A plain HTML, CSS, Javascript boilerplate for info directories / listings

Finally, fixed the weird spacing and margins for the cards and cards container, after deciding to switch to centered alignment. Had to finally use some flexbox

Replaced unicode heart with Fontawesome heart icon in cards so that it doesn't render into a red emoji on phones

Lots of style fixes for ultra small screen of 375px (iPhone SE), especially the dang carousel slider. Thinking of removing it altogether and just using static testimonials

Dumbed down the tagline to make it easier to understand what it does

Looks like it's 90% complete! Realised this current boilerplate version is a travel-theme inspired one. I'm thinking of making 2-3 more versions to showcase the possibilities. Definitely making a SaaS version! What else? What would be popular?

Added CTA section, rolled my own loading spinner, fixes to spacing for resp

Added responsive navbar, added big font look, improved media queries

Added carousel slider, added animated gradient to hero CTA btn, lots of fixes to spacing, media queries

Added script to toggle background-color of filter btn, added float right to card btn (so it looks less like Bootstrap), added feature icons as img tags instead

Added hero section. Added load more. Tweaked load more to work with filters, search. Now it's starting to look like a proper website!

Decided to keep this version as an embeddable widget/plugin (for Carrd, or any other website)

Toyed with daisyUI, Tailwind, found a really awesome Nuxt 3 template (Nuxtwind Daisy) but still unsure. In the end, gravitated towards just plain CSS for now

Researching on HTML templates. Should I use HTML over Tailwind/Bulma? 🤔

Felt too flu-ed out today to get much done, but added some style tweaks at least! I think next step is to just fork it and build the site I need for ketolistsingapore, keyboardsg and add more features to the boilerplate based on real world execution rather than dreaming up feature I need in the boilerplate in abstract