Feature #43280
closed
Improve visual distinction of link presence in SVG icons
Added by Go MAEDA 24 days ago.
Updated 15 days ago.
Description
Right now, SVG icons are shown in the same blue color as link text, so it is hard to recognize whether an icon is actually a link.
This patch changes the colors: non-link icons will be dark gray (oc-gray-8), slightly lighter than the body text, while link icons will remain blue (oc-blue-9). This makes it easier to see which icons can be clicked.
Before:
After:
Files
+1
It's inconvenient when you can't tell whether it's a link until you hover over it. I think this is a very good change.
- Target version set to 6.0.8
Updated the patch.
The value of the fill property for svg.icon-svg-filled selector should be var(--oc-gray-8) instead of var(--oc-gray-9).
- Status changed from New to Resolved
- Assignee set to Go MAEDA
- Resolution set to Fixed
Merged the change into 6.1-stable brnach in r24026.
There were places where the Edit link icon appeared gray.
This happens because the .icon class is applied to a span tag instead of an a tag, so I think the following diff will fix it.
diff --git a/app/views/issues/_form.html.erb b/app/views/issues/_form.html.erb
index 4551adda7..4ef58d657 100644
--- a/app/views/issues/_form.html.erb
+++ b/app/views/issues/_form.html.erb
@@ -40,7 +40,7 @@
}.merge(list_autofill_data_attributes),
:no_label => true %>
<% end %>
- <%= link_to_function content_tag(:span, sprite_icon('edit', l(:button_edit)), :class => 'icon icon-edit'), '$(this).hide(); $("#issue_description_and_toolbar").show()' unless @issue.new_record? %>
+ <%= link_to_function content_tag(:span, sprite_icon('edit', l(:button_edit))), '$(this).hide(); $("#issue_description_and_toolbar").show()', :class => 'icon icon-edit' unless @issue.new_record? %>
</p>
<%= wikitoolbar_for 'issue_description', preview_issue_path(:project_id => @issue.project, :issue_id => @issue.id) %>
<% end %>
Mizuki ISHIKAWA wrote in #note-6:
There were places where the Edit link icon appeared gray.
This happens because the .icon class is applied to a span tag instead of an a tag, so I think the following diff will fix it.
Committed the fix in r24044, and merged to 6.1-stable branch in r24045. Thank you.
- Status changed from Resolved to Closed
- Target version changed from 6.0.8 to 6.1.1
- Related to Defect #43358: Code block copy button icon appears gray instead of blue added
Also available in: Atom
PDF
Updated by 
Updated by 
Updated by