test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-01 19:38:16 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

feat: 补全 helper 文档里的属性列表 (#1228)

Browse Source
This commit is contained in:
吴多益 2020-12-22 14:58:36 +08:00 committed by GitHub
parent 7b07653068
commit e199ab04a5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
51 changed files with 2172 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

121
examples/components/CssDocs.tsx
View File

@ -52,7 +52,7 @@ export const cssDocs = [
path: '/style/layout/box-sizing',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/layout/_box-sizing.scss'],
['../../scss/helper/layout/_box-sizing.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -64,7 +64,7 @@ export const cssDocs = [
path: '/style/layout/display',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/layout/_display.scss'],
['../../scss/helper/layout/_display.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -76,7 +76,7 @@ export const cssDocs = [
path: '/style/layout/floats',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/layout/_float.scss'],
['../../scss/helper/layout/_float.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -88,7 +88,7 @@ export const cssDocs = [
path: '/style/layout/clear',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/layout/_clear.scss'],
['../../scss/helper/layout/_clear.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -100,7 +100,7 @@ export const cssDocs = [
path: '/style/layout/overflow',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/layout/_overflow.scss'],
['../../scss/helper/layout/_overflow.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -112,7 +112,7 @@ export const cssDocs = [
path: '/style/layout/position',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/layout/_position.scss'],
['../../scss/helper/layout/_position.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -124,7 +124,7 @@ export const cssDocs = [
path: '/style/layout/top-right-bottom-left',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/layout/_top-right-bottom-left.scss'],
['../../scss/helper/layout/_top-right-bottom-left.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -136,7 +136,7 @@ export const cssDocs = [
path: '/style/layout/visibility',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/layout/_visibility.scss'],
['../../scss/helper/layout/_visibility.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -148,7 +148,7 @@ export const cssDocs = [
path: '/style/layout/z-index',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/layout/_z-index.scss'],
['../../scss/helper/layout/_z-index.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -165,7 +165,7 @@ export const cssDocs = [
path: '/style/flexbox/direction',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/flex/_direction.scss'],
['../../scss/helper/flex/_direction.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -177,7 +177,7 @@ export const cssDocs = [
path: '/style/flexbox/wrap',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/flex/_wrap.scss'],
['../../scss/helper/flex/_wrap.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -189,7 +189,7 @@ export const cssDocs = [
path: '/style/flexbox/flex',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/flex/_flex.scss'],
['../../scss/helper/flex/_flex.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -201,7 +201,7 @@ export const cssDocs = [
path: '/style/flexbox/grow',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/flex/_grow.scss'],
['../../scss/helper/flex/_grow.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -213,7 +213,7 @@ export const cssDocs = [
path: '/style/flexbox/shrink',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/flex/_shrink.scss'],
['../../scss/helper/flex/_shrink.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -225,7 +225,7 @@ export const cssDocs = [
path: '/style/flexbox/order',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/flex/_order.scss'],
['../../scss/helper/flex/_order.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -242,7 +242,7 @@ export const cssDocs = [
path: '/style/grid/columns',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/grid/_columns.scss'],
['../../scss/helper/grid/_columns.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -253,7 +253,7 @@ export const cssDocs = [
path: '/style/grid/column-start-end',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/grid/_column-start-end.scss'],
['../../scss/helper/grid/_column-start-end.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -264,7 +264,7 @@ export const cssDocs = [
path: '/style/grid/rows',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/grid/_rows.scss'],
['../../scss/helper/grid/_rows.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -275,7 +275,7 @@ export const cssDocs = [
path: '/style/grid/row-start-end',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/grid/_row-start-end.scss'],
['../../scss/helper/grid/_row-start-end.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -286,7 +286,7 @@ export const cssDocs = [
path: '/style/grid/auto-flow',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/grid/_auto-flow.scss'],
['../../scss/helper/grid/_auto-flow.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -297,7 +297,7 @@ export const cssDocs = [
path: '/style/grid/auto-columns',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/grid/_auto-columns.scss'],
['../../scss/helper/grid/_auto-columns.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -308,7 +308,7 @@ export const cssDocs = [
path: '/style/grid/auto-rows',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/grid/_auto-rows.scss'],
['../../scss/helper/grid/_auto-rows.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -318,12 +318,9 @@ export const cssDocs = [
label: 'Gap',
path: '/style/grid/gap',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/grid/_gap.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
)
(require as any)(['../../scss/helper/grid/_gap.scss'], (doc: any) => {
cb(null, makeMarkdownRenderer(doc));
})
}
]
},
@ -335,7 +332,7 @@ export const cssDocs = [
path: '/style/box-alignment/justify-content',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/box-alignment/_justify-content.scss'],
['../../scss/helper/box-alignment/_justify-content.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -347,7 +344,7 @@ export const cssDocs = [
path: '/style/box-alignment/justify-items',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/box-alignment/_justify-items.scss'],
['../../scss/helper/box-alignment/_justify-items.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -359,7 +356,7 @@ export const cssDocs = [
path: '/style/box-alignment/justify-self',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/box-alignment/_justify-self.scss'],
['../../scss/helper/box-alignment/_justify-self.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -371,7 +368,7 @@ export const cssDocs = [
path: '/style/box-alignment/align-content',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/box-alignment/_align-content.scss'],
['../../scss/helper/box-alignment/_align-content.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -383,7 +380,7 @@ export const cssDocs = [
path: '/style/box-alignment/align-items',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/box-alignment/_align-items.scss'],
['../../scss/helper/box-alignment/_align-items.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -395,7 +392,7 @@ export const cssDocs = [
path: '/style/box-alignment/align-self',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/box-alignment/_align-self.scss'],
['../../scss/helper/box-alignment/_align-self.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -407,7 +404,7 @@ export const cssDocs = [
path: '/style/box-alignment/place-content',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/box-alignment/_place-content.scss'],
['../../scss/helper/box-alignment/_place-content.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -419,7 +416,7 @@ export const cssDocs = [
path: '/style/box-alignment/place-items',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/box-alignment/_place-items.scss'],
['../../scss/helper/box-alignment/_place-items.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -431,7 +428,7 @@ export const cssDocs = [
path: '/style/box-alignment/place-self',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/box-alignment/_place-self.scss'],
['../../scss/helper/box-alignment/_place-self.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -448,7 +445,7 @@ export const cssDocs = [
path: '/style/spacing/padding',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/spacing/_padding.scss'],
['../../scss/helper/spacing/_padding.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -460,7 +457,7 @@ export const cssDocs = [
path: '/style/spacing/margin',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/spacing/_margin.scss'],
['../../scss/helper/spacing/_margin.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -472,7 +469,7 @@ export const cssDocs = [
path: '/style/spacing/space-between',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/spacing/_space-between.scss'],
['../../scss/helper/spacing/_space-between.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -489,7 +486,7 @@ export const cssDocs = [
path: '/style/sizing/width',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/sizing/_width.scss'],
['../../scss/helper/sizing/_width.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -500,7 +497,7 @@ export const cssDocs = [
path: '/style/sizing/height',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/sizing/_height.scss'],
['../../scss/helper/sizing/_height.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -517,7 +514,7 @@ export const cssDocs = [
path: '/style/typography/font-size',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_font-size.scss'],
['../../scss/helper/typography/_font-size.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -529,7 +526,7 @@ export const cssDocs = [
path: '/style/typography/font-style',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_font-style.scss'],
['../../scss/helper/typography/_font-style.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -541,7 +538,7 @@ export const cssDocs = [
path: '/style/typography/font-weight',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_font-weight.scss'],
['../../scss/helper/typography/_font-weight.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -553,7 +550,7 @@ export const cssDocs = [
path: '/style/typography/letter-spacing',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_letter-spacing.scss'],
['../../scss/helper/typography/_letter-spacing.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -565,7 +562,7 @@ export const cssDocs = [
path: '/style/typography/line-height',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_line-height.scss'],
['../../scss/helper/typography/_line-height.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -577,7 +574,7 @@ export const cssDocs = [
path: '/style/typography/list-style-type',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_list-style-type.scss'],
['../../scss/helper/typography/_list-style-type.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -589,7 +586,7 @@ export const cssDocs = [
path: '/style/typography/text-align',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_text-align.scss'],
['../../scss/helper/typography/_text-align.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -601,7 +598,7 @@ export const cssDocs = [
path: '/style/typography/text-color',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_text-color.scss'],
['../../scss/helper/typography/_text-color.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -613,7 +610,7 @@ export const cssDocs = [
path: '/style/typography/text-decoration',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_text-decoration.scss'],
['../../scss/helper/typography/_text-decoration.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -625,7 +622,7 @@ export const cssDocs = [
path: '/style/typography/text-transform',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_text-transform.scss'],
['../../scss/helper/typography/_text-transform.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -637,7 +634,7 @@ export const cssDocs = [
path: '/style/typography/vertical-align',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_vertical-align.scss'],
['../../scss/helper/typography/_vertical-align.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -649,7 +646,7 @@ export const cssDocs = [
path: '/style/typography/whitespace',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_whitespace.scss'],
['../../scss/helper/typography/_whitespace.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -661,7 +658,7 @@ export const cssDocs = [
path: '/style/typography/word-break',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/typography/_word-break.scss'],
['../../scss/helper/typography/_word-break.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -678,7 +675,7 @@ export const cssDocs = [
path: '/style/background/background-color',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/background/_background-color.scss'],
['../../scss/helper/background/_background-color.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -695,7 +692,7 @@ export const cssDocs = [
path: '/style/border/border-radius',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/border/_border-radius.scss'],
['../../scss/helper/border/_border-radius.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -707,7 +704,7 @@ export const cssDocs = [
path: '/style/border/border-width',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/border/_border-width.scss'],
['../../scss/helper/border/_border-width.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -719,7 +716,7 @@ export const cssDocs = [
path: '/style/border/border-color',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/border/_border-color.scss'],
['../../scss/helper/border/_border-color.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -731,7 +728,7 @@ export const cssDocs = [
path: '/style/border/border-style',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/border/_border-style.scss'],
['../../scss/helper/border/_border-style.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -748,7 +745,7 @@ export const cssDocs = [
path: '/style/effect/box-shadow',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/effect/_box-shadow.scss'],
['../../scss/helper/effect/_box-shadow.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}
@ -760,7 +757,7 @@ export const cssDocs = [
path: '/style/effect/opacity',
getComponent: (location: any, cb: any) =>
(require as any)(
['../../scss/utilities/effect/_opacity.scss'],
['../../scss/helper/effect/_opacity.scss'],
(doc: any) => {
cb(null, makeMarkdownRenderer(doc));
}

42
scripts/generate-helper-table.js Normal file
View File

@ -0,0 +1,42 @@
/**
* @file 用于生成 helper 文档中的 class 列表，需要在 scss 目录下运行。
* 比如 node ../scripts/generate-helper-table.js helper/border/_border-style.scss
*/
const scssFile = process.argv[2];
const fs = require('fs');
const css = require('css');
const execSync = require('child_process').execSync;
fs.writeSync(
fs.openSync('./tmp.scss', 'w'),
`
@import './functions';
@import './variables';
@import './mixins';
@import '${scssFile}';
`
);
let generateCSS = execSync(`../node_modules/.bin/sass tmp.scss`).toString();
generateCSS = generateCSS.replace(/\/\*\!markdown[\s\S]*?\*\//g, '');
let parseCSS = css.parse(generateCSS);
console.log(`| Class | Properties |
| ----------- | ------------------------ |`);
for (let rule of parseCSS.stylesheet.rules) {
if (rule.type === 'rule') {
let className = rule.selectors[0].replace('.', '');
let declarations = rule.declarations
.map(declaration => {
return `${declaration.property}: ${declaration.value}`;
})
.join('; ');
console.log(`| ${className} | ${declarations} |`);
}
}
fs.unlinkSync('./tmp.scss');

126
scss/helper/background/_background-color.scss
View File

@ -4,8 +4,132 @@
title: 背景色
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| bg-transparent | background: transparent |
| bg-none | background: none !important |
| bg-transparent | background: transparent |
| bg-current | background: currentColor |
| bg-black | background: #000 |
| bg-white | background: #fff |
| bg-primary | background: #007bff |
| bg-secondary | background: #6c757d |
| bg-success | background: #28a745 |
| bg-info | background: #17a2b8 |
| bg-warning | background: #28a745 |
| bg-danger | background: #dc3545 |
| bg-light | background: #f8f9fa |
| bg-dark | background: #343a40 |
| bg-gray-transparent | background: transparent |
| bg-gray-current | background: currentColor |
| bg-gray-50 | background: #f9fafb |
| bg-gray-100 | background: #f3f4f6 |
| bg-gray-200 | background: #e5e7eb |
| bg-gray-300 | background: #d1d5db |
| bg-gray-400 | background: #9ca3af |
| bg-gray-500 | background: #6b7280 |
| bg-gray-600 | background: #4b5563 |
| bg-gray-700 | background: #374151 |
| bg-gray-800 | background: #1f2937 |
| bg-gray-900 | background: #111827 |
| bg-red-transparent | background: transparent |
| bg-red-current | background: currentColor |
| bg-red-50 | background: #fef2f2 |
| bg-red-100 | background: #fee2e2 |
| bg-red-200 | background: #fecaca |
| bg-red-300 | background: #fca5a5 |
| bg-red-400 | background: #f87171 |
| bg-red-500 | background: #ef4444 |
| bg-red-600 | background: #dc2626 |
| bg-red-700 | background: #b91c1c |
| bg-red-800 | background: #991b1b |
| bg-red-900 | background: #7f1d1d |
| bg-yellow-transparent | background: transparent |
| bg-yellow-current | background: currentColor |
| bg-yellow-50 | background: #fffbeb |
| bg-yellow-100 | background: #fef3c7 |
| bg-yellow-200 | background: #fde68a |
| bg-yellow-300 | background: #fcd34d |
| bg-yellow-400 | background: #fbbf24 |
| bg-yellow-500 | background: #f59e0b |
| bg-yellow-600 | background: #d97706 |
| bg-yellow-700 | background: #b45309 |
| bg-yellow-800 | background: #92400e |
| bg-yellow-900 | background: #78350f |
| bg-green-transparent | background: transparent |
| bg-green-current | background: currentColor |
| bg-green-50 | background: #ecfdf5 |
| bg-green-100 | background: #d1fae5 |
| bg-green-200 | background: #a7f3d0 |
| bg-green-300 | background: #6ee7b7 |
| bg-green-400 | background: #34d399 |
| bg-green-500 | background: #10b981 |
| bg-green-600 | background: #059669 |
| bg-green-700 | background: #047857 |
| bg-green-800 | background: #065f46 |
| bg-green-900 | background: #064e3b |
| bg-blue-transparent | background: transparent |
| bg-blue-current | background: currentColor |
| bg-blue-50 | background: #eff6ff |
| bg-blue-100 | background: #dbeafe |
| bg-blue-200 | background: #bfdbfe |
| bg-blue-300 | background: #93c5fd |
| bg-blue-400 | background: #60a5fa |
| bg-blue-500 | background: #3b82f6 |
| bg-blue-600 | background: #2563eb |
| bg-blue-700 | background: #1d4ed8 |
| bg-blue-800 | background: #1e40af |
| bg-blue-900 | background: #1e3a8a |
| bg-cyan-transparent | background: transparent |
| bg-cyan-current | background: currentColor |
| bg-cyan-50 | background: #ecfeff |
| bg-cyan-100 | background: #cffafe |
| bg-cyan-200 | background: #a5f3fc |
| bg-cyan-300 | background: #67e8f9 |
| bg-cyan-400 | background: #22d3ee |
| bg-cyan-500 | background: #06b6d4 |
| bg-cyan-600 | background: #0891b2 |
| bg-cyan-700 | background: #0e7490 |
| bg-cyan-800 | background: #155e75 |
| bg-cyan-900 | background: #164e63 |
| bg-indigo-transparent | background: transparent |
| bg-indigo-current | background: currentColor |
| bg-indigo-50 | background: #eef2ff |
| bg-indigo-100 | background: #e0e7ff |
| bg-indigo-200 | background: #c7d2fe |
| bg-indigo-300 | background: #a5b4fc |
| bg-indigo-400 | background: #818cf8 |
| bg-indigo-500 | background: #6366f1 |
| bg-indigo-600 | background: #4f46e5 |
| bg-indigo-700 | background: #4338ca |
| bg-indigo-800 | background: #3730a3 |
| bg-indigo-900 | background: #312e81 |
| bg-purple-transparent | background: transparent |
| bg-purple-current | background: currentColor |
| bg-purple-50 | background: #f5f3ff |
| bg-purple-100 | background: #ede9fe |
| bg-purple-200 | background: #ddd6fe |
| bg-purple-300 | background: #c4b5fd |
| bg-purple-400 | background: #a78bfa |
| bg-purple-500 | background: #8b5cf6 |
| bg-purple-600 | background: #7c3aed |
| bg-purple-700 | background: #6d28d9 |
| bg-purple-800 | background: #5b21b6 |
| bg-purple-900 | background: #4c1d95 |
| bg-pink-transparent | background: transparent |
| bg-pink-current | background: currentColor |
| bg-pink-50 | background: #fdf2f8 |
| bg-pink-100 | background: #fce7f3 |
| bg-pink-200 | background: #fbcfe8 |
| bg-pink-300 | background: #f9a8d4 |
| bg-pink-400 | background: #f472b6 |
| bg-pink-500 | background: #ec4899 |
| bg-pink-600 | background: #db2777 |
| bg-pink-700 | background: #be185d |
| bg-pink-800 | background: #9d174d |
| bg-pink-900 | background: #831843 |
还有 hover、active、focus、disabled 扩展，比如 `hover:bg-black`
*/

105
scss/helper/border/_border-color.scss
View File

@ -4,9 +4,112 @@
title: 边框颜色
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| border-black | border-color: #000 |
| border-white | border-color: #fff |
| border-primary | border-color: #007bff |
| border-secondary | border-color: #6c757d |
| border-success | border-color: #28a745 |
| border-info | border-color: #17a2b8 |
| border-warning | border-color: #28a745 |
| border-danger | border-color: #dc3545 |
| border-light | border-color: #f8f9fa |
| border-dark | border-color: #343a40 |
| border-gray-50 | border-color: #f9fafb |
| border-gray-100 | border-color: #f3f4f6 |
| border-gray-200 | border-color: #e5e7eb |
| border-gray-300 | border-color: #d1d5db |
| border-gray-400 | border-color: #9ca3af |
| border-gray-500 | border-color: #6b7280 |
| border-gray-600 | border-color: #4b5563 |
| border-gray-700 | border-color: #374151 |
| border-gray-800 | border-color: #1f2937 |
| border-gray-900 | border-color: #111827 |
| border-red-50 | border-color: #fef2f2 |
| border-red-100 | border-color: #fee2e2 |
| border-red-200 | border-color: #fecaca |
| border-red-300 | border-color: #fca5a5 |
| border-red-400 | border-color: #f87171 |
| border-red-500 | border-color: #ef4444 |
| border-red-600 | border-color: #dc2626 |
| border-red-700 | border-color: #b91c1c |
| border-red-800 | border-color: #991b1b |
| border-red-900 | border-color: #7f1d1d |
| border-yellow-50 | border-color: #fffbeb |
| border-yellow-100 | border-color: #fef3c7 |
| border-yellow-200 | border-color: #fde68a |
| border-yellow-300 | border-color: #fcd34d |
| border-yellow-400 | border-color: #fbbf24 |
| border-yellow-500 | border-color: #f59e0b |
| border-yellow-600 | border-color: #d97706 |
| border-yellow-700 | border-color: #b45309 |
| border-yellow-800 | border-color: #92400e |
| border-yellow-900 | border-color: #78350f |
| border-green-50 | border-color: #ecfdf5 |
| border-green-100 | border-color: #d1fae5 |
| border-green-200 | border-color: #a7f3d0 |
| border-green-300 | border-color: #6ee7b7 |
| border-green-400 | border-color: #34d399 |
| border-green-500 | border-color: #10b981 |
| border-green-600 | border-color: #059669 |
| border-green-700 | border-color: #047857 |
| border-green-800 | border-color: #065f46 |
| border-green-900 | border-color: #064e3b |
| border-blue-50 | border-color: #eff6ff |
| border-blue-100 | border-color: #dbeafe |
| border-blue-200 | border-color: #bfdbfe |
| border-blue-300 | border-color: #93c5fd |
| border-blue-400 | border-color: #60a5fa |
| border-blue-500 | border-color: #3b82f6 |
| border-blue-600 | border-color: #2563eb |
| border-blue-700 | border-color: #1d4ed8 |
| border-blue-800 | border-color: #1e40af |
| border-blue-900 | border-color: #1e3a8a |
| border-cyan-50 | border-color: #ecfeff |
| border-cyan-100 | border-color: #cffafe |
| border-cyan-200 | border-color: #a5f3fc |
| border-cyan-300 | border-color: #67e8f9 |
| border-cyan-400 | border-color: #22d3ee |
| border-cyan-500 | border-color: #06b6d4 |
| border-cyan-600 | border-color: #0891b2 |
| border-cyan-700 | border-color: #0e7490 |
| border-cyan-800 | border-color: #155e75 |
| border-cyan-900 | border-color: #164e63 |
| border-indigo-50 | border-color: #eef2ff |
| border-indigo-100 | border-color: #e0e7ff |
| border-indigo-200 | border-color: #c7d2fe |
| border-indigo-300 | border-color: #a5b4fc |
| border-indigo-400 | border-color: #818cf8 |
| border-indigo-500 | border-color: #6366f1 |
| border-indigo-600 | border-color: #4f46e5 |
| border-indigo-700 | border-color: #4338ca |
| border-indigo-800 | border-color: #3730a3 |
| border-indigo-900 | border-color: #312e81 |
| border-purple-50 | border-color: #f5f3ff |
| border-purple-100 | border-color: #ede9fe |
| border-purple-200 | border-color: #ddd6fe |
| border-purple-300 | border-color: #c4b5fd |
| border-purple-400 | border-color: #a78bfa |
| border-purple-500 | border-color: #8b5cf6 |
| border-purple-600 | border-color: #7c3aed |
| border-purple-700 | border-color: #6d28d9 |
| border-purple-800 | border-color: #5b21b6 |
| border-purple-900 | border-color: #4c1d95 |
| border-pink-50 | border-color: #fdf2f8 |
| border-pink-100 | border-color: #fce7f3 |
| border-pink-200 | border-color: #fbcfe8 |
| border-pink-300 | border-color: #f9a8d4 |
| border-pink-400 | border-color: #f472b6 |
| border-pink-500 | border-color: #ec4899 |
| border-pink-600 | border-color: #db2777 |
| border-pink-700 | border-color: #be185d |
| border-pink-800 | border-color: #9d174d |
| border-pink-900 | border-color: #831843 |
还有 hover、active、focus、disabled 扩展，比如 `hover:border-black`
*/
@mixin border-colors-map(

85
scss/helper/border/_border-radius.scss
View File

@ -3,8 +3,89 @@
---
title: 边框圆角
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| rounded-none | border-radius: 0px |
| rounded-sm | border-radius: 0.125rem |
| rounded | border-radius: 0.25rem |
| rounded-md | border-radius: 0.375rem |
| rounded-lg | border-radius: 0.5rem |
| rounded-xl | border-radius: 0.75rem |
| rounded-2xl | border-radius: 1rem |
| rounded-3xl | border-radius: 1.5rem |
| rounded-full | border-radius: 9999px |
| rounded-t-none | border-top-left-radius: 0px; border-top-right-radius: 0px |
| rounded-t-sm | border-top-left-radius: 0.125rem; border-top-right-radius: 0.125rem |
| rounded-t | border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem |
| rounded-t-md | border-top-left-radius: 0.375rem; border-top-right-radius: 0.375rem |
| rounded-t-lg | border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem |
| rounded-t-xl | border-top-left-radius: 0.75rem; border-top-right-radius: 0.75rem |
| rounded-t-2xl | border-top-left-radius: 1rem; border-top-right-radius: 1rem |
| rounded-t-3xl | border-top-left-radius: 1.5rem; border-top-right-radius: 1.5rem |
| rounded-t-full | border-top-left-radius: 9999px; border-top-right-radius: 9999px |
| rounded-r-none | border-top-right-radius: 0px; border-bottom-right-radius: 0px |
| rounded-r-sm | border-top-right-radius: 0.125rem; border-bottom-right-radius: 0.125rem |
| rounded-r | border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem |
| rounded-r-md | border-top-right-radius: 0.375rem; border-bottom-right-radius: 0.375rem |
| rounded-r-lg | border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem |
| rounded-r-xl | border-top-right-radius: 0.75rem; border-bottom-right-radius: 0.75rem |
| rounded-r-2xl | border-top-right-radius: 1rem; border-bottom-right-radius: 1rem |
| rounded-r-3xl | border-top-right-radius: 1.5rem; border-bottom-right-radius: 1.5rem |
| rounded-r-full | border-top-right-radius: 9999px; border-bottom-right-radius: 9999px |
| rounded-b-none | border-bottom-right-radius: 0px; border-bottom-left-radius: 0px |
| rounded-b-sm | border-bottom-right-radius: 0.125rem; border-bottom-left-radius: 0.125rem |
| rounded-b | border-bottom-right-radius: 0.25rem; border-bottom-left-radius: 0.25rem |
| rounded-b-md | border-bottom-right-radius: 0.375rem; border-bottom-left-radius: 0.375rem |
| rounded-b-lg | border-bottom-right-radius: 0.5rem; border-bottom-left-radius: 0.5rem |
| rounded-b-xl | border-bottom-right-radius: 0.75rem; border-bottom-left-radius: 0.75rem |
| rounded-b-2xl | border-bottom-right-radius: 1rem; border-bottom-left-radius: 1rem |
| rounded-b-3xl | border-bottom-right-radius: 1.5rem; border-bottom-left-radius: 1.5rem |
| rounded-b-full | border-bottom-right-radius: 9999px; border-bottom-left-radius: 9999px |
| rounded-l-none | border-top-left-radius: 0px; border-bottom-left-radius: 0px |
| rounded-l-sm | border-top-left-radius: 0.125rem; border-bottom-left-radius: 0.125rem |
| rounded-l | border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem |
| rounded-l-md | border-top-left-radius: 0.375rem; border-bottom-left-radius: 0.375rem |
| rounded-l-lg | border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem |
| rounded-l-xl | border-top-left-radius: 0.75rem; border-bottom-left-radius: 0.75rem |
| rounded-l-2xl | border-top-left-radius: 1rem; border-bottom-left-radius: 1rem |
| rounded-l-3xl | border-top-left-radius: 1.5rem; border-bottom-left-radius: 1.5rem |
| rounded-l-full | border-top-left-radius: 9999px; border-bottom-left-radius: 9999px |
| rounded-tl-none | border-top-left-radius: 0px |
| rounded-tr-none | border-top-right-radius: 0px |
| rounded-br-none | border-bottom-right-radius: 0px |
| rounded-bl-none | border-bottom-left-radius: 0px |
| rounded-tl-sm | border-top-left-radius: 0.125rem |
| rounded-tr-sm | border-top-right-radius: 0.125rem |
| rounded-br-sm | border-bottom-right-radius: 0.125rem |
| rounded-bl-sm | border-bottom-left-radius: 0.125rem |
| rounded-tl | border-top-left-radius: 0.25rem |
| rounded-tr | border-top-right-radius: 0.25rem |
| rounded-br | border-bottom-right-radius: 0.25rem |
| rounded-bl | border-bottom-left-radius: 0.25rem |
| rounded-tl-md | border-top-left-radius: 0.375rem |
| rounded-tr-md | border-top-right-radius: 0.375rem |
| rounded-br-md | border-bottom-right-radius: 0.375rem |
| rounded-bl-md | border-bottom-left-radius: 0.375rem |
| rounded-tl-lg | border-top-left-radius: 0.5rem |
| rounded-tr-lg | border-top-right-radius: 0.5rem |
| rounded-br-lg | border-bottom-right-radius: 0.5rem |
| rounded-bl-lg | border-bottom-left-radius: 0.5rem |
| rounded-tl-xl | border-top-left-radius: 0.75rem |
| rounded-tr-xl | border-top-right-radius: 0.75rem |
| rounded-br-xl | border-bottom-right-radius: 0.75rem |
| rounded-bl-xl | border-bottom-left-radius: 0.75rem |
| rounded-tl-2xl | border-top-left-radius: 1rem |
| rounded-tr-2xl | border-top-right-radius: 1rem |
| rounded-br-2xl | border-bottom-right-radius: 1rem |
| rounded-bl-2xl | border-bottom-left-radius: 1rem |
| rounded-tl-3xl | border-top-left-radius: 1.5rem |
| rounded-tr-3xl | border-top-right-radius: 1.5rem |
| rounded-br-3xl | border-bottom-right-radius: 1.5rem |
| rounded-bl-3xl | border-bottom-left-radius: 1.5rem |
| rounded-tl-full | border-top-left-radius: 9999px |
| rounded-tr-full | border-top-right-radius: 9999px |
| rounded-br-full | border-bottom-right-radius: 9999px |
| rounded-bl-full | border-bottom-left-radius: 9999px |
*/

8
scss/helper/border/_border-style.scss
View File

@ -4,7 +4,13 @@
title: 边框样式
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| border-solid | border-style: solid |
| border-dashed | border-style: dashed |
| border-dotted | border-style: dotted |
| border-double | border-style: double |
| border-none | border-style: none |
*/

28
scss/helper/border/_border-width.scss
View File

@ -4,7 +4,33 @@
title: 边框宽度
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| border | border-width: 1px |
| border-0 | border-width: 0px |
| border-2 | border-width: 2px |
| border-4 | border-width: 4px |
| border-8 | border-width: 8px |
| border-t | border-top-width: 1px |
| border-r | border-right-width: 1px |
| border-b | border-bottom-width: 1px |
| border-l | border-left-width: 1px |
| border-t-0 | border-top-width: 0px |
| border-r-0 | border-right-width: 0px |
| border-b-0 | border-bottom-width: 0px |
| border-l-0 | border-left-width: 0px |
| border-t-2 | border-top-width: 2px |
| border-r-2 | border-right-width: 2px |
| border-b-2 | border-bottom-width: 2px |
| border-l-2 | border-left-width: 2px |
| border-t-4 | border-top-width: 4px |
| border-r-4 | border-right-width: 4px |
| border-b-4 | border-bottom-width: 4px |
| border-l-4 | border-left-width: 4px |
| border-t-8 | border-top-width: 8px |
| border-r-8 | border-right-width: 8px |
| border-b-8 | border-bottom-width: 8px |
| border-l-8 | border-left-width: 8px |
*/

9
scss/helper/box-alignment/_align-content.scss
View File

@ -4,7 +4,14 @@
title: Align Content
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| content-center | align-content: center |
| content-start | align-content: flex-start |
| content-end | align-content: flex-end |
| content-between | align-content: space-between |
| content-around | align-content: space-around |
| content-evenly | align-content: space-evenly |
*/

8
scss/helper/box-alignment/_align-items.scss
View File

@ -4,7 +4,13 @@
title: Align Items
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| items-start | align-items: flex-start |
| items-end | align-items: flex-end |
| items-center | align-items: center |
| items-baseline | align-items: baseline |
| items-stretch | align-items: stretch |
*/

9
scss/helper/box-alignment/_align-self.scss
View File

@ -4,8 +4,13 @@
title: Align Self
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| self-auto | align-self: auto |
| self-start | align-self: flex-start |
| self-end | align-self: flex-end |
| self-center | align-self: center |
| self-stretch | align-self: stretch |
*/

9
scss/helper/box-alignment/_justify-content.scss
View File

@ -4,7 +4,14 @@
title: Jsutify Content
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| justify-start | justify-content: flex-start |
| justify-end | justify-content: flex-end |
| justify-center | justify-content: center |
| justify-between | justify-content: space-between |
| justify-around | justify-content: space-around |
| justify-evenly | justify-content: space-evenly |
*/

8
scss/helper/box-alignment/_justify-items.scss
View File

@ -4,7 +4,13 @@
title: Justify Items
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| justify-items-auto | justify-items: auto |
| justify-items-start | justify-items: start |
| justify-items-end | justify-items: end |
| justify-items-center | justify-items: center |
| justify-items-stretch | justify-items: stretch |
*/

8
scss/helper/box-alignment/_justify-self.scss
View File

@ -4,7 +4,13 @@
title: Jsutify Self
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| justify-self-auto | justify-self: auto |
| justify-self-start | justify-self: start |
| justify-self-end | justify-self: end |
| justify-self-center | justify-self: center |
| justify-self-stretch | justify-self: stretch |
*/

10
scss/helper/box-alignment/_place-content.scss
View File

@ -4,7 +4,15 @@
title: Place Content
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| place-content-center | place-content: center |
| place-content-start | place-content: start |
| place-content-end | place-content: end |
| place-content-between | place-content: space-between |
| place-content-around | place-content: space-around |
| place-content-evenly | place-content: space-evenly |
| place-content-stretch | place-content: stretch |
*/

8
scss/helper/box-alignment/_place-items.scss
View File

@ -4,7 +4,13 @@
title: Place Items
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| place-items-auto | place-items: auto |
| place-items-start | place-items: start |
| place-items-end | place-items: end |
| place-items-center | place-items: center |
| place-items-stretch | place-items: stretch |
*/

8
scss/helper/box-alignment/_place-self.scss
View File

@ -4,7 +4,13 @@
title: Place Self
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| place-self-auto | place-self: auto |
| place-self-start | place-self: start |
| place-self-end | place-self: end |
| place-self-center | place-self: center |
| place-self-stretch | place-self: stretch |
*/

12
scss/helper/effect/_box-shadow.scss
View File

@ -4,8 +4,18 @@
title: Box Shadow
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| shadow-sm | box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) |
| shadow | box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) |
| shadow-md | box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) |
| shadow-lg | box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) |
| shadow-xl | box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1) , 0 10px 10px -5px rgba(0, 0, 0, 0.04) |
| shadow-2xl | box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) |
| shadow-inner | box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06) |
| shadow-none | box-shadow: none |
还有 hover、active、focus 扩展，比如 `hover:shadow-sm`
*/

18
scss/helper/effect/_opacity.scss
View File

@ -4,7 +4,23 @@
title: Opacity
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| opacity-0 | opacity: 0 |
| opacity-5 | opacity: 0.05 |
| opacity-10 | opacity: 0.1 |
| opacity-20 | opacity: 0.2 |
| opacity-25 | opacity: 0.25 |
| opacity-30 | opacity: 0.3 |
| opacity-40 | opacity: 0.4 |
| opacity-50 | opacity: 0.5 |
| opacity-60 | opacity: 0.6 |
| opacity-70 | opacity: 0.7 |
| opacity-75 | opacity: 0.75 |
| opacity-80 | opacity: 0.8 |
| opacity-90 | opacity: 0.9 |
| opacity-95 | opacity: 0.95 |
| opacity-100 | opacity: 1 |
*/

7
scss/helper/flex/_direction.scss
View File

@ -4,7 +4,12 @@
title: Flex Direction
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| flex-row | flex-direction: row |
| flex-row-reverse | flex-direction: row-reverse |
| flex-col | flex-direction: column |
| flex-col-reverse | flex-direction: column-reverse |
*/

7
scss/helper/flex/_flex.scss
View File

@ -4,7 +4,12 @@
title: Flex
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| flex-1 | flex: 1 1 0% |
| flex-auto | flex: 1 1 auto |
| flex-initial | flex: 0 1 auto |
| flex-none | flex: none |
*/

5
scss/helper/flex/_grow.scss
View File

@ -4,7 +4,10 @@
title: Flex Grow
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| flex-grow-0 | flex-grow: 0 |
| flex-grow | flex-grow: 1 |
*/

18
scss/helper/flex/_order.scss
View File

@ -4,8 +4,22 @@
title: Flex Order
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| order-1 | order: 1 |
| order-2 | order: 2 |
| order-3 | order: 3 |
| order-4 | order: 4 |
| order-5 | order: 5 |
| order-6 | order: 6 |
| order-7 | order: 7 |
| order-8 | order: 8 |
| order-9 | order: 9 |
| order-10 | order: 10 |
| order-11 | order: 11 |
| order-12 | order: 12 |
| order-first | order: -9999 |
| order-last | order: 9999 |
*/
@mixin make-flex-order($prefix: '.') {

6
scss/helper/flex/_shrink.scss
View File

@ -4,8 +4,10 @@
title: Flex Shrink
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| flex-shrink-0 | flex-shrink: 0 |
| flex-shrink | flex-shrink: 1 |
*/
@mixin make-flex-shrink($prefix: '.') {

6
scss/helper/flex/_wrap.scss
View File

@ -4,7 +4,11 @@
title: Flex Wrap
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| flex-wrap | flex-wrap: wrap |
| flex-wrap-reverse | flex-wrap: wrap-reverse |
| flex-nowrap | flex-wrap: nowrap |
*/

7
scss/helper/grid/_auto-columns.scss
View File

@ -4,7 +4,12 @@
title: Grid Auto Columns
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| auto-cols-auto | grid-auto-columns: auto |
| auto-cols-min | grid-auto-columns: min-content |
| auto-cols-max | grid-auto-columns: max-content |
| auto-cols-fr | grid-auto-columns: minmax(0, 1fr) |
*/

7
scss/helper/grid/_auto-flow.scss
View File

@ -4,7 +4,12 @@
title: Grid Auto Flow
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| grid-flow-row | grid-auto-flow: row |
| grid-flow-col | grid-auto-flow: column |
| grid-flow-row-dense | grid-auto-flow: row dense |
| grid-flow-col-dense | grid-auto-flow: column dense |
*/

7
scss/helper/grid/_auto-rows.scss
View File

@ -4,7 +4,12 @@
title: Grid Auto Flow
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| auto-rows-auto | grid-auto-rows: auto |
| auto-rows-min | grid-auto-rows: min-content |
| auto-rows-max | grid-auto-rows: max-content |
| auto-rows-fr | grid-auto-rows: minmax(0, 1fr) |
*/

45
scss/helper/grid/_column-start-end.scss
View File

@ -4,7 +4,50 @@
title: Grid Row Start / End
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| col-auto | grid-column: auto |
| col-span-1 | grid-column: span 1/span 1 |
| col-span-2 | grid-column: span 2/span 2 |
| col-span-3 | grid-column: span 3/span 3 |
| col-span-4 | grid-column: span 4/span 4 |
| col-span-5 | grid-column: span 5/span 5 |
| col-span-6 | grid-column: span 6/span 6 |
| col-span-7 | grid-column: span 7/span 7 |
| col-span-8 | grid-column: span 8/span 8 |
| col-span-9 | grid-column: span 9/span 9 |
| col-span-10 | grid-column: span 10/span 10 |
| col-span-11 | grid-column: span 11/span 1 |
| col-span-12 | grid-column: span 12/span 12 |
| col-span-full | grid-column: 1/-1 |
| col-start-1 | grid-column-start: 1 |
| col-start-2 | grid-column-start: 2 |
| col-start-3 | grid-column-start: 3 |
| col-start-4 | grid-column-start: 4 |
| col-start-5 | grid-column-start: 5 |
| col-start-6 | grid-column-start: 6 |
| col-start-7 | grid-column-start: 7 |
| col-start-8 | grid-column-start: 8 |
| col-start-9 | grid-column-start: 9 |
| col-start-10 | grid-column-start: 10 |
| col-start-11 | grid-column-start: 11 |
| col-start-12 | grid-column-start: 12 |
| col-start-13 | grid-column-start: 13 |
| col-start-auto | grid-column-start: auto |
| col-end-1 | grid-column-end: 1 |
| col-end-2 | grid-column-end: 2 |
| col-end-3 | grid-column-end: 3 |
| col-end-4 | grid-column-end: 4 |
| col-end-5 | grid-column-end: 5 |
| col-end-6 | grid-column-end: 6 |
| col-end-7 | grid-column-end: 7 |
| col-end-8 | grid-column-end: 8 |
| col-end-9 | grid-column-end: 9 |
| col-end-10 | grid-column-end: 10 |
| col-end-11 | grid-column-end: 11 |
| col-end-12 | grid-column-end: 12 |
| col-end-13 | grid-column-end: 13 |
| col-end-auto | grid-column-end: auto |
*/

16
scss/helper/grid/_columns.scss
View File

@ -4,7 +4,21 @@
title: Grid Template Columns
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| grid-cols-1 | grid-template-columns: repeat(1, minmax(0, 1fr)) |
| grid-cols-2 | grid-template-columns: repeat(2, minmax(0, 1fr)) |
| grid-cols-3 | grid-template-columns: repeat(3, minmax(0, 1fr)) |
| grid-cols-4 | grid-template-columns: repeat(4, minmax(0, 1fr)) |
| grid-cols-5 | grid-template-columns: repeat(5, minmax(0, 1fr)) |
| grid-cols-6 | grid-template-columns: repeat(6, minmax(0, 1fr)) |
| grid-cols-7 | grid-template-columns: repeat(6, minmax(0, 1fr)) |
| grid-cols-8 | grid-template-columns: repeat(8, minmax(0, 1fr)) |
| grid-cols-9 | grid-template-columns: repeat(9, minmax(0, 1fr)) |
| grid-cols-10 | grid-template-columns: repeat(10, minmax(0, 1fr)) |
| grid-cols-11 | grid-template-columns: repeat(11, minmax(0, 1fr)) |
| grid-cols-12 | grid-template-columns: repeat(12, minmax(0, 1fr)) |
| grid-cols-none | grid-template-columns: none |
*/

114
scss/helper/grid/_gap.scss
View File

@ -4,7 +4,119 @@
title: Gap
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| gap-px | gap: 0.0625rem |
| gap-x-px | column-gap: 0.0625rem |
| gap-y-px | row-gap: 0.0625rem |
| gap-0 | gap: 0 |
| gap-x-0 | column-gap: 0 |
| gap-y-0 | row-gap: 0 |
| gap-none | gap: 0 |
| gap-x-none | column-gap: 0 |
| gap-y-none | row-gap: 0 |
| gap-0\.5 | gap: 0.125rem |
| gap-x-0\.5 | column-gap: 0.125rem |
| gap-y-0\.5 | row-gap: 0.125rem |
| gap-1 | gap: 0.25rem |
| gap-x-1 | column-gap: 0.25rem |
| gap-y-1 | row-gap: 0.25rem |
| gap-1\.5 | gap: 0.375rem |
| gap-x-1\.5 | column-gap: 0.375rem |
| gap-y-1\.5 | row-gap: 0.375rem |
| gap-2 | gap: 0.5rem |
| gap-x-2 | column-gap: 0.5rem |
| gap-y-2 | row-gap: 0.5rem |
| gap-2\.5 | gap: 0.625rem |
| gap-x-2\.5 | column-gap: 0.625rem |
| gap-y-2\.5 | row-gap: 0.625rem |
| gap-3 | gap: 0.75rem |
| gap-x-3 | column-gap: 0.75rem |
| gap-y-3 | row-gap: 0.75rem |
| gap-3\.5 | gap: 0.875rem |
| gap-x-3\.5 | column-gap: 0.875rem |
| gap-y-3\.5 | row-gap: 0.875rem |
| gap-4 | gap: 1rem |
| gap-x-4 | column-gap: 1rem |
| gap-y-4 | row-gap: 1rem |
| gap-5 | gap: 1.25rem |
| gap-x-5 | column-gap: 1.25rem |
| gap-y-5 | row-gap: 1.25rem |
| gap-6 | gap: 1.5rem |
| gap-x-6 | column-gap: 1.5rem |
| gap-y-6 | row-gap: 1.5rem |
| gap-7 | gap: 1.75rem |
| gap-x-7 | column-gap: 1.75rem |
| gap-y-7 | row-gap: 1.75rem |
| gap-8 | gap: 2rem |
| gap-x-8 | column-gap: 2rem |
| gap-y-8 | row-gap: 2rem |
| gap-9 | gap: 2.25rem |
| gap-x-9 | column-gap: 2.25rem |
| gap-y-9 | row-gap: 2.25rem |
| gap-10 | gap: 2.5rem |
| gap-x-10 | column-gap: 2.5rem |
| gap-y-10 | row-gap: 2.5rem |
| gap-11 | gap: 2.75rem |
| gap-x-11 | column-gap: 2.75rem |
| gap-y-11 | row-gap: 2.75rem |
| gap-12 | gap: 3rem |
| gap-x-12 | column-gap: 3rem |
| gap-y-12 | row-gap: 3rem |
| gap-14 | gap: 3.5rem |
| gap-x-14 | column-gap: 3.5rem |
| gap-y-14 | row-gap: 3.5rem |
| gap-16 | gap: 4rem |
| gap-x-16 | column-gap: 4rem |
| gap-y-16 | row-gap: 4rem |
| gap-18 | gap: 4.5rem |
| gap-x-18 | column-gap: 4.5rem |
| gap-y-18 | row-gap: 4.5rem |
| gap-20 | gap: 5rem |
| gap-x-20 | column-gap: 5rem |
| gap-y-20 | row-gap: 5rem |
| gap-24 | gap: 6rem |
| gap-x-24 | column-gap: 6rem |
| gap-y-24 | row-gap: 6rem |
| gap-28 | gap: 7rem |
| gap-x-28 | column-gap: 7rem |
| gap-y-28 | row-gap: 7rem |
| gap-32 | gap: 8rem |
| gap-x-32 | column-gap: 8rem |
| gap-y-32 | row-gap: 8rem |
| gap-36 | gap: 9rem |
| gap-x-36 | column-gap: 9rem |
| gap-y-36 | row-gap: 9rem |
| gap-40 | gap: 10rem |
| gap-x-40 | column-gap: 10rem |
| gap-y-40 | row-gap: 10rem |
| gap-44 | gap: 11rem |
| gap-x-44 | column-gap: 11rem |
| gap-y-44 | row-gap: 11rem |
| gap-48 | gap: 12rem |
| gap-x-48 | column-gap: 12rem |
| gap-y-48 | row-gap: 12rem |
| gap-52 | gap: 13rem |
| gap-x-52 | column-gap: 13rem |
| gap-y-52 | row-gap: 13rem |
| gap-56 | gap: 14rem |
| gap-x-56 | column-gap: 14rem |
| gap-y-56 | row-gap: 14rem |
| gap-60 | gap: 15rem |
| gap-x-60 | column-gap: 15rem |
| gap-y-60 | row-gap: 15rem |
| gap-64 | gap: 16rem |
| gap-x-64 | column-gap: 16rem |
| gap-y-64 | row-gap: 16rem |
| gap-72 | gap: 18rem |
| gap-x-72 | column-gap: 18rem |
| gap-y-72 | row-gap: 18rem |
| gap-80 | gap: 20rem |
| gap-x-80 | column-gap: 20rem |
| gap-y-80 | row-gap: 20rem |
| gap-96 | gap: 24rem |
| gap-x-96 | column-gap: 24rem |
| gap-y-96 | row-gap: 24rem |
*/

45
scss/helper/grid/_row-start-end.scss
View File

@ -4,7 +4,50 @@
title: Grid Row Start / End
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| row-auto | grid-row: auto |
| row-span-1 | grid-row: span 1/span 1 |
| row-span-2 | grid-row: span 2/span 2 |
| row-span-3 | grid-row: span 3/span 3 |
| row-span-4 | grid-row: span 4/span 4 |
| row-span-5 | grid-row: span 5/span 5 |
| row-span-6 | grid-row: span 6/span 6 |
| row-span-7 | grid-row: span 7/span 7 |
| row-span-8 | grid-row: span 8/span 8 |
| row-span-9 | grid-row: span 9/span 9 |
| row-span-10 | grid-row: span 10/span 10 |
| row-span-11 | grid-row: span 11/span 1 |
| row-span-12 | grid-row: span 12/span 12 |
| row-span-full | grid-row: 1/-1 |
| row-start-1 | grid-row-start: 1 |
| row-start-2 | grid-row-start: 2 |
| row-start-3 | grid-row-start: 3 |
| row-start-4 | grid-row-start: 4 |
| row-start-5 | grid-row-start: 5 |
| row-start-6 | grid-row-start: 6 |
| row-start-7 | grid-row-start: 7 |
| row-start-8 | grid-row-start: 8 |
| row-start-9 | grid-row-start: 9 |
| row-start-10 | grid-row-start: 10 |
| row-start-11 | grid-row-start: 11 |
| row-start-12 | grid-row-start: 12 |
| row-start-13 | grid-row-start: 13 |
| row-start-auto | grid-row-start: auto |
| row-end-1 | grid-row-end: 1 |
| row-end-2 | grid-row-end: 2 |
| row-end-3 | grid-row-end: 3 |
| row-end-4 | grid-row-end: 4 |
| row-end-5 | grid-row-end: 5 |
| row-end-6 | grid-row-end: 6 |
| row-end-7 | grid-row-end: 7 |
| row-end-8 | grid-row-end: 8 |
| row-end-9 | grid-row-end: 9 |
| row-end-10 | grid-row-end: 10 |
| row-end-11 | grid-row-end: 11 |
| row-end-12 | grid-row-end: 12 |
| row-end-13 | grid-row-end: 13 |
| row-end-auto | grid-row-end: auto |
*/

10
scss/helper/grid/_rows.scss
View File

@ -4,7 +4,15 @@
title: Grid Template Rows
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| grid-rows-1 | grid-template-rows: repeat(1, minmax(0, 1fr)) |
| grid-rows-2 | grid-template-rows: repeat(2, minmax(0, 1fr)) |
| grid-rows-3 | grid-template-rows: repeat(3, minmax(0, 1fr)) |
| grid-rows-4 | grid-template-rows: repeat(4, minmax(0, 1fr)) |
| grid-rows-5 | grid-template-rows: repeat(5, minmax(0, 1fr)) |
| grid-rows-6 | grid-template-rows: repeat(6, minmax(0, 1fr)) |
| grid-rows-none | grid-template-rows: none |
*/

100
scss/helper/sizing/_height.scss
View File

@ -4,7 +4,105 @@
title: Height
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| h-px | height: 0.0625rem |
| h-0 | height: 0 |
| h-none | height: 0 |
| h-0\.5 | height: 0.125rem |
| h-1 | height: 0.25rem |
| h-1\.5 | height: 0.375rem |
| h-2 | height: 0.5rem |
| h-2\.5 | height: 0.625rem |
| h-3 | height: 0.75rem |
| h-3\.5 | height: 0.875rem |
| h-4 | height: 1rem |
| h-5 | height: 1.25rem |
| h-6 | height: 1.5rem |
| h-7 | height: 1.75rem |
| h-8 | height: 2rem |
| h-9 | height: 2.25rem |
| h-10 | height: 2.5rem |
| h-11 | height: 2.75rem |
| h-12 | height: 3rem |
| h-14 | height: 3.5rem |
| h-16 | height: 4rem |
| h-18 | height: 4.5rem |
| h-20 | height: 5rem |
| h-24 | height: 6rem |
| h-28 | height: 7rem |
| h-32 | height: 8rem |
| h-36 | height: 9rem |
| h-40 | height: 10rem |
| h-44 | height: 11rem |
| h-48 | height: 12rem |
| h-52 | height: 13rem |
| h-56 | height: 14rem |
| h-60 | height: 15rem |
| h-64 | height: 16rem |
| h-72 | height: 18rem |
| h-80 | height: 20rem |
| h-96 | height: 24rem |
| h-auto | height: auto |
| h-1\/2 | height: 50% |
| h-1\/3 | height: 33.333333% |
| h-2\/3 | height: 66.666667% |
| h-1\/4 | height: 25% |
| h-2\/4 | height: 50% |
| h-3\/4 | height: 75% |
| h-1\/5 | height: 20% |
| h-2\/5 | height: 40% |
| h-3\/5 | height: 60% |
| h-4\/5 | height: 80% |
| h-1\/6 | height: 16.666667% |
| h-2\/6 | height: 33.333333% |
| h-3\/6 | height: 50% |
| h-4\/6 | height: 66.666667% |
| h-5\/6 | height: 83.333333% |
| h-full | height: 100% |
| h-screen | height: 100vh |
| min-h-0 | min-height: 0px |
| min-h-full | min-height: 100% |
| min-h-screen | min-height: 100vh |
| max-h-px | max-height: 0.0625rem |
| max-h-0 | max-height: 0 |
| max-h-none | max-height: 0 |
| max-h-0\.5 | max-height: 0.125rem |
| max-h-1 | max-height: 0.25rem |
| max-h-1\.5 | max-height: 0.375rem |
| max-h-2 | max-height: 0.5rem |
| max-h-2\.5 | max-height: 0.625rem |
| max-h-3 | max-height: 0.75rem |
| max-h-3\.5 | max-height: 0.875rem |
| max-h-4 | max-height: 1rem |
| max-h-5 | max-height: 1.25rem |
| max-h-6 | max-height: 1.5rem |
| max-h-7 | max-height: 1.75rem |
| max-h-8 | max-height: 2rem |
| max-h-9 | max-height: 2.25rem |
| max-h-10 | max-height: 2.5rem |
| max-h-11 | max-height: 2.75rem |
| max-h-12 | max-height: 3rem |
| max-h-14 | max-height: 3.5rem |
| max-h-16 | max-height: 4rem |
| max-h-18 | max-height: 4.5rem |
| max-h-20 | max-height: 5rem |
| max-h-24 | max-height: 6rem |
| max-h-28 | max-height: 7rem |
| max-h-32 | max-height: 8rem |
| max-h-36 | max-height: 9rem |
| max-h-40 | max-height: 10rem |
| max-h-44 | max-height: 11rem |
| max-h-48 | max-height: 12rem |
| max-h-52 | max-height: 13rem |
| max-h-56 | max-height: 14rem |
| max-h-60 | max-height: 15rem |
| max-h-64 | max-height: 16rem |
| max-h-72 | max-height: 18rem |
| max-h-80 | max-height: 20rem |
| max-h-96 | max-height: 24rem |
| max-h-full | max-height: 100% |
| max-h-screen | max-height: 100vh |
*/

95
scss/helper/sizing/_width.scss
View File

@ -18,7 +18,100 @@
title: Width
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| w-px | width: 0.0625rem |
| w-0 | width: 0 |
| w-none | width: 0 |
| w-0\.5 | width: 0.125rem |
| w-1 | width: 0.25rem |
| w-1\.5 | width: 0.375rem |
| w-2 | width: 0.5rem |
| w-2\.5 | width: 0.625rem |
| w-3 | width: 0.75rem |
| w-3\.5 | width: 0.875rem |
| w-4 | width: 1rem |
| w-5 | width: 1.25rem |
| w-6 | width: 1.5rem |
| w-7 | width: 1.75rem |
| w-8 | width: 2rem |
| w-9 | width: 2.25rem |
| w-10 | width: 2.5rem |
| w-11 | width: 2.75rem |
| w-12 | width: 3rem |
| w-14 | width: 3.5rem |
| w-16 | width: 4rem |
| w-18 | width: 4.5rem |
| w-20 | width: 5rem |
| w-24 | width: 6rem |
| w-28 | width: 7rem |
| w-32 | width: 8rem |
| w-36 | width: 9rem |
| w-40 | width: 10rem |
| w-44 | width: 11rem |
| w-48 | width: 12rem |
| w-52 | width: 13rem |
| w-56 | width: 14rem |
| w-60 | width: 15rem |
| w-64 | width: 16rem |
| w-72 | width: 18rem |
| w-80 | width: 20rem |
| w-96 | width: 24rem |
| w-auto | width: auto |
| w-1x | width: 1em |
| w-2x | width: 2em |
| w-3x | width: 3em |
| w-1\/2 | width: 50% |
| w-1\/3 | width: 33.333333% |
| w-2\/3 | width: 66.666667% |
| w-1\/4 | width: 25% |
| w-2\/4 | width: 50% |
| w-3\/4 | width: 75% |
| w-1\/5 | width: 20% |
| w-2\/5 | width: 40% |
| w-3\/5 | width: 60% |
| w-4\/5 | width: 80% |
| w-1\/6 | width: 16.666667% |
| w-2\/6 | width: 33.333333% |
| w-3\/6 | width: 50% |
| w-4\/6 | width: 66.666667% |
| w-5\/6 | width: 83.333333% |
| w-1\/12 | width: 8.333333% |
| w-2\/12 | width: 16.666667% |
| w-3\/12 | width: 25% |
| w-4\/12 | width: 33.333333% |
| w-5\/12 | width: 41.666667% |
| w-6\/12 | width: 50% |
| w-7\/12 | width: 58.333333% |
| w-8\/12 | width: 66.666667% |
| w-9\/12 | width: 75% |
| w-10\/12 | width: 83.333333% |
| w-11\/12 | width: 91.666667% |
| w-full | width: 100% |
| w-screen | width: 100vw |
| w-min | width: min-content |
| w-max | width: max-content |
| min-w-0 | min-width: 0px |
| min-w-full | min-width: 100% |
| min-w-min | min-width: min-content |
| min-w-max | min-width: max-content |
| max-w-none | max-width: none |
| max-w-0 | max-width: 0rem |
| max-w-xs | max-width: 20rem |
| max-w-sm | max-width: 24rem |
| max-w-md | max-width: 28rem |
| max-w-lg | max-width: 32rem |
| max-w-xl | max-width: 36rem |
| max-w-2xl | max-width: 42rem |
| max-w-3xl | max-width: 48rem |
| max-w-4xl | max-width: 56rem |
| max-w-5xl | max-width: 64rem |
| max-w-6xl | max-width: 72rem |
| max-w-7xl | max-width: 80rem |
| max-w-full | max-width: 100% |
| max-w-min | max-width: min-content |
| max-w-max | max-width: max-content |
| max-w-prose | max-width: 65ch |
*/

525
scss/helper/spacing/_margin.scss
View File

@ -4,7 +4,530 @@
title: Margin
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| m-px | margin: 0.0625rem |
| m-0 | margin: 0 |
| m-none | margin: 0 |
| m-0\.5 | margin: 0.125rem |
| m-1 | margin: 0.25rem |
| m-1\.5 | margin: 0.375rem |
| m-2 | margin: 0.5rem |
| m-2\.5 | margin: 0.625rem |
| m-3 | margin: 0.75rem |
| m-3\.5 | margin: 0.875rem |
| m-4 | margin: 1rem |
| m-5 | margin: 1.25rem |
| m-6 | margin: 1.5rem |
| m-7 | margin: 1.75rem |
| m-8 | margin: 2rem |
| m-9 | margin: 2.25rem |
| m-10 | margin: 2.5rem |
| m-11 | margin: 2.75rem |
| m-12 | margin: 3rem |
| m-14 | margin: 3.5rem |
| m-16 | margin: 4rem |
| m-18 | margin: 4.5rem |
| m-20 | margin: 5rem |
| m-24 | margin: 6rem |
| m-28 | margin: 7rem |
| m-32 | margin: 8rem |
| m-36 | margin: 9rem |
| m-40 | margin: 10rem |
| m-44 | margin: 11rem |
| m-48 | margin: 12rem |
| m-52 | margin: 13rem |
| m-56 | margin: 14rem |
| m-60 | margin: 15rem |
| m-64 | margin: 16rem |
| m-72 | margin: 18rem |
| m-80 | margin: 20rem |
| m-96 | margin: 24rem |
| m-auto | margin: auto |
| -m-px | margin: -0.0625rem |
| -m-0 | margin: 0 |
| -m-none | margin: 0 |
| -m-0\.5 | margin: -0.125rem |
| -m-1 | margin: -0.25rem |
| -m-1\.5 | margin: -0.375rem |
| -m-2 | margin: -0.5rem |
| -m-2\.5 | margin: -0.625rem |
| -m-3 | margin: -0.75rem |
| -m-3\.5 | margin: -0.875rem |
| -m-4 | margin: -1rem |
| -m-5 | margin: -1.25rem |
| -m-6 | margin: -1.5rem |
| -m-7 | margin: -1.75rem |
| -m-8 | margin: -2rem |
| -m-9 | margin: -2.25rem |
| -m-10 | margin: -2.5rem |
| -m-11 | margin: -2.75rem |
| -m-12 | margin: -3rem |
| -m-14 | margin: -3.5rem |
| -m-16 | margin: -4rem |
| -m-18 | margin: -4.5rem |
| -m-20 | margin: -5rem |
| -m-24 | margin: -6rem |
| -m-28 | margin: -7rem |
| -m-32 | margin: -8rem |
| -m-36 | margin: -9rem |
| -m-40 | margin: -10rem |
| -m-44 | margin: -11rem |
| -m-48 | margin: -12rem |
| -m-52 | margin: -13rem |
| -m-56 | margin: -14rem |
| -m-60 | margin: -15rem |
| -m-64 | margin: -16rem |
| -m-72 | margin: -18rem |
| -m-80 | margin: -20rem |
| -m-96 | margin: -24rem |
| mx-px | margin-left: 0.0625rem; margin-right: 0.0625rem |
| mx-0 | margin-left: 0; margin-right: 0 |
| mx-none | margin-left: 0; margin-right: 0 |
| mx-0\.5 | margin-left: 0.125rem; margin-right: 0.125rem |
| mx-1 | margin-left: 0.25rem; margin-right: 0.25rem |
| mx-1\.5 | margin-left: 0.375rem; margin-right: 0.375rem |
| mx-2 | margin-left: 0.5rem; margin-right: 0.5rem |
| mx-2\.5 | margin-left: 0.625rem; margin-right: 0.625rem |
| mx-3 | margin-left: 0.75rem; margin-right: 0.75rem |
| mx-3\.5 | margin-left: 0.875rem; margin-right: 0.875rem |
| mx-4 | margin-left: 1rem; margin-right: 1rem |
| mx-5 | margin-left: 1.25rem; margin-right: 1.25rem |
| mx-6 | margin-left: 1.5rem; margin-right: 1.5rem |
| mx-7 | margin-left: 1.75rem; margin-right: 1.75rem |
| mx-8 | margin-left: 2rem; margin-right: 2rem |
| mx-9 | margin-left: 2.25rem; margin-right: 2.25rem |
| mx-10 | margin-left: 2.5rem; margin-right: 2.5rem |
| mx-11 | margin-left: 2.75rem; margin-right: 2.75rem |
| mx-12 | margin-left: 3rem; margin-right: 3rem |
| mx-14 | margin-left: 3.5rem; margin-right: 3.5rem |
| mx-16 | margin-left: 4rem; margin-right: 4rem |
| mx-18 | margin-left: 4.5rem; margin-right: 4.5rem |
| mx-20 | margin-left: 5rem; margin-right: 5rem |
| mx-24 | margin-left: 6rem; margin-right: 6rem |
| mx-28 | margin-left: 7rem; margin-right: 7rem |
| mx-32 | margin-left: 8rem; margin-right: 8rem |
| mx-36 | margin-left: 9rem; margin-right: 9rem |
| mx-40 | margin-left: 10rem; margin-right: 10rem |
| mx-44 | margin-left: 11rem; margin-right: 11rem |
| mx-48 | margin-left: 12rem; margin-right: 12rem |
| mx-52 | margin-left: 13rem; margin-right: 13rem |
| mx-56 | margin-left: 14rem; margin-right: 14rem |
| mx-60 | margin-left: 15rem; margin-right: 15rem |
| mx-64 | margin-left: 16rem; margin-right: 16rem |
| mx-72 | margin-left: 18rem; margin-right: 18rem |
| mx-80 | margin-left: 20rem; margin-right: 20rem |
| mx-96 | margin-left: 24rem; margin-right: 24rem |
| mx-auto | margin-left: auto; margin-right: auto |
| -mx-px | margin-left: -0.0625rem; margin-right: -0.0625rem |
| -mx-0 | margin-left: 0; margin-right: 0 |
| -mx-none | margin-left: 0; margin-right: 0 |
| -mx-0\.5 | margin-left: -0.125rem; margin-right: -0.125rem |
| -mx-1 | margin-left: -0.25rem; margin-right: -0.25rem |
| -mx-1\.5 | margin-left: -0.375rem; margin-right: -0.375rem |
| -mx-2 | margin-left: -0.5rem; margin-right: -0.5rem |
| -mx-2\.5 | margin-left: -0.625rem; margin-right: -0.625rem |
| -mx-3 | margin-left: -0.75rem; margin-right: -0.75rem |
| -mx-3\.5 | margin-left: -0.875rem; margin-right: -0.875rem |
| -mx-4 | margin-left: -1rem; margin-right: -1rem |
| -mx-5 | margin-left: -1.25rem; margin-right: -1.25rem |
| -mx-6 | margin-left: -1.5rem; margin-right: -1.5rem |
| -mx-7 | margin-left: -1.75rem; margin-right: -1.75rem |
| -mx-8 | margin-left: -2rem; margin-right: -2rem |
| -mx-9 | margin-left: -2.25rem; margin-right: -2.25rem |
| -mx-10 | margin-left: -2.5rem; margin-right: -2.5rem |
| -mx-11 | margin-left: -2.75rem; margin-right: -2.75rem |
| -mx-12 | margin-left: -3rem; margin-right: -3rem |
| -mx-14 | margin-left: -3.5rem; margin-right: -3.5rem |
| -mx-16 | margin-left: -4rem; margin-right: -4rem |
| -mx-18 | margin-left: -4.5rem; margin-right: -4.5rem |
| -mx-20 | margin-left: -5rem; margin-right: -5rem |
| -mx-24 | margin-left: -6rem; margin-right: -6rem |
| -mx-28 | margin-left: -7rem; margin-right: -7rem |
| -mx-32 | margin-left: -8rem; margin-right: -8rem |
| -mx-36 | margin-left: -9rem; margin-right: -9rem |
| -mx-40 | margin-left: -10rem; margin-right: -10rem |
| -mx-44 | margin-left: -11rem; margin-right: -11rem |
| -mx-48 | margin-left: -12rem; margin-right: -12rem |
| -mx-52 | margin-left: -13rem; margin-right: -13rem |
| -mx-56 | margin-left: -14rem; margin-right: -14rem |
| -mx-60 | margin-left: -15rem; margin-right: -15rem |
| -mx-64 | margin-left: -16rem; margin-right: -16rem |
| -mx-72 | margin-left: -18rem; margin-right: -18rem |
| -mx-80 | margin-left: -20rem; margin-right: -20rem |
| -mx-96 | margin-left: -24rem; margin-right: -24rem |
| my-px | margin-top: 0.0625rem; margin-bottom: 0.0625rem |
| my-0 | margin-top: 0; margin-bottom: 0 |
| my-none | margin-top: 0; margin-bottom: 0 |
| my-0\.5 | margin-top: 0.125rem; margin-bottom: 0.125rem |
| my-1 | margin-top: 0.25rem; margin-bottom: 0.25rem |
| my-1\.5 | margin-top: 0.375rem; margin-bottom: 0.375rem |
| my-2 | margin-top: 0.5rem; margin-bottom: 0.5rem |
| my-2\.5 | margin-top: 0.625rem; margin-bottom: 0.625rem |
| my-3 | margin-top: 0.75rem; margin-bottom: 0.75rem |
| my-3\.5 | margin-top: 0.875rem; margin-bottom: 0.875rem |
| my-4 | margin-top: 1rem; margin-bottom: 1rem |
| my-5 | margin-top: 1.25rem; margin-bottom: 1.25rem |
| my-6 | margin-top: 1.5rem; margin-bottom: 1.5rem |
| my-7 | margin-top: 1.75rem; margin-bottom: 1.75rem |
| my-8 | margin-top: 2rem; margin-bottom: 2rem |
| my-9 | margin-top: 2.25rem; margin-bottom: 2.25rem |
| my-10 | margin-top: 2.5rem; margin-bottom: 2.5rem |
| my-11 | margin-top: 2.75rem; margin-bottom: 2.75rem |
| my-12 | margin-top: 3rem; margin-bottom: 3rem |
| my-14 | margin-top: 3.5rem; margin-bottom: 3.5rem |
| my-16 | margin-top: 4rem; margin-bottom: 4rem |
| my-18 | margin-top: 4.5rem; margin-bottom: 4.5rem |
| my-20 | margin-top: 5rem; margin-bottom: 5rem |
| my-24 | margin-top: 6rem; margin-bottom: 6rem |
| my-28 | margin-top: 7rem; margin-bottom: 7rem |
| my-32 | margin-top: 8rem; margin-bottom: 8rem |
| my-36 | margin-top: 9rem; margin-bottom: 9rem |
| my-40 | margin-top: 10rem; margin-bottom: 10rem |
| my-44 | margin-top: 11rem; margin-bottom: 11rem |
| my-48 | margin-top: 12rem; margin-bottom: 12rem |
| my-52 | margin-top: 13rem; margin-bottom: 13rem |
| my-56 | margin-top: 14rem; margin-bottom: 14rem |
| my-60 | margin-top: 15rem; margin-bottom: 15rem |
| my-64 | margin-top: 16rem; margin-bottom: 16rem |
| my-72 | margin-top: 18rem; margin-bottom: 18rem |
| my-80 | margin-top: 20rem; margin-bottom: 20rem |
| my-96 | margin-top: 24rem; margin-bottom: 24rem |
| my-auto | margin-top: auto; margin-bottom: auto |
| -my-px | margin-top: -0.0625rem; margin-bottom: -0.0625rem |
| -my-0 | margin-top: 0; margin-bottom: 0 |
| -my-none | margin-top: 0; margin-bottom: 0 |
| -my-0\.5 | margin-top: -0.125rem; margin-bottom: -0.125rem |
| -my-1 | margin-top: -0.25rem; margin-bottom: -0.25rem |
| -my-1\.5 | margin-top: -0.375rem; margin-bottom: -0.375rem |
| -my-2 | margin-top: -0.5rem; margin-bottom: -0.5rem |
| -my-2\.5 | margin-top: -0.625rem; margin-bottom: -0.625rem |
| -my-3 | margin-top: -0.75rem; margin-bottom: -0.75rem |
| -my-3\.5 | margin-top: -0.875rem; margin-bottom: -0.875rem |
| -my-4 | margin-top: -1rem; margin-bottom: -1rem |
| -my-5 | margin-top: -1.25rem; margin-bottom: -1.25rem |
| -my-6 | margin-top: -1.5rem; margin-bottom: -1.5rem |
| -my-7 | margin-top: -1.75rem; margin-bottom: -1.75rem |
| -my-8 | margin-top: -2rem; margin-bottom: -2rem |
| -my-9 | margin-top: -2.25rem; margin-bottom: -2.25rem |
| -my-10 | margin-top: -2.5rem; margin-bottom: -2.5rem |
| -my-11 | margin-top: -2.75rem; margin-bottom: -2.75rem |
| -my-12 | margin-top: -3rem; margin-bottom: -3rem |
| -my-14 | margin-top: -3.5rem; margin-bottom: -3.5rem |
| -my-16 | margin-top: -4rem; margin-bottom: -4rem |
| -my-18 | margin-top: -4.5rem; margin-bottom: -4.5rem |
| -my-20 | margin-top: -5rem; margin-bottom: -5rem |
| -my-24 | margin-top: -6rem; margin-bottom: -6rem |
| -my-28 | margin-top: -7rem; margin-bottom: -7rem |
| -my-32 | margin-top: -8rem; margin-bottom: -8rem |
| -my-36 | margin-top: -9rem; margin-bottom: -9rem |
| -my-40 | margin-top: -10rem; margin-bottom: -10rem |
| -my-44 | margin-top: -11rem; margin-bottom: -11rem |
| -my-48 | margin-top: -12rem; margin-bottom: -12rem |
| -my-52 | margin-top: -13rem; margin-bottom: -13rem |
| -my-56 | margin-top: -14rem; margin-bottom: -14rem |
| -my-60 | margin-top: -15rem; margin-bottom: -15rem |
| -my-64 | margin-top: -16rem; margin-bottom: -16rem |
| -my-72 | margin-top: -18rem; margin-bottom: -18rem |
| -my-80 | margin-top: -20rem; margin-bottom: -20rem |
| -my-96 | margin-top: -24rem; margin-bottom: -24rem |
| mt-px | margin-top: 0.0625rem |
| mt-0 | margin-top: 0 |
| mt-none | margin-top: 0 |
| mt-0\.5 | margin-top: 0.125rem |
| mt-1 | margin-top: 0.25rem |
| mt-1\.5 | margin-top: 0.375rem |
| mt-2 | margin-top: 0.5rem |
| mt-2\.5 | margin-top: 0.625rem |
| mt-3 | margin-top: 0.75rem |
| mt-3\.5 | margin-top: 0.875rem |
| mt-4 | margin-top: 1rem |
| mt-5 | margin-top: 1.25rem |
| mt-6 | margin-top: 1.5rem |
| mt-7 | margin-top: 1.75rem |
| mt-8 | margin-top: 2rem |
| mt-9 | margin-top: 2.25rem |
| mt-10 | margin-top: 2.5rem |
| mt-11 | margin-top: 2.75rem |
| mt-12 | margin-top: 3rem |
| mt-14 | margin-top: 3.5rem |
| mt-16 | margin-top: 4rem |
| mt-18 | margin-top: 4.5rem |
| mt-20 | margin-top: 5rem |
| mt-24 | margin-top: 6rem |
| mt-28 | margin-top: 7rem |
| mt-32 | margin-top: 8rem |
| mt-36 | margin-top: 9rem |
| mt-40 | margin-top: 10rem |
| mt-44 | margin-top: 11rem |
| mt-48 | margin-top: 12rem |
| mt-52 | margin-top: 13rem |
| mt-56 | margin-top: 14rem |
| mt-60 | margin-top: 15rem |
| mt-64 | margin-top: 16rem |
| mt-72 | margin-top: 18rem |
| mt-80 | margin-top: 20rem |
| mt-96 | margin-top: 24rem |
| -mt-px | margin-top: -0.0625rem |
| -mt-0 | margin-top: 0 |
| -mt-none | margin-top: 0 |
| -mt-0\.5 | margin-top: -0.125rem |
| -mt-1 | margin-top: -0.25rem |
| -mt-1\.5 | margin-top: -0.375rem |
| -mt-2 | margin-top: -0.5rem |
| -mt-2\.5 | margin-top: -0.625rem |
| -mt-3 | margin-top: -0.75rem |
| -mt-3\.5 | margin-top: -0.875rem |
| -mt-4 | margin-top: -1rem |
| -mt-5 | margin-top: -1.25rem |
| -mt-6 | margin-top: -1.5rem |
| -mt-7 | margin-top: -1.75rem |
| -mt-8 | margin-top: -2rem |
| -mt-9 | margin-top: -2.25rem |
| -mt-10 | margin-top: -2.5rem |
| -mt-11 | margin-top: -2.75rem |
| -mt-12 | margin-top: -3rem |
| -mt-14 | margin-top: -3.5rem |
| -mt-16 | margin-top: -4rem |
| -mt-18 | margin-top: -4.5rem |
| -mt-20 | margin-top: -5rem |
| -mt-24 | margin-top: -6rem |
| -mt-28 | margin-top: -7rem |
| -mt-32 | margin-top: -8rem |
| -mt-36 | margin-top: -9rem |
| -mt-40 | margin-top: -10rem |
| -mt-44 | margin-top: -11rem |
| -mt-48 | margin-top: -12rem |
| -mt-52 | margin-top: -13rem |
| -mt-56 | margin-top: -14rem |
| -mt-60 | margin-top: -15rem |
| -mt-64 | margin-top: -16rem |
| -mt-72 | margin-top: -18rem |
| -mt-80 | margin-top: -20rem |
| -mt-96 | margin-top: -24rem |
| mr-px | margin-right: 0.0625rem |
| mr-0 | margin-right: 0 |
| mr-none | margin-right: 0 |
| mr-0\.5 | margin-right: 0.125rem |
| mr-1 | margin-right: 0.25rem |
| mr-1\.5 | margin-right: 0.375rem |
| mr-2 | margin-right: 0.5rem |
| mr-2\.5 | margin-right: 0.625rem |
| mr-3 | margin-right: 0.75rem |
| mr-3\.5 | margin-right: 0.875rem |
| mr-4 | margin-right: 1rem |
| mr-5 | margin-right: 1.25rem |
| mr-6 | margin-right: 1.5rem |
| mr-7 | margin-right: 1.75rem |
| mr-8 | margin-right: 2rem |
| mr-9 | margin-right: 2.25rem |
| mr-10 | margin-right: 2.5rem |
| mr-11 | margin-right: 2.75rem |
| mr-12 | margin-right: 3rem |
| mr-14 | margin-right: 3.5rem |
| mr-16 | margin-right: 4rem |
| mr-18 | margin-right: 4.5rem |
| mr-20 | margin-right: 5rem |
| mr-24 | margin-right: 6rem |
| mr-28 | margin-right: 7rem |
| mr-32 | margin-right: 8rem |
| mr-36 | margin-right: 9rem |
| mr-40 | margin-right: 10rem |
| mr-44 | margin-right: 11rem |
| mr-48 | margin-right: 12rem |
| mr-52 | margin-right: 13rem |
| mr-56 | margin-right: 14rem |
| mr-60 | margin-right: 15rem |
| mr-64 | margin-right: 16rem |
| mr-72 | margin-right: 18rem |
| mr-80 | margin-right: 20rem |
| mr-96 | margin-right: 24rem |
| -mr-px | margin-right: -0.0625rem |
| -mr-0 | margin-right: 0 |
| -mr-none | margin-right: 0 |
| -mr-0\.5 | margin-right: -0.125rem |
| -mr-1 | margin-right: -0.25rem |
| -mr-1\.5 | margin-right: -0.375rem |
| -mr-2 | margin-right: -0.5rem |
| -mr-2\.5 | margin-right: -0.625rem |
| -mr-3 | margin-right: -0.75rem |
| -mr-3\.5 | margin-right: -0.875rem |
| -mr-4 | margin-right: -1rem |
| -mr-5 | margin-right: -1.25rem |
| -mr-6 | margin-right: -1.5rem |
| -mr-7 | margin-right: -1.75rem |
| -mr-8 | margin-right: -2rem |
| -mr-9 | margin-right: -2.25rem |
| -mr-10 | margin-right: -2.5rem |
| -mr-11 | margin-right: -2.75rem |
| -mr-12 | margin-right: -3rem |
| -mr-14 | margin-right: -3.5rem |
| -mr-16 | margin-right: -4rem |
| -mr-18 | margin-right: -4.5rem |
| -mr-20 | margin-right: -5rem |
| -mr-24 | margin-right: -6rem |
| -mr-28 | margin-right: -7rem |
| -mr-32 | margin-right: -8rem |
| -mr-36 | margin-right: -9rem |
| -mr-40 | margin-right: -10rem |
| -mr-44 | margin-right: -11rem |
| -mr-48 | margin-right: -12rem |
| -mr-52 | margin-right: -13rem |
| -mr-56 | margin-right: -14rem |
| -mr-60 | margin-right: -15rem |
| -mr-64 | margin-right: -16rem |
| -mr-72 | margin-right: -18rem |
| -mr-80 | margin-right: -20rem |
| -mr-96 | margin-right: -24rem |
| mb-px | margin-bottom: 0.0625rem |
| mb-0 | margin-bottom: 0 |
| mb-none | margin-bottom: 0 |
| mb-0\.5 | margin-bottom: 0.125rem |
| mb-1 | margin-bottom: 0.25rem |
| mb-1\.5 | margin-bottom: 0.375rem |
| mb-2 | margin-bottom: 0.5rem |
| mb-2\.5 | margin-bottom: 0.625rem |
| mb-3 | margin-bottom: 0.75rem |
| mb-3\.5 | margin-bottom: 0.875rem |
| mb-4 | margin-bottom: 1rem |
| mb-5 | margin-bottom: 1.25rem |
| mb-6 | margin-bottom: 1.5rem |
| mb-7 | margin-bottom: 1.75rem |
| mb-8 | margin-bottom: 2rem |
| mb-9 | margin-bottom: 2.25rem |
| mb-10 | margin-bottom: 2.5rem |
| mb-11 | margin-bottom: 2.75rem |
| mb-12 | margin-bottom: 3rem |
| mb-14 | margin-bottom: 3.5rem |
| mb-16 | margin-bottom: 4rem |
| mb-18 | margin-bottom: 4.5rem |
| mb-20 | margin-bottom: 5rem |
| mb-24 | margin-bottom: 6rem |
| mb-28 | margin-bottom: 7rem |
| mb-32 | margin-bottom: 8rem |
| mb-36 | margin-bottom: 9rem |
| mb-40 | margin-bottom: 10rem |
| mb-44 | margin-bottom: 11rem |
| mb-48 | margin-bottom: 12rem |
| mb-52 | margin-bottom: 13rem |
| mb-56 | margin-bottom: 14rem |
| mb-60 | margin-bottom: 15rem |
| mb-64 | margin-bottom: 16rem |
| mb-72 | margin-bottom: 18rem |
| mb-80 | margin-bottom: 20rem |
| mb-96 | margin-bottom: 24rem |
| -mb-px | margin-bottom: -0.0625rem |
| -mb-0 | margin-bottom: 0 |
| -mb-none | margin-bottom: 0 |
| -mb-0\.5 | margin-bottom: -0.125rem |
| -mb-1 | margin-bottom: -0.25rem |
| -mb-1\.5 | margin-bottom: -0.375rem |
| -mb-2 | margin-bottom: -0.5rem |
| -mb-2\.5 | margin-bottom: -0.625rem |
| -mb-3 | margin-bottom: -0.75rem |
| -mb-3\.5 | margin-bottom: -0.875rem |
| -mb-4 | margin-bottom: -1rem |
| -mb-5 | margin-bottom: -1.25rem |
| -mb-6 | margin-bottom: -1.5rem |
| -mb-7 | margin-bottom: -1.75rem |
| -mb-8 | margin-bottom: -2rem |
| -mb-9 | margin-bottom: -2.25rem |
| -mb-10 | margin-bottom: -2.5rem |
| -mb-11 | margin-bottom: -2.75rem |
| -mb-12 | margin-bottom: -3rem |
| -mb-14 | margin-bottom: -3.5rem |
| -mb-16 | margin-bottom: -4rem |
| -mb-18 | margin-bottom: -4.5rem |
| -mb-20 | margin-bottom: -5rem |
| -mb-24 | margin-bottom: -6rem |
| -mb-28 | margin-bottom: -7rem |
| -mb-32 | margin-bottom: -8rem |
| -mb-36 | margin-bottom: -9rem |
| -mb-40 | margin-bottom: -10rem |
| -mb-44 | margin-bottom: -11rem |
| -mb-48 | margin-bottom: -12rem |
| -mb-52 | margin-bottom: -13rem |
| -mb-56 | margin-bottom: -14rem |
| -mb-60 | margin-bottom: -15rem |
| -mb-64 | margin-bottom: -16rem |
| -mb-72 | margin-bottom: -18rem |
| -mb-80 | margin-bottom: -20rem |
| -mb-96 | margin-bottom: -24rem |
| ml-px | margin-left: 0.0625rem |
| ml-0 | margin-left: 0 |
| ml-none | margin-left: 0 |
| ml-0\.5 | margin-left: 0.125rem |
| ml-1 | margin-left: 0.25rem |
| ml-1\.5 | margin-left: 0.375rem |
| ml-2 | margin-left: 0.5rem |
| ml-2\.5 | margin-left: 0.625rem |
| ml-3 | margin-left: 0.75rem |
| ml-3\.5 | margin-left: 0.875rem |
| ml-4 | margin-left: 1rem |
| ml-5 | margin-left: 1.25rem |
| ml-6 | margin-left: 1.5rem |
| ml-7 | margin-left: 1.75rem |
| ml-8 | margin-left: 2rem |
| ml-9 | margin-left: 2.25rem |
| ml-10 | margin-left: 2.5rem |
| ml-11 | margin-left: 2.75rem |
| ml-12 | margin-left: 3rem |
| ml-14 | margin-left: 3.5rem |
| ml-16 | margin-left: 4rem |
| ml-18 | margin-left: 4.5rem |
| ml-20 | margin-left: 5rem |
| ml-24 | margin-left: 6rem |
| ml-28 | margin-left: 7rem |
| ml-32 | margin-left: 8rem |
| ml-36 | margin-left: 9rem |
| ml-40 | margin-left: 10rem |
| ml-44 | margin-left: 11rem |
| ml-48 | margin-left: 12rem |
| ml-52 | margin-left: 13rem |
| ml-56 | margin-left: 14rem |
| ml-60 | margin-left: 15rem |
| ml-64 | margin-left: 16rem |
| ml-72 | margin-left: 18rem |
| ml-80 | margin-left: 20rem |
| ml-96 | margin-left: 24rem |
| -ml-px | margin-left: -0.0625rem |
| -ml-0 | margin-left: 0 |
| -ml-none | margin-left: 0 |
| -ml-0\.5 | margin-left: -0.125rem |
| -ml-1 | margin-left: -0.25rem |
| -ml-1\.5 | margin-left: -0.375rem |
| -ml-2 | margin-left: -0.5rem |
| -ml-2\.5 | margin-left: -0.625rem |
| -ml-3 | margin-left: -0.75rem |
| -ml-3\.5 | margin-left: -0.875rem |
| -ml-4 | margin-left: -1rem |
| -ml-5 | margin-left: -1.25rem |
| -ml-6 | margin-left: -1.5rem |
| -ml-7 | margin-left: -1.75rem |
| -ml-8 | margin-left: -2rem |
| -ml-9 | margin-left: -2.25rem |
| -ml-10 | margin-left: -2.5rem |
| -ml-11 | margin-left: -2.75rem |
| -ml-12 | margin-left: -3rem |
| -ml-14 | margin-left: -3.5rem |
| -ml-16 | margin-left: -4rem |
| -ml-18 | margin-left: -4.5rem |
| -ml-20 | margin-left: -5rem |
| -ml-24 | margin-left: -6rem |
| -ml-28 | margin-left: -7rem |
| -ml-32 | margin-left: -8rem |
| -ml-36 | margin-left: -9rem |
| -ml-40 | margin-left: -10rem |
| -ml-44 | margin-left: -11rem |
| -ml-48 | margin-left: -12rem |
| -ml-52 | margin-left: -13rem |
| -ml-56 | margin-left: -14rem |
| -ml-60 | margin-left: -15rem |
| -ml-64 | margin-left: -16rem |
| -ml-72 | margin-left: -18rem |
| -ml-80 | margin-left: -20rem |
| -ml-96 | margin-left: -24rem |
*/

263
scss/helper/spacing/_padding.scss
View File

@ -4,7 +4,268 @@
title: Padding
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| p-px | padding: 0.0625rem |
| p-0 | padding: 0 |
| p-none | padding: 0 |
| p-0\.5 | padding: 0.125rem |
| p-1 | padding: 0.25rem |
| p-1\.5 | padding: 0.375rem |
| p-2 | padding: 0.5rem |
| p-2\.5 | padding: 0.625rem |
| p-3 | padding: 0.75rem |
| p-3\.5 | padding: 0.875rem |
| p-4 | padding: 1rem |
| p-5 | padding: 1.25rem |
| p-6 | padding: 1.5rem |
| p-7 | padding: 1.75rem |
| p-8 | padding: 2rem |
| p-9 | padding: 2.25rem |
| p-10 | padding: 2.5rem |
| p-11 | padding: 2.75rem |
| p-12 | padding: 3rem |
| p-14 | padding: 3.5rem |
| p-16 | padding: 4rem |
| p-18 | padding: 4.5rem |
| p-20 | padding: 5rem |
| p-24 | padding: 6rem |
| p-28 | padding: 7rem |
| p-32 | padding: 8rem |
| p-36 | padding: 9rem |
| p-40 | padding: 10rem |
| p-44 | padding: 11rem |
| p-48 | padding: 12rem |
| p-52 | padding: 13rem |
| p-56 | padding: 14rem |
| p-60 | padding: 15rem |
| p-64 | padding: 16rem |
| p-72 | padding: 18rem |
| p-80 | padding: 20rem |
| p-96 | padding: 24rem |
| px-px | padding-left: 0.0625rem; padding-right: 0.0625rem |
| px-0 | padding-left: 0; padding-right: 0 |
| px-none | padding-left: 0; padding-right: 0 |
| px-0\.5 | padding-left: 0.125rem; padding-right: 0.125rem |
| px-1 | padding-left: 0.25rem; padding-right: 0.25rem |
| px-1\.5 | padding-left: 0.375rem; padding-right: 0.375rem |
| px-2 | padding-left: 0.5rem; padding-right: 0.5rem |
| px-2\.5 | padding-left: 0.625rem; padding-right: 0.625rem |
| px-3 | padding-left: 0.75rem; padding-right: 0.75rem |
| px-3\.5 | padding-left: 0.875rem; padding-right: 0.875rem |
| px-4 | padding-left: 1rem; padding-right: 1rem |
| px-5 | padding-left: 1.25rem; padding-right: 1.25rem |
| px-6 | padding-left: 1.5rem; padding-right: 1.5rem |
| px-7 | padding-left: 1.75rem; padding-right: 1.75rem |
| px-8 | padding-left: 2rem; padding-right: 2rem |
| px-9 | padding-left: 2.25rem; padding-right: 2.25rem |
| px-10 | padding-left: 2.5rem; padding-right: 2.5rem |
| px-11 | padding-left: 2.75rem; padding-right: 2.75rem |
| px-12 | padding-left: 3rem; padding-right: 3rem |
| px-14 | padding-left: 3.5rem; padding-right: 3.5rem |
| px-16 | padding-left: 4rem; padding-right: 4rem |
| px-18 | padding-left: 4.5rem; padding-right: 4.5rem |
| px-20 | padding-left: 5rem; padding-right: 5rem |
| px-24 | padding-left: 6rem; padding-right: 6rem |
| px-28 | padding-left: 7rem; padding-right: 7rem |
| px-32 | padding-left: 8rem; padding-right: 8rem |
| px-36 | padding-left: 9rem; padding-right: 9rem |
| px-40 | padding-left: 10rem; padding-right: 10rem |
| px-44 | padding-left: 11rem; padding-right: 11rem |
| px-48 | padding-left: 12rem; padding-right: 12rem |
| px-52 | padding-left: 13rem; padding-right: 13rem |
| px-56 | padding-left: 14rem; padding-right: 14rem |
| px-60 | padding-left: 15rem; padding-right: 15rem |
| px-64 | padding-left: 16rem; padding-right: 16rem |
| px-72 | padding-left: 18rem; padding-right: 18rem |
| px-80 | padding-left: 20rem; padding-right: 20rem |
| px-96 | padding-left: 24rem; padding-right: 24rem |
| py-px | padding-top: 0.0625rem; padding-bottom: 0.0625rem |
| py-0 | padding-top: 0; padding-bottom: 0 |
| py-none | padding-top: 0; padding-bottom: 0 |
| py-0\.5 | padding-top: 0.125rem; padding-bottom: 0.125rem |
| py-1 | padding-top: 0.25rem; padding-bottom: 0.25rem |
| py-1\.5 | padding-top: 0.375rem; padding-bottom: 0.375rem |
| py-2 | padding-top: 0.5rem; padding-bottom: 0.5rem |
| py-2\.5 | padding-top: 0.625rem; padding-bottom: 0.625rem |
| py-3 | padding-top: 0.75rem; padding-bottom: 0.75rem |
| py-3\.5 | padding-top: 0.875rem; padding-bottom: 0.875rem |
| py-4 | padding-top: 1rem; padding-bottom: 1rem |
| py-5 | padding-top: 1.25rem; padding-bottom: 1.25rem |
| py-6 | padding-top: 1.5rem; padding-bottom: 1.5rem |
| py-7 | padding-top: 1.75rem; padding-bottom: 1.75rem |
| py-8 | padding-top: 2rem; padding-bottom: 2rem |
| py-9 | padding-top: 2.25rem; padding-bottom: 2.25rem |
| py-10 | padding-top: 2.5rem; padding-bottom: 2.5rem |
| py-11 | padding-top: 2.75rem; padding-bottom: 2.75rem |
| py-12 | padding-top: 3rem; padding-bottom: 3rem |
| py-14 | padding-top: 3.5rem; padding-bottom: 3.5rem |
| py-16 | padding-top: 4rem; padding-bottom: 4rem |
| py-18 | padding-top: 4.5rem; padding-bottom: 4.5rem |
| py-20 | padding-top: 5rem; padding-bottom: 5rem |
| py-24 | padding-top: 6rem; padding-bottom: 6rem |
| py-28 | padding-top: 7rem; padding-bottom: 7rem |
| py-32 | padding-top: 8rem; padding-bottom: 8rem |
| py-36 | padding-top: 9rem; padding-bottom: 9rem |
| py-40 | padding-top: 10rem; padding-bottom: 10rem |
| py-44 | padding-top: 11rem; padding-bottom: 11rem |
| py-48 | padding-top: 12rem; padding-bottom: 12rem |
| py-52 | padding-top: 13rem; padding-bottom: 13rem |
| py-56 | padding-top: 14rem; padding-bottom: 14rem |
| py-60 | padding-top: 15rem; padding-bottom: 15rem |
| py-64 | padding-top: 16rem; padding-bottom: 16rem |
| py-72 | padding-top: 18rem; padding-bottom: 18rem |
| py-80 | padding-top: 20rem; padding-bottom: 20rem |
| py-96 | padding-top: 24rem; padding-bottom: 24rem |
| pt-px | padding-top: 0.0625rem |
| pt-0 | padding-top: 0 |
| pt-none | padding-top: 0 |
| pt-0\.5 | padding-top: 0.125rem |
| pt-1 | padding-top: 0.25rem |
| pt-1\.5 | padding-top: 0.375rem |
| pt-2 | padding-top: 0.5rem |
| pt-2\.5 | padding-top: 0.625rem |
| pt-3 | padding-top: 0.75rem |
| pt-3\.5 | padding-top: 0.875rem |
| pt-4 | padding-top: 1rem |
| pt-5 | padding-top: 1.25rem |
| pt-6 | padding-top: 1.5rem |
| pt-7 | padding-top: 1.75rem |
| pt-8 | padding-top: 2rem |
| pt-9 | padding-top: 2.25rem |
| pt-10 | padding-top: 2.5rem |
| pt-11 | padding-top: 2.75rem |
| pt-12 | padding-top: 3rem |
| pt-14 | padding-top: 3.5rem |
| pt-16 | padding-top: 4rem |
| pt-18 | padding-top: 4.5rem |
| pt-20 | padding-top: 5rem |
| pt-24 | padding-top: 6rem |
| pt-28 | padding-top: 7rem |
| pt-32 | padding-top: 8rem |
| pt-36 | padding-top: 9rem |
| pt-40 | padding-top: 10rem |
| pt-44 | padding-top: 11rem |
| pt-48 | padding-top: 12rem |
| pt-52 | padding-top: 13rem |
| pt-56 | padding-top: 14rem |
| pt-60 | padding-top: 15rem |
| pt-64 | padding-top: 16rem |
| pt-72 | padding-top: 18rem |
| pt-80 | padding-top: 20rem |
| pt-96 | padding-top: 24rem |
| pr-px | padding-right: 0.0625rem |
| pr-0 | padding-right: 0 |
| pr-none | padding-right: 0 |
| pr-0\.5 | padding-right: 0.125rem |
| pr-1 | padding-right: 0.25rem |
| pr-1\.5 | padding-right: 0.375rem |
| pr-2 | padding-right: 0.5rem |
| pr-2\.5 | padding-right: 0.625rem |
| pr-3 | padding-right: 0.75rem |
| pr-3\.5 | padding-right: 0.875rem |
| pr-4 | padding-right: 1rem |
| pr-5 | padding-right: 1.25rem |
| pr-6 | padding-right: 1.5rem |
| pr-7 | padding-right: 1.75rem |
| pr-8 | padding-right: 2rem |
| pr-9 | padding-right: 2.25rem |
| pr-10 | padding-right: 2.5rem |
| pr-11 | padding-right: 2.75rem |
| pr-12 | padding-right: 3rem |
| pr-14 | padding-right: 3.5rem |
| pr-16 | padding-right: 4rem |
| pr-18 | padding-right: 4.5rem |
| pr-20 | padding-right: 5rem |
| pr-24 | padding-right: 6rem |
| pr-28 | padding-right: 7rem |
| pr-32 | padding-right: 8rem |
| pr-36 | padding-right: 9rem |
| pr-40 | padding-right: 10rem |
| pr-44 | padding-right: 11rem |
| pr-48 | padding-right: 12rem |
| pr-52 | padding-right: 13rem |
| pr-56 | padding-right: 14rem |
| pr-60 | padding-right: 15rem |
| pr-64 | padding-right: 16rem |
| pr-72 | padding-right: 18rem |
| pr-80 | padding-right: 20rem |
| pr-96 | padding-right: 24rem |
| pb-px | padding-bottom: 0.0625rem |
| pb-0 | padding-bottom: 0 |
| pb-none | padding-bottom: 0 |
| pb-0\.5 | padding-bottom: 0.125rem |
| pb-1 | padding-bottom: 0.25rem |
| pb-1\.5 | padding-bottom: 0.375rem |
| pb-2 | padding-bottom: 0.5rem |
| pb-2\.5 | padding-bottom: 0.625rem |
| pb-3 | padding-bottom: 0.75rem |
| pb-3\.5 | padding-bottom: 0.875rem |
| pb-4 | padding-bottom: 1rem |
| pb-5 | padding-bottom: 1.25rem |
| pb-6 | padding-bottom: 1.5rem |
| pb-7 | padding-bottom: 1.75rem |
| pb-8 | padding-bottom: 2rem |
| pb-9 | padding-bottom: 2.25rem |
| pb-10 | padding-bottom: 2.5rem |
| pb-11 | padding-bottom: 2.75rem |
| pb-12 | padding-bottom: 3rem |
| pb-14 | padding-bottom: 3.5rem |
| pb-16 | padding-bottom: 4rem |
| pb-18 | padding-bottom: 4.5rem |
| pb-20 | padding-bottom: 5rem |
| pb-24 | padding-bottom: 6rem |
| pb-28 | padding-bottom: 7rem |
| pb-32 | padding-bottom: 8rem |
| pb-36 | padding-bottom: 9rem |
| pb-40 | padding-bottom: 10rem |
| pb-44 | padding-bottom: 11rem |
| pb-48 | padding-bottom: 12rem |
| pb-52 | padding-bottom: 13rem |
| pb-56 | padding-bottom: 14rem |
| pb-60 | padding-bottom: 15rem |
| pb-64 | padding-bottom: 16rem |
| pb-72 | padding-bottom: 18rem |
| pb-80 | padding-bottom: 20rem |
| pb-96 | padding-bottom: 24rem |
| pl-px | padding-left: 0.0625rem |
| pl-0 | padding-left: 0 |
| pl-none | padding-left: 0 |
| pl-0\.5 | padding-left: 0.125rem |
| pl-1 | padding-left: 0.25rem |
| pl-1\.5 | padding-left: 0.375rem |
| pl-2 | padding-left: 0.5rem |
| pl-2\.5 | padding-left: 0.625rem |
| pl-3 | padding-left: 0.75rem |
| pl-3\.5 | padding-left: 0.875rem |
| pl-4 | padding-left: 1rem |
| pl-5 | padding-left: 1.25rem |
| pl-6 | padding-left: 1.5rem |
| pl-7 | padding-left: 1.75rem |
| pl-8 | padding-left: 2rem |
| pl-9 | padding-left: 2.25rem |
| pl-10 | padding-left: 2.5rem |
| pl-11 | padding-left: 2.75rem |
| pl-12 | padding-left: 3rem |
| pl-14 | padding-left: 3.5rem |
| pl-16 | padding-left: 4rem |
| pl-18 | padding-left: 4.5rem |
| pl-20 | padding-left: 5rem |
| pl-24 | padding-left: 6rem |
| pl-28 | padding-left: 7rem |
| pl-32 | padding-left: 8rem |
| pl-36 | padding-left: 9rem |
| pl-40 | padding-left: 10rem |
| pl-44 | padding-left: 11rem |
| pl-48 | padding-left: 12rem |
| pl-52 | padding-left: 13rem |
| pl-56 | padding-left: 14rem |
| pl-60 | padding-left: 15rem |
| pl-64 | padding-left: 16rem |
| pl-72 | padding-left: 18rem |
| pl-80 | padding-left: 20rem |
| pl-96 | padding-left: 24rem |
*/

153
scss/helper/spacing/_space-between.scss
View File

@ -4,7 +4,158 @@
title: Space Between
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| space-x-px | margin-left: 0.0625rem |
| space-x-px.space-x-reverse | margin-right: 0.0625rem |
| space-x-0 | margin-left: 0 |
| space-x-0.space-x-reverse | margin-right: 0 |
| space-x-none | margin-left: 0 |
| space-x-none.space-x-reverse | margin-right: 0 |
| space-x-0\.5 | margin-left: 0.125rem |
| space-x-0\.5.space-x-reverse | margin-right: 0.125rem |
| space-x-1 | margin-left: 0.25rem |
| space-x-1.space-x-reverse | margin-right: 0.25rem |
| space-x-1\.5 | margin-left: 0.375rem |
| space-x-1\.5.space-x-reverse | margin-right: 0.375rem |
| space-x-2 | margin-left: 0.5rem |
| space-x-2.space-x-reverse | margin-right: 0.5rem |
| space-x-2\.5 | margin-left: 0.625rem |
| space-x-2\.5.space-x-reverse | margin-right: 0.625rem |
| space-x-3 | margin-left: 0.75rem |
| space-x-3.space-x-reverse | margin-right: 0.75rem |
| space-x-3\.5 | margin-left: 0.875rem |
| space-x-3\.5.space-x-reverse | margin-right: 0.875rem |
| space-x-4 | margin-left: 1rem |
| space-x-4.space-x-reverse | margin-right: 1rem |
| space-x-5 | margin-left: 1.25rem |
| space-x-5.space-x-reverse | margin-right: 1.25rem |
| space-x-6 | margin-left: 1.5rem |
| space-x-6.space-x-reverse | margin-right: 1.5rem |
| space-x-7 | margin-left: 1.75rem |
| space-x-7.space-x-reverse | margin-right: 1.75rem |
| space-x-8 | margin-left: 2rem |
| space-x-8.space-x-reverse | margin-right: 2rem |
| space-x-9 | margin-left: 2.25rem |
| space-x-9.space-x-reverse | margin-right: 2.25rem |
| space-x-10 | margin-left: 2.5rem |
| space-x-10.space-x-reverse | margin-right: 2.5rem |
| space-x-11 | margin-left: 2.75rem |
| space-x-11.space-x-reverse | margin-right: 2.75rem |
| space-x-12 | margin-left: 3rem |
| space-x-12.space-x-reverse | margin-right: 3rem |
| space-x-14 | margin-left: 3.5rem |
| space-x-14.space-x-reverse | margin-right: 3.5rem |
| space-x-16 | margin-left: 4rem |
| space-x-16.space-x-reverse | margin-right: 4rem |
| space-x-18 | margin-left: 4.5rem |
| space-x-18.space-x-reverse | margin-right: 4.5rem |
| space-x-20 | margin-left: 5rem |
| space-x-20.space-x-reverse | margin-right: 5rem |
| space-x-24 | margin-left: 6rem |
| space-x-24.space-x-reverse | margin-right: 6rem |
| space-x-28 | margin-left: 7rem |
| space-x-28.space-x-reverse | margin-right: 7rem |
| space-x-32 | margin-left: 8rem |
| space-x-32.space-x-reverse | margin-right: 8rem |
| space-x-36 | margin-left: 9rem |
| space-x-36.space-x-reverse | margin-right: 9rem |
| space-x-40 | margin-left: 10rem |
| space-x-40.space-x-reverse | margin-right: 10rem |
| space-x-44 | margin-left: 11rem |
| space-x-44.space-x-reverse | margin-right: 11rem |
| space-x-48 | margin-left: 12rem |
| space-x-48.space-x-reverse | margin-right: 12rem |
| space-x-52 | margin-left: 13rem |
| space-x-52.space-x-reverse | margin-right: 13rem |
| space-x-56 | margin-left: 14rem |
| space-x-56.space-x-reverse | margin-right: 14rem |
| space-x-60 | margin-left: 15rem |
| space-x-60.space-x-reverse | margin-right: 15rem |
| space-x-64 | margin-left: 16rem |
| space-x-64.space-x-reverse | margin-right: 16rem |
| space-x-72 | margin-left: 18rem |
| space-x-72.space-x-reverse | margin-right: 18rem |
| space-x-80 | margin-left: 20rem |
| space-x-80.space-x-reverse | margin-right: 20rem |
| space-x-96 | margin-left: 24rem |
| space-x-96.space-x-reverse | margin-right: 24rem |
| space-y-px | margin-top: 0.0625rem |
| space-y-px.space-y-reverse | margin-bottom: 0.0625rem |
| space-y-0 | margin-top: 0 |
| space-y-0.space-y-reverse | margin-bottom: 0 |
| space-y-none | margin-top: 0 |
| space-y-none.space-y-reverse | margin-bottom: 0 |
| space-y-0\.5 | margin-top: 0.125rem |
| space-y-0\.5.space-y-reverse | margin-bottom: 0.125rem |
| space-y-1 | margin-top: 0.25rem |
| space-y-1.space-y-reverse | margin-bottom: 0.25rem |
| space-y-1\.5 | margin-top: 0.375rem |
| space-y-1\.5.space-y-reverse | margin-bottom: 0.375rem |
| space-y-2 | margin-top: 0.5rem |
| space-y-2.space-y-reverse | margin-bottom: 0.5rem |
| space-y-2\.5 | margin-top: 0.625rem |
| space-y-2\.5.space-y-reverse | margin-bottom: 0.625rem |
| space-y-3 | margin-top: 0.75rem |
| space-y-3.space-y-reverse | margin-bottom: 0.75rem |
| space-y-3\.5 | margin-top: 0.875rem |
| space-y-3\.5.space-y-reverse | margin-bottom: 0.875rem |
| space-y-4 | margin-top: 1rem |
| space-y-4.space-y-reverse | margin-bottom: 1rem |
| space-y-5 | margin-top: 1.25rem |
| space-y-5.space-y-reverse | margin-bottom: 1.25rem |
| space-y-6 | margin-top: 1.5rem |
| space-y-6.space-y-reverse | margin-bottom: 1.5rem |
| space-y-7 | margin-top: 1.75rem |
| space-y-7.space-y-reverse | margin-bottom: 1.75rem |
| space-y-8 | margin-top: 2rem |
| space-y-8.space-y-reverse | margin-bottom: 2rem |
| space-y-9 | margin-top: 2.25rem |
| space-y-9.space-y-reverse | margin-bottom: 2.25rem |
| space-y-10 | margin-top: 2.5rem |
| space-y-10.space-y-reverse | margin-bottom: 2.5rem |
| space-y-11 | margin-top: 2.75rem |
| space-y-11.space-y-reverse | margin-bottom: 2.75rem |
| space-y-12 | margin-top: 3rem |
| space-y-12.space-y-reverse | margin-bottom: 3rem |
| space-y-14 | margin-top: 3.5rem |
| space-y-14.space-y-reverse | margin-bottom: 3.5rem |
| space-y-16 | margin-top: 4rem |
| space-y-16.space-y-reverse | margin-bottom: 4rem |
| space-y-18 | margin-top: 4.5rem |
| space-y-18.space-y-reverse | margin-bottom: 4.5rem |
| space-y-20 | margin-top: 5rem |
| space-y-20.space-y-reverse | margin-bottom: 5rem |
| space-y-24 | margin-top: 6rem |
| space-y-24.space-y-reverse | margin-bottom: 6rem |
| space-y-28 | margin-top: 7rem |
| space-y-28.space-y-reverse | margin-bottom: 7rem |
| space-y-32 | margin-top: 8rem |
| space-y-32.space-y-reverse | margin-bottom: 8rem |
| space-y-36 | margin-top: 9rem |
| space-y-36.space-y-reverse | margin-bottom: 9rem |
| space-y-40 | margin-top: 10rem |
| space-y-40.space-y-reverse | margin-bottom: 10rem |
| space-y-44 | margin-top: 11rem |
| space-y-44.space-y-reverse | margin-bottom: 11rem |
| space-y-48 | margin-top: 12rem |
| space-y-48.space-y-reverse | margin-bottom: 12rem |
| space-y-52 | margin-top: 13rem |
| space-y-52.space-y-reverse | margin-bottom: 13rem |
| space-y-56 | margin-top: 14rem |
| space-y-56.space-y-reverse | margin-bottom: 14rem |
| space-y-60 | margin-top: 15rem |
| space-y-60.space-y-reverse | margin-bottom: 15rem |
| space-y-64 | margin-top: 16rem |
| space-y-64.space-y-reverse | margin-bottom: 16rem |
| space-y-72 | margin-top: 18rem |
| space-y-72.space-y-reverse | margin-bottom: 18rem |
| space-y-80 | margin-top: 20rem |
| space-y-80.space-y-reverse | margin-bottom: 20rem |
| space-y-96 | margin-top: 24rem |
| space-y-96.space-y-reverse | margin-bottom: 24rem |
*/

17
scss/helper/typography/_font-size.scss
View File

@ -4,7 +4,22 @@
title: Font Size
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| text-xs | font-size: 0.75rem; line-height: 1rem |
| text-sm | font-size: 0.875rem; line-height: 1.25rem |
| text-base | font-size: 1rem; line-height: 1.5rem |
| text-md | font-size: 1.125rem; line-height: 1.75rem |
| text-lg | font-size: 1.25rem; line-height: 1.75rem |
| text-xl | font-size: 1.5rem; line-height: 2rem |
| text-2xl | font-size: 1.875rem; line-height: 2.25rem |
| text-3xl | font-size: 2.25rem; line-height: 2.5rem |
| text-4xl | font-size: 3rem; line-height: 1 |
| text-5xl | font-size: 3.75rem; line-height: 1 |
| text-6xl | font-size: 4.5rem; line-height: 1 |
| text-7xl | font-size: 6rem; line-height: 1 |
| text-8xl | font-size: 8rem; line-height: 1 |
*/

5
scss/helper/typography/_font-style.scss
View File

@ -4,7 +4,10 @@
title: Font Style
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| italic | font-style: italic |
| not-italic | font-style: normal |
*/

12
scss/helper/typography/_font-weight.scss
View File

@ -4,7 +4,17 @@
title: Font Weight
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| font-thin | font-weight: 100 |
| font-extralight | font-weight: 200 |
| font-light | font-weight: 300 |
| font-normal | font-weight: 400 |
| font-medium | font-weight: 500 |
| font-semibold | font-weight: 600 |
| font-bold | font-weight: 700 |
| font-extrabold | font-weight: 800 |
| font-black | font-weight: 900 |
*/

9
scss/helper/typography/_letter-spacing.scss
View File

@ -4,7 +4,14 @@
title: Letter Spacing
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| tracking-tighter | letter-spacing: -0.05em |
| tracking-tight | letter-spacing: -0.025em |
| tracking-normal | letter-spacing: 0em |
| tracking-wide | letter-spacing: 0.025 |
| tracking-wider | letter-spacing: 0.05em |
| tracking-widest | letter-spacing: 0.1em |
*/

17
scss/helper/typography/_line-height.scss
View File

@ -4,7 +4,22 @@
title: Line Height
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| leading-3 | line-height: 0.75rem |
| leading-4 | line-height: 1rem |
| leading-5 | line-height: 1.25rem |
| leading-6 | line-height: 1.5rem |
| leading-7 | line-height: 1.75rem |
| leading-8 | line-height: 2rem |
| leading-9 | line-height: 2.25rem |
| leading-10 | line-height: 2.5rem |
| leading-none | line-height: 1 |
| leading-tight | line-height: 1.25 |
| leading-snug | line-height: 1.375 |
| leading-normal | line-height: 1.5 |
| leading-relaxed | line-height: 1.625 |
| leading-loose | line-height: 2 |
*/

8
scss/helper/typography/_list-style-type.scss
View File

@ -4,7 +4,13 @@
title: List Style Type
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| list-none | list-style-type: none |
| list-disc | list-style-type: disc |
| list-decimal | list-style-type: decimal |
| list-inside | list-style-position: inside |
| list-outside | list-style-position: outside |
*/

7
scss/helper/typography/_text-align.scss
View File

@ -4,7 +4,12 @@
title: Text Align
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| text-left | text-align: left |
| text-center | text-align: center |
| text-right | text-align: right |
| text-justify | text-align: justify |
*/

106
scss/helper/typography/_text-color.scss
View File

@ -4,8 +4,112 @@
title: Text Color
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| text-transparent | color: transparent |
| text-current | color: currentColor |
| text-black | color: #000 |
| text-white | color: #fff |
| text-primary | color: #007bff |
| text-secondary | color: #6c757d |
| text-success | color: #28a745 |
| text-info | color: #17a2b8 |
| text-warning | color: #28a745 |
| text-danger | color: #dc3545 |
| text-light | color: #f8f9fa |
| text-dark | color: #343a40 |
| text-gray-50 | color: #f9fafb |
| text-gray-100 | color: #f3f4f6 |
| text-gray-200 | color: #e5e7eb |
| text-gray-300 | color: #d1d5db |
| text-gray-400 | color: #9ca3af |
| text-gray-500 | color: #6b7280 |
| text-gray-600 | color: #4b5563 |
| text-gray-700 | color: #374151 |
| text-gray-800 | color: #1f2937 |
| text-gray-900 | color: #111827 |
| text-red-50 | color: #fef2f2 |
| text-red-100 | color: #fee2e2 |
| text-red-200 | color: #fecaca |
| text-red-300 | color: #fca5a5 |
| text-red-400 | color: #f87171 |
| text-red-500 | color: #ef4444 |
| text-red-600 | color: #dc2626 |
| text-red-700 | color: #b91c1c |
| text-red-800 | color: #991b1b |
| text-red-900 | color: #7f1d1d |
| text-yellow-50 | color: #fffbeb |
| text-yellow-100 | color: #fef3c7 |
| text-yellow-200 | color: #fde68a |
| text-yellow-300 | color: #fcd34d |
| text-yellow-400 | color: #fbbf24 |
| text-yellow-500 | color: #f59e0b |
| text-yellow-600 | color: #d97706 |
| text-yellow-700 | color: #b45309 |
| text-yellow-800 | color: #92400e |
| text-yellow-900 | color: #78350f |
| text-green-50 | color: #ecfdf5 |
| text-green-100 | color: #d1fae5 |
| text-green-200 | color: #a7f3d0 |
| text-green-300 | color: #6ee7b7 |
| text-green-400 | color: #34d399 |
| text-green-500 | color: #10b981 |
| text-green-600 | color: #059669 |
| text-green-700 | color: #047857 |
| text-green-800 | color: #065f46 |
| text-green-900 | color: #064e3b |
| text-blue-50 | color: #eff6ff |
| text-blue-100 | color: #dbeafe |
| text-blue-200 | color: #bfdbfe |
| text-blue-300 | color: #93c5fd |
| text-blue-400 | color: #60a5fa |
| text-blue-500 | color: #3b82f6 |
| text-blue-600 | color: #2563eb |
| text-blue-700 | color: #1d4ed8 |
| text-blue-800 | color: #1e40af |
| text-blue-900 | color: #1e3a8a |
| text-cyan-50 | color: #ecfeff |
| text-cyan-100 | color: #cffafe |
| text-cyan-200 | color: #a5f3fc |
| text-cyan-300 | color: #67e8f9 |
| text-cyan-400 | color: #22d3ee |
| text-cyan-500 | color: #06b6d4 |
| text-cyan-600 | color: #0891b2 |
| text-cyan-700 | color: #0e7490 |
| text-cyan-800 | color: #155e75 |
| text-cyan-900 | color: #164e63 |
| text-indigo-50 | color: #eef2ff |
| text-indigo-100 | color: #e0e7ff |
| text-indigo-200 | color: #c7d2fe |
| text-indigo-300 | color: #a5b4fc |
| text-indigo-400 | color: #818cf8 |
| text-indigo-500 | color: #6366f1 |
| text-indigo-600 | color: #4f46e5 |
| text-indigo-700 | color: #4338ca |
| text-indigo-800 | color: #3730a3 |
| text-indigo-900 | color: #312e81 |
| text-purple-50 | color: #f5f3ff |
| text-purple-100 | color: #ede9fe |
| text-purple-200 | color: #ddd6fe |
| text-purple-300 | color: #c4b5fd |
| text-purple-400 | color: #a78bfa |
| text-purple-500 | color: #8b5cf6 |
| text-purple-600 | color: #7c3aed |
| text-purple-700 | color: #6d28d9 |
| text-purple-800 | color: #5b21b6 |
| text-purple-900 | color: #4c1d95 |
| text-pink-50 | color: #fdf2f8 |
| text-pink-100 | color: #fce7f3 |
| text-pink-200 | color: #fbcfe8 |
| text-pink-300 | color: #f9a8d4 |
| text-pink-400 | color: #f472b6 |
| text-pink-500 | color: #ec4899 |
| text-pink-600 | color: #db2777 |
| text-pink-700 | color: #be185d |
| text-pink-800 | color: #9d174d |
| text-pink-900 | color: #831843 |
还有 hover、active、focus、disabled 扩展，比如 `hover:text-black`
*/
@mixin text-colors-map(

6
scss/helper/typography/_text-decoration.scss
View File

@ -4,7 +4,11 @@
title: Text Decoration
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| underline | text-decoration: underline |
| line-through | text-decoration: line-through |
| no-underline | text-decoration: none |
*/

7
scss/helper/typography/_text-overflow.scss
View File

@ -4,7 +4,12 @@
title: Text OverFlow
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| truncate | overflow: hidden; text-overflow: ellipsis; white-space: nowrap |
| overflow-ellipsis | text-overflow: ellipsis |
| overflow-clip | text-overflow: clip |
*/

8
scss/helper/typography/_text-transform.scss
View File

@ -4,7 +4,13 @@
title: Text Transform
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| uppercase | text-transform: uppercase |
| lowercase | text-transform: lowercase |
| capitalize | text-transform: capitalize |
| normal-case | text-transform: none |
*/

10
scss/helper/typography/_vertical-align.scss
View File

@ -4,7 +4,15 @@
title: Vertial Align
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| align-baseline | vertical-align: baseline |
| align-top | vertical-align: top |
| align-middle | vertical-align: middle |
| align-bottom | vertical-align: bottom |
| align-text-top | vertical-align: text-top |
| align-text-bottom | vertical-align: text-bottom |
*/

9
scss/helper/typography/_whitespace.scss
View File

@ -4,7 +4,14 @@
title: Whitespace
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| align-normal | vertical-align: normal |
| align-nowrap | vertical-align: nowrap |
| align-pre | vertical-align: pre |
| align-pre-line | vertical-align: pre-line |
| align-pre-wrap | vertical-align: pre-wrap |
*/

7
scss/helper/typography/_word-break.scss
View File

@ -4,7 +4,12 @@
title: Word Break
---
待补充
| Class | Properties |
| ----------- | ------------------------ |
| break-normal | overflow-wrap: normal; word-break: normal |
| break-words | overflow-wrap: break-word |
| break-all | word-break: break-all |
*/