{"id":26826201,"url":"https://github.com/vkuprin/lynx-tailwind-starter","last_synced_at":"2025-03-30T11:18:02.209Z","repository":{"id":285181186,"uuid":"957297167","full_name":"vkuprin/lynx-tailwind-starter","owner":"vkuprin","description":"A starter template for building Lynx applications with Tailwind CSS integration + Hot Reloading","archived":false,"fork":false,"pushed_at":"2025-03-30T03:48:40.000Z","size":2152,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-30T04:25:03.846Z","etag":null,"topics":["lynx","lynx-react","tailwind","tailwindcss"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vkuprin.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-03-30T02:25:42.000Z","updated_at":"2025-03-30T03:57:44.000Z","dependencies_parsed_at":"2025-03-30T04:35:11.368Z","dependency_job_id":null,"html_url":"https://github.com/vkuprin/lynx-tailwind-starter","commit_stats":null,"previous_names":["vkuprin/lynx-tailwind-starter"],"tags_count":0,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vkuprin%2Flynx-tailwind-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vkuprin%2Flynx-tailwind-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vkuprin%2Flynx-tailwind-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vkuprin%2Flynx-tailwind-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vkuprin","download_url":"https://codeload.github.com/vkuprin/lynx-tailwind-starter/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246308048,"owners_count":20756482,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["lynx","lynx-react","tailwind","tailwindcss"],"created_at":"2025-03-30T11:18:01.800Z","updated_at":"2025-03-30T11:18:02.194Z","avatar_url":"https://github.com/vkuprin.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Lynx Tailwind CSS Starter Template\n\n![Lynx + Tailwind CSS](https://img.shields.io/badge/Lynx-Tailwind_CSS-38B2AC?style=for-the-badge\u0026logo=tailwind-css\u0026logoColor=white)\n\nA starter template for building Lynx applications with Tailwind CSS integration. This template provides a solid foundation for creating beautiful, responsive mobile applications using the power of Tailwind's utility-first CSS framework.\n\n## Tailwind bugs related\nhttps://github.com/lynx-family/lynx/issues/356\n\n## Getting Started\n\n### Installation\n\n1. Clone this repository or use it as a github template:\n\n```bash\n# Clone the repository\ngit clone https://github.com/vkuprin/lynx-tailwind-starter.git\ncd lynx-tailwind-starter\n```\n\n2. Install the dependencies:\n\n```bash\n# Using yarn\nyarn install\n```\n\n### Development\n\nStart the development server:\n\n```bash\n# Using yarn berry\nyarn dev\n```\n\nScan the QR code displayed in your terminal with the LynxExplorer App on your mobile device to see the application in action.\n\n## Tailwind CSS Integration\n\nThis template comes with Tailwind CSS pre-configured and ready to use. Here's how it's set up:\n\n### Configuration Files\n\n- **tailwind.config.js**: Contains the Tailwind configuration with the Lynx preset\n- **postcss.config.js**: Configures PostCSS to process Tailwind directives\n\n### CSS Files\n\n- **src/tailwind.css**: Contains the Tailwind directives and custom styles\n\n### Using Tailwind in Your Components\n\nYou can use Tailwind utility classes directly in your components:\n\n```jsx\n\u003cview className=\"flex flex-col items-center justify-center p-4 bg-blue-500 rounded-lg\"\u003e\n  \u003ctext className=\"text-white text-xl font-bold\"\u003eHello Tailwind!\u003c/text\u003e\n\u003c/view\u003e\n```\n\n## How to Set Up Tailwind CSS in a New Lynx Project\n\nIf you want to add Tailwind CSS to an existing Lynx project, follow these steps:\n\n1. Install the required dependencies:\n\n```bash\nnpm install tailwindcss autoprefixer postcss postcss-loader @lynx-js/tailwind-preset-canary\n```\n\n2. Create a `tailwind.config.js` file:\n\n```js\n/** @type {import('tailwindcss').Config} */\nexport default {\n  content: ['./src/**/*.{js,jsx,ts,tsx}'],\n  presets: [require('@lynx-js/tailwind-preset-canary')],\n  theme: {\n    extend: {},\n  },\n  plugins: [],\n};\n```\n\n3. Create a `postcss.config.js` file:\n\n```js\nexport default {\n  plugins: {\n    tailwindcss: {},\n    autoprefixer: {},\n  },\n};\n```\n\n4. Create a `src/tailwind.css` file with the Tailwind directives:\n\n```css\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n/* Add your custom styles here */\n```\n\n5. Import the CSS file in your entry point (e.g., `src/index.tsx`):\n\n```tsx\nimport './tailwind.css';\n```\n\n6. Start using Tailwind classes in your components!\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvkuprin%2Flynx-tailwind-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvkuprin%2Flynx-tailwind-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvkuprin%2Flynx-tailwind-starter/lists"}