Priestch/marko-foundation

★ 0Forks 0MarkoGitHub ↗Compare

README

marko-foundation

This repo is now organized as a pnpm workspace for the Marko Foundation project.

Workspace packages

  • apps/website: official website built with Marko Run.
  • tags: shared Marko tag library for Foundation-wrapped UI components.
  • packages/theme-default: default Sass theme package that maps project tokens onto Foundation for Sites.

Current components

  • fd-button (tags/fd-button/index.marko)
  • fd-button-group (tags/fd-button-group/index.marko)
  • fd-icon-button (tags/fd-icon-button/index.marko)
  • fd-close-button (tags/fd-close-button/index.marko)
  • fd-callout (tags/fd-callout/index.marko)
  • fd-label (tags/fd-label/index.marko)
  • fd-badge (tags/fd-badge/index.marko)
  • fd-switch (tags/fd-switch/index.marko)
  • fd-progress (tags/fd-progress/index.marko)
  • fd-thumbnail (tags/fd-thumbnail/index.marko)
  • fd-pagination (tags/fd-pagination/index.marko)
  • fd-breadcrumbs (tags/fd-breadcrumbs/index.marko)

UI architecture

  • tags/* own the Marko API and output Foundation-compatible structure.
  • packages/theme-default owns tokens, Foundation Sass settings, and shared CSS custom properties.
  • apps/website imports the theme Sass entrypoint and adds site-level shell styling on top.
  • Tags now emit mf-* framework classes as the primary component styling surface.
  • Selective Foundation CSS and JS remain only for shared layout primitives, forms, and focused compatibility/runtime paths.

Commands

pnpm install
pnpm dev
pnpm dev:website
pnpm build
pnpm build:website
pnpm preview:website

Documentation

Contributors

Priestch

Issues