@hashtagcms/web-ui-kit (Laravel/Blade)

Frontend Themes and UI components for the HashtagCms ecosystem

This package contains frontend themes specifically designed for the Blade/PHP (Laravel) ecosystem of HashtagCms. It utilizes the core functionality provided by @hashtagcms/web-sdk to share underlying logic across different designs.

[!IMPORTANT] Modern Standards: We have transitioned to Tailwind CSS for our modern themes. The Modern theme is our current flagship, while Basic is maintained as a legacy theme.

✨ Features

• 🎨 Tailwind CSS - Modern themes powered by utility-first CSS.
• 🛠️ Customizable - Easy theme creation and extension.
• 🎮 Interactive Playground - Preview any theme instantly.
• 🚀 Framework Agnostic - Pure JavaScript logic via @hashtagcms/web-sdk.
• 📱 Responsive - Mobile-first design for all devices.

📦 Installation

npm install @hashtagcms/web-ui-kit

Basic Usage (Modern Theme)

In JavaScript:

import '@hashtagcms/web-ui-kit/src/themes/modern/js/app';

In HTML:

<link rel="stylesheet" href="node_modules/@hashtagcms/web-ui-kit/dist/themes/modern/app.css">
<script src="node_modules/@hashtagcms/web-ui-kit/dist/themes/modern/app.js"></script>

🎮 HashtagCMS Playground

The easiest way to test and preview themes is using our built-in Playground.

npm run playground

Once running, visit http://localhost:3000.

Key Features:

• Theme Switcher: Instantly toggle between Modern and Basic.
• Page Navigator: Switch between simulated pages like Home, Blog, and Contact.
• Real-time updates: Automatic re-rendering on template or mock-data changes.

🎨 Available Themes

Modern Theme (Standard)

Our flagship theme built with Tailwind CSS.

• ✅ Premium, modern aesthetic
• ✅ Dark mode support
• ✅ High performance utilities

Basic (Legacy)

Classic design built with Bootstrap 5 and custom SCSS.

📚 Documentation

• Full Index
• Getting Started
• Creating Themes
• Theme Structure
• Building CSS
• API Reference
• FAQ

🛠️ Development

# Build all themes
npm run build

# Development watch mode
npm run watch

# Run playground
npm run playground

📄 License

MIT © HashtagCms

Made with ❤️ by the HashtagCms team