andbrandco/component-library

A library of barebones front-end components built with WordPress and accessibility in mind.

10up Component Library

A library of barebones front-end components built with WordPress and accessibility in mind.

Overview

At 10up, we strive to provide websites that yield a top-notch user experience. In order to improve both our efficiency and consistency, we need to standardize what we use and how we use it. Standardizing our approach to commonly-used front-end components allows us to understand better the inner workings of someone else’s project and produce better solutions for ourselves and our clients.

Each component in this library is built with simplicity and accessibility in mind, tailored to fit the often opinionated nature of WordPress core output. These components are intended to be easily adapted to any number of different projects and use cases.

All components are tested to be WCAG 2.1 Compliant.

Start browsing ☞

How to Use

To use a component, navigate to the component’s detail page to see demos, usage examples, and installation instructions.

Components

• Accordion
• Animate
• Countdown Timer
• Navigation
• Tabs
• Tooltip

Support Level

Active: 10up is actively working on this, and we expect to continue work for the foreseeable future including keeping tested up to the most recent version of WordPress. Bug reports, feature requests, questions, and pull requests are welcome.

Repository Structure and Engineering Guidelines

Visit the CONTRIBUTING page for initial contribution and engineering guidance.

This repository is broken into four parts. Within each part, there is an included README.md file that contains additinal pertinent engineering guidelines and instructions:

• packages: The UI components and scripts that are distributed as an NPM package, and test/demo pages for each component.

• test-utils: This is currently a work in progress.

• e2e: Testing suite for packages. Includes all package components for local testing.

• docs: The public facing documentation site. Includes codebase utilizng Jekyll to construct site. Pulls componets from latest release on npm.

Like what you see?