Cuukbuuk home page
I redesigned the entire Cuukbuuk app. The update is largely built on clean Faunder UI. The goal was less clutter and more clarity.
cuukbuuk.com
ui.faunder.fi
#uidesign #frontend #css #faunderui
Cuukbuuk home page
I redesigned the entire Cuukbuuk app. The update is largely built on clean Faunder UI. The goal was less clutter and more clarity.
cuukbuuk.com
ui.faunder.fi
#uidesign #frontend #css #faunderui
#FaunderUI changelog:
ui-icon: Besides mask icon, now supports svg, img, and content (span). Same sizing and styling: <i ui-icon>, <svg ui-icon>, <img ui-icon>, <span ui-icon>emoji</span>. Size via --ui-icon-size or ui-icon="sm"/"lg".
ui.faunder.fi/icon
#FaunderUI changelog:
Layout helpers: ui-column, ui-row, and ui-margin keep layouts consistent (same xs–6xl scale) and make structure easier.
Example: ui-column="gap-lg x-center", ui-row="wrap gap-md", ui-margin="top-lg".
ui.faunder.fi/row
ui.faunder.fi/column
ui.faunder.fi/margin
#FaunderUI changelog:
No more separate ui-card-link element inside ui-card — ui-card works directly on <a>. The card can be the link: <a ui-card href="#">...</a>.
ui.faunder.fi/card
#FaunderUI changelog:
ui-accordion: Added animations (open/close, content height and opacity) and support for custom summary icons.
ui.faunder.fi/accordion
#FaunderUI changelog:
Components no longer use class names - each has its own ui-x attribute (e.g. ui-button, ui-container). Variants and utilities are easier to manage, and your own styles won’t clash. Example: <button ui-button="primary lg">.
ui.faunder.fi