diff --git a/docs/Icon-guidelines.md b/docs/Icon-guidelines.md new file mode 100644 index 000000000..9d5268358 --- /dev/null +++ b/docs/Icon-guidelines.md @@ -0,0 +1,16 @@ +# Icon Usage Guidelines + +This folder contains SVG icons that are used in the design system. When using +icons from this folder, please follow the guidelines below: + +- Icons located in public/ folder is the current source of truth. All icons +will be placed in this folder. Ensure that icons placed gere are using the +`class` attribute, and not `className` for SVG element. + +- For icons used in React components that require class modifications or +similar, first create the icon in public/icons, and then manually copy the SVG +from the `public/icons` folder and make any necessary changes, i.e replacing +the `class` with `className` or other modifications. + +Currently, there is no automated solution for this process that ensures +consistency for this. This may be changed in the future. diff --git a/public/icons/README.md b/public/icons/README.md index b989ace15..5279acc96 100644 --- a/public/icons/README.md +++ b/public/icons/README.md @@ -1,9 +1,3 @@ # Icon Usage Guidelines -This folder contains SVG icons that are used in the design system. When using icons from this folder, please follow the guidelines below: - -- Icons located in public/ folder is the current source of truth. All icons will be placed in this folder. Ensure that icons placed gere are using the `class` attribute, and not `className` for SVG element. This is necessary for the icons to work properly when the folder is copied over using the "dapple"-setup. - -- For icons used in React components that require class modifications or similar, first create the icon in public/icons, and then manually copy the SVG from the `public/icons` folder and make any necessary changes, i.e replacing the `class` with `className` or other modifications. - -Currently, there is no automated solution for this process that ensures consistency for this. This may be changed in the future. \ No newline at end of file +For information on how to use icons for this project, see [icon-guidelines.md](../../docs/Icon-guidelines.md).