We have a number of labels in DevTools which are using sentence case ("This is a label") instead of the expected Title Case "This Is a Label").
Guidelines: https://design.firefox.com/photon/copy/capitalization.html
We should fix those labels to make the UI more consistent.
I'm not sure about tooltips. Here are a few from Inspector:
- Title case: "Create New Node".
- Sentence case: "Grab a color from the page", "Toggle on the 3-pane inspector", "Add new rule", "Toggle pseudo-classes", "Toggle classes", "Highlight all elements matching this selector", "Click to open the color picker, Shift+Click to change the color format".
Tooltips can be short but oftentimes they're longer or more detailed labels than a "primary" label. Maybe sentence case makes sense here?
## Inspector
- Computed: "Browser styles"
- Fonts: "All fonts on page", "Font preview text"
## Console
- "Filter output"
- All the labels in the context menu: "Store as global variables", "Copy message", "Copy object", "Select all", "Export visible messages to clipboard", "Open in sidebar"
## Debugger
Basically Debugger is 100% sentence case, except for the "XHR Breakpoints" label? Is that desirable?
- Sources context menu entries
- Tabs context menu entries
- Editor context menu entries
- "Watch expressions", "Call stack"
- "Pause on exceptions", "Pause on caught exceptions"
- "Pause on any URL", "Break when URL contains"
- etc.
## Style Editor
- Settings menu: "Show original sources", "Show @media sidebar"
- Editor context menu: "Jump to line"
- Media query sidebar: "@media rules" (maybe "Media Queries" here?)
## Network
Toolbar:
- "Disable cache"
- "No throttling"
Headers tab:
- "Request method"
- "Request address"
- "Status code"
- "Filter headers"
- "Response headers"
- "Request headers"
- "Raw headers"
Cookies tab:
- "Filter cookies"
- "Response cookies"
- "Request cookies"
Params tab:
- "Filter request parameters"
- "Query string"
Response tab:
- "Response payload"
Timings tab:
- "DNS resolution"
- "TLS setup"
## Storage
Cookies:
- "Filter items"
- "Expires on" (rule = don't capitalize prepositions unless they're the first or last word of the text element)
- "Last accessed on"
Bug 1541411 Comment 0 Edit History
Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.
We have a number of labels in DevTools which are using sentence case ("This is a label") instead of the expected Title Case "This Is a Label").
Guidelines: https://design.firefox.com/photon/copy/capitalization.html
We should fix those labels to make the UI more consistent.
I'm not sure about tooltips. Here are a few from Inspector:
- Title case: "Create New Node".
- Sentence case: "Grab a color from the page", "Toggle on the 3-pane inspector", "Add new rule", "Toggle pseudo-classes", "Toggle classes", "Highlight all elements matching this selector", "Click to open the color picker, Shift+Click to change the color format".
Tooltips can be short but oftentimes they're longer or more detailed labels than a "primary" label. Maybe sentence case makes sense here?
## Inspector
- Computed: "Browser styles"
- Fonts: "All fonts on page", "Font preview text"
- Layout: "CSS Grid is not in use on this page" -> keep the current case, but it needs a final dot to be consistent with similar messages in Layout>Flexbox and in Fonts.
## Console
- "Filter output"
- All the labels in the context menu: "Store as global variables", "Copy message", "Copy object", "Select all", "Export visible messages to clipboard", "Open in sidebar"
## Debugger
Basically Debugger is 100% sentence case, except for the "XHR Breakpoints" label? Is that desirable?
- Sources context menu entries
- Tabs context menu entries
- Editor context menu entries
- "Watch expressions", "Call stack"
- "Pause on exceptions", "Pause on caught exceptions"
- "Pause on any URL", "Break when URL contains"
- etc.
## Style Editor
- Settings menu: "Show original sources", "Show @media sidebar"
- Editor context menu: "Jump to line"
- Media query sidebar: "@media rules" (maybe "Media Queries" here?)
## Network
Toolbar:
- "Disable cache"
- "No throttling"
Headers tab:
- "Request method"
- "Request address"
- "Status code"
- "Filter headers"
- "Response headers"
- "Request headers"
- "Raw headers"
Cookies tab:
- "Filter cookies"
- "Response cookies"
- "Request cookies"
Params tab:
- "Filter request parameters"
- "Query string"
Response tab:
- "Response payload"
Timings tab:
- "DNS resolution"
- "TLS setup"
## Storage
Cookies:
- "Filter items"
- "Expires on" (rule = don't capitalize prepositions unless they're the first or last word of the text element)
- "Last accessed on"