1.4.0 • Published 4 years ago
@quarksuite/components v1.4.0
Quarksuite (Components)
This repo contains and documents components for building Quarksuite GUIs. If you want to learn more about what this is and why it exists, please visit the core repo.
Installation
As a Module
You’ll want to grab the latest Node.js LTS (v12.15.0) version if you want to use the library as a module. I recommend installing Yarn as well.
npm install @quarksuite/components
# OR
yarn add @quarksuite/components
Then in your target file:
require('@quarksuite/components');
// OR if using Webpack/Parcel
import '@quarksuite/components';
In the Browser
Snowpack
npm install @quarksuite/components
# OR
yarn add @quarksuite/components
npx snowpack
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Quarksuite Components (v1.3.x) Example</title>
</head>
<body>
<script type="module" src="/index.js"></script>
</body>
</html>
import '/web_modules/@quarksuite/components.js';
Unpkg
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Quarksuite Components (v1.3.x) Example</title>
</head>
<body>
<script src="https://unpkg.com/@quarksuite/components@v1.4.0/dist-web/index.bundled.js"></script>
</body>
</html>
UI Samples
Below are some rough examples of how the core and components work together to create, display, and capture baseline data.
Color
Custom Palette
Basic Color Scheme
Color Variants
Content
System Font Stacks
Modular Scale
Proportion
Modular Scale
API
See the API documentation.