Core HTML Element Atom: Button #110
Labels
Milestone
Comments
arcticicestudio
added a commit
that referenced
this issue
Jan 8, 2019
It provides multiple variations: - `primary` — uses the primary color `nord8` for background/border/text colorization - `secondary` — uses the secondary color `nord9` for background/border/text colorization - `simple` — uses the _Snow Storm_ and _Polar Night_ palettes for background/border/text colorization - `subtle` — only colorizes the background on hover using the "Snow Storm" and "Polar Night" palettes for background/border/text colorization Next to variations there are additional props to toggle more styles: - `dashed` — uses the `dashed` property for the CSS `border-style` (1) attribute - `ghost` — only uses a border instead of a background color - `outlined` — uses uses a border in addition to a background color - `quiet` — keeps the initial text colorization on hover References: (1) https://developer.mozilla.org/en-US/docs/Web/CSS/border-style Associated epic: GH-63 GH-110
arcticicestudio
added a commit
that referenced
this issue
Jan 8, 2019
It consists of the previously implemented styles and variants and represents a `<button>` (1). Next to this is can also wrap the base HTML element atom `A` (2) to handle internal and external links. References: (1) https://developer.mozilla.org/de/docs/Web/HTML/Element/button (2) #70 Associated epic: GH-63 GH-110
arcticicestudio
added a commit
that referenced
this issue
Jan 8, 2019
…-element-atom-button Core HTML Element Atom: Button
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This issue documents the implementation of the core base HTML element atom
Buttonthat represents a<button>with matching brand styles. It can also wrap the base HTML element atomAto handle internal and external links.It will provide multiple variations:
primary— uses the primary colornord8for background/border/text colorizationsecondary— uses the secondary colornord9for background/border/text colorizationsimple— uses the Snow Storm and Polar Night palettes for background/border/text colorizationsubtle— only colorizes the background on hover using the Snow Storm and Polar Night palettes for background/border/text colorizationNext to variations there will be additional props to toggle more styles:
dashed— uses thedashedproperty for the CSSborder-styleattributeghost— only uses a border instead of a background coloroutlined— uses uses a border in addition to a background colorquiet— keeps the initial text colorization on hoverTasks
Link.The text was updated successfully, but these errors were encountered: