qb-animation-library
Advanced tools
The QuickBooks Animation Library is scalable, easy to use solution to add signature QuickBooks motion to your product, page, or feature.
The QuickBooks Animation Library is a solution to add QuickBooks motion to your product, page, or feature. Our motion is natural, guiding, and calm.
This is one approach to implementing and systematizing motion on the web. If you are an Intuit employee, refer to our design system for more detail on motion principles, motivation, and rationale.
qbal-trowserModal-enter) by updating the library_qbal-variables.scss defines timing, easing, and property values to animate
_qbal-keyframes.scss builds the CSS keyframes needed for specific animations
_qbal-animation-classes.scss defines the cores set of generic animations
_qbal-semantic-classes.scss defines semantic mappings for entrance and exit animations for specific components
The 4 above files can be included via _qbal-mixins.scss and then used as mixins, or developers can use the CSS classes generated from qb_animation_library.scss.
Download qb_animation_library.css
Link to it in your HTML
<link rel="stylesheet" href="path/to/qb_animation_library.css">
Start adding classes:
<div class="qbal-fade-enter"> ... </div>
Clone repository or download as ZIP
Copy /scss folder to your project
Import qbal mixins into your scss:
@import "qbal-mixins";
Start including mixins in your scss (mixin names are the same as the class names above):
.my-tooltip {
@include qbal-tooltip-enter;
}
This project is licensed under the MIT License - see the LICENSE.md file for details
Clone repository and install
git clone git@github.com:intuit/qb-animation-library.git
cd qb-animation-library/
npm install
To build CSS
npm run build
To build CSS when SCSS files change
npm run watch
To build CSS when SCSS files change & launch dev http server
npm run dev
Then open http://localhost:8080/ in your browser
v0.0.2 (Fri Jan 18 2019)
Notable changes to this project will be documented in this file.
The format is based on Keep a Changelog, and this project adheres to Semantic Versioning.
FAQs
The QuickBooks Animation Library is scalable, easy to use solution to add signature QuickBooks motion to your product, page, or feature.
The npm package qb-animation-library receives a total of 1 weekly downloads. As such, qb-animation-library popularity was classified as not popular.
We found that qb-animation-library demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
A malicious npm package disguised as a WhatsApp client is exploiting authentication flows with a remote kill switch to exfiltrate data and destroy files.
Security News
PyPI now supports digital attestations, enhancing security and trust by allowing package maintainers to verify the authenticity of Python packages.
Security News
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.