
Security News
GitHub Actions Supply Chain Attack Puts Thousands of Projects at Risk
A compromised GitHub Action exposed secrets in CI/CD logs, putting thousands of projects at risk and forcing developers to urgently secure their workflows.
@oruga-ui/theme-bulma
Advanced tools
npm install @oruga-ui/theme-bulma
or
yarn add @oruga-ui/theme-bulma
import { createApp } from 'vue'
import App from './App.vue'
import Oruga from '@oruga-ui/oruga-next'
import { bulmaConfig } from '@oruga-ui/theme-bulma'
import '@oruga-ui/theme-bulma/dist/bulma.css'
createApp(App)
.use(Oruga, bulmaConfig)
.mount('#app')
Please note, this package can be used without importing any other Oruga styling or theme.
Bulma is a highly customizable CSS framework. From colors to typography, spacing and sizes, forms and layouts, all parts of Bulma can be customized by the user (see Bulma Customization).
Using the following sample code you don't need import '@oruga-ui/theme-bulma/dist/bulma.css'
but you have to add a custom sass/scss file to customize Bulma and the theme variables. To overwrite Bulma’s Sass variables with your own values, write @use
and the with
keyword, which takes a Sass map:
// set your color overrides
$primary: #8c67ef;
$link: $primary;
// add new colors to the colors map
$twitter: #4099FF;
$custom-colors: ('twitter', $twitter);
@use '@oruga-ui/theme-bulma/dist/scss/bulma' with (
$family-primary: '"Nunito", sans-serif',
$primary: $primary,
$link: $link,
$custom-colors: $custom-colors,
);
In case you want to replace the default style of a component you can override or add new classes changing bulmaConfig
; more details about components customization on https://oruga-ui.com/documentation/customisation.html
import { createApp } from 'vue'
import Oruga from '@oruga-ui/oruga-next'
import { bulmaConfig } from '@oruga-ui/theme-bulma'
import '@oruga-ui/theme-bulma/dist/bulma.css'
const customBulmaConfig = {
...bulmaConfig,
checkbox: {
override: true,
rootClass: 'checkbox'
}
}
createApp(App)
.use(Oruga, customBulmaConfig)
.mount('#app')
Thank you to everyone involved for improving this project, day by day 💚
Logo designed by rubjo
Code released under MIT license.
FAQs
Bulma theme for Oruga
The npm package @oruga-ui/theme-bulma receives a total of 4,512 weekly downloads. As such, @oruga-ui/theme-bulma popularity was classified as popular.
We found that @oruga-ui/theme-bulma demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers 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
A compromised GitHub Action exposed secrets in CI/CD logs, putting thousands of projects at risk and forcing developers to urgently secure their workflows.
Research
Security News
A malicious Maven package typosquatting a popular library is secretly stealing OAuth credentials on the 15th of each month, putting Java developers at risk.
Security News
Socket and Seal Security collaborate to fix a critical npm overrides bug, resolving a three-year security issue in the JavaScript ecosystem's most popular package manager.