Svelte Bulma Components

screenshot of Svelte Bulma Components
svelte
bulma

Collection of Bulma UI components to be used in Svelte or standalone

Overview:

The svelte-bulma-components library is a collection of UI components designed to be used in Svelte.js or as standalone components. It provides a convenient way to implement interactive Bulma components in your projects.

Features:

  • Dropdown: An interactive dropdown menu for discoverable content. It supports options such as label text, hoverable behavior, popup direction, and alignment.
  • Modal: A classic modal overlay that can be used to display any content. It includes options for customizing the color of the success button and emits an onclose event when closed.
  • ModalCard: A modal card that includes a head, body, and foot. It emits an onclose event and supports customizing the color of the success button.
  • Navbar: A responsive horizontal navbar that can contain images, links, buttons, and dropdowns. It offers options for fixed positioning, background color, transparency, and more.
  • Pagination: A responsive and flexible pagination component. It emits an onchange event with the selected page number and supports customization of the current page, total number of pages, and appearance.

Summary:

The svelte-bulma-components library provides a collection of UI components that can be used in Svelte.js projects or as standalone components. It offers various interactive and customizable components such as dropdowns, modals, navbars, and pagination. The installation process is straightforward, and the library requires the inclusion of the Bulma and Font Awesome CSS files. With these components, developers can easily implement interactive Bulma components in their projects.

svelte
Svelte

Svelte is a modern front-end framework that compiles your code at build time, resulting in smaller and faster applications. It uses a reactive approach to update the DOM, allowing for high performance and a smoother user experience.

bulma
Bulma

Bulma is a free, open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

rollup
Rollup

RollupJS is a popular and efficient JavaScript module bundler that takes the code from multiple modules and packages them into a single optimized file, minimizing the overall size of the application and improving its performance.