Documentation

This commit is contained in:
Lucas 2019-11-28 07:20:36 +07:00
parent 80ce6f23c1
commit f5e4d01cbb
18 changed files with 429 additions and 427 deletions

View file

@ -28,7 +28,7 @@ $enable-classes: true !default;
//
// Gutters and horizontals margins
// For <body>, '.row' (grids), <nav>, <table>
// For <body>, .grid, <nav>, <table>
$spacing-gutter: 1rem !default;
// Blocks verticals margins and paddings
@ -41,7 +41,6 @@ $spacing-block: 2rem !default;
$spacing-typography: 1.5rem !default;
// Padding for <input> and <button>
// (Vertical Horizontal)
$spacing-input-button: .75rem 1rem !default;
@ -66,7 +65,7 @@ $heading-weight: 700 !default;
// Blocks
//
// For <form> elements, <button>, card (<article>), inlined code, badge (<u>)
// For <form> elements, <button>, <article>, <details> inlined code, tooltips
$round: .25rem !default;
@ -107,7 +106,7 @@ $breakpoints: (
// Viewports
$viewports: (
// 'null' disable the viewport (max-width) on a breakpoint
// 'null' disable the viewport on a breakpoint
sm: 510px,
md: 700px,
lg: 920px,

View file

@ -196,6 +196,11 @@ textarea {
}
}
// Color
input[type="color"] {
height: calc(3rem + 2px); // HACK
}
// Select
select {
// Unstyle the caret on `<select>`s in IE10+.

View file

@ -14,15 +14,15 @@
// Layout
@import "layout/document"; // html
@import "layout/sectioning"; // body, header, main, footer
@import "layout/container"; // .container
@import "layout/container"; // .container, .container-fluid
@import "layout/section"; // main > section
@import "layout/grid"; // .grid
@import "layout/scroller"; // figure
// Content
@import "content/typography"; // a, headings, p, ul ...
@import "content/typography"; // a, headings, p, ul, blockquote ...
@import "content/form"; // label, input, select, ...
@import "content/button"; // button, a[role=button]
@import "content/button"; // button, a[role=button], ...
@import "content/table"; // table, tr, td, ...
@import "content/code"; // pre, code, ...
@import "content/miscs"; // hr, progress, template, [hidden]

View file

@ -20,10 +20,10 @@
--mark: #{rgba($amber-200, .25)};
// Call-to-Action
--primary: #{$primary-600};
--primary-hover: #{$primary-500};
--primary-focus: #{rgba($primary-600, .25)};
--primary-inverse: #{$white};
--primary: #{$primary-600};
--primary-hover: #{$primary-500};
--primary-focus: #{rgba($primary-600, .25)};
--primary-inverse: #{$white};
// Secondary Call-to-Action
--secondary: #{$grey-200};
@ -90,10 +90,10 @@
--mark: #{rgba($amber-200, .25)};
// Call-to-Action
--primary: #{$primary-600};
--primary-hover: #{$primary-500};
--primary-focus: #{rgba($primary-600, .25)};
--primary-inverse: #{$white};
--primary: #{$primary-600};
--primary-hover: #{$primary-500};
--primary-focus: #{rgba($primary-600, .25)};
--primary-inverse: #{$white};
// Secondary Call-to-Action
--secondary: #{$grey-200};

View file

@ -20,10 +20,10 @@
--mark: #{rgba($amber-200, .5)};
// Primary Call-to-Action
--primary: #{$primary-600};
--primary-hover: #{$primary-700};
--primary-focus: #{rgba($primary-600, .125)};
--primary-inverse: #{$white};
--primary: #{$primary-600};
--primary-hover: #{$primary-700};
--primary-focus: #{rgba($primary-600, .125)};
--primary-inverse: #{$white};
// Secondary Call-to-Action
--secondary: #{mix($grey-700, $grey-800)};