search

jossef / material-design-icons-iconfont

Material Design icons + Development Experience
https://jossef.github.io/material-design-icons-iconfont
Apache License 2.0
455 stars 58 forks source link

"Off" icon (line from upper left to lower right) #95

Open flensrocker opened 7 months ago

flensrocker commented 7 months ago

I would like to overlay other icons, which don't have an "off" state, with this "off" icon, so I can visualize any icon as "not on".

My usecase: the priority_high icon

Alternative: an "no_priority" icon which is a strikethrough exclamation point.

flensrocker commented 7 months ago

I helped myself and created an SVG, which I can use as an Angular Material Icon, to strikethrough other icons. If anyone is interested, here's the SVG (you have to define a CSS variable with the current background color, to support different themes):

<svg width="24" height="24">
  <g>
    <rect fill="var(--my-background-color)" x="2" y="-1.5" width="23" height="2" transform="translate(3.5, 2) rotate(45)" />
    <rect x="2" y="0" width="23" height="1.75" transform="translate(3.5, 2) rotate(45)" />
  </g>
</svg>