feat(icons): add flag, repeat, tag and close glyphs
This commit is contained in:
@@ -15,7 +15,11 @@ export type IconName =
|
|||||||
| "projects"
|
| "projects"
|
||||||
| "review"
|
| "review"
|
||||||
| "settings"
|
| "settings"
|
||||||
|
| "flag"
|
||||||
|
| "repeat"
|
||||||
|
| "tag"
|
||||||
| "plus"
|
| "plus"
|
||||||
|
| "close"
|
||||||
| "chevron";
|
| "chevron";
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
@@ -227,6 +231,64 @@ export default function Icon({ name, size = 22, color = C.textSecondary, bg = C.
|
|||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
case "flag":
|
||||||
|
return (
|
||||||
|
<View style={box}>
|
||||||
|
{/* Pole plus a pennant — reads as a priority flag at 20px where a
|
||||||
|
detailed banner outline would smear into a blob. */}
|
||||||
|
<View style={{ position: "absolute", left: size * 0.26, top: size * 0.12, width: w, height: size * 0.76, borderRadius: 1, backgroundColor: color }} />
|
||||||
|
<View
|
||||||
|
style={{
|
||||||
|
position: "absolute",
|
||||||
|
left: size * 0.26 + w,
|
||||||
|
top: size * 0.14,
|
||||||
|
width: size * 0.44,
|
||||||
|
height: size * 0.34,
|
||||||
|
borderTopRightRadius: 2,
|
||||||
|
borderBottomRightRadius: 2,
|
||||||
|
backgroundColor: color,
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
|
||||||
|
case "repeat":
|
||||||
|
return (
|
||||||
|
<View style={box}>
|
||||||
|
{/* Two offset bars with opposing arrowheads: a loop, without the
|
||||||
|
anti-aliasing mush a thin circular arc gets at this size. */}
|
||||||
|
<View style={{ position: "absolute", left: size * 0.2, top: size * 0.3, width: size * 0.5, height: w, backgroundColor: color }} />
|
||||||
|
<View style={{ position: "absolute", left: size * 0.62, top: size * 0.3 - size * 0.09 + w / 2, width: size * 0.18, height: size * 0.18, borderRightWidth: w, borderTopWidth: w, borderColor: color, transform: [{ rotate: "45deg" }] }} />
|
||||||
|
<View style={{ position: "absolute", left: size * 0.3, top: size * 0.66, width: size * 0.5, height: w, backgroundColor: color }} />
|
||||||
|
<View style={{ position: "absolute", left: size * 0.2, top: size * 0.66 - size * 0.09 + w / 2, width: size * 0.18, height: size * 0.18, borderLeftWidth: w, borderBottomWidth: w, borderColor: color, transform: [{ rotate: "45deg" }] }} />
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
|
||||||
|
case "tag":
|
||||||
|
return (
|
||||||
|
<View style={[box, s.center]}>
|
||||||
|
<View
|
||||||
|
style={{
|
||||||
|
width: size * 0.6,
|
||||||
|
height: size * 0.6,
|
||||||
|
borderWidth: w,
|
||||||
|
borderColor: color,
|
||||||
|
borderRadius: 3,
|
||||||
|
transform: [{ rotate: "45deg" }],
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<View style={{ position: "absolute", left: size * 0.3, top: size * 0.3, width: w + 0.6, height: w + 0.6, borderRadius: 999, backgroundColor: color }} />
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
|
||||||
|
case "close":
|
||||||
|
return (
|
||||||
|
<View style={[box, s.center]}>
|
||||||
|
<View style={{ position: "absolute", width: size * 0.6, height: w, borderRadius: 2, backgroundColor: color, transform: [{ rotate: "45deg" }] }} />
|
||||||
|
<View style={{ position: "absolute", width: size * 0.6, height: w, borderRadius: 2, backgroundColor: color, transform: [{ rotate: "-45deg" }] }} />
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
|
||||||
case "plus":
|
case "plus":
|
||||||
return (
|
return (
|
||||||
<View style={[box, s.center]}>
|
<View style={[box, s.center]}>
|
||||||
|
|||||||
Reference in New Issue
Block a user