There are two states for the Bell icon - the plain Bell and the Bell with an indicator that indicates there are unread[1] notifications in the center. The bell is only displayed if a user is logged in.
- Precondition: The Bell button is only displayed if the user is logged in
- In Explore feed, add left bar button Bell
- In Settings, only if the user has disabled the Explore feed, add right bar button Bell
- Add both Bell state images (logic to update the bell image state in separate ticket)
Product/Design Needs:
[1] Should the bell indicator stay on as long as there are unread notifications (not marked as read), or as long as there are unseen notifications (visiting the Notification Center flags as seen)?
Icons
Figma with icons: https://www.figma.com/file/cedgOU5CyOR0UVqtjDOvzE/iOS-Notifications?node-id=905%3A1582
Bell with badge | Bell outline with space for indicator | Indicator dot | Bell outline without indicator | |
---|---|---|---|---|
PNG | ||||
Colors | Primary link color + Destructive action color | Primary link color | Destructive action color | Primary link color |
Related
https://phabricator.wikimedia.org/T288773
https://phabricator.wikimedia.org/T287628