<path d="M3 7l9 6l.565 -.377m2.435 -1.623l6 -4"/>
<path d="M3 3l18 18"/>
</symbol>
- <symbol viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" id="icon--error">
- <path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"/>
- <path d="M12 9v4"/>
- <path d="M12 16v.01"/>
- </symbol>
<symbol viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" id="icon--fav">
<path d="M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z"/>
</symbol>
stroke: #c61a1a;
}
-svg.icon-error {
- stroke: #f37c60;
-}
-
svg.icon-ok {
stroke: #5db651;
}
+.icon-error svg.icon-svg {
+ stroke: #c61a1a
+}
+
.icon-warning svg {
stroke: #e4bc4b;
}
.icon-time-add:not(:has(svg)) { background-image: url(/time_add.png); }
.icon-stats:not(:has(svg)) { background-image: url(/stats.png); }
.icon-warning:not(:has(svg)) { background-image: url(/warning.png); }
-.icon-error:not(svg) { background-image: url(/exclamation.png); }
+.icon-error:not(:has(svg)) { background-image: url(/exclamation.png); }
.icon-fav:not(:has(svg)) { background-image: url(/fav.png); }
.icon-fav-off:not(:has(svg)) { background-image: url(/fav_off.png); }
.icon-reload:not(:has(svg)) { background-image: url(/reload.png); }
.icon-email:not(:has(svg)) { background-image: url(/email.png); }
.icon-email-disabled:not(:has(svg)) { background-image: url(/email_disabled.png); }
.icon-email-add:not(:has(svg)) { background-image: url(/email_add.png); }
-.icon-ok:not(svg) { background-image: url(/true.png); }
+.icon-ok:not(:has(svg)) { background-image: url(/true.png); }
.icon-not-ok:not(svg) { background-image: url(/false.png); }
.icon-link-break:not(:has(svg)) { background-image: url(/link_break.png); }
.icon-list:not(:has(svg)) { background-image: url(/text_list_bullets.png); }
def sprite_icon(icon_name, size: DEFAULT_ICON_SIZE, sprite: DEFAULT_SPRITE, css_class: nil)
sprite_path = "#{sprite}.svg"
+ css_classes = "s#{size} icon-svg"
+ css_classes += " #{css_class}" unless css_class.nil?
content_tag(
:svg,
content_tag(:use, '', { 'href' => "#{asset_path(sprite_path)}#icon--#{icon_name}" }),
- class: "s#{size} icon-svg",
+ class: css_classes,
aria: {
hidden: true
}
<% @checklist.each do |label, result| %>
<tr>
<td class="name"><%= label.is_a?(Symbol) ? l(label) : label %></td>
- <td class="tick"><%= result ? sprite_icon('checked', css_class: "icon-ok") : sprite_icon('error', css_class: "icon-error") %></td>
+ <td class="tick">
+ <span class="icon-only icon-<%= result ? "ok" : "error" %>">
+ <%= result ? sprite_icon('checked') : sprite_icon('warning') %>
+ </span>
+ </td>
</tr>
<% end %>
</table>