{"id":47258995,"url":"https://github.com/vanduo-oss/framework","last_synced_at":"2026-04-06T21:01:10.206Z","repository":{"id":335367465,"uuid":"1127658109","full_name":"vanduo-oss/framework","owner":"vanduo-oss","description":"A lightweight, pure HTML/CSS/JS framework for designing beautiful websites. ","archived":false,"fork":false,"pushed_at":"2026-03-14T18:56:57.000Z","size":18893,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-03-15T05:59:07.222Z","etag":null,"topics":["css","foss","framework","html","html5","javascript","javascript-framework","js","open-color","phosphor-icons","web","web-framework","webframework"],"latest_commit_sha":null,"homepage":"https://vanduo.dev/","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vanduo-oss.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-01-04T10:45:26.000Z","updated_at":"2026-03-14T18:57:00.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/vanduo-oss/framework","commit_stats":null,"previous_names":["nostromo-618/vanduo-framework","vanduo-oss/framework"],"tags_count":19,"template":false,"template_full_name":null,"purl":"pkg:github/vanduo-oss/framework","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vanduo-oss%2Fframework","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vanduo-oss%2Fframework/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vanduo-oss%2Fframework/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vanduo-oss%2Fframework/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vanduo-oss","download_url":"https://codeload.github.com/vanduo-oss/framework/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vanduo-oss%2Fframework/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31489427,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-06T17:22:55.647Z","status":"ssl_error","status_checked_at":"2026-04-06T17:22:54.741Z","response_time":112,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","foss","framework","html","html5","javascript","javascript-framework","js","open-color","phosphor-icons","web","web-framework","webframework"],"created_at":"2026-03-14T22:24:02.372Z","updated_at":"2026-04-06T21:01:10.194Z","avatar_url":"https://github.com/vanduo-oss.png","language":"CSS","readme":"# Vanduo Framework v1.3.2\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"vanduo-banner.svg\" alt=\"Vanduo Framework Banner\" width=\"100%\"\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@vanduo-oss/framework\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@vanduo-oss/framework?style=flat-square\u0026color=3b82f6\" alt=\"NPM Version\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/vanduo-oss/framework/actions/workflows/ci.yml\"\u003e\u003cimg src=\"https://img.shields.io/github/actions/workflow/status/vanduo-oss/framework/ci.yml?branch=main\u0026style=flat-square\u0026color=10b981\" alt=\"Build Status\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/vanduo-oss/framework/blob/main/dist/vanduo.min.css\"\u003e\u003cimg src=\"https://img.shields.io/badge/minified_size-~110kb-8b5cf6?style=flat-square\" alt=\"Minified Size\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/vanduo-oss/framework/blob/main/LICENSE\"\u003e\u003cimg src=\"https://img.shields.io/github/license/vanduo-oss/framework?style=flat-square\u0026color=64748b\" alt=\"License\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n**Essential just like water is.** \n\n- **Pure HTML, CSS, JS** \n- **No third party dependencies**\n- **Free and open source.**\n\n## Overview\n\nA lightweight, pure HTML/CSS/JS framework with **46+ components** for designing beautiful interfaces. Zero runtime dependencies, no mandatory build tools, just clean and simple code.\n\n[**Browse Full Documentation →**](https://vanduo.dev/#docs)\n\n## Features\n\n- 🎨 **Pure CSS/JS** - No libraries, no dependencies\n- 🚀 **Lightweight** - Minimal file size, maximum performance\n- 📱 **Responsive** - Mobile-first design approach\n- 🎯 **Utility-First** - Flexible utility classes for rapid development\n- 🧩 **Modular** - Import only what you need\n- ♿ **Accessible** - Built with accessibility in mind (WCAG 2.1 AA)\n- 🌙 **Dark Mode** - Automatic OS preference detection + manual toggle\n- 🌗 **Theme Switcher** - Lightweight light/dark/system toggle with shared preference storage\n- 🎛️ **Theme Customizer** - Real-time color, radius, font, and mode customization\n- 🔍 **SEO-Ready** - Comprehensive meta tags, structured data, and sitemap\n\n---\n\n## What's New in v1.3.2\n\nv1.3.2 is a component release centered on audio playback, with no breaking changes:\n\n- **New Music Player component.** Ships a zero-dependency HTML5 audio player with play/pause, previous/next, volume, track title, and optional progress, shuffle, and playlist controls.\n- **Framework-friendly API.** Accepts a plain JavaScript tracks array (`[{ name, url }]`), exposes custom events, and supports programmatic control through `window.VanduoMusicPlayer`.\n- **Responsive player layout.** Control wrapping and volume sizing were tuned so the component stays usable across compact, inline, and mobile layouts.\n- **Release coverage and artifacts updated.** Package metadata, generated bundles, `llms.txt`, and release-facing README examples now point at v1.3.2.\n\nThe framework now ships **46+ components**, including the new Music Player and the additions below.\n\n| Component | Vanduo Name | Type |\n|---|---|---|\n| Carousel | Flow | CSS + JS |\n| Music Player | Music Player | CSS + JS |\n| Popover | Bubble | CSS + JS |\n| Scrollspy | Waypoint | CSS + JS |\n| Offcanvas | — (enhanced Sidenav) | CSS + JS |\n| Ripple / Waves | Ripple | CSS + JS |\n| Floating Action Button | FAB | CSS-only |\n| Sticky | Affix | CSS + JS |\n| Autocomplete | Suggest | CSS + JS |\n| Form Validation | Validate | JS |\n| Date Picker | Datepicker | CSS + JS |\n| Time Picker | Timepicker | CSS + JS |\n| Stepper | Stepper | CSS + JS |\n| Timeline | Timeline | CSS-only |\n| Rating | Rating | CSS + JS |\n| Transfer / Multi-select | Transfer | CSS + JS |\n| Tree View | Tree | CSS + JS |\n| Spotlight / Feature Discovery | Spotlight | CSS + JS |\n\n---\n\n## Quick Start\n\n### Option 1: CDN (Recommended)\n\nThe quickest way to get started — no install, no build step. Add two lines to any HTML file:\n\n```html\n\u003c!-- Vanduo CSS --\u003e\n\u003clink rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/gh/vanduo-oss/framework@main/dist/vanduo.min.css\"\u003e\n\n\u003c!-- Vanduo JS --\u003e\n\u003cscript src=\"https://cdn.jsdelivr.net/gh/vanduo-oss/framework@main/dist/vanduo.min.js\"\u003e\u003c/script\u003e\n\u003cscript\u003eVanduo.init();\u003c/script\u003e\n```\n\n**Pin to a specific version** for production:\n```html\n\u003clink rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/gh/vanduo-oss/framework@v1.3.2/dist/vanduo.min.css\"\u003e\n\u003cscript src=\"https://cdn.jsdelivr.net/gh/vanduo-oss/framework@v1.3.2/dist/vanduo.min.js\"\u003e\u003c/script\u003e\n\u003cscript\u003eVanduo.init();\u003c/script\u003e\n```\n\n### Option 2: Download\n\n[**Download the dist/ folder**](https://github.com/vanduo-oss/framework/tree/main/dist) and include locally — no internet connection required at runtime:\n\n```html\n\u003clink rel=\"stylesheet\" href=\"dist/vanduo.min.css\"\u003e\n\u003cscript src=\"dist/vanduo.min.js\"\u003e\u003c/script\u003e\n\u003cscript\u003eVanduo.init();\u003c/script\u003e\n```\n\nThe `dist/` folder is **self-contained** (CSS, JS, Fonts, Icons).\n\n### Option 3: Source Files\n\nFor development or when you need more control, use the unminified source:\n\n```html\n\u003clink rel=\"stylesheet\" href=\"css/vanduo.css\"\u003e\n\u003cscript src=\"js/vanduo.js\"\u003e\u003c/script\u003e\n\u003cscript\u003eVanduo.init();\u003c/script\u003e\n```\n\n### Option 4: With a Bundler (Vite)\n\n\u003e **Requires a build tool.** The imports below use bare module specifiers (`@vanduo-oss/framework`) which browsers cannot resolve on their own. For static HTML files, use the CDN or Download options above.\n\nScaffold a Vite project and install Vanduo:\n\n```bash\npnpm create vite my-app --template vanilla\ncd my-app\npnpm add @vanduo-oss/framework\n```\n\nImport in your entry file (e.g. `main.js`):\n\n```js\nimport '@vanduo-oss/framework/css';\nimport { Vanduo } from '@vanduo-oss/framework';\nVanduo.init();\n```\n\n**Why pnpm?** pnpm enforces a strict lockfile and creates an isolated `node_modules` structure. Vanduo's `.npmrc` security policies work best with pnpm out of the box.\n\n*(Note: `npm install @vanduo-oss/framework` and `yarn add @vanduo-oss/framework` will also work, but they do not enforce the same strict lockfile and isolated `node_modules` security guarantees.)*\n\n---\n\n## LLM Access\n\nThis project includes an [`llms.txt`](llms.txt) file — a structured markdown summary designed for AI assistants and LLM-powered code editors. It provides quick access to framework documentation, component references, and usage patterns.\n\n---\n\n## Release Assets (Maintainers)\n\nUse the hardened upload script to attach only approved bundle artifacts from `dist/`:\n\n```bash\npnpm run release:assets -- v1.3.2\n```\n\nNotes:\n- If tag is omitted, it defaults to `v` + version from `package.json`.\n- Use `--dry-run` to preview files without uploading.\n\n---\n\n## Documentation\n\nComprehensive documentation for all components, utilities, and customization options is available at vanduo.dev.\n\n[**View Documentation**](https://vanduo.dev/#docs)\n\n### Key Capabilities\n\n*   **Dark Mode**: Works automatically with system preferences. Can be forced via `data-theme=\"dark\"` on `\u003chtml\u003e`.\n*   **Theme Switcher**: Lightweight light/dark/system toggle that can coexist with Theme Customizer.\n*   **Theme Customizer**: Built-in runtime tool to change colors, fonts, and radius.\n*   **Modular Imports**: Import only specific components (e.g., `css/components/buttons.css`) to keep your site lean.\n*   **Icons**: Includes [Phosphor Icons](https://phosphoricons.com) (Regular + Fill weights bundled).\n\n---\n\n## Project Structure\n\n```\nvanduo-framework/\n├── dist/                  # Production ready files (minified)\n├── css/\n│   ├── vanduo.css         # Main framework file (imports all)\n│   ├── core/              # Foundation (colors, typography, grid)\n│   ├── components/        # UI components (buttons, cards, etc)\n│   ├── utilities/         # Utility classes\n│   └── effects/           # Visual effects\n├── js/\n│   ├── vanduo.js          # Main entry point\n│   └── components/        # Component logic\n├── icons/                 # Phosphor Icons\n├── fonts/                 # Web fonts\n└── tests/                 # Framework test suite\n```\n\n## Browser Support\n\n- Chrome (last 2 versions)\n- Firefox (last 2 versions)\n- Safari (last 2 versions)\n- Edge (last 2 versions)\n\n## License\n\nMIT License - see [LICENSE](LICENSE) file for details.\n\n## Credits\n\n- **Color System**: [Open Color](https://yeun.github.io/open-color/) by Heeyeun Jeong (MIT License)\n- **Icons**: [Phosphor Icons](https://phosphoricons.com) (MIT License)\n\n---\nVanduo Framework - Built with ❤️ for the web.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvanduo-oss%2Fframework","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvanduo-oss%2Fframework","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvanduo-oss%2Fframework/lists"}