This repository has been archived by the owner on Aug 9, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
Updating Icons
Phil Schanely edited this page Mar 20, 2020
·
1 revision
When new icons are needed use the following process:
-
Work with Design to obtain an updated set of fonts and place them in the
app/assets/fonts/sage
folder, replacing the existingSage.eot
,Sage.svg
,Sage.ttf
,Sage.woff
, andSage.woff2
files there. -
Add the new icons to the icon token map:
- Open
app/assets/fonts/sage/Sage.svg
andapp/assets/fonts/sageapp/assets/stylesheets/sage/tokens/_icon.scss
- Look in
Sage.svg
for the new<glyph>
additions and add corresponding entries in the$sage-icons
map in_icon.scss
: Match theglyph-name
andunicode
attributes fromSage.svg
to the format already in place in_icons.scss
. - Add corresponding items in
app/views/sage/pages/icon.html.erb
following the format in place there. - Confirm that the new icons appear as expected in the Icons page in the browser.
- Open
-
Ensure that any pre-existing icon names and unicode characters are still in sync with the Icon tokens map. Work with Design to resolve the discrepancies, favoring keeping the Icon map file as the rule. Otherwise, changes will need to be considered throughout any application that uses Sage icons.
Getting Started
- Welcome
- Introduction
- Setup
- Installation
- Contributing
- Git/code workflow
- Local development In Kajabi-Products
- Updating Sage version and integrating into Kajabi
Guidelines
- Voice & Tone
- Product language
- Code Conventions
- JS & Test Binding Conventions
- Understanding and Maintaining Type Specs
- Updating Icons
- Using z-index
- Accessibility
- Browser support
- Color Spaces/Profiles
- Sharing In-progress Work
- Deprecation
Updates