-
Notifications
You must be signed in to change notification settings - Fork 11
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🤑 🤑 🤑 Left a few notes!
src/components/themes/themes.js
Outdated
@@ -93,6 +93,15 @@ const themes = { | |||
color: '#cf1c61', | |||
borderColor: '#fd8ac0' | |||
} | |||
}, | |||
pricing: { | |||
image: <Image icon="cart" color="green" />, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@HeyStenson What do you think about creditcard
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Much better! I didn't see that one, probably bc I was too fixated on finding 💸 😆
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
wow this is so great!
src/components/themes/themes.js
Outdated
}, | ||
pricing: { | ||
image: <Image icon="cart" color="green" />, | ||
label: 'Download', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@HeyStenson This will be the default title for the Note so you'll want to switch this label to "Pricing" or something similar.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Eep, copy-paste fail. Thanks for catching this!
<div> | ||
{' '} | ||
<Note theme="pricing">pricing note</Note> | ||
<Tag theme="pricing" /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@HeyStenson do you think you'll be using a pricing Tag? Just checking since some themes have a tag, other don't. If you do have use for a pricing tag, you'll also want to update the Tag component's propTypes to include "pricing" as a theme option.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Oh hmmm, I hadn't considered this! But I think it could be useful - we could use it to differentiate pricing pages in the list of guides. I'll add this in!
Thanks @katydecorah! I updated the icon for the note theme from 🛒 to 💳 , and added a tag. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
thank you for this awesome follow up, @HeyStenson! Your last screenshot still has the shopping cart. Did it change?
and for helping out, @katydecorah!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
💸 💸 💸
pricing: { | ||
image: <Image icon="creditcard" color="green" />, | ||
label: 'Pricing', | ||
tooltipText: 'This contains information about product pricing.', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice!
@jc-clark loool, apparently I just pasted the old screenshot 😅 here's the new screenshot with the |
@katydecorah are there any other changes coming up to wait for, or should we cut a new release for this change only? |
@HeyStenson Nothing else! You can cut a release for this change only. |
* main: (24 commits) 3.3.1 Prepare 3.3.1 The `edit.css` prop is optional when displaying `Edit` in `CodeSnippet` (#421) 3.3.0 Prepare 3.3.0 Bump elliptic from 6.5.3 to 6.5.4 (#417) When `maxHeight` is set, move `Edit` buttons in `CodeSnippet` above the code (#420) Update CONTRIBUTING.md (#418) 3.2.0 update version number in changelog Add pricing theme to Note component (#416) 3.1.0 Prepare 3.1.0 Make `filename` required for `CodeSnippetTitle` (#413) Update package-lock.json (#412) Make `css` optional in Edit and CodeSnippet components (#293) Remove HelpPage, NavigationDropdown, SectionedNavigation, TopbarSticker, Topbar components (#407) Update prism (#411) 3.0.1 Fix CSS for code elements in headings (#409) ...
* main: (24 commits) 3.3.1 Prepare 3.3.1 The `edit.css` prop is optional when displaying `Edit` in `CodeSnippet` (#421) 3.3.0 Prepare 3.3.0 Bump elliptic from 6.5.3 to 6.5.4 (#417) When `maxHeight` is set, move `Edit` buttons in `CodeSnippet` above the code (#420) Update CONTRIBUTING.md (#418) 3.2.0 update version number in changelog Add pricing theme to Note component (#416) 3.1.0 Prepare 3.1.0 Make `filename` required for `CodeSnippetTitle` (#413) Update package-lock.json (#412) Make `css` optional in Edit and CodeSnippet components (#293) Remove HelpPage, NavigationDropdown, SectionedNavigation, TopbarSticker, Topbar components (#407) Update prism (#411) 3.0.1 Fix CSS for code elements in headings (#409) ...
* main: 3.3.1 Prepare 3.3.1 The `edit.css` prop is optional when displaying `Edit` in `CodeSnippet` (#421) 3.3.0 Prepare 3.3.0 Bump elliptic from 6.5.3 to 6.5.4 (#417) When `maxHeight` is set, move `Edit` buttons in `CodeSnippet` above the code (#420) Update CONTRIBUTING.md (#418) 3.2.0 update version number in changelog Add pricing theme to Note component (#416)
* main: (93 commits) Enforces where React component static properties should be positioned (#429) Node 12 (#428) 3.3.1 Prepare 3.3.1 The `edit.css` prop is optional when displaying `Edit` in `CodeSnippet` (#421) 3.3.0 Prepare 3.3.0 Bump elliptic from 6.5.3 to 6.5.4 (#417) When `maxHeight` is set, move `Edit` buttons in `CodeSnippet` above the code (#420) Update CONTRIBUTING.md (#418) 3.2.0 update version number in changelog Add pricing theme to Note component (#416) 3.1.0 Prepare 3.1.0 Make `filename` required for `CodeSnippetTitle` (#413) Update package-lock.json (#412) Make `css` optional in Edit and CodeSnippet components (#293) Remove HelpPage, NavigationDropdown, SectionedNavigation, TopbarSticker, Topbar components (#407) Update prism (#411) ...
This PR creates a new theme that we can use for notes that are specifically about pricing topics. @jc-clark lmk what you think - is the shopping cart icon too on the nose? 😆 If so, we could definitely change it to something else from https://labs.mapbox.com/assembly/icons/ (maybe
alert
?).How to test
QA checklist
#.#.#
.Open the test cases app locally on:
Before merge
npx browserslist@latest --update-db
to update the browser data and commit any changes to package-lock.json.