├── .changeset
├── README.md
└── config.json
├── .gitignore
├── .npmrc
├── .prettierignore
├── .prettierrc
├── CHANGELOG.md
├── README.md
├── e2e
└── blocks.test.ts
├── eslint.config.js
├── mdsvex.config.js
├── package.json
├── playwright.config.ts
├── pnpm-lock.yaml
├── src
├── app.css
├── app.d.ts
├── app.html
├── demo.spec.ts
├── lib
│ ├── Section.svelte
│ ├── acount-recovery
│ │ ├── ForgotPassword.svelte
│ │ └── ForgotPasswordHeader.svelte
│ ├── banner
│ │ └── Banner.svelte
│ ├── blog-template
│ │ └── BlogTemplate.svelte
│ ├── blog
│ │ ├── ArticleAuthor.svelte
│ │ ├── ArticleBody.svelte
│ │ ├── ArticleHead.svelte
│ │ ├── ArticleWrapper.svelte
│ │ ├── BlogBodyWrapper.svelte
│ │ └── BlogHead.svelte
│ ├── comment
│ │ ├── Comment.svelte
│ │ └── CommentItem.svelte
│ ├── contact
│ │ └── Contact.svelte
│ ├── content
│ │ ├── Content.svelte
│ │ └── ContentWithImage.svelte
│ ├── cta
│ │ └── Cta.svelte
│ ├── faq
│ │ ├── Faq.svelte
│ │ └── FaqItem.svelte
│ ├── feature
│ │ ├── FeatureDefault.svelte
│ │ └── FeatureItem.svelte
│ ├── header
│ │ └── Navigation.svelte
│ ├── hero
│ │ ├── HeroBody.svelte
│ │ ├── HeroHeader.svelte
│ │ └── News.svelte
│ ├── index.ts
│ ├── maintenance
│ │ ├── Maintenance.svelte
│ │ └── ToolsIcon.svelte
│ ├── newsletter
│ │ └── Newsletter.svelte
│ ├── page404
│ │ └── Page404.svelte
│ ├── page500
│ │ └── Page500.svelte
│ ├── popup
│ │ └── Popup.svelte
│ ├── portfolio
│ │ ├── Portfolio.svelte
│ │ └── PortfolioItem.svelte
│ ├── pricing
│ │ ├── PricingBodyHead.svelte
│ │ ├── PricingCard.svelte
│ │ ├── PricingHead.svelte
│ │ ├── PricingItem.svelte
│ │ └── PricingItemWrapper.svelte
│ ├── register
│ │ └── Register.svelte
│ ├── schedule
│ │ ├── Schedule.svelte
│ │ └── ScheduleItem.svelte
│ ├── sidebar
│ │ ├── SidebarBottomNav.svelte
│ │ └── SidebarBottomNavItem.svelte
│ ├── social
│ │ └── Social.svelte
│ ├── tableheader
│ │ └── TableHeader.svelte
│ ├── team
│ │ ├── TeamBody.svelte
│ │ ├── TeamHeader.svelte
│ │ ├── TeamItem.svelte
│ │ └── TeamWrapper.svelte
│ ├── testimonial
│ │ ├── Testimonial.svelte
│ │ ├── TestimonialCard.svelte
│ │ └── TestimonialCardItem.svelte
│ ├── types.ts
│ └── utils
│ │ ├── Facebook.svelte
│ │ ├── GitHub.svelte
│ │ ├── Instagram.svelte
│ │ ├── Quotes.svelte
│ │ └── Twitter.svelte
├── routes
│ ├── +layout.server.ts
│ ├── +layout.svelte
│ ├── +page.server.ts
│ ├── +page.svelte
│ ├── api
│ │ └── +server.js
│ ├── application
│ │ ├── +page.md
│ │ ├── [slug]
│ │ │ ├── +page.svelte
│ │ │ └── +page.ts
│ │ ├── advanced-tables.md
│ │ ├── crud-create-drawers.md
│ │ ├── crud-create-forms.md
│ │ ├── crud-create-modals.md
│ │ ├── crud-delete-confirm.md
│ │ ├── crud-read-drawers.md
│ │ ├── crud-read-modals.md
│ │ ├── crud-read-sections.md
│ │ ├── crud-success-message.md
│ │ ├── crud-update-drawers.md
│ │ ├── crud-update-forms.md
│ │ ├── crud-update-modals.md
│ │ ├── dashboard-footer.md
│ │ ├── faceted-search-drawers.md
│ │ ├── faceted-search-modals.md
│ │ ├── filter.md
│ │ ├── navbar.md
│ │ ├── sidenav.md
│ │ ├── table-footers.md
│ │ └── table-headers.md
│ ├── component-data
│ │ ├── ArticleAuthor.json
│ │ ├── ArticleBody.json
│ │ ├── ArticleHead.json
│ │ ├── ArticleWrapper.json
│ │ ├── Banner.json
│ │ ├── BlogBodyWrapper.json
│ │ ├── BlogHead.json
│ │ ├── BlogTemplate.json
│ │ ├── Comment.json
│ │ ├── CommentItem.json
│ │ ├── Contact.json
│ │ ├── Content.json
│ │ ├── ContentWithImage.json
│ │ ├── Cta.json
│ │ ├── Facebook.json
│ │ ├── Faq.json
│ │ ├── FaqItem.json
│ │ ├── FeatureDefault.json
│ │ ├── FeatureItem.json
│ │ ├── ForgotPassword.json
│ │ ├── ForgotPasswordHeader.json
│ │ ├── Github.json
│ │ ├── HeroBody.json
│ │ ├── HeroHeader.json
│ │ ├── Maintenance.json
│ │ ├── Navigation.json
│ │ ├── News.json
│ │ ├── Newsletter.json
│ │ ├── Page404.json
│ │ ├── Page500.json
│ │ ├── Popup.json
│ │ ├── Portfolio.json
│ │ ├── PortfolioItem.json
│ │ ├── PricingBodyHead.json
│ │ ├── PricingCard.json
│ │ ├── PricingHead.json
│ │ ├── PricingItem.json
│ │ ├── PricingItemWrapper.json
│ │ ├── Quotes.json
│ │ ├── Register.json
│ │ ├── Schedule.json
│ │ ├── ScheduleItem.json
│ │ ├── Section.json
│ │ ├── SidebarBottomNav.json
│ │ ├── SidebarBottomNavItem.json
│ │ ├── Social.json
│ │ ├── TableHeader.json
│ │ ├── TeamBody.json
│ │ ├── TeamHeader.json
│ │ ├── TeamItem.json
│ │ ├── TeamWrapper.json
│ │ ├── Testimonial.json
│ │ ├── TestimonialCard.json
│ │ ├── TestimonialCardItem.json
│ │ ├── ToolsIcon.json
│ │ ├── Twitter.json
│ │ ├── index.json
│ │ └── types.json
│ ├── compotests
│ │ └── +page.svelte
│ ├── example
│ │ └── +page.md
│ ├── layouts
│ │ ├── +page.svelte
│ │ ├── Anchor.svelte
│ │ ├── code.svelte
│ │ ├── h2.svelte
│ │ └── h3.svelte
│ ├── marketing
│ │ ├── +page.md
│ │ ├── 404.md
│ │ ├── 500.md
│ │ ├── [slug]
│ │ │ ├── +page.js
│ │ │ └── +page.svelte
│ │ ├── account-recovery.md
│ │ ├── banner.md
│ │ ├── blog.md
│ │ ├── contact.md
│ │ ├── content.md
│ │ ├── cookie.md
│ │ ├── cta.md
│ │ ├── customer-logos.md
│ │ ├── event-schedule.md
│ │ ├── faq.md
│ │ ├── feature.md
│ │ ├── footer.md
│ │ ├── header.md
│ │ ├── hero.md
│ │ ├── login.md
│ │ ├── maintenance.md
│ │ ├── newsletter.md
│ │ ├── popup.md
│ │ ├── portfolio.md
│ │ ├── pricing.md
│ │ ├── register.md
│ │ ├── reset-password.md
│ │ ├── social-proof.md
│ │ ├── team.md
│ │ ├── testimonial.md
│ │ └── user-onboarding.md
│ ├── pages
│ │ ├── [slug]
│ │ │ ├── +page.js
│ │ │ └── +page.svelte
│ │ └── quickstart.md
│ ├── publisher
│ │ ├── +page.md
│ │ ├── [slug]
│ │ │ ├── +page.js
│ │ │ └── +page.svelte
│ │ ├── blog-example.json
│ │ ├── blog-templates.md
│ │ ├── comments.md
│ │ └── related-articles.md
│ ├── sitemap.xml
│ │ └── +server.ts
│ ├── testdir
│ │ ├── +page.svelte
│ │ └── blog-example.json
│ └── utils
│ │ ├── CompoAttributesViewer.svelte
│ │ ├── CompoCard.svelte
│ │ ├── CompoDescription.svelte
│ │ ├── DocBadge.svelte
│ │ ├── ExampleDarkMode.svelte
│ │ ├── ExampleHelper.svelte
│ │ ├── ExampleRTL.svelte
│ │ ├── ExampleWrapper.svelte
│ │ ├── Footer.svelte
│ │ ├── GitHubSource.svelte
│ │ ├── GitHubSourceList.svelte
│ │ ├── MetaTag.svelte
│ │ ├── Newsletter.svelte
│ │ ├── PageHeadSection.svelte
│ │ ├── Paging.svelte
│ │ ├── Section.svelte
│ │ ├── SectionHeader.svelte
│ │ ├── Sectioncompo.svelte
│ │ ├── TableDefaultRow.svelte
│ │ ├── TableProp.svelte
│ │ ├── Toc.svelte
│ │ ├── ToolbarLink.svelte
│ │ ├── advancedTable.json
│ │ ├── data.json
│ │ ├── fetchPost.ts
│ │ ├── helpers.ts
│ │ ├── icons
│ │ ├── Airbnb.svelte
│ │ ├── ArrowLeft.svelte
│ │ ├── ArrowRight.svelte
│ │ ├── Discord.svelte
│ │ ├── Facebook.svelte
│ │ ├── GitHub.svelte
│ │ ├── GitHubHome.svelte
│ │ ├── Google.svelte
│ │ ├── Instagram.svelte
│ │ ├── Mail.svelte
│ │ ├── Mailchimp.svelte
│ │ ├── Mashable.svelte
│ │ ├── Microsoft.svelte
│ │ ├── ProductHunt.svelte
│ │ ├── Reddit.svelte
│ │ ├── Spotify.svelte
│ │ ├── Twitter.svelte
│ │ ├── Youtube.svelte
│ │ └── YoutubeHome.svelte
│ │ ├── index.ts
│ │ └── mdsvex.d.ts
└── vite-env.d.ts
├── static
├── images
│ ├── android-chrome-192x192.png
│ ├── android-chrome-512x512.png
│ ├── apple-touch-icon.png
│ ├── application
│ │ ├── advanced-tables-dark.svg
│ │ ├── advanced-tables.svg
│ │ ├── crud-create-drawers-dark.svg
│ │ ├── crud-create-drawers.svg
│ │ ├── crud-create-forms-dark.svg
│ │ ├── crud-create-forms.svg
│ │ ├── crud-create-modals-dark.svg
│ │ ├── crud-create-modals.svg
│ │ ├── crud-delete-confirm-dark.svg
│ │ ├── crud-delete-confirm.svg
│ │ ├── crud-read-drawers-dark.svg
│ │ ├── crud-read-drawers.svg
│ │ ├── crud-read-modals-dark.svg
│ │ ├── crud-read-modals.svg
│ │ ├── crud-read-sections-dark.svg
│ │ ├── crud-read-sections.svg
│ │ ├── crud-success-message-dark.svg
│ │ ├── crud-success-message.svg
│ │ ├── crud-update-drawers-dark.svg
│ │ ├── crud-update-drawers.svg
│ │ ├── crud-update-forms-dark.svg
│ │ ├── crud-update-forms.svg
│ │ ├── crud-update-modals-dark.svg
│ │ ├── crud-update-modals.svg
│ │ ├── dashboard-footer-dark.svg
│ │ ├── dashboard-footer.svg
│ │ ├── faceted-search-drawers-dark.svg
│ │ ├── faceted-search-drawers.svg
│ │ ├── faceted-search-modals-dark.svg
│ │ ├── faceted-search-modals.svg
│ │ ├── filter-dark.svg
│ │ ├── filter.svg
│ │ ├── navbar-dark.svg
│ │ ├── navbar.svg
│ │ ├── sidenav-dark.svg
│ │ ├── sidenav.svg
│ │ ├── table-footers-dark.svg
│ │ ├── table-footers.svg
│ │ ├── table-headers-dark.svg
│ │ └── table-headers.svg
│ ├── favicon-16x16.png
│ ├── favicon-32x32.png
│ ├── favicon.ico
│ ├── favicon.png
│ ├── favicon.svg
│ ├── logo.svg
│ ├── marketing
│ │ ├── 404-dark.svg
│ │ ├── 404.svg
│ │ ├── 500-dark.svg
│ │ ├── 500.svg
│ │ ├── account-recovery-dark.svg
│ │ ├── account-recovery.svg
│ │ ├── banner-dark.svg
│ │ ├── banner.svg
│ │ ├── blog-dark.svg
│ │ ├── blog.svg
│ │ ├── contact-dark.svg
│ │ ├── contact.svg
│ │ ├── content-dark.svg
│ │ ├── content.svg
│ │ ├── cookie-dark.svg
│ │ ├── cookie.svg
│ │ ├── cta-dark.svg
│ │ ├── cta.svg
│ │ ├── customer-logos-dark.svg
│ │ ├── customer-logos.svg
│ │ ├── event-schedule-dark.svg
│ │ ├── event-schedule.svg
│ │ ├── faq-dark.svg
│ │ ├── faq.svg
│ │ ├── feature-dark.svg
│ │ ├── feature.svg
│ │ ├── footer-dark.svg
│ │ ├── footer.svg
│ │ ├── header-dark.svg
│ │ ├── header.svg
│ │ ├── hero-dark.svg
│ │ ├── hero.svg
│ │ ├── login-dark.svg
│ │ ├── login.svg
│ │ ├── maintenance-dark.svg
│ │ ├── maintenance.svg
│ │ ├── newsletter-dark.svg
│ │ ├── newsletter.svg
│ │ ├── popup-dark.svg
│ │ ├── popup.svg
│ │ ├── portfolio-dark.svg
│ │ ├── portfolio.svg
│ │ ├── pricing-dark.svg
│ │ ├── pricing.svg
│ │ ├── register-dark.svg
│ │ ├── register.svg
│ │ ├── reset-password-dark.svg
│ │ ├── reset-password.svg
│ │ ├── social-proof-dark.svg
│ │ ├── social-proof.svg
│ │ ├── team-dark.svg
│ │ ├── team.svg
│ │ ├── testimonial-dark.svg
│ │ ├── testimonial.svg
│ │ ├── user-onboarding-dark.svg
│ │ └── user-onboarding.svg
│ └── publisher
│ │ ├── blog-templates-dark.svg
│ │ ├── blog-templates.svg
│ │ ├── comments-dark.svg
│ │ ├── comments.svg
│ │ ├── related-articles-dark.svg
│ │ └── related-articles.svg
├── manifest.json
├── manifest.webmanifest
└── styles
│ └── docs.css
├── svelte.config.js
├── tsconfig.json
├── vite.config.ts
└── vitest-setup-client.ts
/.changeset/README.md:
--------------------------------------------------------------------------------
1 | # Changesets
2 |
3 | Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works with multi-package repos, or single-package repos to help you version and publish your code. You can find the full documentation for it [in our repository](https://github.com/changesets/changesets)
4 |
5 | We have a quick list of common questions to get you started engaging with this project in [our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)
6 |
--------------------------------------------------------------------------------
/.changeset/config.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://unpkg.com/@changesets/config@3.0.0/schema.json",
3 | "changelog": ["@svitejs/changesets-changelog-github-compact", { "repo": "themesberg/flowbite-svelte-blocks" }],
4 | "commit": false,
5 | "fixed": [],
6 | "linked": [],
7 | "access": "public",
8 | "baseBranch": "main",
9 | "updateInternalDependencies": "patch",
10 | "ignore": []
11 | }
12 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | test-results
2 | node_modules
3 |
4 | # Output
5 | .output
6 | .vercel
7 | .netlify
8 | .wrangler
9 | /.svelte-kit
10 | /build
11 | /dist
12 |
13 | # OS
14 | .DS_Store
15 | Thumbs.db
16 |
17 | # Env
18 | .env
19 | .env.*
20 | !.env.example
21 | !.env.test
22 |
23 | # Vite
24 | vite.config.js.timestamp-*
25 | vite.config.ts.timestamp-*
26 |
--------------------------------------------------------------------------------
/.npmrc:
--------------------------------------------------------------------------------
1 | engine-strict=true
2 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | # Package Managers
2 | package-lock.json
3 | pnpm-lock.yaml
4 | yarn.lock
5 | bun.lock
6 | bun.lockb
7 |
--------------------------------------------------------------------------------
/.prettierrc:
--------------------------------------------------------------------------------
1 | {
2 | "useTabs": true,
3 | "singleQuote": true,
4 | "trailingComma": "none",
5 | "printWidth": 200,
6 | "plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
7 | "overrides": [
8 | {
9 | "files": "*.svelte",
10 | "options": {
11 | "parser": "svelte"
12 | }
13 | }
14 | ]
15 | }
16 |
--------------------------------------------------------------------------------
/CHANGELOG.md:
--------------------------------------------------------------------------------
1 | # flowbite-svelte-blocks
2 |
3 | ## 2.0.0
4 |
5 | ### Major Changes
6 |
7 | - svelte 5 runes mode
8 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Svelte library
2 |
3 | Everything you need to build a Svelte library, powered by [`sv`](https://npmjs.com/package/sv).
4 |
5 | Read more about creating a library [in the docs](https://svelte.dev/docs/kit/packaging).
6 |
7 | ## Creating a project
8 |
9 | If you're seeing this, you've probably already done this step. Congrats!
10 |
11 | ```bash
12 | # create a new project in the current directory
13 | npx sv create
14 |
15 | # create a new project in my-app
16 | npx sv create my-app
17 | ```
18 |
19 | ## Developing
20 |
21 | Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
22 |
23 | ```bash
24 | npm run dev
25 |
26 | # or start the server and open the app in a new browser tab
27 | npm run dev -- --open
28 | ```
29 |
30 | Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.
31 |
32 | ## Building
33 |
34 | To build your library:
35 |
36 | ```bash
37 | npm run package
38 | ```
39 |
40 | To create a production version of your showcase app:
41 |
42 | ```bash
43 | npm run build
44 | ```
45 |
46 | You can preview the production build with `npm run preview`.
47 |
48 | > To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.
49 |
50 | ## Publishing
51 |
52 | Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).
53 |
54 | To publish your library to [npm](https://www.npmjs.com):
55 |
56 | ```bash
57 | npm publish
58 | ```
59 |
--------------------------------------------------------------------------------
/eslint.config.js:
--------------------------------------------------------------------------------
1 | import prettier from 'eslint-config-prettier';
2 | import js from '@eslint/js';
3 | import { includeIgnoreFile } from '@eslint/compat';
4 | import svelte from 'eslint-plugin-svelte';
5 | import globals from 'globals';
6 | import { fileURLToPath } from 'node:url';
7 | import ts from 'typescript-eslint';
8 | import svelteConfig from './svelte.config.js';
9 |
10 | const gitignorePath = fileURLToPath(new URL('./.gitignore', import.meta.url));
11 |
12 | export default ts.config(
13 | includeIgnoreFile(gitignorePath),
14 | js.configs.recommended,
15 | ...ts.configs.recommended,
16 | ...svelte.configs.recommended,
17 | prettier,
18 | ...svelte.configs.prettier,
19 | {
20 | languageOptions: {
21 | globals: { ...globals.browser, ...globals.node }
22 | },
23 | rules: { 'no-undef': 'off' }
24 | },
25 | {
26 | files: ['**/*.svelte', '**/*.svelte.ts', '**/*.svelte.js'],
27 | ignores: ['eslint.config.js', 'svelte.config.js'],
28 | languageOptions: {
29 | parserOptions: {
30 | projectService: true,
31 | extraFileExtensions: ['.svelte'],
32 | parser: ts.parser,
33 | svelteConfig
34 | }
35 | }
36 | }
37 | );
38 |
--------------------------------------------------------------------------------
/mdsvex.config.js:
--------------------------------------------------------------------------------
1 | import { defineMDSveXConfig as defineConfig } from 'mdsvex';
2 | import examples from 'mdsvexamples';
3 |
4 | const config = defineConfig({
5 | layout: {
6 | componentLayout: './src/routes/layouts/+page.svelte'
7 | // blockComponentLayout: './src/routes/blocks/layouts/Blocklayout.svelte'
8 | },
9 | extensions: ['.svelte.md', '.md', '.svx'],
10 |
11 | smartypants: {
12 | dashes: 'oldschool'
13 | },
14 |
15 | remarkPlugins: [[examples, { defaults: { Wrapper: '/src/routes/utils/ExampleWrapper.svelte' } }]],
16 | rehypePlugins: []
17 | });
18 |
19 | export default config;
20 |
--------------------------------------------------------------------------------
/playwright.config.ts:
--------------------------------------------------------------------------------
1 | import { defineConfig } from '@playwright/test';
2 |
3 | export default defineConfig({
4 | webServer: {
5 | command: 'npm run build && npm run preview',
6 | port: 4173
7 | },
8 | testDir: 'e2e'
9 | });
10 |
--------------------------------------------------------------------------------
/src/app.css:
--------------------------------------------------------------------------------
1 | @import 'tailwindcss';
2 |
3 | @custom-variant dark (&:where(.dark, .dark *));
4 |
5 | @source './src/**/*.{html,js,svelte,ts,md}';
6 | @source '../node_modules/flowbite-svelte/**/*.{html,js,svelte,ts}';
7 |
8 | @plugin 'flowbite/plugin';
9 |
10 | @theme {
11 | --z-index-100: 100;
12 |
13 | --color-primary-50: #fff5f2;
14 | --color-primary-100: #fff1ee;
15 | --color-primary-200: #ffe4de;
16 | --color-primary-300: #ffd5cc;
17 | --color-primary-400: #ffbcad;
18 | --color-primary-500: #fe795d;
19 | --color-primary-600: #ef562f;
20 | --color-primary-700: #eb4f27;
21 | --color-primary-800: #cc4522;
22 | --color-primary-900: #a5371b;
23 |
24 | --color-secondary-50: #f0f9ff;
25 | --color-secondary-100: #e0f2fe;
26 | --color-secondary-200: #bae6fd;
27 | --color-secondary-300: #7dd3fc;
28 | --color-secondary-400: #38bdf8;
29 | --color-secondary-500: #0ea5e9;
30 | --color-secondary-600: #0284c7;
31 | --color-secondary-700: #0369a1;
32 | --color-secondary-800: #075985;
33 | --color-secondary-900: #0c4a6e;
34 | }
35 |
36 | /*
37 | The default border color has changed to `currentColor` in Tailwind CSS v4,
38 | so we've added these compatibility styles to make sure everything still
39 | looks the same as it did with Tailwind CSS v3.
40 |
41 | If we ever want to remove these styles, we need to add an explicit border
42 | color utility to any element that depends on these defaults.
43 | */
44 | @layer base {
45 | *,
46 | ::after,
47 | ::before,
48 | ::backdrop,
49 | ::file-selector-button {
50 | border-color: var(--color-gray-200, currentColor);
51 | }
52 | }
53 |
54 | @import '../static/styles/docs.css' layer(base);
55 |
56 | @layer base {
57 | html {
58 | -webkit-text-size-adjust: 100%;
59 | font-family:
60 | Inter,
61 | ui-sans-serif,
62 | system-ui,
63 | -apple-system,
64 | Segoe UI,
65 | Roboto,
66 | Helvetica Neue,
67 | Arial,
68 | Noto Sans,
69 | sans-serif,
70 | Apple Color Emoji,
71 | Segoe UI Emoji,
72 | Segoe UI Symbol,
73 | Noto Color Emoji;
74 | line-height: 1.5;
75 | -moz-tab-size: 4;
76 | tab-size: 4;
77 | }
78 |
79 | .related-components,
80 | .references {
81 | @apply flex w-full flex-wrap;
82 | }
83 |
84 | .related-components p,
85 | .references p {
86 | @apply w-full md:w-1/2 lg:w-1/3;
87 | }
88 |
89 | #mainContent > pre {
90 | @apply mx-auto my-4 w-full overflow-auto rounded-xl border border-gray-200 bg-gray-50 bg-linear-to-r p-2 text-sm text-gray-600 sm:p-6 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-400;
91 | }
92 | p {
93 | @apply dark:text-white;
94 | }
95 | }
96 |
--------------------------------------------------------------------------------
/src/app.d.ts:
--------------------------------------------------------------------------------
1 | // See https://svelte.dev/docs/kit/types#app.d.ts
2 | // for information about these interfaces
3 | declare global {
4 | namespace App {
5 | // interface Error {}
6 | // interface Locals {}
7 | // interface PageData {}
8 | // interface PageState {}
9 | // interface Platform {}
10 | }
11 | }
12 |
13 | export {};
14 |
--------------------------------------------------------------------------------
/src/app.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | %sveltekit.body%
14 |
15 |
16 |
--------------------------------------------------------------------------------
/src/demo.spec.ts:
--------------------------------------------------------------------------------
1 | import { describe, it, expect } from 'vitest';
2 |
3 | describe('sum test', () => {
4 | it('adds 1 + 2 to equal 3', () => {
5 | expect(1 + 2).toBe(3);
6 | });
7 | });
8 |
--------------------------------------------------------------------------------
/src/lib/acount-recovery/ForgotPassword.svelte:
--------------------------------------------------------------------------------
1 |
13 |
14 |
15 | {@render children()}
16 |
17 |
18 |
26 |
--------------------------------------------------------------------------------
/src/lib/acount-recovery/ForgotPasswordHeader.svelte:
--------------------------------------------------------------------------------
1 |
20 |
21 |
22 |
25 |
26 |
38 |
--------------------------------------------------------------------------------
/src/lib/banner/Banner.svelte:
--------------------------------------------------------------------------------
1 |
16 |
17 |
18 | {@render children()}
19 |
20 |
21 |
29 |
--------------------------------------------------------------------------------
/src/lib/blog/ArticleAuthor.svelte:
--------------------------------------------------------------------------------
1 |
15 |
16 |
17 |
18 | {#if author}
19 | {@render author()}
20 | {/if}
21 |
22 | {@render children()}
23 |
17 | {@render h2()}
18 |
19 | {/if}
20 | {#if children}
21 | {@render children()}
22 | {/if}
23 |
24 |
33 |
--------------------------------------------------------------------------------
/src/lib/blog/ArticleHead.svelte:
--------------------------------------------------------------------------------
1 |
12 |
13 |
14 | {@render children()}
15 |
16 |
17 |
25 |
--------------------------------------------------------------------------------
/src/lib/blog/ArticleWrapper.svelte:
--------------------------------------------------------------------------------
1 |
12 |
13 |
14 | {@render children()}
15 |
16 |
17 |
25 |
--------------------------------------------------------------------------------
/src/lib/blog/BlogBodyWrapper.svelte:
--------------------------------------------------------------------------------
1 |
12 |
13 |
14 | {@render children()}
15 |
16 |
17 |
25 |
--------------------------------------------------------------------------------
/src/lib/blog/BlogHead.svelte:
--------------------------------------------------------------------------------
1 |
21 |
22 |
23 | {#if h2}
24 |
25 | {@render h2()}
26 |
27 | {/if}
28 | {#if children}
29 | {@render children()}
30 | {/if}
31 |
32 |
33 |
44 |
--------------------------------------------------------------------------------
/src/lib/comment/Comment.svelte:
--------------------------------------------------------------------------------
1 |
19 |
20 |
21 |
{title}
22 |
23 |
24 | {@render children()}
25 |
26 |
36 |
--------------------------------------------------------------------------------
/src/lib/contact/Contact.svelte:
--------------------------------------------------------------------------------
1 |
15 |
16 | {#if h2}
17 |
18 | {@render h2()}
19 |
20 | {/if}
21 | {#if paragraph}
22 |
23 | {@render paragraph()}
24 |
25 | {/if}
26 | {@render children()}
27 |
28 |
38 |
--------------------------------------------------------------------------------
/src/lib/content/Content.svelte:
--------------------------------------------------------------------------------
1 |
14 |
15 |
16 | {#if h2}
17 |
18 | {@render h2()}
19 |
20 | {/if}
21 | {@render children()}
22 |
23 |
24 |
33 |
--------------------------------------------------------------------------------
/src/lib/content/ContentWithImage.svelte:
--------------------------------------------------------------------------------
1 |
17 |
18 |
19 | {#if h2}
20 |
21 | {@render h2()}
22 |
23 | {/if}
24 | {@render children()}
25 |
26 | {#if image}
27 |
28 | {@render image()}
29 |
30 | {/if}
31 |
32 |
43 |
--------------------------------------------------------------------------------
/src/lib/cta/Cta.svelte:
--------------------------------------------------------------------------------
1 |
33 |
34 | {#if img}
35 | {@render img()}
36 | {/if}
37 |
38 | {#if h2}
39 |
40 | {@render h2()}
41 |
42 | {/if}
43 | {@render children()}
44 |
45 |
46 |
57 |
--------------------------------------------------------------------------------
/src/lib/faq/Faq.svelte:
--------------------------------------------------------------------------------
1 |
11 |
12 |
13 | {@render children()}
14 |
15 |
16 |
23 |
--------------------------------------------------------------------------------
/src/lib/faq/FaqItem.svelte:
--------------------------------------------------------------------------------
1 |
15 |
16 |
17 |
18 |
21 | {@render children()}
22 |
23 |
24 |
33 |
--------------------------------------------------------------------------------
/src/lib/feature/FeatureDefault.svelte:
--------------------------------------------------------------------------------
1 |
11 |
12 |
13 | {@render children()}
14 |
15 |
16 |
23 |
--------------------------------------------------------------------------------
/src/lib/feature/FeatureItem.svelte:
--------------------------------------------------------------------------------
1 |
17 |
18 |
19 | {#if icon}
20 |
21 | {@render icon()}
22 |
23 | {/if}
24 | {#if h3}
25 |
26 | {@render h3()}
27 |
28 | {/if}
29 | {#if paragraph}
30 |
31 | {@render paragraph()}
32 |
33 | {/if}
34 |
20 | {#if head}
21 |
22 | {@render head()}
23 |
24 | {/if}
25 | {@render children()}
26 |
27 |
28 |
37 |
--------------------------------------------------------------------------------
/src/lib/hero/HeroHeader.svelte:
--------------------------------------------------------------------------------
1 |
21 |
22 |
23 | {#if h1}
24 |
25 | {@render h1()}
26 |
27 | {/if}
28 | {#if h2}
29 |
30 | {@render h2()}
31 |
32 | {/if}
33 | {#if paragraph}
34 |
35 | {@render paragraph()}
36 |
37 | {/if}
38 | {#if children}
39 | {@render children()}
40 | {/if}
41 |
22 | {@render children()}
23 |
25 |
26 |
35 |
--------------------------------------------------------------------------------
/src/lib/maintenance/Maintenance.svelte:
--------------------------------------------------------------------------------
1 |
18 |
19 |
23 | {@render h1()}
24 |
25 | {/if}
26 | {#if paragraph}
27 |
28 | {@render paragraph()}
29 |
30 | {/if}
31 |
32 |
42 |
--------------------------------------------------------------------------------
/src/lib/maintenance/ToolsIcon.svelte:
--------------------------------------------------------------------------------
1 |
16 | {#if h2}
17 |
18 | {@render h2()}
19 |
20 | {/if}
21 | {@render children()}
22 |
23 |
24 |
33 |
--------------------------------------------------------------------------------
/src/lib/page404/Page404.svelte:
--------------------------------------------------------------------------------
1 |
14 |
15 |
16 | {#if h1}
17 |
18 | {@render h1()}
19 |
20 | {/if}
21 | {#if paragraph}
22 | {@render paragraph()}
23 | {/if}
24 |
25 |
26 |
35 |
--------------------------------------------------------------------------------
/src/lib/page500/Page500.svelte:
--------------------------------------------------------------------------------
1 |
14 |
15 |
16 | {#if h1}
17 |
18 | {@render h1()}
19 |
20 | {/if}
21 | {#if paragraph}
22 | {@render paragraph()}
23 | {/if}
24 |
25 |
26 |
35 |
--------------------------------------------------------------------------------
/src/lib/popup/Popup.svelte:
--------------------------------------------------------------------------------
1 |
15 |
16 |
23 |
24 |
33 |
--------------------------------------------------------------------------------
/src/lib/portfolio/Portfolio.svelte:
--------------------------------------------------------------------------------
1 |
22 |
23 |
24 |
25 | {title}
26 |
27 | {#if subtitle}
28 |
29 | {subtitle}
30 |
31 | {/if}
32 |
35 | {@render children()}
36 |
37 |
38 |
50 |
--------------------------------------------------------------------------------
/src/lib/pricing/PricingBodyHead.svelte:
--------------------------------------------------------------------------------
1 |
17 |
18 | {#if h3}
19 |
20 | {@render h3()}
21 |
22 | {/if}
23 | {#if paragraph}
24 |
25 | {@render paragraph()}
26 |
27 | {/if}
28 | {#if price}
29 |
30 | {@render price()}
31 |
32 | {/if}
33 |
34 |
45 |
--------------------------------------------------------------------------------
/src/lib/pricing/PricingCard.svelte:
--------------------------------------------------------------------------------
1 |
14 |
15 |
16 | {@render children()}
17 |
18 |
19 |
26 |
--------------------------------------------------------------------------------
/src/lib/pricing/PricingHead.svelte:
--------------------------------------------------------------------------------
1 |
16 |
17 |
18 | {#if h2}
19 |
20 | {@render h2()}
21 |
22 | {/if}
23 | {#if paragraph}
24 |
25 | {@render paragraph()}
26 |
27 | {/if}
28 |
16 |
19 |
20 |
28 |
--------------------------------------------------------------------------------
/src/lib/pricing/PricingItemWrapper.svelte:
--------------------------------------------------------------------------------
1 |
12 |
13 |
14 | {@render children()}
15 |
16 | {#if btn}
17 | {@render btn()}
18 | {/if}
19 |
20 |
28 |
--------------------------------------------------------------------------------
/src/lib/register/Register.svelte:
--------------------------------------------------------------------------------
1 |
16 |
17 | {#if top}
18 |
19 | {@render top()}
20 |
21 | {/if}
22 |
23 | {@render children()}
24 |
25 |
26 |
36 |
--------------------------------------------------------------------------------
/src/lib/schedule/Schedule.svelte:
--------------------------------------------------------------------------------
1 |
20 |
21 |
22 |
23 | {scheduleName}
24 |
25 | {#if subtitle}
26 | {@render subtitle()}
27 | {/if}
28 |
29 |
30 |
31 |
32 | {@render children()}
33 |
34 |
23 | {#if item.time}
24 |
25 | {item.time}
26 |
27 | {/if}
28 |
29 | {#if item.href}
30 | {item.title}
31 | {:else}
32 | {item.title}
33 | {/if}
34 |
35 |
13 | {@render children()}
14 |
15 |
16 |
23 |
--------------------------------------------------------------------------------
/src/lib/sidebar/SidebarBottomNavItem.svelte:
--------------------------------------------------------------------------------
1 |
18 |
19 |
20 | {@render children()}
21 |
22 | {#if tooltip}
23 | {tooltip}
24 | {/if}
25 |
26 |
35 |
--------------------------------------------------------------------------------
/src/lib/social/Social.svelte:
--------------------------------------------------------------------------------
1 |
13 |
14 |
15 |
16 | {@render children()}
17 |
18 |
22 | {#if headerType === 'search'}
23 |
31 | {:else}
32 |
35 | {/if}
36 |
37 |
38 |
48 |
--------------------------------------------------------------------------------
/src/lib/team/TeamBody.svelte:
--------------------------------------------------------------------------------
1 |
11 |
12 |
13 | {@render children()}
14 |
15 |
16 |
23 |
--------------------------------------------------------------------------------
/src/lib/team/TeamHeader.svelte:
--------------------------------------------------------------------------------
1 |
14 |
15 |
16 |
17 | {@render label()}
18 |
19 | {@render children()}
20 |
21 |
22 |
31 |
--------------------------------------------------------------------------------
/src/lib/team/TeamItem.svelte:
--------------------------------------------------------------------------------
1 |
23 |
24 |
25 | {#if href && src}
26 |
27 |
29 | {/if}
30 |
31 | {#if href && name}
32 |
35 | {/if}
36 | {#if jobTitle}
37 |
{jobTitle}
38 | {/if}
39 | {@render children()}
40 |
41 | {@render social()}
42 |
43 |
44 |
14 | {@render children()}
15 |
16 |
17 |
24 |
--------------------------------------------------------------------------------
/src/lib/testimonial/Testimonial.svelte:
--------------------------------------------------------------------------------
1 |
17 |
18 |
19 | {#if Icon}
20 |
29 |
30 |
40 |
--------------------------------------------------------------------------------
/src/lib/testimonial/TestimonialCard.svelte:
--------------------------------------------------------------------------------
1 |
14 |
15 | {#if header}
16 |
19 | {/if}
20 | {#if children}
21 |
22 | {@render children()}
23 |
24 | {/if}
25 |
26 |
35 |
--------------------------------------------------------------------------------
/src/lib/testimonial/TestimonialCardItem.svelte:
--------------------------------------------------------------------------------
1 |
19 |
20 |
21 |
22 | {#if h3}
23 |
24 | {@render h3()}
25 |
26 | {/if}
27 | {#if children}
28 | {@render children()}
29 | {/if}
30 |
31 | {#if caption}
32 |
35 | {/if}
36 |
37 |
38 |
50 |
--------------------------------------------------------------------------------
/src/lib/types.ts:
--------------------------------------------------------------------------------
1 | export type Comment = {
2 | id: string;
3 | commenter: {
4 | name: string;
5 | profilePicture?: string;
6 | };
7 | date?: string;
8 | isoDate?: string;
9 | content: string;
10 | replies?: Comment[];
11 | };
12 |
13 | export interface LinkType {
14 | name: string;
15 | href?: string;
16 | rel?: string;
17 | active?: boolean;
18 | }
19 |
--------------------------------------------------------------------------------
/src/lib/utils/Facebook.svelte:
--------------------------------------------------------------------------------
1 |
7 |
8 |
9 |
17 |
18 |
24 |
--------------------------------------------------------------------------------
/src/lib/utils/GitHub.svelte:
--------------------------------------------------------------------------------
1 |
7 |
8 |
9 |
17 |
18 |
24 |
--------------------------------------------------------------------------------
/src/lib/utils/Instagram.svelte:
--------------------------------------------------------------------------------
1 |
9 |
10 | Instagram
12 |
17 |
18 |
24 |
--------------------------------------------------------------------------------
/src/lib/utils/Twitter.svelte:
--------------------------------------------------------------------------------
1 |
7 |
8 |
9 |
15 |
16 |
22 |
--------------------------------------------------------------------------------
/src/routes/+layout.server.ts:
--------------------------------------------------------------------------------
1 | import { ANALYTICS_ID_FLOWBITE } from '$env/static/private';
2 | import type { LayoutServerLoad } from './$types';
3 |
4 | export const load: LayoutServerLoad = async ({ fetch }) => {
5 | try {
6 | const response = await fetch('/api');
7 |
8 | return {
9 | posts: await response.json(),
10 | ANALYTICS_ID_FLOWBITE
11 | };
12 | } catch (error) {
13 | console.error(`Error in load function for /: ${error}`);
14 | }
15 | };
16 |
--------------------------------------------------------------------------------
/src/routes/+page.server.ts:
--------------------------------------------------------------------------------
1 | const json = (r: Response) => r.json();
2 | import type { PageServerLoad } from './$types';
3 |
4 | export const load: PageServerLoad = async ({ fetch }) => {
5 | try {
6 | const githubAPI = 'https://api.github.com/repos/themesberg/flowbite-svelte-blocks';
7 | const posts = await fetch('/api').then(json);
8 | const github = await fetch(githubAPI).then(json);
9 | // const contributors = await fetch(githubAPI + '/contributors?per_page=21').then(json);
10 | const today = new Date().toISOString().slice(0, 10);
11 | const npm = await fetch(`https://api.npmjs.org/downloads/point/2020-01-01:${today}/flowbite-svelte-blocks`).then(json);
12 | const discord = await fetch('https://discord.com/api/v9/invites/4eeurUVvTy?with_counts=true&with_expiration=true').then(json);
13 |
14 | return { posts, github, npm, discord };
15 | } catch (error) {
16 | console.error(`Error in load function for /: ${error}`);
17 | }
18 | };
19 |
--------------------------------------------------------------------------------
/src/routes/+page.svelte:
--------------------------------------------------------------------------------
1 |
17 |
18 |
41 |
42 |
43 |
44 | Get started with free UI components built with the utility classes from Tailwind CSS to upgrade your web development stack and customize the colors, fonts, and dark mode using the configurator.
45 |
46 |
47 |
33 |
34 | (defaultModal = true)}>Default modal
35 |
36 |
37 | Are you sure you want to delete this item?
45 |
46 | No, cancel
47 | Yes, I'm sure
48 |
49 |
50 |
51 | ```
52 |
53 | Filter by category
21 |
22 |
23 | Apple (56)
24 |
25 |
26 | Fitbit (56)
27 |
28 |
29 | Dell (56)
30 |
31 |
32 | Asus (97)
33 |
34 |
35 | Logitech (97)
36 |
37 |
38 | MSI (97)
39 |
40 |
41 | Bosch (176)
42 |
43 |
44 | Sony (234)
45 |
46 |
47 | Samsung (76)
48 |
49 |
50 | Canon (49)
51 |
52 |
53 | Microsoft (45)
54 |
55 |
56 | Razor (49)
57 |
58 |
59 | ```
60 |
--------------------------------------------------------------------------------
/src/routes/application/navbar.md:
--------------------------------------------------------------------------------
1 | ---
2 | layout: componentLayout
3 | title: Svelte Dashboard Navbars - Flowbite Svelte Blocks
4 | breadcrumb_title: Dashboard Navbars
5 | no_of_components: 0 component
6 | dir: application
7 | description: Get started with a free collection of responsive navigation bars built for application and dashboard user interfaces built with Tailwind CSS.
8 | ---
9 |
10 | ## Default navbar
11 |
12 | Use this navigation bar inside a dashboard interface to show a side nav toggle, logo, search bar, button CTA, notifications, app center, and user avatar dropdown.
13 |
14 | ```svelte example hideOutput
15 | COMING SOON
16 | ```
17 |
--------------------------------------------------------------------------------
/src/routes/application/table-footers.md:
--------------------------------------------------------------------------------
1 | ---
2 | layout: componentLayout
3 | title: Svelte Table Footers - Flowbite Svelte Blocks
4 | breadcrumb_title: Table Footers
5 | no_of_components: 0 component
6 | dir: application
7 | description: Get started with a collection of footer components that you can append to the end of a table element to indicate pagination, table actions, information and more.
8 | ---
9 |
10 | ## Default table footer with pagination
11 |
12 | Use this free example to add a footer section to a table component to show a pagination component and indicate the number of data items being showed on one page.
13 |
14 | ```svelte example hideOutput
15 | COMING SOON
16 | ```
17 |
--------------------------------------------------------------------------------
/src/routes/component-data/ArticleAuthor.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ArticleAuthor",
3 | "slots": ["author"],
4 | "events": [],
5 | "props": [
6 | ["authorDiv", "string", "'flex justify-between items-center'"],
7 | ["authorImgDiv", "string", "'flex items-center space-x-4'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/ArticleBody.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ArticleBody",
3 | "slots": ["h2", "paragraph"],
4 | "events": [],
5 | "props": [["h2Class", "string", "'mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/ArticleHead.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ArticleHead",
3 | "slots": [],
4 | "events": [],
5 | "props": [["divClass", "string", "'flex justify-between items-center mb-5 text-gray-500'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/ArticleWrapper.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ArticleWrapper",
3 | "slots": [],
4 | "events": [],
5 | "props": [["articleClass", "string", "'p-6 bg-white rounded-lg border border-gray-200 shadow-md dark:bg-gray-800 dark:border-gray-700'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/Banner.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Banner",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["id", "string", "'banner'"],
7 | ["divClass", "string", "'flex z-50 gap-8 justify-between items-start py-3 px-4 w-full bg-gray-50 border border-b border-gray-200 sm:items-center dark:border-gray-700 lg:py-4 dark:bg-gray-800'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/BlogBodyWrapper.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "BlogBodyWrapper",
3 | "slots": [],
4 | "events": [],
5 | "props": [["divClass", "string", "'grid gap-8 lg:grid-cols-2'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/BlogHead.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "BlogHead",
3 | "slots": ["h2", "paragraph"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'mx-auto max-w-screen-sm text-center lg:mb-16 mb-8'"],
7 | ["h2Class", "string", "'mb-4 text-3xl lg:text-4xl tracking-tight font-extrabold text-gray-900 dark:text-white'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/BlogTemplate.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "BlogTemplate",
3 | "slots": [],
4 | "events": [],
5 | "props": [["blog", "Blog", "@prop export let blog: Blog"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/Comment.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Comment",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["title", "string", "''"],
7 | ["titleDiv", "string", "'flex justify-between items-center mb-6'"],
8 | ["h2Class", "string", "'text-lg lg:text-2xl font-bold text-gray-900 dark:text-white'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/CommentItem.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "CommentItem",
3 | "slots": ["dropdownMenu", "reply"],
4 | "events": [],
5 | "props": [
6 | ["replyButton", "boolean", "true"],
7 | ["comment", "Comment", "@prop export let replyButton: boolean = true"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/Contact.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Contact",
3 | "slots": ["h2", "paragraph"],
4 | "events": [],
5 | "props": [
6 | ["h2Class", "string", "'mb-4 text-4xl tracking-tight font-extrabold text-center text-gray-900 dark:text-white'"],
7 | ["pClass", "string", "'mb-8 lg:mb-16 font-light text-center text-gray-500 dark:text-gray-400 sm:text-xl'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/Content.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Content",
3 | "slots": ["h2"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'max-w-screen-lg text-gray-500 sm:text-lg dark:text-gray-400'"],
7 | ["h2Class", "string", "'mb-4 text-4xl tracking-tight font-bold text-gray-900 dark:text-white'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/ContentWithImage.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ContentWithImage",
3 | "slots": ["h2", "image"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'font-light text-gray-500 sm:text-lg dark:text-gray-400'"],
7 | ["h2Class", "string", "'mb-4 text-4xl tracking-tight font-extrabold text-gray-900 dark:text-white'"],
8 | ["imgDivClass", "string", "'grid grid-cols-2 gap-4 mt-8'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/Cta.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Cta",
3 | "slots": ["img", "h2"],
4 | "events": [],
5 | "props": [["ctatype", "'default' | 'image' | 'heading' | 'none'", "'default'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/Facebook.json:
--------------------------------------------------------------------------------
1 | { "name": "Facebook", "slots": [], "events": [], "props": [["href", "string", "''"]] }
2 |
--------------------------------------------------------------------------------
/src/routes/component-data/Faq.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Faq",
3 | "slots": [],
4 | "events": [],
5 | "props": [["divClass", "string", "'grid pt-8 text-left border-t border-gray-200 md:gap-16 dark:border-gray-700 md:grid-cols-2'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/FaqItem.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "FaqItem",
3 | "slots": ["h3"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'mb-10'"],
7 | ["h3Class", "string", "'flex items-center mb-4 text-lg font-medium text-gray-900 dark:text-white'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/FeatureDefault.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "FeatureDefault",
3 | "slots": [],
4 | "events": [],
5 | "props": [["divClass", "string", "'space-y-8 md:grid md:grid-cols-2 lg:grid-cols-3 md:gap-12 md:space-y-0'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/FeatureItem.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "FeatureItem",
3 | "slots": ["icon", "h3", "paragraph"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'flex justify-center items-center mb-4 w-10 h-10 rounded-full bg-primary-100 lg:h-12 lg:w-12 dark:bg-primary-900'"],
7 | ["h3Class", "string", "'mb-2 text-xl font-bold dark:text-white'"],
8 | ["pClass", "string", "'text-gray-500 dark:text-gray-400'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/ForgotPassword.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ForgotPassword",
3 | "slots": [],
4 | "events": [],
5 | "props": [["divClass", "string", "'w-full p-6 bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md dark:bg-gray-800 dark:border-gray-700 sm:p-8'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/ForgotPasswordHeader.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ForgotPasswordHeader",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["aClass", "string", "'flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white'"],
7 | ["imgClass", "string", "'w-8 h-8 mr-2'"],
8 | ["src", "string", "''"],
9 | ["href", "string", "''"],
10 | ["alt", "string", "''"]
11 | ]
12 | }
13 |
--------------------------------------------------------------------------------
/src/routes/component-data/Github.json:
--------------------------------------------------------------------------------
1 | { "name": "Github", "slots": [], "events": [], "props": [["href", "string", "''"]] }
2 |
--------------------------------------------------------------------------------
/src/routes/component-data/HeroBody.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "HeroBody",
3 | "slots": ["head"],
4 | "events": [],
5 | "props": [["hero", "'default' | 'visual'", "'default'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/HeroHeader.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "HeroHeader",
3 | "slots": ["h1", "h2", "paragraph"],
4 | "events": [],
5 | "props": [
6 | ["h1Class", "string", "'mb-4 text-4xl font-extrabold tracking-tight leading-none text-gray-900 md:text-5xl lg:text-6xl dark:text-white'"],
7 | ["h2Class", "string", "'mb-8 lg:mb-16 text-3xl font-extrabold tracking-tight leading-tight text-center text-gray-900 dark:text-white md:text-4xl'"],
8 | ["pClass", "string", "'mb-8 text-lg font-normal text-gray-500 lg:text-xl sm:px-16 xl:px-48 dark:text-gray-400'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/Maintenance.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Maintenance",
3 | "slots": ["h1", "paragraph"],
4 | "events": [],
5 | "props": [
6 | ["Icon", "typeof SvelteComponent", "ToolsIcon"],
7 | ["h1Class", "string", "'mb-4 text-4xl font-bold tracking-tight leading-none text-gray-900 lg:mb-6 md:text-5xl xl:text-6xl dark:text-white'"],
8 | ["pClass", "string", "'font-light text-gray-500 md:text-lg xl:text-xl dark:text-gray-400'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/Navigation.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Navigation",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["navClass", "string", "'bg-white border-gray-200 px-4 lg:px-6 py-2.5 dark:bg-gray-800'"],
7 | ["divClass", "string", "'flex flex-wrap justify-between items-center mx-auto max-w-screen-xl'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/News.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "News",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["href", "string", "'/'"],
7 | ["classA", "string", "''"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/Newsletter.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Newsletter",
3 | "slots": ["h2"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'mx-auto max-w-screen-md sm:text-center'"],
7 | ["h2Class", "string", "'mb-4 text-3xl tracking-tight font-extrabold text-gray-900 sm:text-4xl dark:text-white'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/Page404.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Page404",
3 | "slots": ["h1", "paragraph"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'mx-auto max-w-screen-sm text-center'"],
7 | ["h1Class", "string", "'mb-4 text-7xl tracking-tight font-extrabold lg:text-9xl text-primary-600 dark:text-primary-500'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/Page500.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Page500",
3 | "slots": ["h1", "paragraph"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'mx-auto max-w-screen-sm text-center'"],
7 | ["h1Class", "string", "'mb-4 text-7xl tracking-tight font-extrabold lg:text-9xl text-primary-600 dark:text-primary-500'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/Popup.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Popup",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["outerDivClass", "string", "'overflow-y-auto overflow-x-hidden z-50 md:inset-0 md:h-full'"],
7 | ["innerDivClass", "string", "'relative p-4 w-full max-w-lg h-full md:h-auto'"],
8 | ["contentDivClass", "string", "'relative p-4 bg-white rounded-lg shadow dark:bg-gray-800 md:p-8'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/Portfolio.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Portfolio",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["title", "string", "''"],
7 | ["subtitle", "string", "''"],
8 | ["headerDivClass", "string", "'max-w-2xl mx-auto text-center'"],
9 | ["h2Class", "string", "'text-3xl font-extrabold leading-tight tracking-tight text-gray-900 sm:text-4xl dark:text-white'"],
10 | ["subtitleClass", "string", "'mt-4 text-base font-normal text-gray-500 sm:text-xl dark:text-gray-400'"],
11 | ["bodyDivClasss", "string", "'grid grid-cols-1 mt-12 text-center sm:mt-16 gap-x-20 gap-y-12 sm:grid-cols-2 lg:grid-cols-3'"]
12 | ]
13 | }
14 |
--------------------------------------------------------------------------------
/src/routes/component-data/PortfolioItem.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "PortfolioItem",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'space-y-4'"],
7 | ["customerClass", "string", "'bg-gray-100 text-gray-900 text-xs font-medium inline-flex items-center px-2.5 py-0.5 rounded dark:bg-gray-700 dark:text-gray-300'"],
8 | ["titleClass", "string", "'text-2xl font-bold leading-tight text-gray-900 dark:text-white'"],
9 | ["descriptionClass", "string", "'text-lg font-normal text-gray-500 dark:text-gray-400'"],
10 | [
11 | "linkClass",
12 | "string",
13 | "'text-white bg-primary-700 justify-center hover:bg-primary-800 inline-flex items-center focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800'"
14 | ],
15 | ["item", "string", "{"]
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/src/routes/component-data/PricingBodyHead.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "PricingBodyHead",
3 | "slots": ["h3", "paragraph", "price"],
4 | "events": [],
5 | "props": [
6 | ["h3Class", "string", "'mb-4 text-2xl font-semibold'"],
7 | ["pClass", "string", "'font-light text-gray-500 sm:text-lg dark:text-gray-400'"],
8 | ["priceClass", "string", "'flex justify-center items-baseline my-8'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/PricingCard.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "PricingCard",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | [
7 | "divClass",
8 | "string",
9 | "'flex flex-col p-6 mx-auto max-w-lg text-center text-gray-900 bg-white rounded-lg border border-gray-100 shadow dark:border-gray-600 xl:p-8 dark:bg-gray-800 dark:text-white'"
10 | ]
11 | ]
12 | }
13 |
--------------------------------------------------------------------------------
/src/routes/component-data/PricingHead.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "PricingHead",
3 | "slots": ["h2", "paragraph"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'mx-auto max-w-screen-md text-center mb-8 lg:mb-12'"],
7 | ["h2Class", "string", "'mb-4 text-4xl tracking-tight font-extrabold text-gray-900 dark:text-white'"],
8 | ["pClass", "string", "'mb-5 font-light text-gray-500 sm:text-xl dark:text-gray-400'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/PricingItem.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "PricingItem",
3 | "slots": [],
4 | "events": [],
5 | "props": [["liClass", "string", "'flex items-center space-x-3'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/PricingItemWrapper.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "PricingItemWrapper",
3 | "slots": ["btn"],
4 | "events": [],
5 | "props": [["ulClass", "string", "'mb-8 space-y-4 text-left'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/Quotes.json:
--------------------------------------------------------------------------------
1 | { "name": "Quotes", "slots": [], "events": [], "props": [] }
2 |
--------------------------------------------------------------------------------
/src/routes/component-data/Register.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Register",
3 | "slots": ["top"],
4 | "events": [],
5 | "props": [
6 | ["href", "string", "''"],
7 | ["aClass", "string", "'flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white'"],
8 | ["divClass", "string", "'w-full bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/Schedule.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Schedule",
3 | "slots": ["subtitle"],
4 | "events": [],
5 | "props": [["scheduleName", "string", "''"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/ScheduleItem.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ScheduleItem",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'flex flex-col gap-2 py-4 sm:gap-6 sm:flex-row sm:items-center'"],
7 | ["pClass", "string", "'w-32 text-lg font-normal text-gray-500 sm:text-right dark:text-gray-400 shrink-0'"],
8 | ["h3Class", "string", "'text-lg font-semibold text-gray-900 dark:text-white'"],
9 | ["aClass", "string", "'hover:underline'"],
10 | ["item", "string", "{"]
11 | ]
12 | }
13 |
--------------------------------------------------------------------------------
/src/routes/component-data/Section.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Section",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["sectionClass", "string", "'relative py-6 sm:py-10'"],
7 | [
8 | "name",
9 | "'blog' | 'comment' |'cta' | 'ctawithimg' | 'contact' | 'content' | 'contentwithimg' | 'crudcreatedrawer' | 'crudcreateform' | 'crudreadsection' | 'default' | 'faq' | 'feature' | 'forgotpassword' | 'headingwithctabutton' | 'heroDefault' | 'heroVisual' | 'login' | 'logos' | 'maintenance' | 'newsletter' | 'none' | 'page500' | 'page404' | 'portfolio' | 'pricing' | 'register' | 'reset' | 'schedule' | 'social' | 'tableheader' | 'team' | 'testimonial'",
10 | "'default'"
11 | ]
12 | ]
13 | }
14 |
--------------------------------------------------------------------------------
/src/routes/component-data/SidebarBottomNav.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "SidebarBottomNav",
3 | "slots": [],
4 | "events": [],
5 | "props": [["divClass", "string", "'hidden absolute bottom-0 left-0 justify-center p-4 space-x-4 w-full lg:flex bg-white dark:bg-gray-800 z-20'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/SidebarBottomNavItem.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "SidebarBottomNavItem",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["href", "string", "''"],
7 | ["tooltip", "string", "''"],
8 | ["aClass", "string", "'inline-flex justify-center p-2 text-gray-500 rounded cursor-pointer dark:text-gray-400 hover:text-gray-900 dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-600'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/Social.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Social",
3 | "slots": [],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'max-w-screen-xl px-4 py-8 mx-auto text-center lg:py-16 lg:px-6'"],
7 | ["dlClass", "string", "'grid max-w-screen-md gap-8 mx-auto text-gray-900 sm:grid-cols-3 dark:text-white'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/TableHeader.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "TableHeader",
3 | "slots": ["search"],
4 | "events": [],
5 | "props": [
6 | ["divOuterClass", "string", "'relative bg-white shadow-md dark:bg-gray-800 sm:rounded-lg'"],
7 | ["headerType", "'search' | 'textbtn' | 'custom'", "'search'"],
8 | ["divSlotClass", "string", "'flex flex-col items-stretch justify-end flex-shrink-0 w-full space-y-2 md:w-auto md:flex-row md:space-y-0 md:items-center md:space-x-3'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/TeamBody.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "TeamBody",
3 | "slots": [],
4 | "events": [],
5 | "props": [["divClass", "string", "'grid gap-8 mb-6 lg:mb-16 md:grid-cols-2'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/TeamHeader.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "TeamHeader",
3 | "slots": ["label"],
4 | "events": [],
5 | "props": [["divClass", "string", "'mx-auto max-w-screen-sm text-center mb-8 lg:mb-16'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/TeamItem.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "TeamItem",
3 | "slots": ["social"],
4 | "events": [],
5 | "props": [
6 | ["divClass", "string", "'items-center bg-gray-50 rounded-lg shadow sm:flex dark:bg-gray-800 dark:border-gray-700'"],
7 | ["imgClass", "string", "'w-full rounded-lg sm:rounded-none sm:rounded-l-lg'"],
8 | ["h3Class", "string", "'text-xl font-bold tracking-tight text-gray-900 dark:text-white'"],
9 | ["spanClass", "string", "'text-gray-500 dark:text-gray-400'"],
10 | ["href", "string", "''"],
11 | ["src", "string", "''"],
12 | ["alt", "string", "''"],
13 | ["name", "string", "''"],
14 | ["jobTitle", "string", "''"]
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/src/routes/component-data/TeamWrapper.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "TeamWrapper",
3 | "slots": [],
4 | "events": [],
5 | "props": [["divClass", "string", "'py-8 px-4 mx-auto max-w-screen-xl lg:py-16 lg:px-6'"]]
6 | }
7 |
--------------------------------------------------------------------------------
/src/routes/component-data/Testimonial.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Testimonial",
3 | "slots": ["footer"],
4 | "events": [],
5 | "props": [
6 | ["icon", "typeof SvelteComponent | null", "null"],
7 | ["figureClass", "string", "'max-w-screen-md mx-auto'"],
8 | ["figureFooterClass", "string", "'flex items-center justify-center mt-6 space-x-3'"]
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/routes/component-data/TestimonialCard.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "TestimonialCard",
3 | "slots": ["header"],
4 | "events": [],
5 | "props": [
6 | ["headerClass", "string", "'mx-auto max-w-screen-sm'"],
7 | ["divClass", "string", "'grid mb-8 lg:mb-12 lg:grid-cols-2'"]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/src/routes/component-data/TestimonialCardItem.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "TestimonialCardItem",
3 | "slots": ["h3", "caption"],
4 | "events": [],
5 | "props": [
6 | ["figureClass", "string", "'flex flex-col justify-center items-center p-8 text-center bg-gray-50 border-b border-gray-200 md:p-12 lg:border-r dark:bg-gray-800 dark:border-gray-700'"],
7 | ["blockQuoteClass", "string", "'mx-auto mb-8 max-w-2xl text-gray-500 dark:text-gray-400'"],
8 | ["h3Class", "string", "'text-lg font-semibold text-gray-900 dark:text-white'"],
9 | ["footerBlockQuoteClass", "string", "'flex justify-center items-center space-x-3'"]
10 | ]
11 | }
12 |
--------------------------------------------------------------------------------
/src/routes/component-data/ToolsIcon.json:
--------------------------------------------------------------------------------
1 | { "name": "ToolsIcon", "slots": [], "events": [], "props": [] }
2 |
--------------------------------------------------------------------------------
/src/routes/component-data/Twitter.json:
--------------------------------------------------------------------------------
1 | { "name": "Twitter", "slots": [], "events": [], "props": [["href", "string", "''"]] }
2 |
--------------------------------------------------------------------------------
/src/routes/component-data/index.json:
--------------------------------------------------------------------------------
1 | { "name": "index", "slots": [], "events": [], "props": [] }
2 |
--------------------------------------------------------------------------------
/src/routes/component-data/types.json:
--------------------------------------------------------------------------------
1 | { "name": "types", "slots": [], "events": [], "props": [] }
2 |
--------------------------------------------------------------------------------
/src/routes/compotests/+page.svelte:
--------------------------------------------------------------------------------
1 |
5 |
6 |
7 |
8 |
9 |
10 | "Flowbite is just awesome. It contains tons of predesigned components and pages starting from login screen to complex dashboard. Perfect choice for your next SaaS application."
11 |
12 |
13 | {#snippet footer()}
14 |
16 |
Micheal Gough
17 |
CEO at Google
18 |
21 |
22 |
--------------------------------------------------------------------------------
/src/routes/layouts/+page.svelte:
--------------------------------------------------------------------------------
1 |
8 |
9 |
28 |
29 |
32 |
33 |
34 | {@render children()}
35 |
36 |
37 |
31 | #
34 |
35 |
--------------------------------------------------------------------------------
/src/routes/layouts/code.svelte:
--------------------------------------------------------------------------------
1 |
28 |
29 | {#snippet h1()}
30 | 404
31 | {/snippet}
32 | {#snippet paragraph()}
33 | Something's missing.
34 | Sorry, we can't find that page. You'll find lots to explore on the home page.
35 | Back to Homepage
36 | {/snippet}
37 |
38 |
39 | ```
40 |
41 |
25 |
26 | {#snippet h1()}500{/snippet}
27 | {#snippet paragraph()}
28 | Internal Server Error.
29 | We are already working to solve the problem.
30 | {/snippet}
31 |
32 |
33 | ```
34 |
35 |
26 | Flowbite
27 |
28 | Forgot your password?
29 | Don't fret! Just type in your email and we will send you a code to reset your password!
30 |
42 |
43 |
44 | ```
45 |
46 |
30 |
31 | Supercharge your hiring by taking advantage of our limited-time sale for Designer Search +
32 | Job Board. Unlimited access to over 190K top-ranked candidates and the #1 design job board.
33 |
34 | (visible = false)} class="rounded-lg p-1.5 text-sm text-gray-400 hover:bg-gray-200 hover:text-gray-900 dark:hover:bg-gray-600 dark:hover:text-white" />
35 |
36 | {/if}
37 | ```
38 |
39 |
26 |
27 | {#snippet h2()}Contact Us{/snippet}
28 | {#snippet paragraph()}Got a technical issue? Want to send feedback about a beta feature? Need details about our Business plan? Let us know.{/snippet}
29 |
44 |
45 |
46 | ```
47 |
48 |
26 |
27 | {#snippet h2()}You’ll be in good company{/snippet}
28 |
50 |
51 | ```
52 |
53 |
26 |
27 | {#snippet top()}
28 |
53 |
54 | ```
55 |
56 |
25 |
26 | {#snippet h1()}Under Maintenance{/snippet}
27 | {#snippet paragraph()}Our Enterprise administrators are performing scheduled maintenance.{/snippet}
28 |
29 |
30 | ```
31 |
32 |
26 |
27 |
Privacy info
28 |
The backup created with this export functionnality may contain some sensitive data. We suggest you to save this archive in a securised location.
29 |
38 | ```
39 |
40 |
49 |
50 | {#each portfolios as item}
51 |
54 |
55 | ```
56 |
57 |
26 |
27 | {#snippet top()}
28 |
56 |
57 | ```
58 |
59 |
26 |
27 | {#snippet top()}
28 |
53 |
54 | ```
55 |
56 |
25 |
26 |
27 |
28 |
developers
29 |
30 |
31 |
32 |
contributors
33 |
34 |
35 |
36 |
organizations
37 |
38 |
39 |
40 | ```
41 |
42 |
65 | {#each compoData as compo}
66 |
{compo.data.default.name}
67 |
72 | {/each}
73 |
6 | {@render children()}
7 |
8 |
--------------------------------------------------------------------------------
/src/routes/utils/DocBadge.svelte:
--------------------------------------------------------------------------------
1 |
10 |
11 |
12 | {@render children()}
13 |
14 |
--------------------------------------------------------------------------------
/src/routes/utils/ExampleDarkMode.svelte:
--------------------------------------------------------------------------------
1 |
4 |
5 |
10 | {#if dark}
11 |
12 |
18 | {:else}
19 |
20 |
22 | {/if}
23 | Toggle dark/light mode
24 |
25 |
--------------------------------------------------------------------------------
/src/routes/utils/ExampleHelper.svelte:
--------------------------------------------------------------------------------
1 |
4 |
5 |
6 | {@render snippet()}
7 |
8 |
--------------------------------------------------------------------------------
/src/routes/utils/ExampleRTL.svelte:
--------------------------------------------------------------------------------
1 |
20 |
21 |
26 | {#if rtl === 'rtl'}
27 | LTR
28 | {:else}
29 | RTL
30 | {/if}
31 | Toggle direction
32 |
33 |
--------------------------------------------------------------------------------
/src/routes/utils/GitHubSource.svelte:
--------------------------------------------------------------------------------
1 |
10 |
11 |
12 |
13 |
19 |
20 | {@render children()}: View Source Code
21 |
22 |
23 |
--------------------------------------------------------------------------------
/src/routes/utils/GitHubSourceList.svelte:
--------------------------------------------------------------------------------
1 |
18 |
19 |
41 |
--------------------------------------------------------------------------------
/src/routes/utils/MetaTag.svelte:
--------------------------------------------------------------------------------
1 |
21 |
22 |
14 |
17 |
18 | {description}
19 |
20 |
--------------------------------------------------------------------------------
/src/routes/utils/Section.svelte:
--------------------------------------------------------------------------------
1 |
10 |
11 |
12 |
13 | {@render children()}
14 |
15 |
16 |
--------------------------------------------------------------------------------
/src/routes/utils/SectionHeader.svelte:
--------------------------------------------------------------------------------
1 |
21 |
22 |
41 |
--------------------------------------------------------------------------------
/src/routes/utils/TableProp.svelte:
--------------------------------------------------------------------------------
1 |
32 |
33 |
34 |
35 |
36 |
37 | {#if category === 'props'}
38 | {#each header as column}
39 |
40 | {column}
41 |
42 | {/each}
43 | {:else}
44 |
45 | {header}
46 |
47 | {/if}
48 |
49 |
50 |
51 | {@render children()}
52 |
53 |
54 |
35 | {#if headings.length}
36 |
37 |
38 |
On this page
39 |
40 |
41 | {#each headings as { rel, href, name }}
42 |
43 | {name}
44 |
45 | {/each}
46 |
47 |
48 |
49 |
50 | {/if}
51 |
8 | {@render children()}
9 |
10 | {name}
11 |
--------------------------------------------------------------------------------
/src/routes/utils/data.json:
--------------------------------------------------------------------------------
1 | {
2 | "settings": {
3 | "after_subscribe": {
4 | "action": "message",
5 | "success_message": "Success! Now check your email to confirm your subscription.",
6 | "redirect_url": ""
7 | },
8 | "analytics": {
9 | "google": null,
10 | "fathom": null,
11 | "facebook": null,
12 | "segment": null,
13 | "pinterest": null,
14 | "sparkloop": null,
15 | "googletagmanager": null
16 | },
17 | "modal": {
18 | "trigger": "timer",
19 | "scroll_percentage": null,
20 | "timer": 5,
21 | "devices": "all",
22 | "show_once_every": 15
23 | },
24 | "powered_by": {
25 | "show": true,
26 | "url": "https://convertkit.com/features/forms?utm_campaign=poweredby&utm_content=form&utm_medium=referral&utm_source=dynamic"
27 | },
28 | "recaptcha": { "enabled": false },
29 | "return_visitor": { "action": "show", "custom_content": "" },
30 | "slide_in": {
31 | "display_in": "bottom_right",
32 | "trigger": "timer",
33 | "scroll_percentage": null,
34 | "timer": 5,
35 | "devices": "all",
36 | "show_once_every": 15
37 | },
38 | "sticky_bar": {
39 | "display_in": "top",
40 | "trigger": "timer",
41 | "scroll_percentage": null,
42 | "timer": 5,
43 | "devices": "all",
44 | "show_once_every": 15
45 | }
46 | },
47 | "version": "5"
48 | }
49 |
--------------------------------------------------------------------------------
/src/routes/utils/helpers.ts:
--------------------------------------------------------------------------------
1 | export function getFilteredFileNames(dirName: string) {
2 | const modules = import.meta.glob('$lib/**/*.svelte');
3 | const pathsArray = Object.keys(modules);
4 | const filteredPaths = pathsArray.filter((path) => path.includes(dirName));
5 | const fileNames = filteredPaths.map((path) => {
6 | const parts = path.split('/');
7 | const fileNameWithExtension = parts[parts.length - 1];
8 | const fileNameWithoutExtension = fileNameWithExtension.substring(0, fileNameWithExtension.lastIndexOf('.'));
9 |
10 | return fileNameWithoutExtension;
11 | });
12 |
13 | return fileNames;
14 | }
15 |
16 | export function toKebabCase(inputString: string) {
17 | return inputString.toLowerCase().replace(/\s+/g, '-');
18 | }
19 |
--------------------------------------------------------------------------------
/src/routes/utils/icons/ArrowLeft.svelte:
--------------------------------------------------------------------------------
1 |
2 |
4 |
--------------------------------------------------------------------------------
/src/routes/utils/icons/ArrowRight.svelte:
--------------------------------------------------------------------------------
1 |
2 |
9 |
--------------------------------------------------------------------------------
/src/routes/utils/icons/Discord.svelte:
--------------------------------------------------------------------------------
1 |
2 |
7 |
--------------------------------------------------------------------------------
/src/routes/utils/icons/Facebook.svelte:
--------------------------------------------------------------------------------
1 |
9 |
10 | Facebook GitHub
15 |
21 |
--------------------------------------------------------------------------------
/src/routes/utils/icons/Instagram.svelte:
--------------------------------------------------------------------------------
1 |
9 |
10 | Instagram
10 |
20 |
--------------------------------------------------------------------------------
/src/routes/utils/icons/Twitter.svelte:
--------------------------------------------------------------------------------
1 |
9 |
10 | Twitter
2 |
7 |
--------------------------------------------------------------------------------
/src/routes/utils/index.ts:
--------------------------------------------------------------------------------
1 | export { default as MetaTag } from './MetaTag.svelte';
2 |
3 | export { default as Airbnb } from './icons/Airbnb.svelte';
4 | // export { default as Github } from './icons/Github.svelte';
5 | export { default as Google } from './icons/Google.svelte';
6 | // export { default as GitHub } from './icons/GitHub.svelte';
7 | export { default as Facebook } from './icons/Facebook.svelte';
8 | export { default as Instagram } from './icons/Instagram.svelte';
9 | export { default as Mailchimp } from './icons/Mailchimp.svelte';
10 | export { default as Mashable } from './icons/Mashable.svelte';
11 | export { default as Microsoft } from './icons/Microsoft.svelte';
12 | export { default as ProductHunt } from './icons/ProductHunt.svelte';
13 | export { default as Reddit } from './icons/Reddit.svelte';
14 | export { default as Spotify } from './icons/Spotify.svelte';
15 | export { default as Twitter } from './icons/Twitter.svelte';
16 | export { default as Youtube } from './icons/Youtube.svelte';
17 |
18 | export { default as TableDefaultRow } from './TableDefaultRow.svelte';
19 | export { default as TableProp } from './TableProp.svelte';
20 | export { default as CompoAttributesViewer } from './CompoAttributesViewer.svelte';
21 |
--------------------------------------------------------------------------------
/src/routes/utils/mdsvex.d.ts:
--------------------------------------------------------------------------------
1 | /* eslint-disable @typescript-eslint/no-empty-object-type */
2 | declare module '*.md' {
3 | import type { SvelteComponent } from 'svelte';
4 |
5 | export default class Comp extends SvelteComponent {
6 | $$prop_def: {};
7 | metadata: Record;
8 | }
9 | export const metadata: Record;
10 | }
11 |
12 | declare module '*.svx' {
13 | import type { SvelteComponent } from 'svelte';
14 |
15 | export default class Comp extends SvelteComponent {}
16 |
17 | export const metadata: Record;
18 | }
19 |
20 | declare module '*.svelte.md' {
21 | import type { SvelteComponent } from 'svelte';
22 |
23 | export default class Comp extends SvelteComponent {}
24 |
25 | export const metadata: Record;
26 | }
27 |
--------------------------------------------------------------------------------
/src/vite-env.d.ts:
--------------------------------------------------------------------------------
1 | declare const __VERSION__: string;
2 | declare const __NAME__: string;
3 |
--------------------------------------------------------------------------------
/static/images/android-chrome-192x192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themesberg/flowbite-svelte-blocks/46f47513ccdd18d80caaa9b7695e8ad36e2f9bdc/static/images/android-chrome-192x192.png
--------------------------------------------------------------------------------
/static/images/android-chrome-512x512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themesberg/flowbite-svelte-blocks/46f47513ccdd18d80caaa9b7695e8ad36e2f9bdc/static/images/android-chrome-512x512.png
--------------------------------------------------------------------------------
/static/images/apple-touch-icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themesberg/flowbite-svelte-blocks/46f47513ccdd18d80caaa9b7695e8ad36e2f9bdc/static/images/apple-touch-icon.png
--------------------------------------------------------------------------------
/static/images/favicon-16x16.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themesberg/flowbite-svelte-blocks/46f47513ccdd18d80caaa9b7695e8ad36e2f9bdc/static/images/favicon-16x16.png
--------------------------------------------------------------------------------
/static/images/favicon-32x32.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themesberg/flowbite-svelte-blocks/46f47513ccdd18d80caaa9b7695e8ad36e2f9bdc/static/images/favicon-32x32.png
--------------------------------------------------------------------------------
/static/images/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themesberg/flowbite-svelte-blocks/46f47513ccdd18d80caaa9b7695e8ad36e2f9bdc/static/images/favicon.ico
--------------------------------------------------------------------------------
/static/images/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/themesberg/flowbite-svelte-blocks/46f47513ccdd18d80caaa9b7695e8ad36e2f9bdc/static/images/favicon.png
--------------------------------------------------------------------------------
/static/images/marketing/404-dark.svg:
--------------------------------------------------------------------------------
1 |
2 |
8 |
--------------------------------------------------------------------------------
/static/images/marketing/404.svg:
--------------------------------------------------------------------------------
1 |
2 |
8 |
--------------------------------------------------------------------------------
/static/images/marketing/account-recovery-dark.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
16 |
17 |
18 |
20 |
21 |
22 |
--------------------------------------------------------------------------------
/static/images/marketing/account-recovery.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
18 |
19 |
20 |
22 |
23 |
24 |
--------------------------------------------------------------------------------
/static/images/marketing/contact-dark.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
31 |
32 |
33 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/static/images/marketing/contact.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
31 |
32 |
33 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/static/images/marketing/hero-dark.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
17 |
18 |
19 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/static/images/marketing/hero.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
17 |
18 |
19 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/static/images/marketing/login-dark.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
20 |
21 |
22 |
24 |
25 |
26 |
--------------------------------------------------------------------------------
/static/images/marketing/login.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
21 |
22 |
23 |
25 |
26 |
27 |
--------------------------------------------------------------------------------
/static/images/marketing/newsletter-dark.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
17 |
18 |
19 |
32 |
33 |
34 |
--------------------------------------------------------------------------------
/static/images/marketing/newsletter.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
17 |
18 |
19 |
32 |
33 |
34 |
--------------------------------------------------------------------------------
/static/images/marketing/register-dark.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
30 |
31 |
32 |
34 |
35 |
36 |
--------------------------------------------------------------------------------
/static/images/marketing/register.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
32 |
33 |
34 |
36 |
37 |
38 |
--------------------------------------------------------------------------------
/static/images/marketing/reset-password-dark.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
22 |
23 |
24 |
26 |
27 |
28 |
--------------------------------------------------------------------------------
/static/images/marketing/reset-password.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
24 |
25 |
26 |
28 |
29 |
30 |
--------------------------------------------------------------------------------
/static/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Flowbite Svelte Blocks",
3 | "short_name": "Flowbite Svelte Blocks",
4 | "scope": "/",
5 | "start_url": ".",
6 | "icons": [
7 | {
8 | "src": "images/apple-touch-icon.png",
9 | "sizes": "180x180",
10 | "type": "image/png"
11 | },
12 | {
13 | "src": "images/android-chrome-192x192.png",
14 | "sizes": "192x192",
15 | "type": "image/png"
16 | },
17 | {
18 | "src": "images/android-chrome-512x512.png",
19 | "sizes": "512x512",
20 | "type": "image/png"
21 | },
22 | {
23 | "src": "images/maskable_icon_x192.png",
24 | "sizes": "192x192",
25 | "type": "image/png",
26 | "purpose": "any maskable"
27 | }
28 | ],
29 | "theme_color": "#ffffff",
30 | "background_color": "#ffffff",
31 | "display": "standalone"
32 | }
33 |
--------------------------------------------------------------------------------
/static/manifest.webmanifest:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Flowbite Svelte Blocks",
3 | "short_name": "Flowbite Svelte Blocks",
4 | "scope": "/",
5 | "start_url": ".",
6 | "icons": [
7 | {
8 | "src": "images/apple-touch-icon.png",
9 | "sizes": "180x180",
10 | "type": "image/png"
11 | },
12 | {
13 | "src": "images/android-chrome-192x192.png",
14 | "sizes": "192x192",
15 | "type": "image/png"
16 | },
17 | {
18 | "src": "images/android-chrome-512x512.png",
19 | "sizes": "512x512",
20 | "type": "image/png"
21 | },
22 | {
23 | "src": "images/maskable_icon_x192.png",
24 | "sizes": "192x192",
25 | "type": "image/png",
26 | "purpose": "any maskable"
27 | }
28 | ],
29 | "theme_color": "#ffffff",
30 | "background_color": "#ffffff",
31 | "display": "standalone"
32 | }
33 |
--------------------------------------------------------------------------------
/svelte.config.js:
--------------------------------------------------------------------------------
1 | import { mdsvex } from 'mdsvex';
2 | import mdsvexConfig from './mdsvex.config.js';
3 | import adapter from '@sveltejs/adapter-auto';
4 | import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
5 |
6 | /** @type {import('@sveltejs/kit').Config} */
7 | const config = {
8 | extensions: ['.svelte', ...mdsvexConfig.extensions],
9 | preprocess: [mdsvex(mdsvexConfig), vitePreprocess()],
10 |
11 | kit: {
12 | // adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
13 | // If your environment is not supported, or you settled on a specific environment, switch out the adapter.
14 | // See https://svelte.dev/docs/kit/adapters for more information about adapters.
15 | adapter: adapter()
16 | }
17 | };
18 |
19 | export default config;
20 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./.svelte-kit/tsconfig.json",
3 | "compilerOptions": {
4 | "allowJs": true,
5 | "checkJs": true,
6 | "esModuleInterop": true,
7 | "forceConsistentCasingInFileNames": true,
8 | "resolveJsonModule": true,
9 | "skipLibCheck": true,
10 | "sourceMap": true,
11 | "strict": true,
12 | "moduleResolution": "bundler"
13 | }
14 | }
15 |
--------------------------------------------------------------------------------
/vite.config.ts:
--------------------------------------------------------------------------------
1 | import tailwindcss from '@tailwindcss/vite';
2 | import { svelteTesting } from '@testing-library/svelte/vite';
3 | import { sveltekit } from '@sveltejs/kit/vite';
4 | import { defineConfig } from 'vite';
5 | import examples from 'mdsvexamples/vite';
6 | import path from 'path';
7 | import pkg from './package.json' with { type: 'json' };
8 |
9 | export default defineConfig({
10 | plugins: [tailwindcss(), sveltekit(), examples],
11 | test: {
12 | workspace: [
13 | {
14 | extends: './vite.config.ts',
15 | plugins: [svelteTesting()],
16 | test: {
17 | name: 'client',
18 | environment: 'jsdom',
19 | clearMocks: true,
20 | include: ['src/**/*.svelte.{test,spec}.{js,ts}'],
21 | exclude: ['src/lib/server/**'],
22 | setupFiles: ['./vitest-setup-client.ts']
23 | }
24 | },
25 | {
26 | extends: './vite.config.ts',
27 | test: {
28 | name: 'server',
29 | environment: 'node',
30 | include: ['src/**/*.{test,spec}.{js,ts}'],
31 | exclude: ['src/**/*.svelte.{test,spec}.{js,ts}']
32 | }
33 | }
34 | ]
35 | },
36 | resolve: {
37 | alias: {
38 | 'flowbite-svelte-blocks': path.resolve(process.cwd(), './src/lib/index.ts')
39 | }
40 | },
41 | define: {
42 | __NAME__: JSON.stringify(pkg.name),
43 | __VERSION__: JSON.stringify(pkg.version)
44 | }
45 | });
46 |
--------------------------------------------------------------------------------
/vitest-setup-client.ts:
--------------------------------------------------------------------------------
1 | import '@testing-library/jest-dom/vitest';
2 | import { vi } from 'vitest';
3 |
4 | // required for svelte5 + jsdom as jsdom does not support matchMedia
5 | Object.defineProperty(window, 'matchMedia', {
6 | writable: true,
7 | enumerable: true,
8 | value: vi.fn().mockImplementation((query) => ({
9 | matches: false,
10 | media: query,
11 | onchange: null,
12 | addEventListener: vi.fn(),
13 | removeEventListener: vi.fn(),
14 | dispatchEvent: vi.fn()
15 | }))
16 | });
17 |
18 | // add more mocks here if you need them
19 |
--------------------------------------------------------------------------------
15 | 
23 | Flowbite
24 |