| Summary: | Request: better, more universal "sort options" icon | ||
|---|---|---|---|
| Product: | [Plasma] Breeze | Reporter: | Nate Graham <nate> |
| Component: | Icons | Assignee: | visual-design |
| Status: | RESOLVED FIXED | ||
| Severity: | normal | CC: | anditosan1000, kainz.a, null, rafael.brandmaier |
| Priority: | NOR | ||
| Version: | 5.11.2 | ||
| Target Milestone: | --- | ||
| Platform: | Other | ||
| OS: | Linux | ||
| Latest Commit: | https://commits.kde.org/breeze-icons/64b3a8fa6ff713c526e2ebdc607865b8475c72a2 | Version Fixed In: | 5.53 |
| Sentry Crash Report: | |||
| Attachments: | datasort | ||
|
Description
Nate Graham
2018-04-20 02:18:41 UTC
This need came up in https://phabricator.kde.org/D12337. The best icon I could find was the proposed sorting menu was "itemize", but even that didn't really do it. BTW other apps that have recently had a need for this icon include Discover and Elisa. We probably cannot avoid some subtle reference to order or direction in the visual language of a sort icon, but I agree it has to be generic enough to not fit only for one specific type of ordering. FWIW, https://www.materialui.co/icon/sort known from many Android apps works well for me, although for Breeze probably some adjustments to the line weight are needed. Options I like: - https://image.flaticon.com/icons/svg/159/159799.svg - https://image.flaticon.com/icons/svg/565/565620.svg - https://image.flaticon.com/icons/svg/219/219380.svg - https://image.flaticon.com/icons/svg/690/690319.svg If the icon has arrows, we need them to be pointing in both directions to avoid suggesting descending or ascending order (it has to work for either one) I'd also like to avoid numbers or letters, as that would imply that the current sort order is alphabetical or by size or something, when, again, the icon needs to work for either one. Basically it needs to suggest the *concept* of sorting without seeming to imply a specific sorting mode. The first two options are my favorite. It is as simple as the concept gets. Another idea: https://image.flaticon.com/icons/png/512/644/644070.png I'll leave it to icon folks now. We'd really like to get this in for Frameworks 5.47, as it's required for us to land https://phabricator.kde.org/D12337 Created attachment 112516 [details]
datasort
this is what LibreOffice use for data sort
I slightly prefer the ones that have horizontal bars in them; I think they help suggest what's being sorted. The arrows alone are a bit ambiguous. I'm working on this at https://phabricator.kde.org/D16905 I would appreciate your thoughts on this as the proposal is close to final Git commit 64b3a8fa6ff713c526e2ebdc607865b8475c72a2 by Noah Davis, on behalf of Rafael Brandmaier.
Committed on 17/11/2018 at 20:31.
Pushed by ndavis into branch 'master'.
Add new generic sorting icons; rename existing sorting icons
Summary:
Add a generic sorting options icons as requested in {D12337} as well as version with ascending and descending orders.
FIXED-IN: 5.53
The existing `view-sort-ascending` and `view-sort-descending` have been renamed `view-sort-ascending-name` and `view-sort-descending-name` as they show alphabetic characters to depict alphabetic sorting. The symbolic link `sort-name` has been changed to point to `view-sort-ascending-name` (from `view-sort-ascending`).
Their fallback colors in the embedded stylesheets have been updated to use Shade Black and Cardboard White, respectively.
Test Plan:
The new icons:
| size | `view-sort` | `view-sort-descending` | `view-sort-ascending`
| ----- | ----- | ----- | -----
|`16px`|{F6427148}|{F6428784}|{F6428785}
|`22px` and `24px`|{F6427153}|{F6428786}|{F6428787}
|`32px`|{F6429216}|{F6429219}|{F6429218}
Reviewers: #vdg, #breeze, ndavis
Reviewed By: #vdg, ndavis
Subscribers: cfeck, emateli, ndavis, ngraham, kde-frameworks-devel
Tags: #frameworks
Differential Revision: https://phabricator.kde.org/D16905
M +1 -1 icons-dark/actions/16/sort-name.svg
C +1 -1 icons-dark/actions/16/view-sort-ascending-name.svg [from: icons/actions/16/view-sort-ascending.svg - 097% similarity]
M +1 -13 icons-dark/actions/16/view-sort-ascending.svg
C +1 -1 icons-dark/actions/16/view-sort-descending-name.svg [from: icons-dark/actions/16/view-sort-descending.svg - 098% similarity]
M +1 -13 icons-dark/actions/16/view-sort-descending.svg
A +1 -0 icons-dark/actions/16/view-sort.svg
M +1 -1 icons-dark/actions/22/sort-name.svg
C +1 -1 icons-dark/actions/22/view-sort-ascending-name.svg [from: icons-dark/actions/22/view-sort-ascending.svg - 098% similarity]
M +1 -14 icons-dark/actions/22/view-sort-ascending.svg
C +1 -1 icons-dark/actions/22/view-sort-descending-name.svg [from: icons/actions/22/view-sort-descending.svg - 098% similarity]
M +1 -14 icons-dark/actions/22/view-sort-descending.svg
A +1 -0 icons-dark/actions/22/view-sort.svg
M +1 -1 icons-dark/actions/24/sort-name.svg
C +1 -1 icons-dark/actions/24/view-sort-ascending-name.svg [from: icons/actions/24/view-sort-ascending.svg - 098% similarity]
M +1 -13 icons-dark/actions/24/view-sort-ascending.svg
C +1 -1 icons-dark/actions/24/view-sort-descending-name.svg [from: icons/actions/24/view-sort-descending.svg - 098% similarity]
M +1 -13 icons-dark/actions/24/view-sort-descending.svg
A +1 -0 icons-dark/actions/24/view-sort.svg
C +1 -1 icons-dark/actions/32/view-sort-ascending-name.svg [from: icons-dark/actions/32/view-sort-ascending.svg - 098% similarity]
M +1 -18 icons-dark/actions/32/view-sort-ascending.svg
C +1 -1 icons-dark/actions/32/view-sort-descending-name.svg [from: icons-dark/actions/32/view-sort-descending.svg - 098% similarity]
M +1 -18 icons-dark/actions/32/view-sort-descending.svg
A +1 -0 icons-dark/actions/32/view-sort.svg
M +1 -1 icons/actions/16/sort-name.svg
C +1 -1 icons/actions/16/view-sort-ascending-name.svg [from: icons/actions/16/view-sort-ascending.svg - 097% similarity]
M +1 -13 icons/actions/16/view-sort-ascending.svg
C +1 -1 icons/actions/16/view-sort-descending-name.svg [from: icons-dark/actions/16/view-sort-descending.svg - 098% similarity]
M +1 -13 icons/actions/16/view-sort-descending.svg
A +1 -0 icons/actions/16/view-sort.svg
M +1 -1 icons/actions/22/sort-name.svg
C +1 -1 icons/actions/22/view-sort-ascending-name.svg [from: icons-dark/actions/22/view-sort-ascending.svg - 098% similarity]
M +1 -14 icons/actions/22/view-sort-ascending.svg
C +1 -1 icons/actions/22/view-sort-descending-name.svg [from: icons/actions/22/view-sort-descending.svg - 098% similarity]
M +1 -14 icons/actions/22/view-sort-descending.svg
A +1 -0 icons/actions/22/view-sort.svg
M +1 -1 icons/actions/24/sort-name.svg
C +1 -1 icons/actions/24/view-sort-ascending-name.svg [from: icons/actions/24/view-sort-ascending.svg - 098% similarity]
M +1 -13 icons/actions/24/view-sort-ascending.svg
C +1 -1 icons/actions/24/view-sort-descending-name.svg [from: icons/actions/24/view-sort-descending.svg - 098% similarity]
M +1 -13 icons/actions/24/view-sort-descending.svg
A +1 -0 icons/actions/24/view-sort.svg
C +1 -1 icons/actions/32/view-sort-ascending-name.svg [from: icons-dark/actions/32/view-sort-ascending.svg - 098% similarity]
M +1 -18 icons/actions/32/view-sort-ascending.svg
C +1 -1 icons/actions/32/view-sort-descending-name.svg [from: icons-dark/actions/32/view-sort-descending.svg - 098% similarity]
M +1 -18 icons/actions/32/view-sort-descending.svg
A +1 -0 icons/actions/32/view-sort.svg
https://commits.kde.org/breeze-icons/64b3a8fa6ff713c526e2ebdc607865b8475c72a2
Woohoo! |
