Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
react-bulma-switch
Advanced tools
Readme
React component for Bulma Switch extension using React-Bulma-Components
You can find the Storybook of all components here
npm install react-bulma-components react-bulma-switch
or
yarn add -E react-bulma-components react-bulma-switch
import React from 'react';
// You can import from the global component (you will need to include the css file dist/react-bulma-switch.min.css)
import Switch from 'react-bulma-switch';
// You can also include the js that also bundle the ccs (do not work with server-side rendering)
import switch from 'react-bulma-switch/full';
// [RECOMENDED] If you use this approach configure webpack to handle sass files
import Switch from 'react-bulma-switch/lib';
export default () => (
<div>
<Switch value rounded>Switch Rounded</Switch>
<Switch value thin>Switch Thin</Switch>
<Switch value rtl>Switch Text on the left</Switch>
<Switch value outlined>Switch Text on the left</Switch>
</div>
);
You can find the documentation in https://couds.github.io/react-bulma-switch
Each component import his own sass file, in this way you can reduce your css total file only including the styles you use, to enable this please configure your Webpack to handle sass files. You can use the webpack.config.js on the root folder of this repository
Some api/naming may vary of convention with the Bulma Docs, please refear to each storybook to see how to use each component (you can find the source code of the story usin ght button "Show info" on the top-right corner)
To Override the variables set by Bulma you will need to create a sass file like this one (_variable.sass)
@import '~bulma/sass/utilities/initial-variables.sass'
// ADD HERE variables you want to override
$primary: #f4f4f4
@import '~bulma/sass/utilities/_all.sass'
After that you will need to add to your webpack configuration an alias pointing to the file
resolve {
// Other resolve props
alias: {
// Other aliases
'_variables.sass': path.resolve(__dirname, 'relative/path/to/your/file/from/webpack/config/file'),
},
}
This page is open source. Noticed a typo? Or something unclear? Improve this page on GitHub
FAQs
Switch Bulma extension using react-bulma-components
The npm package react-bulma-switch receives a total of 247 weekly downloads. As such, react-bulma-switch popularity was classified as not popular.
We found that react-bulma-switch demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.