Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Upgrade to Bulma v1 #121

Open
jluttine opened this issue Mar 29, 2024 · 2 comments
Open

Upgrade to Bulma v1 #121

jluttine opened this issue Mar 29, 2024 · 2 comments
Assignees

Comments

@jluttine
Copy link

Bulma v1 was released recently: https://github.com/jgthms/bulma/releases/tag/1.0.0

Currently, Bulmaswatch themes don't support these new v1 features (e.g., <div class="grid">). Would be great if Bulmaswatch themes were upgraded, because the current Bulma docs don't anymore contain info about the removed features (e.g., <div class="tile">).

Migration guidelines: https://bulma.io/documentation/start/migrating-to-v1/

@jenil jenil self-assigned this Apr 1, 2024
@CAYdenberg
Copy link

Please let me know if I can help, or if you have any suggestions for splitting up the work.

@davetapley
Copy link

If it helps anyone, here is part of darkly:

$turquoise: #1abc9c;

$text: #fff;

$grey-lighter: #dbdee0;
$grey-light: #8c9b9d;

$grey: darken($grey-light, 18);
$grey-dark: darken($grey, 18);
$grey-darker: darken($grey, 23);
$body-background-color: darken($grey-darker, 4);

@use "bulma/sass" with (
  $body-background-color: $body-background-color,
  $body-color: $text,
  $title-color: $text,

  $section-padding: 1rem,
  $section-padding-desktop: 1rem,

  $box-color: $text,
  $box-background-color: $grey-dark,
  $box-shadow: none,
  $box-padding: 0.25rem 0.5rem,

  $link: $text,

  $navbar-background-color: $blue,
  $navbar-height: 4rem,
  $navbar-item-color: $text,
  $navbar-item-hover-background-l-delta: 0,
  $navbar-item-active-background-l-delta: 0,

  $family-primary:
    '"Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", "Helvetica", "Arial", sans-serif',

  $title-weight: 500,
  $subtitle-weight: 400,

  $breadcrumb-item-separator-color: $grey-light,
  $breadcrumb-item-color: $text,
  $breadcrumb-item-active-color: $text,

  $table-background-color: transparent,
  $table-color: $text,
);

I suppose it could in principal be possible to write a script to generate all the @use?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants