bolt

The Bolt Design System provides robust Twig and Web Component-powered UI components, reusable visual styles, and powerful tooling to help developers, designers, and content authors build, maintain, and scale best of class digital experiences.

MIT License

Downloads
956
Stars
293
Committers
45
View Code on GitHub Visit Website
Ecosystems: Webpack, Preact.js, Drupal, Web Components

Bot releases are hidden (Show)

bolt - https://github.com/boltdesignsystem/bolt/releases/tag/v5.2.2

Published by colbytcook over 2 years ago

Release Notes

From #2434

Visual changes

Any modal that has width set to regular now has a max-width of 1400px. This means the modal width will not get wider than 1400px. For modals that require going beyond that max-width, use width: full instead.

Misc

Bug Fixes

Authors: 2

bolt - https://github.com/boltdesignsystem/bolt/releases/tag/v5.2.1

Published by colbytcook over 2 years ago

Misc

Features

Bug Fixes

Authors: 2

bolt -

Published by colbytcook over 2 years ago

Release Notes

Page Header

Updated the page header utility section to the new designs based on the notification work. From #2300

Icon Element

  • pega-heath-shield renamed to pega-health-shield. This icon is not currently in use as far as we know. From #2424
  • customer-service icon has been updated to match brand icon. The double chat bubbles are slightly different from before. From #2411

Ratio Component

This component is now deprecated. Replace this with the new Ratio Element. From #2412

Modal Component

  • Fixed a Safari bug that didn't allow the modal's height to properly calculate on scroll. From #2420
  • Also fixed another Safari bug where the modal image was not horizontally centered. From #2420

Listing Teaser Component

This component no longer wraps itself in an empty div. From #2418

Visual Changes

  • The page header utility section will have a different design. From #2300
  • customer-service icon has been updated to match brand icon. The double chat bubbles are slightly different from before. From #2411

Misc

Features

Bug Fixes

Authors: 8

bolt - https://github.com/boltdesignsystem/bolt/releases/tag/v5.1.1

Published by colbytcook almost 3 years ago

Misc

Authors: 1

bolt -

Published by colbytcook almost 3 years ago

Release Notes

Ratio Element

  • Added a new Ratio Element
  • Ratio Component will be deprecated and replaced with the new Ratio Element. From #2400

Background Component

The Background Component now leverages the Image Element instead of the Image Component. From #2385 and #2387

Headline Component

Subheadline size options now match the Drupal Admin UI From #2390

Stylelint Upgrade

Upgraded Stylelint to v14. From #2391

Profile and Notifications Mockups

Added the following mockups

  • Profile View From #2383 and #2399
  • Notification Tag Manger From #2389 and #2392

Switch Button Component

Added a new Switch Button Component From #2382

Version Selector Update

Fixed bugs in the PL version selector From #2406

Form Comonent

Updated the docs to make them more clear From #2379

Misc

Features

Bug Fixes

Docs

Authors: 8

bolt -

Published by colbytcook almost 3 years ago

Release Notes

Chips Component

Updated the icon vertical alignment to center within the chips

Holy Grail Layout

Fixed a table bug that prevented scrolling

Printable Element

Updated the CSS to fix a Safari specific print bug

Misc

Authors: 1

bolt -

Published by colbytcook almost 3 years ago

Release Notes

Notifications Tag Manager and User Profile

Included the markup for the Notifications Tag Manager and User Profile

Misc

Authors: 1

bolt -

Published by colbytcook almost 3 years ago

Release Notes

Bolt Chip Component

Added a gray background option to the chips that will show a persistent gray background color regardless of color themes.

Misc

  • Release v4.8.1: Background Image and Chip Color Update #2395 (@bolt-bot)

Authors: 1

bolt -

Published by colbytcook almost 3 years ago

Release Notes

Background Component

Replaced the Image Component with a Image Element to provide a performance boost. From #2386

Profile View

Added the Notification Profile View with the following additions. From #2386

  1. Profile Component created to handle user profiles.
  2. Info Section Component created to handle sections within a user profile.
  3. Removes text-align behaviors in Tooltip Component to simplify the code and make the behavior more predictable.
  4. Miscellaneous doc changes that enhance or re-organize existing docs.
  5. Fixes Image Element CSS so that when fill prop is used, the image's display is set to block, which removes undesired white space from inline-block.

Features

Authors: 2

bolt - https://github.com/boltdesignsystem/bolt/releases/tag/v5.0.1

Published by colbytcook almost 3 years ago

Misc

Authors: 1

bolt -

Published by colbytcook almost 3 years ago

Release Notes

For step-by-step upgrade docs see https://github.com/boltdesignsystem/bolt/wiki/Upgrade-to-5.x.

Node

Updated node to v14.18.1. From #2358

Icon Component

All instances of the Icon Component have been replaced with the Icon Element. From #2366

Video Component

This component has been removed. From #2376

Dropdown Component

This component has been removed. From #2365

Block List Component

This component has been removed. From #2353

Figure Component

The following deprecated props have been removed: media.image, media.icon, media.video, media.table, and content. From #2366

Device Viewer Component

The following deprecated props have been removed: image, and magnify. From #2366

CSS Updates

  • Removed the Bolt-theme() mixin. From #2364
  • Removed the Crop Object. From #2352
  • Removed the Island Object. From #2351

Visual changes

Icon Element

Icons may appear slightly larger in the following components:

  • Button
  • Card (Card actions)
  • Carousel
  • Chip List
  • Chip
  • Code Snippet
  • Form elements (submit, validation icons)
  • Link
  • Tabs
  • Typeahead
  • Holygrail Layout

Breaking Changes

Features

Bug Fixes

Authors: 9

bolt -

Published by colbytcook almost 3 years ago

Release Notes

Tabs Component

Added functionality to allow the tabs "More" label to be automatically translated with the use of the t() function From #2354

My Quick Links

Added UX Mockups for the My Quick Links component Form #2301

Optimized Campaign Landing Pages

Fixed a bug that prevented the footer links from appropriately wrapping on mobile From #2341

Misc

Features

Docs

Authors: 7

bolt - https://github.com/boltdesignsystem/bolt/releases/tag/v4.6.2

Published by colbytcook almost 3 years ago

Misc

Features

Authors: 3

bolt - https://github.com/boltdesignsystem/bolt/releases/tag/v4.6.1

Published by colbytcook about 3 years ago

Misc

Features

Bug Fixes

Authors: 2

bolt -

Published by colbytcook about 3 years ago

Release Notes

Code Snippet Component

Rebuild Code Snippet component with several new features, drop web-component support. From #2317

Form Component

Added support for passing attributes to each form select option. From #2336

Listing Teaser Component

Raised the signifier link above headline link. Listing Teaser Component now supports multiple linking options; direct linking and opening a modal from the signifier. From #2326

Visual changes

Banner Component

Banner with status "information" are now light blue with dark blue text. Previously they were white with black text. From #2339

Form Component

Form inputs with label "before" the field (not floating inside) will no longer shift in height when they get focus. From #2317

Misc

Features

Bug Fixes

Docs

Authors: 5

bolt - https://github.com/boltdesignsystem/bolt/releases/tag/v4.5.1

Published by colbytcook about 3 years ago

Misc

Authors: 1

bolt -

Published by colbytcook about 3 years ago

Release Notes

Twig

Support for twig 2 added. From #2258

Icon Component

This component is now deprecated, please use the Icon Element. From #2308

Icon Element

A new custom_icon_path was added to make it possible to render the icon element by Twig usage. From #2325

Image Component

This component is now deprecated, please use the Image Element. From #2322

Headline Component

Replaced the Link Component with the Text Link Element. From #2319

Optimized Campaign Landing Pages

Added a preview image chip and re-order preview and checklist in mobile view From #2327

Patternlab Documentation

Added information about twig file name on schema section. From #2316

Visual changes

Icon Element

  • Icons in several components may now appear slightly larger than before where the "component" version of Icon was replaced with the "element" version. See description in #2320 for complete list of components changed.
  • Chevron icons are slightly bigger than component version (~1px). Very minor change but it enhances the balance between text and icon when the chevrons are used in elements such as Text Links.
  • Yellow icon color is one shade darker.

Misc

Features

Docs

Authors: 9

bolt -

Published by colbytcook about 3 years ago

Release Notes

Optimized Campaign Landing Page Mockups

Added the Optimized Campaign Landing Page docs pages From #2310

Teaser Component

Added new CTA to the Listing Teaser actions list on the bolt-teaser component and the best-of-content page. From #2312

Video Thumbnail Component

Added a title and chip prop From #2313

Page Footer

Refactored the Page Footer From #2278

Icon Element

New instructor icon added to From #2306

Visual Changes

Teaser Component

Action list is now aligned to the left. From #2303

Side Nav Component

Style and icon Updates From #2310

  • Top level links are now semibold.
  • Side Nav links and text will no longer hyphenate.
  • External Links now get a external icon

Button Element

Slightly increased the gap between button text and icon From #2314

Text Link Element

Slightly increased the gap between link text and icon From #2314

Mobile Header

In the global nav, top-level links are now black instead of dark navy when not selected. For example, on https://boltdesignsystem.com/pattern-lab/?p=components-page-header-example-main-site-with-subnav

Before:

After:

Misc

Features

Bug Fixes

Authors: 9

bolt -

Published by colbytcook about 3 years ago

Release Notes

Icon Component

This component is deprecated. From #2276

Bolt Logo Component

The Bolt Logo Component is deprecated, please use the image element. From #2293

Icon Element

Added the Icon Element. From #2276

Shape Element

Added the Shape Element. From #2276

Microjourneys

Removed Bolt-Button option from Micro Journey Editor. From #2294

Sass Variables

The indigo colour has been renamed to navy. From #2285
3 Sass variables are deprecated. From #2273

  • $bolt-transition-ease (replace with var(--bolt-transition-ease)),
  • $bolt-transition-timing (replace with var(--bolt-transition-timing))
  • $bolt-transition (replace with var(--bolt-transition))

Misc

Features

Authors: 9

bolt - https://github.com/boltdesignsystem/bolt/releases/tag/v4.2.3

Published by colbytcook about 3 years ago

Release Notes

From #2304

Changed the color of the main navigation links from black to blue

Visual changes

On mobile, the header navigation links will now display black instead of blue.

Misc

  • Turned the nav links to black on the mobile header #2304 (@bolt-bot)

Authors: 1

Package Rankings
Top 6.73% on Proxy.golang.org
Top 6.96% on Npmjs.org
Related Projects
material-web

Material Design Web Components

27 Mar 2018 9,239
webcomponents

Monorepo of webcomponents and associated microservice apis

25 Sep 2018 243
patternfly-elements

PatternFly Elements. A set of community-created web components based on PatternFly design.

04 Jan 2018 377
11ty-web-component-generator

Use the power of 11ty to generate web components (custom elements).

14 Oct 2020 55
component-template

Template for kicking off a new Web Component

08 Dec 2023 40
web-component-designer

A Designer for HTML Components or Pages in a WebComponent

22 Oct 2019 143
blueprintui

Accelerate your development with flexible UI components and tools that work everywhere.

13 Aug 2015 310
stencil-with-maximilian

Web Components & Stencil.js

26 Apr 2024 0
web_components

WebCraftery’s Web Components is a comprehensive collection of responsive, mobile-friendly web com...

10 Aug 2024 3
material-web-components-react

Material Web Components for React ⚛

25 Jun 2024 22
custom-elements

A list of my Custom Elements (Web Components) and some useful links with related material.

13 Apr 2022 7
m-

The modern web's design system.

04 Dec 2019 300
stencil-component-starter

Minimal starter project for building shareable web components with Stencil

15 Sep 2017 271
d3-web-components

Defines the ‹d3-force-graph› element, a force directed graph, that layouts HTML and SVG as nodes

25 Feb 2019 3
bulma-stenciljs

Stencil web component with Bulma CSS

23 Dec 2021 3