Sign in Subscribe

Skeleton v0.99.5

Today's release kicks off the refinement phase for the project as we move towards Release Candidate status for Skeleton. This means we'll be focusing primarily on polish and bugfixes.

Chris Simmons

• 6 min read
Skeleton v0.99.5

News

Skeleton on the LogRock Podcast

Chris will be appearing on an episode of the LogRocket Podcast on February 15th. Be sure to tune in as we'll be sharing some exciting news about Skeleton!

Community Updates

We've introduced a new set of community focused updates to help ensure that all Skeleton projects are friendly and inclusive. These rules and guidelines will be enforced on Github, Discord, and any other community focused space.

Release Notes

Release: https://github.com/skeletonlabs/skeleton/releases/tag/0.99.5

Today's release kicks off the refinement phase for the project as we move towards Release Candidate status for Skeleton. This means we'll be focusing primarily on polish and bugfixes. Please be aware that we expect the next few release to be bumpy, with more breaking changes than you may be used to. We ask for your patience during this time. However, be aware this will come with many highly requested updates and changes that will result in a much more stable product overall.

Summary:

  • 🎨 New universal variant styles
  • 🔘 Added button group styles
  • 🔲 Added input group styles
  • 📙 Greatly expanded Element documentation
  • 🐞 Various bugfixes and minor improvements

Tailwind Element Updates

https://github.com/skeletonlabs/skeleton/issues/837

Our refinement and polish for Skeleton has started with Tailwind Elements. These are broad and far reaching styles that affect many parts of Skeleton applications. We have compiled a detailed list of changes here. The most notable improvements include:

Universal Variants

Screen Shot 2023-01-23 at 1 58 39 PM

Element variant styles now pull from a shared pool of styles and are universal. These are now available to buttons, badges, chips, cards, and other features. See the migration guide below for more info.

Button Groups

Screen Shot 2023-01-23 at 1 59 34 PM

Button groups have now been introduced, allowing you to group a set of related actions.

Input Groups

Screen Shot 2023-01-23 at 2 00 10 PM

Input groups have been introduced, allowing you to append icons and group multiple inputs.

Greatly Expanded Documentation

Screen Shot 2023-01-23 at 2 00 48 PM

The documentation for each section has been greatly expanded, including many previously undocumented features.

Less Opinionated Styles

Screen Shot 2023-01-23 at 2 01 34 PM

Styling for certain elements, such as links and button animations, are now less opinionated by default. Providing a simpler starting point for customization in your own projects.

Presentation Features

Screen Shot 2023-01-23 at 2 02 16 PM

We've also introduced a new Tailwind > Presentation category, for features such as Gradient Headings that do not require Skeleton.

⚠️ Migration Guide

Given the scope of these changes, we would highly recommend viewing this ticket and review items marked BREAKING:. We also advise reviewing the latest documentation for each feature. The change to universal variants is the most broad so we've provided instruction below.

Migrating to Universal Variants

All elements will now pull from a universal pool of shared variant styles, rather than having a unique set per Element. These are much simpler to use in practice. For example:

  • Was <button class="btn btn-filled-primary">, now <button class="btn variant-filled-primary">
  • Was <span class="badge badge-ghost-secondary">, now <span class="badge variant-ghost-secondary">
  • Was <span class="chip chip-ringed-tertiary">, now <span class="chip variant-ringed-tertiary">
  • Was <aside class="alert alert-primary">, now <aside class="alert variant-ghost-warning">

Even elements that previously required passing color values can now utilize variants instead:

  • Was <div class="card !bg-error-500">, now <div class="card variant-filled-error">

We recommend using your code editor's find/replace feature to update each instance. See a few examples below:

  • Find: btn-filled, replace with: variant-filled
  • Find: badge-filled, replace with: variant-filled
  • Find: chip-filled, replace with: variant-filled

Tailwind Plugin Change

We've modified how portions of the Skeleton Tailwind plugin are generated. It is now more modular. Due to this change there is one minor breaking change introduced that you will need to address in existing projects. See the migration guide below.

⚠️ Migration Guide

Open your tailwind.config.cjs and prepend ... before the plugin and () after the plugin:

const config = {
  // ...
  plugins: [
    // Keep any existing plugins present and append the following:
    // 👇 ADD THIS! "..."
    ...require("@skeletonlabs/skeleton/tailwind/skeleton.cjs")(), // <--- ADD THIS!
  ],
};

Minor Improvements

Bugfixes

Documentation

Preparing for Upcoming Releases

We do not typically discuss upcoming releases here, but given the amount of notable changes coming, we thought it might be helpful to explain what's coming down the pipeline over the next few releases. Expect to see a large amount of breaking issues as we move closer towards a stable Release Candidate status.

Polish Passes

Per this ticket, our current focus is polishing and refining as many core features within Skeleton as possible. The updates to Elements in this release are just the beginning. We have two other passes planned as follows:

  1. https://github.com/skeletonlabs/skeleton/issues/857
  2. Polish Pass: Utility features - coming soon (put issues here)

We welcome your feedback for changes you would like to see for these features. Please provide these in linked tickets or reach out on Discord. Keep in mind that these will be polish/bugfix focused. Total refactors are not likely, so please keep your expectations reasonable.

Documentation Updates

Per this ticket, we have a large number of improvements for the Skeleton documentation website planned. This includes everything from design updates, improved text copy and instruction, to administrative tasks such as SEO.

If you're a skilled copywriter we could use your help! The plan is to take all volunteers, then divide and conquer, addressing issues from top to bottom - this includes fixing typos, grammar, and ensuring content is relevant and accurate. If you're available to help in this process then please reach out and let us know!

Support Skeleton

Like what you see here? Wish to sponsor Skeleton directly? Consider supporting us via one of the following services:

Sign up for more like this.

Enter your email
Subscribe