/* * Los iconos del backoffice de JapoPrint. * =========================================================================== * * Obra propia de JAPOPRINT E.A.S. Reemplaza a Keenicons, el juego de iconos * que venía adentro del tema comercial y del que no hay constancia de * licencia. Ver NOTICE. * * =========================================================================== * POR QUE MASCARAS Y NO UNA TIPOGRAFIA DE ICONOS * =========================================================================== * * Keenicons es una tipografía: cada icono es una letra de una fuente, y se * pinta con `content` en un `::before`. Reponerlo así obligaría a fabricar y * versionar un archivo de fuente, que es un formato binario que nadie puede * revisar leyendo el repositorio. * * Acá cada icono es un SVG escrito a mano, puesto como MASCARA. El color sale * de `currentColor`, así que todas las clases que ya usan las plantillas * —`text-gray-500`, `text-primary`, `text-lg`— siguen funcionando igual: el * icono hereda color y tamaño del texto que lo rodea, como antes. * * Y lo más importante: NO HAY QUE TOCAR NINGUNA PLANTILLA. Los nombres de * clase son los mismos que ya están escritos —`ki-filled ki-check`—, sólo * cambia quién los define. * * =========================================================================== * SON 25, Y DOS NO EXISTIAN * =========================================================================== * * `ki-entry` y `ki-file` se usan en el panel desde hace meses y NO EXISTEN en * Keenicons: se venían dibujando como un cuadradito vacío. Acá existen. El * reemplazo arregla, de paso, un defecto que estaba a la vista de todos. * * =========================================================================== * COMO SE AGREGA UNO * =========================================================================== * * Se copia una línea de abajo y se cambia el `d` del trazo. El dibujo va en * una caja de 24x24, con trazo de 2 y puntas redondeadas: si un icono nuevo * no respeta eso, se nota al lado de los otros. El `%23` que aparece en * alguno es un `#`: adentro de una dirección hay que escribirlo así. */ .ki-filled, .ki-outline, .ki-solid, .ki-duotone { display: inline-block; width: 1em; height: 1em; flex-shrink: 0; vertical-align: -0.125em; background-color: currentColor; -webkit-mask: var(--jp-icono) no-repeat center / contain; mask: var(--jp-icono) no-repeat center / contain; } /* Sin dibujo asignado no se pinta nada, en vez de un cuadrado negro. Un icono que falta tiene que desaparecer, no gritar. */ .ki-filled:not([class*=" ki-"]):not([class^="ki-filled ki-"]) { background-color: transparent; } /* --- navegación ---------------------------------------------------------- */ .ki-left { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E"); } .ki-right { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E"); } /* El de plegar el menú: una flecha contra una pared. */ .ki-black-left-line { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 6l-6 6 6 6M19 5v14'/%3E%3C/svg%3E"); } .ki-menu { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E"); } .ki-exit-right { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 4H6v16h7M11 12h9M16.5 8.5L20 12l-3.5 3.5'/%3E%3C/svg%3E"); } /* No existe en Keenicons: se veía un cuadradito. Es la salida, al revés. */ .ki-entry { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4h7v16h-7M13 12H4M7.5 8.5L4 12l3.5 3.5'/%3E%3C/svg%3E"); } /* --- acciones ------------------------------------------------------------ */ .ki-check { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E"); } .ki-cross { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E"); } .ki-plus { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); } .ki-trash { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M9 7V5h6v2M6.5 7l1 13h9l1-13M10 11v5M14 11v5'/%3E%3C/svg%3E"); } .ki-notepad-edit { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 4H6v16h8M9 8h5M9 12h3M19.5 12.5l2 2-5.5 5.5H14v-2z'/%3E%3C/svg%3E"); } .ki-eye { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); } .ki-eye-slash { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5c1.7 0 3.2.5 4.4 1.2M19.8 9.3c1.1 1.4 1.7 2.7 1.7 2.7S18 18.5 12 18.5c-1.9 0-3.5-.6-4.8-1.4M3 3l18 18'/%3E%3C/svg%3E"); } /* --- documentos ---------------------------------------------------------- */ .ki-document { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l4 4v14H6z M14 3v4h4 M9 12h6M9 16h6'/%3E%3C/svg%3E"); } /* Tampoco existía en Keenicons. */ .ki-file { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l4 4v14H6z M14 3v4h4'/%3E%3C/svg%3E"); } .ki-file-down { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l4 4v14H6z M14 3v4h4 M12 11v6M9.5 14.5L12 17l2.5-2.5'/%3E%3C/svg%3E"); } .ki-code { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 8l-5 4 5 4M15 8l5 4-5 4'/%3E%3C/svg%3E"); } /* --- estado y avisos ----------------------------------------------------- */ .ki-check-circle { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.3l2.6 2.6L16 9.5'/%3E%3C/svg%3E"); } .ki-information { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v6M12 7.4v.2'/%3E%3C/svg%3E"); } .ki-time { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5.3l3.3 2'/%3E%3C/svg%3E"); } .ki-star { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.2l2.7 5.6 6.1.9-4.4 4.3 1.1 6.1L12 17.2 6.5 20.1l1.1-6.1L3.2 9.7l6.1-.9z'/%3E%3C/svg%3E"); } /* --- varios -------------------------------------------------------------- */ .ki-dollar { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M16 7.4c0-1.6-1.8-2.4-4-2.4s-4 .9-4 2.5 1.6 2.4 4 2.9 4 1.2 4 2.9-1.8 2.5-4 2.5-4-.8-4-2.4'/%3E%3C/svg%3E"); } .ki-calculator { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cpath d='M9 7.5h6M9 11.5h.2M12 11.5h.2M15 11.5h.2M9 15h.2M12 15h.2M15 15h.2M9 18.5h6'/%3E%3C/svg%3E"); } .ki-setting-2 { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3.2'/%3E%3Cpath d='M12 2.5v2.6M12 18.9v2.6M21.5 12h-2.6M5.1 12H2.5M18.7 5.3l-1.8 1.8M7.1 16.9l-1.8 1.8M18.7 18.7l-1.8-1.8M7.1 7.1L5.3 5.3'/%3E%3C/svg%3E"); } .ki-moon { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 14.3A8.5 8.5 0 019.7 3.5a8.5 8.5 0 1010.8 10.8z'/%3E%3C/svg%3E"); } /* --- los tres de la pantalla de manuales ---------------------------------- */ /* * `core/manuales.py` elige estos por nombre. No aparecieron en el primer * relevamiento porque no están escritos en ninguna plantilla: los arma el * código. Los encontró `core/tests_plantillas.py`, que es exactamente para lo * que esa prueba está. */ .ki-book { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 5.5A2.5 2.5 0 017.5 3H19v15H7.5A2.5 2.5 0 005 20.5z M5 5.5v15M19 18v3H7.5'/%3E%3C/svg%3E"); } .ki-screen { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='12' rx='2'/%3E%3Cpath d='M9 20h6M12 16v4'/%3E%3C/svg%3E"); } .ki-shield-cross { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5.5c0 4.3-3 7.7-7 8.5-4-.8-7-4.2-7-8.5V6z'/%3E%3Cpath d='M9.8 9.8l4.4 4.4M14.2 9.8l-4.4 4.4'/%3E%3C/svg%3E"); } /* ========================================================================== LOS 24 DEL MENU LATERAL ========================================================================== Estos NUNCA se vieron, ni con el tema comprado. La plantilla escribe `class="ki-filled {{ icono }}"` y `core/secciones.py` guarda el nombre SIN el prefijo -`element-11`, no `ki-element-11`-, asi que la clase que salia era `ki-filled element-11` y no coincidia con nada. Ni con Keenicons ni con esto. O sea que el menu del backoffice estuvo todo este tiempo sin iconos y nadie lo noto, porque el texto se lee igual. Se arregla el prefijo en la plantilla -una linea- y se dibujan los 24 que faltaban. Mismo estilo que los otros: caja de 24x24, trazo 2.2, puntas redondeadas. Un icono de menu se ve a 18 pixeles: lo que no se distingue a ese tamano sobra. Por eso son de pocos trazos y sin detalle chico. */ /* Tablero. Cuatro paneles, que es como se ve un tablero. */ .ki-element-11 { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='3.5' width='7' height='7' rx='2'/%3E%3Crect x='13.5' y='3.5' width='7' height='7' rx='2'/%3E%3Crect x='3.5' y='13.5' width='7' height='7' rx='2'/%3E%3Crect x='13.5' y='13.5' width='7' height='7' rx='2'/%3E%3C/svg%3E"); } /* Tablero de inversores. Una porcion de torta. */ .ki-chart-pie-simple { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 1 1-9-9v9z'/%3E%3Cpath d='M12 3a9 9 0 0 1 9 9'/%3E%3C/svg%3E"); } /* Un grafico de linea: dos ejes y la curva. */ .ki-chart-line { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4v16h16'/%3E%3Cpath d='M7.5 15l3.5-4.2 3 2.4L19 8'/%3E%3C/svg%3E"); } /* Estado de la red. El latido de un monitor. */ .ki-pulse { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h4l2.5-6.5 4 13 2.5-6.5H21'/%3E%3C/svg%3E"); } /* Impresoras. La de siempre: tapa, cuerpo y hoja saliendo. */ .ki-printer { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 9V4h10v5'/%3E%3Cpath d='M4.5 9h15a1.5 1.5 0 0 1 1.5 1.5V16h-4v4H7v-4H3v-5.5A1.5 1.5 0 0 1 4.5 9z'/%3E%3Cpath d='M8.5 16h7'/%3E%3C/svg%3E"); } /* Pagos. Una billetera con su broche. */ .ki-wallet { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7.5V6.2A1.2 1.2 0 0 1 5.2 5H16'/%3E%3Cpath d='M4 7.5h13.8A2.2 2.2 0 0 1 20 9.7v7.1a2.2 2.2 0 0 1-2.2 2.2H5.2A1.2 1.2 0 0 1 4 17.8z'/%3E%3Ccircle cx='16.4' cy='13.2' r='1.1'/%3E%3C/svg%3E"); } /* Descuentos y tarifas. Una etiqueta colgada. */ .ki-discount { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.6 3H20a1 1 0 0 1 1 1v7.4a1 1 0 0 1-.3.7l-9 9a1 1 0 0 1-1.4 0l-7.4-7.4a1 1 0 0 1 0-1.4l9-9A1 1 0 0 1 12.6 3z'/%3E%3Ccircle cx='16.6' cy='7.4' r='1.3'/%3E%3C/svg%3E"); } /* Una persona. */ .ki-user { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.6'/%3E%3Cpath d='M5 20c0-3.7 3.2-5.6 7-5.6s7 1.9 7 5.6'/%3E%3C/svg%3E"); } /* Varias personas. La de atras se dibuja mas chica. */ .ki-users { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9.3' cy='8.4' r='3.2'/%3E%3Cpath d='M2.8 20c0-3.3 2.9-5.1 6.5-5.1s6.5 1.8 6.5 5.1'/%3E%3Ccircle cx='17.4' cy='7.6' r='2.3'/%3E%3Cpath d='M17 13.2c2.6.2 4.2 1.9 4.2 4.6'/%3E%3C/svg%3E"); } /* Relevamientos. Una planilla con el visto puesto. */ .ki-clipboard-check { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.2 4.6h5.6V3H9.2z'/%3E%3Cpath d='M9.2 5.6H6.6A1.6 1.6 0 0 0 5 7.2v12.2A1.6 1.6 0 0 0 6.6 21h10.8a1.6 1.6 0 0 0 1.6-1.6V7.2a1.6 1.6 0 0 0-1.6-1.6h-2.6'/%3E%3Cpath d='M9 13.6l2.2 2.2 4.2-4.4'/%3E%3C/svg%3E"); } /* Checklist. Un cuadro con el visto adentro. */ .ki-check-squared { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='3.5' width='17' height='17' rx='2.4'/%3E%3Cpath d='M8 12.2l2.7 2.7L16.2 9.4'/%3E%3C/svg%3E"); } /* Agregar. Un cuadro con un mas. */ .ki-plus-squared { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='3.5' width='17' height='17' rx='2.4'/%3E%3Cpath d='M12 8.4v7.2'/%3E%3Cpath d='M8.4 12h7.2'/%3E%3C/svg%3E"); } /* Procedimientos. Una hoja escrita. */ .ki-notepad { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5.5' y='3' width='13' height='18' rx='2'/%3E%3Cpath d='M9 8h6'/%3E%3Cpath d='M9 12h6'/%3E%3Cpath d='M9 16h4'/%3E%3C/svg%3E"); } /* Manuales. Un libro abierto. */ .ki-book-open { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 6.6C10.4 5.1 7.9 4.6 4 5.1v13.2c3.9-.5 6.4 0 8 1.5 1.6-1.5 4.1-2 8-1.5V5.1c-3.9-.5-6.4 0-8 1.5z'/%3E%3Cpath d='M12 6.6v13.2'/%3E%3C/svg%3E"); } /* Que hago. Una tableta preguntando. */ .ki-questionnaire-tablet { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5.5' y='3' width='13' height='18' rx='2'/%3E%3Cpath d='M10.1 9.4a2 2 0 1 1 2.7 2.4c-.6.3-.9.8-.9 1.4v.4'/%3E%3Cpath d='M12 16.8h.01'/%3E%3C/svg%3E"); } /* Puntos. Un pin en el mapa. */ .ki-geolocation { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.2c4.7-4.6 7-8.1 7-10.6a7 7 0 1 0-14 0c0 2.5 2.3 6 7 10.6z'/%3E%3Ccircle cx='12' cy='10.2' r='2.6'/%3E%3C/svg%3E"); } /* Equipos. Una pantalla y un telefono al lado. */ .ki-devices { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.5 15.5H3.6A1.6 1.6 0 0 1 2 13.9V6.1A1.6 1.6 0 0 1 3.6 4.5h11.9'/%3E%3Cpath d='M6.5 19h6'/%3E%3Cpath d='M9.5 15.5V19'/%3E%3Crect x='17' y='8.5' width='5' height='10.5' rx='1.4'/%3E%3C/svg%3E"); } /* Inventario. Una caja cerrada. */ .ki-package { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.2l8 4.4v8.8l-8 4.4-8-4.4V7.6z'/%3E%3Cpath d='M4 7.6l8 4.4 8-4.4'/%3E%3Cpath d='M12 12v8.8'/%3E%3C/svg%3E"); } /* Proveedores. El camion que trae. */ .ki-delivery { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.8 6.5h10.4v9.8H2.8z'/%3E%3Cpath d='M13.2 10h3.6l3.4 3.4v2.9h-7z'/%3E%3Ccircle cx='6.8' cy='18.2' r='1.8'/%3E%3Ccircle cx='17.6' cy='18.2' r='1.8'/%3E%3C/svg%3E"); } /* Avisos. Un globo de mensaje. */ .ki-sms { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5.5h16v10.2h-8.8L6 20v-4.3H4z'/%3E%3C/svg%3E"); } /* Ideas y cosas por hacer. Una lampara encendida. */ .ki-lamp-on { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.2 15.8a5.6 5.6 0 1 1 5.6 0v2.4H9.2z'/%3E%3Cpath d='M10 21.2h4'/%3E%3Cpath d='M12 1.8v1.4'/%3E%3Cpath d='M4.6 6.2l1 1'/%3E%3Cpath d='M19.4 6.2l-1 1'/%3E%3C/svg%3E"); } /* Permisos. Un escudo con el visto. */ .ki-shield-tick { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.8l7 2.9v5.6c0 4.4-2.9 8.1-7 9.7-4.1-1.6-7-5.3-7-9.7V5.7z'/%3E%3Cpath d='M8.9 11.9l2.3 2.3 4.2-4.4'/%3E%3C/svg%3E"); } /* El servidor. Una nube. */ .ki-cloud { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.4 18.2h9.4a3.6 3.6 0 0 0 .3-7.2 5.6 5.6 0 0 0-10.6-1.5 3.8 3.8 0 0 0 .9 8.7z'/%3E%3C/svg%3E"); } /* Instalador del totem. La nube con la flecha. */ .ki-cloud-download { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.4 16.4h2M14.6 16.4h2.2a3.6 3.6 0 0 0 .3-7.2 5.6 5.6 0 0 0-10.6-1.5 3.8 3.8 0 0 0 .9 8.7'/%3E%3Cpath d='M12 12.4v7'/%3E%3Cpath d='M9.2 16.6L12 19.4l2.8-2.8'/%3E%3C/svg%3E"); } /* =========================================================================== * LOS TRES QUE FALTABAN (29/08/2026) * =========================================================================== * * Los encontro Fernando mirando el sidebar: tres entradas salian con un * cuadrado gris en vez de un icono. Es el sintoma de un nombre que la * plantilla pide y este archivo no define — no da error, simplemente no se * dibuja nada. * * `medal-star` la puse yo al crear JapoPuntos, y las dos de soporte venian de * los nombres de Keenicons, que este archivo reemplazo sin reponerlas. */ /* JapoPuntos. Una medalla con su cinta: se gana, no se compra. */ .ki-medal-star { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.6 2.8L12 8.2l3.4-5.4'/%3E%3Cpath d='M5.6 2.8l3 5'/%3E%3Cpath d='M18.4 2.8l-3 5'/%3E%3Ccircle cx='12' cy='15.4' r='5.8'/%3E%3Cpath d='M12 12.4l1 2 2.2.3-1.6 1.5.4 2.2-2-1-2 1 .4-2.2-1.6-1.5 2.2-.3z'/%3E%3C/svg%3E"); } /* Bandeja de soporte. Dos globos de chat: es una conversacion, no un aviso. */ .ki-messages { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4.2h11.6v7.4H7.8L4.6 14.4v-2.8H3z'/%3E%3Cpath d='M17.4 8.4H21v7.4h-1.6v2.8l-3.2-2.8H9.4v-1.6'/%3E%3C/svg%3E"); } /* Mensajeria del soporte. Un globo con renglones: son textos guardados. */ .ki-message-text-2 { --jp-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4.4h16v11.2h-9.2L6.4 19.6v-4H4z'/%3E%3Cpath d='M7.6 8.4h8.8'/%3E%3Cpath d='M7.6 11.8h5.6'/%3E%3C/svg%3E"); }