Notes
Notes are containers that temporarily display short, contextual text. They are typically activated when a user hovers over an icon or other trigger.
Download CSS for NotesDirect Dependencies:
bootstrap.bundle.min.js
root.css
colors.css
notes.css
When to use
Notes is similar to popover but is not used for the same purpose. Identifying the right use case will make the experience clear for all users.
| Component | Use cases |
|---|---|
| Notes | Note is a container that temporarily displays a short, text-only definition and is activated when a user hovers or focuses on an icon or other trigger. Limit note content to short descriptions written in sentence case. If content is a full sentence, use punctuation. |
Standarts
Minimal width of element with notes is 5rem width.
Minimal height of element with notes is 3rem height.
State secrets & launch codes
| Some Information Here | Some Information Here | Some Information Here | Some Information Here | Some Information Here | Some Information Here | Some Information Here | Some Information Here | Some Information Here |
Some Information Here
|