SPB Git

spb/toit-ka Public

Toit-Ka — louer ou acheter un toit au Québec, un seul endroit (fusion Lou-Ka × Immo-Ka) — www.toit-ka.com

Python 40.2% TypeScript 39% CSS 20.2% HTML 0.7%
5.9 KB · 169 lines tsx
Raw Blame History
1// -----------------------------------------------------------------------------2// Author: Simon-Pierre Boucher3// Contact: contact@spboucher.ai4// Project: Toit-Ka5// components/Icons.tsx : iconographie MAISON — traits 1,7 px sur grille 24,6//   zéro emoji, zéro pack générique. Chaque icône est un tracé « stroke » net7//   qui hérite de la couleur du texte (currentColor).8// -----------------------------------------------------------------------------9import { ReactNode } from "react";1011const P: Record<string, ReactNode> = {12  home: (<>13    <path d="M3.5 10.6 12 3.4l8.5 7.2" />14    <path d="M5.6 9.4V20h12.8V9.4" />15    <path d="M10 20v-5.6h4V20" />16  </>),17  key: (<>18    <circle cx="8" cy="8.6" r="4.6" />19    <path d="m11.4 12 8 8M16.2 16.8l2.4-2.4M13.6 19.4l2.2-2.2" />20  </>),21  map: (<>22    <path d="M3.2 6.4 9 4.2l6 2.2 5.8-2.2v13.4L15 19.8l-6-2.2-5.8 2.2z" />23    <path d="M9 4.2v13.4M15 6.4v13.4" />24  </>),25  chart: (<>26    <path d="M4 20h16" />27    <path d="M7.2 20v-5.6M12 20V8.8M16.8 20V12" />28  </>),29  building: (<>30    <path d="M5 20V5.6A1.6 1.6 0 0 1 6.6 4h6.2a1.6 1.6 0 0 1 1.6 1.6V20" />31    <path d="M14.4 9.4h3.4A1.6 1.6 0 0 1 19.4 11v9" />32    <path d="M3.2 20h17.6" />33    <path d="M8 8h2.4M8 11.6h2.4M8 15.2h2.4M16.4 13h.9M16.4 16.2h.9" />34  </>),35  bed: (<>36    <path d="M3.4 6.8V18.6" />37    <path d="M3.4 15.4h17.2v3.2" />38    <path d="M3.4 12.2h6.2v3.2" />39    <circle cx="6.5" cy="9.9" r="1.35" />40    <path d="M11.4 12.2h5.8a3.4 3.4 0 0 1 3.4 3.2" />41  </>),42  bath: (<>43    <path d="M3.6 12.4h16.8v1.4a5.2 5.2 0 0 1-5.2 5.2H8.8a5.2 5.2 0 0 1-5.2-5.2z" />44    <path d="M5.8 12.4V5.9a2.1 2.1 0 0 1 4-1" />45    <path d="m7 19.4-1 2.1M17 19.4l1 2.1" />46  </>),47  area: (<>48    <path d="M4.4 19.6 19.6 4.4" />49    <path d="M4.4 14v5.6H10" />50    <path d="M19.6 10V4.4H14" />51  </>),52  land: (<>53    <path d="M4.4 9.6v9.8M9.5 9.6v9.8M14.5 9.6v9.8M19.6 9.6v9.8" />54    <path d="M3 12.6h18M3 16.4h18" />55    <path d="M4.4 9.6 12 5.2l7.6 4.4" />56  </>),57  calendar: (<>58    <rect x="4" y="5.6" width="16" height="14.8" rx="2" />59    <path d="M4 10.2h16M8.2 3.4v4M15.8 3.4v4" />60  </>),61  tag: (<>62    <path d="m12.9 3.6 7.5 7.5a1.8 1.8 0 0 1 0 2.5l-6.8 6.8a1.8 1.8 0 0 1-2.5 0L3.6 12.9V3.6z" />63    <circle cx="8" cy="8" r="1.5" />64  </>),65  camera: (<>66    <rect x="3.4" y="7" width="17.2" height="13" rx="2" />67    <path d="M8.6 7 10 4.4h4L15.4 7" />68    <circle cx="12" cy="13.2" r="3.4" />69  </>),70  paw: (<>71    <circle cx="7.4" cy="9" r="1.7" />72    <circle cx="12" cy="7" r="1.7" />73    <circle cx="16.6" cy="9" r="1.7" />74    <path d="M8.2 16.6c0-2.3 1.7-4 3.8-4s3.8 1.7 3.8 4c0 1.9-1.5 3-3.8 3s-3.8-1.1-3.8-3z" />75  </>),76  sofa: (<>77    <path d="M4.4 11V7.6A1.6 1.6 0 0 1 6 6h12a1.6 1.6 0 0 1 1.6 1.6V11" />78    <path d="M3.2 13.4a1.8 1.8 0 0 1 3.6 0v.8h10.4v-.8a1.8 1.8 0 0 1 3.6 0V17a1.4 1.4 0 0 1-1.4 1.4H4.6A1.4 1.4 0 0 1 3.2 17z" />79    <path d="M5.4 18.4v1.8M18.6 18.4v1.8" />80  </>),81  search: (<>82    <circle cx="10.6" cy="10.6" r="6.2" />83    <path d="m15.3 15.3 5.3 5.3" />84  </>),85  arrow: (<>86    <path d="M4 12h15.2" />87    <path d="m13.8 6.4 5.4 5.6-5.4 5.6" />88  </>),89  check: (<path d="m5 12.8 4.3 4.4L19 7.4" />),90  alert: (<>91    <path d="M12 4.2 2.9 19.4h18.2z" />92    <path d="M12 10.2v4.4" />93    <path d="M12 17.4v.05" />94  </>),95  phone: (<path d="M5.2 4h3.6L10.4 8.4 8.3 10.1a12.5 12.5 0 0 0 5.6 5.6l1.7-2.1 4.4 1.6v3.6a1.8 1.8 0 0 1-1.9 1.8A16.4 16.4 0 0 1 3.4 5.9 1.8 1.8 0 0 1 5.2 4z" />),96  external: (<>97    <path d="M14.4 4h5.6v5.6" />98    <path d="M20 4 11.4 12.6" />99    <path d="M18.6 13.6V18a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V7.4a2 2 0 0 1 2-2h4.4" />100  </>),101  pin: (<>102    <path d="M12 21.2S5.4 15.7 5.4 10.8a6.6 6.6 0 0 1 13.2 0c0 4.9-6.6 10.4-6.6 10.4z" />103    <circle cx="12" cy="10.6" r="2.3" />104  </>),105  people: (<>106    <circle cx="9" cy="8" r="3.2" />107    <path d="M3.6 20a5.4 5.4 0 0 1 10.8 0" />108    <path d="M15.4 5.4a3.2 3.2 0 0 1 0 5.9M17 14.8a5.4 5.4 0 0 1 3.4 5.2" />109  </>),110  instagram: (<>111    <rect x="4" y="4" width="16" height="16" rx="4.6" />112    <circle cx="12" cy="12" r="3.6" />113    <path d="M16.6 7.4v.05" />114  </>),115  facebook: (<>116    <path d="M14.8 4.2h-2.2a3.4 3.4 0 0 0-3.4 3.4V10H6.8v3.4h2.4V20h3.4v-6.6h2.6l.6-3.4h-3.2V8a1 1 0 0 1 1-1h2.2z" />117  </>),118  x: (<>119    <path d="M4.6 4.4h4.2L19.4 19.6h-4.2z" />120    <path d="M19 4.4 13.4 11M10.4 13.2 4.8 19.6" />121  </>),122  linkedin: (<>123    <rect x="4" y="4" width="16" height="16" rx="2.4" />124    <path d="M8 10.4V16.4M8 7.6v.05" />125    <path d="M11.6 16.4v-6M11.6 12.6a2.4 2.4 0 0 1 4.8 0v3.8" />126  </>),127  tiktok: (<>128    <path d="M13.6 3.8v10.9a3.5 3.5 0 1 1-3.5-3.5" />129    <path d="M13.6 5.4a5.4 5.4 0 0 0 5.2 4" />130  </>),131  youtube: (<>132    <rect x="3.2" y="6" width="17.6" height="12.4" rx="3.4" />133    <path d="m10.4 9.4 4.6 2.8-4.6 2.8z" />134  </>),135};136137export type IconName = keyof typeof P;138139export function Ico({ name, size = 18, className = "", stroke = 1.7 }:140  { name: IconName | string; size?: number; className?: string; stroke?: number }) {141  const paths = P[name as IconName];142  if (!paths) return null;143  return (144    <svg145      className={`ico ${className}`}146      width={size} height={size} viewBox="0 0 24 24"147      fill="none" stroke="currentColor" strokeWidth={stroke}148      strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"149    >150      {paths}151    </svg>152  );153}154155/** Cœur des favoris ♥ — seule icône « remplissable » (état on/off). */156export function IcoHeart({ size = 16, filled = false, className = "" }:157  { size?: number; filled?: boolean; className?: string }) {158  return (159    <svg160      className={`ico ${className}`}161      width={size} height={size} viewBox="0 0 24 24"162      fill={filled ? "currentColor" : "none"} stroke="currentColor" strokeWidth={1.7}163      strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"164    >165      <path d="M12 20.5C7 16.5 3.5 13 3.5 9.3 3.5 6.8 5.5 5 7.8 5c1.7 0 3.2 1 4.2 2.6C13 6 14.5 5 16.2 5c2.3 0 4.3 1.8 4.3 4.3 0 3.7-3.5 7.2-8.5 11.2z" />166    </svg>167  );168}169