feat(Icon): add an examples for color prop #1275
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 0fa440d:
|
Gatsby Cloud Build ReportDNB Eufemia Portal 🎉 Your build was successful! See the Deploy preview here. Build Details🕐 Build time: 8m PerformanceLighthouse report
|
thaytharma
force-pushed
the
feat/icon-colors
branch
from
6f4f405
to
80acff1
Compare
tujoworker
approved these changes
Feb 18, 2022
| @@ -11,7 +11,7 @@ showTabs: true | |||
| | `border` | _(optional)_ use `true` to display a rounded border with an inherited color. Keep in mind that the icon will have a larger total width and height of `+0.5em`. | | |||
| | `alt` | _(optional)_ the alternative label (text version) of the icon. Defaults to the imported icon name. | | |||
| | `size` | _(optional)_ the dimension of the icon. This will be the `viewBox` and represent `width` and `height`. Defaults to `16`. You can use `small`,`medium`, `large` or `auto`. Auto will enable that the icon size gets inherited by the parent HTML element if it provides a `font-size`. | | |||
| | `color` | _(optional)_ sets a color property to the `svg` markup. Default is no color, which means _black_ | | |||
| | `color` | _(optional)_ sets a color property to the `svg` markup. Default is no color, which means _black._ `color` can be any valid color property, such as Hex, RGB or any CSS variable from the [colors table](/uilib/usage/customisation/colors), e.g. `var(--color-ocean-green)`. | | |||
There was a problem hiding this comment.
Suggested change
| | `color` | _(optional)_ sets a color property to the `svg` markup. Default is no color, which means _black._ `color` can be any valid color property, such as Hex, RGB or any CSS variable from the [colors table](/uilib/usage/customisation/colors), e.g. `var(--color-ocean-green)`. | | |
| | `color` | _(optional)_ the color can be any valid color property, such as Hex, RGB or preferable – any CSS variable from the [colors table](/uilib/usage/customisation/colors), e.g. `var(--color-ocean-green)`. Default is no color, which means `--color-black-80`. | |
There was a problem hiding this comment.
Good suggestion! This has been updated 😊
thaytharma
force-pushed
the
feat/icon-colors
branch
from
80acff1
to
0fa440d
Compare
tujoworker
pushed a commit
that referenced
this pull request
Feb 21, 2022
# [9.23.0-beta.4](v9.23.0-beta.3...v9.23.0-beta.4) (2022-02-21) ### Bug Fixes * **Dropdown:** disabled tertiary dropdown ([c1b4c4b](c1b4c4b)) * **Styles:** ensure independent styling packages have declared their dependencies ([8b3c230](8b3c230)) ### Features * **esm:** remove esm directory in package build ([f189b62](f189b62)) * **Icon:** add examples for color property ([#1275](#1275)) ([67f8121](67f8121)) * **Tabs:** Enhance parent width handling and remove auto edge detection ([d002f2c](d002f2c)) * **TypeScript:** remove original ts/tsx files and only leave type definition files ([#1292](#1292)) ([79bdfb4](79bdfb4))
|
🎉 This PR is included in version 9.23.0-beta.4 🎉 The release is available on: Your semantic-release bot 📦🚀 |
tujoworker
pushed a commit
that referenced
this pull request
Feb 22, 2022
# [9.23.0](v9.22.0...v9.23.0) (2022-02-22) ### Bug Fixes * **Dropdown:** disabled tertiary dropdown ([c1b4c4b](c1b4c4b)) * **Modal:** add possibility for camelcase props ([4127452](4127452)) * **ProgressIndicator:** css change to fix aliasing artifacts for ProgressIndicator ([ab8859e](ab8859e)) * set Eufemia.version during release ([e74d441](e74d441)) * **Styles:** ensure independent styling packages have declared their dependencies ([8b3c230](8b3c230)) * **Tabs:** align to new UX designs ([794bf70](794bf70)) * **Tag:** fix Tag.Group spacing ([d7b77a2](d7b77a2)) ### Features * **esm:** remove esm directory in package build ([f189b62](f189b62)) * **Icon:** add examples for color property ([#1275](#1275)) ([67f8121](67f8121)) * Separate Drawer and Dialog from Modal ([ebe8e6a](ebe8e6a)) * **Tabs:** Enhance parent width handling and remove auto edge detection ([99ed393](99ed393)) * **TypeScript:** remove original ts/tsx files and only leave type definition files ([#1292](#1292)) ([79bdfb4](79bdfb4))
|
🎉 This PR is included in version 9.23.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Added examples for color property in
Icon.Also added some info about using CSS variables as a color option in the docs.