Get boba!
boba Version 1.7.2
  • Introduction
  • Installation
  • Customize
  • Compatibility
  • Changelog
  • Breakpoints
  • Colors
  • Typography
  • Containers
  • Grid
  • Navbar
  • Sections
  • Sidebar
  • Banners
  • Breadcrumbs
  • Cards
  • Collapsible
  • Messages
  • Notifications
  • Pagination
  • Tabs
  • Tables
  • Blockquotes
  • Buttons
  • Code
  • Counters
  • Descriptions
  • Dividers
  • Labels
  • Lists
  • Progress
  • Checkboxes
  • Inputs
  • Radios
  • Selects
  • Switches
  • Textareas
  • Animations
  • Background
  • Borders
  • Display
  • Flex
  • Images
  • Shadows
  • Shapes
  • Sizing
  • Spacing
  • Text

Overview

Learn how to build your website with boba!

Changelog

Find out what's new in the latest version of boba.
1.7.1
  • Improved alignment of switch handles.
  • Fixed bug with switch handles that caused their position to be incorrectly offset in Safari.
1.7.0
  • Added new switch form element.
  • Added new variable, keyboard input, and sample output semantic elements under the code section.
  • Added system default monospace fonts for all code-related tags (code, var, kbd, and samp) before falling back on the generic monospace.
  • Updated dependencies to support Babel 7.
1.6.1
  • Updated dependencies to support Node 10.
  • Fixed typo in documentation for adding custom fonts.
1.6.0
  • Renamed counter description class name from desc -> description.
  • Added new description list component.
  • Added new bullet styles to list component.
  • Added new hover classes for depth-based shadow utilities.
  • Added new soft shadow utilities with hover support.
  • Added new normal and italic typography helper classes.
  • Added styling to the semantic HTML section tag to match the existing section class.
  • Added missing documentation for the container and section classes.
  • Added websites to the showcase section on the main landing page.
  • Added scripts to automatically generate showcase website previews.
  • Updated base CSS normalization to set the default box-sizing to border-box.
  • Updated breakpoints page to be more clear.
  • Fixed spacing issue for images contained within cards.
  • Fixed documentation error for blockquote color classes.
1.5.1
  • Removed bottom margin on subheaders when they are the last-child.
  • Reworked padding between sidebar sticky-region and scroll-region.
1.5.0
  • Renamed boba-core -> boba-lite.
  • Renamed boba-lite -> boba.
  • Renamed boba -> boba-extended.
  • Added version overview to the homepage.
  • Added new shadow helpers classes to the utilities section.
  • Replaced box-shadow on cards with borders to improve design cohesiveness.
  • Deprecated blockquote author attribute in favour of footer and cite tags.
  • Updated blockquote documentation to include alignment class helpers.
  • Updated typography subheader classes to retain a line-height of 1 for better word-wrapping.
  • Updated feature comparison chart.
  • Updated background, border, and text utility pages to reflect version name changes.
  • Updated the color of color-black.
  • Reworked background tints to be more subtle.
  • Set the default color of all text to color-black.
1.4.0
  • Added new collapsible component that deprecates the old accordion and menu components.
  • Added new checkbox component for forms.
  • Added new radio component for forms.
  • Added support for color and date input types.
  • Added hover animations to buttons and styled collapsible headers for a more salient visual cue.
  • Added missing documentation for width and height utilities.
  • Added new accessibility mixins for more efficient code reuse.
  • Added margin-bottom to paragraph tags (excluding the last-child).
  • Renamed neutral colors into tint colors.
  • Improved accessibility of navbar and collapsible components.
  • Improved collapsible component to better support any type of contained content.
  • Improved scss structure of tab component for better maintainability.
  • Fixed bug with tab classes that caused them to have unintentional padding and gaps.
  • Fixed bug with colored tabs that prevented them from having rounded corners when active.
  • Fixed bug with full-width tables that prevented them from growing to be full-width.
  • Simplified spacing for most elements and components by converting to only using margin-bottom where possible.
  • Updated navbar documentation to include example of both left-aligned and right-aligned menu items in the same navbar.
  • Updated breadcrumb, button, navbar, and pagination documentation pages as well as the quick start template to prevent the page from jumping to the top when interacting with examples.
  • Adjusted breadcrumb styling to have more consistent spacing and behavior and removed unused styling properties.
  • Adjusted card padding when using the borderless footer class to maintain equal spacing between card sections.
  • Adjusted border classes to be more consistent with framework-wide sizing.
  • Adjusted padding and color of inline code class for better readability.
  • Switched default line-height from 1 to 1.5.
  • Switched to default dark background color behind light-colored examples on background, border, and text utility pages.
1.3.1
  • Added new neutral background colors based on boba's original palette.
  • Improved nesting support for accordion submenus.
  • Adjusted accordion padding to be more consistent.
1.3.0
  • Added a new blockquote element.
  • Applied boba's standard border-radius to the inline code class.
1.2.0
  • Rewrote menu component to be collapsible on click.
  • Improved support for nested menus.
1.1.13
  • Removed custom fonts from all versions of boba to improve page load times by eliminating external dependencies.
  • Updated boba's default font-family to use system UI fonts for maximum performance.
  • Added section to customize page detailing how to import custom fonts.
  • Improved text-wrapping and spacing for list elements.
1.1.12
  • Added correct border-radius when using card-image without card-header.
1.1.10
  • Changed widescreen starting width to 1280px.
  • Improved navbar component alignment.
1.1.7
  • Fixed error handling for sass, nunjucks, and scripts tasks.
  • Optimized nunjucks task to only reload the browser once all pages have finished compiling.
  • Updated package.json dependencies and removed unused dependencies.
1.1.6
  • Added :focus pseudo-class selectors to animation utilities.
  • Refined accordion styling and updated documentation.
  • Improved Sass logic to reduce unnecessary class generation.
  • Removed unused color constants.
  • Cleaned up various documentation pages.
1.1.3
  • Reworked messages and notifications to use RGB backgrounds instead of RGBA for increased consistency.
  • Added RGBA to RGB Sass function.
1.1.0
  • First public release!
1.0.0
  • Published on npm!
0.1.0
  • Component list finalized.
  • Gulp build process created.
  • Documentation started.
0.0.1
  • boba is born!