mirror of
https://github.com/raphaelsalaja/userinterface-wiki.git
synced 2026-09-14 20:06:29 +08:00
Raphael S.
ae3b426950
- Introduced a new documentation page covering various pseudo-elements, including `::backdrop`, `::view-transition`, and `::scroll-marker`. - Added examples and practical patterns for using these pseudo-elements effectively. - Created a new CSS module for styling demo components related to pseudo-elements. Also added TypeScript interface for icon properties to improve type safety in icon components.
43 lines
1.6 KiB
TypeScript
43 lines
1.6 KiB
TypeScript
import type { IconProps } from "@/icons/types";
|
|
|
|
export const SquareDotedBehindSquareIcon = ({
|
|
size = 24,
|
|
color = "currentColor",
|
|
...props
|
|
}: IconProps) => (
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
width={size}
|
|
height={size}
|
|
{...props}
|
|
>
|
|
<title>Square Doted Behind Square</title>
|
|
<path
|
|
d="M10 5C10 4.44772 10.4477 4 11 4C11.5523 4 12 3.55228 12 3C12 2.44772 11.5523 2 11 2C9.34315 2 8 3.34315 8 5C8 5.55228 8.44772 6 9 6C9.55228 6 10 5.55228 10 5Z"
|
|
fill={color}
|
|
/>
|
|
<path
|
|
d="M14 2C13.4477 2 13 2.44772 13 3C13 3.55228 13.4477 4 14 4H16C16.5523 4 17 3.55228 17 3C17 2.44772 16.5523 2 16 2H14Z"
|
|
fill={color}
|
|
/>
|
|
<path
|
|
d="M19 2C18.4477 2 18 2.44772 18 3C18 3.55228 18.4477 4 19 4C19.5523 4 20 4.44772 20 5C20 5.55228 20.4477 6 21 6C21.5523 6 22 5.55228 22 5C22 3.34315 20.6569 2 19 2Z"
|
|
fill={color}
|
|
/>
|
|
<path
|
|
d="M10 8C10 7.44772 9.55228 7 9 7C8.44772 7 8 7.44772 8 8H4.25C3.00736 8 2 9.00736 2 10.25V19.75C2 20.9926 3.00736 22 4.25 22H13.75C14.9926 22 16 20.9926 16 19.75V16C16.5523 16 17 15.5523 17 15C17 14.4477 16.5523 14 16 14V10.25C16 9.00736 14.9926 8 13.75 8H10Z"
|
|
fill={color}
|
|
/>
|
|
<path
|
|
d="M22 8C22 7.44772 21.5523 7 21 7C20.4477 7 20 7.44772 20 8V10C20 10.5523 20.4477 11 21 11C21.5523 11 22 10.5523 22 10V8Z"
|
|
fill={color}
|
|
/>
|
|
<path
|
|
d="M22 13C22 12.4477 21.5523 12 21 12C20.4477 12 20 12.4477 20 13C20 13.5523 19.5523 14 19 14C18.4477 14 18 14.4477 18 15C18 15.5523 18.4477 16 19 16C20.6569 16 22 14.6569 22 13Z"
|
|
fill={color}
|
|
/>
|
|
</svg>
|
|
);
|