npm - desy-html - Versions diffs - 7.3.1 → 7.4.0 - Mend

desy-html 7.3.1 → 7.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (57) hide show

package/src/templates/components/pill/_examples.pill.njk CHANGED Viewed

@@ -1,101 +1,101 @@
 {% set exampleComponent = "pill" %}
 {% set examples =  [
   {
-    "name": "default",
+    "name": "por defecto",
     "data": {
-      "text": "Default pill"
+      "text": "Pill por defecto"
     }
   },
   {
-    "name": "Type link",
+    "name": "tipo enlace",
     "data": {
-      "text": "Type link",
+      "text": "Tipo enlace",
       "href": "http://www.google.com"
     }
   },
   {
-    "name": "Type link with target blank",
+    "name": "Tipo enlace con target blank",
     "data": {
-      "text": "Type link with target",
+      "text": "Tipo enlace con target",
       "href": "http://www.google.com",
       "target": "_blank"
     }
   },
   {
-    "name": "Type button",
+    "name": "Tipo botón",
     "data": {
       "type": "button",
-      "text": "Type button",
+      "text": "Tipo botón",
       "classes": "cursor-pointer"
     }
   },
   {
-    "name": "Type link or button with hover state",
-    "description": "Simulate triggering the :hover CSS pseudo-class",
+    "name": "Tipo enlace o botón con estado hover",
+    "description": 'Simula activar la pseudoclase de CSS <code>:hover</code>',
     "data": {
       "type": "button",
-      "text": "Hovered",
+      "text": "Hover",
       "classes": "ds-hover"
     }
   },
   {
-    "name": "Type link or button with focus state",
-    "description": "Simulate triggering the :focus CSS pseudo-class",
+    "name": "Tipo enlace o botón con estado focus",
+    "description": 'Simula activar la pseudoclase de CSS <code>:focus</code>',
     "data": {
       "type": "button",
-      "text": "Focussed",
+      "text": "Focus",
       "classes": "ds-focus"
     }
   },
   {
-    "name": "Size xs",
-    "description": "Use the text size classes to size the pill",
+    "name": "Peque",
+    "description": "Usa las clases de tamaño de texto para establecer el tamaño.",
     "data": {
-      "text": "Small pill",
+      "text": "Peque pill",
       "classes": "text-sm"
     }
   },
   {
-    "name": "With icon right",
+    "name": "con icono a la derecha",
     "data": {
       "type": "button",
-      "html": "Icon right pill <svg viewBox=\"0 0 140 140\" class=\" self-center ml-2 \" role=\" img \" aria-label=\"Eliminar\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M85.91 71.77a2.5 2.5 0 010-3.54l46.16-46.16a10 10 0 10-14.14-14.14L71.77 54.09a2.5 2.5 0 01-3.54 0L22.07 7.93A10 10 0 007.93 22.07l46.16 46.16a2.5 2.5 0 010 3.54L7.93 117.93a10 10 0 0014.14 14.14l46.16-46.16a2.5 2.5 0 013.54 0l46.16 46.16a10 10 0 0014.14-14.14z\"/></svg>",
+      "html": "Icono derecha pill <svg viewBox=\"0 0 140 140\" class=\" self-center ml-2 \" role=\" img \" aria-label=\"Eliminar\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M85.91 71.77a2.5 2.5 0 010-3.54l46.16-46.16a10 10 0 10-14.14-14.14L71.77 54.09a2.5 2.5 0 01-3.54 0L22.07 7.93A10 10 0 007.93 22.07l46.16 46.16a2.5 2.5 0 010 3.54L7.93 117.93a10 10 0 0014.14 14.14l46.16-46.16a2.5 2.5 0 013.54 0l46.16 46.16a10 10 0 0014.14-14.14z\"/></svg>",
       "classes": "cursor-pointer"
     }
   },
   {
-    "name": "With icon left",
+    "name": "con icono a la izquierda",
     "data": {
       "type": "button",
-      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M35 35a35 35 0 1070 0 35 35 0 10-70 0zM132.78 133.33a66.59 66.59 0 00-125.56 0 5 5 0 004.71 6.67h116.14a5 5 0 004.71-6.67z\" /></svg> Icon left pill",
+      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M35 35a35 35 0 1070 0 35 35 0 10-70 0zM132.78 133.33a66.59 66.59 0 00-125.56 0 5 5 0 004.71 6.67h116.14a5 5 0 004.71-6.67z\" /></svg> Icono izquierda pill",
       "classes": "cursor-pointer"
     }
   },
   {
-    "name": "Primary",
+    "name": "primario",
     "data": {
-      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M43.7 140a17.42 17.42 0 01-12.36-5.12L5.13 108.66a17.49 17.49 0 010-24.75l24.61-24.25a7.5 7.5 0 0110.52 10.68L15.69 94.56a2.5 2.5 0 000 3.49l26.21 26.22a2.51 2.51 0 003.54 0l24.22-24.53a7.5 7.5 0 1110.68 10.52l-24.21 24.57A17.53 17.53 0 0143.7 140zM99.66 80.26a7.49 7.49 0 01.08-10.6l24.57-24.22a2.5 2.5 0 000-3.49L98.06 15.73a2.51 2.51 0 00-3.54 0L70.34 40.26a7.5 7.5 0 01-10.68-10.52L83.87 5.17a17.52 17.52 0 0124.79 0l26.21 26.21a17.49 17.49 0 010 24.75l-24.61 24.21a7.49 7.49 0 01-10.6-.08z\"/><path fill=\"currentColor\" d=\"M55 92.5a7.5 7.5 0 01-5.3-12.8l30-30a7.5 7.5 0 1110.6 10.6l-30 30a7.44 7.44 0 01-5.3 2.2z\"/></svg> Primary",
+      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M43.7 140a17.42 17.42 0 01-12.36-5.12L5.13 108.66a17.49 17.49 0 010-24.75l24.61-24.25a7.5 7.5 0 0110.52 10.68L15.69 94.56a2.5 2.5 0 000 3.49l26.21 26.22a2.51 2.51 0 003.54 0l24.22-24.53a7.5 7.5 0 1110.68 10.52l-24.21 24.57A17.53 17.53 0 0143.7 140zM99.66 80.26a7.49 7.49 0 01.08-10.6l24.57-24.22a2.5 2.5 0 000-3.49L98.06 15.73a2.51 2.51 0 00-3.54 0L70.34 40.26a7.5 7.5 0 01-10.68-10.52L83.87 5.17a17.52 17.52 0 0124.79 0l26.21 26.21a17.49 17.49 0 010 24.75l-24.61 24.21a7.49 7.49 0 01-10.6-.08z\"/><path fill=\"currentColor\" d=\"M55 92.5a7.5 7.5 0 01-5.3-12.8l30-30a7.5 7.5 0 1110.6 10.6l-30 30a7.44 7.44 0 01-5.3 2.2z\"/></svg> Primario",
       "classes": "c-pill--primary"
     }
   },
   {
-    "name": "Warning",
+    "name": "Aviso",
     "data": {
-      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M138.42 118.29l-55-110a15 15 0 00-26.84 0l-55 110A15 15 0 0015 140h110a15 15 0 0013.42-21.71zM62.5 50a7.5 7.5 0 0115 0v30a7.5 7.5 0 01-15 0zm7.5 70a10 10 0 1110-10 10 10 0 01-10 10z\"/></svg> Warning",
+      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M138.42 118.29l-55-110a15 15 0 00-26.84 0l-55 110A15 15 0 0015 140h110a15 15 0 0013.42-21.71zM62.5 50a7.5 7.5 0 0115 0v30a7.5 7.5 0 01-15 0zm7.5 70a10 10 0 1110-10 10 10 0 01-10 10z\"/></svg> Aviso",
       "classes": "c-pill--warning"
     }
   },
   {
-    "name": "Success",
+    "name": "Éxito",
     "data": {
-      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M39.94 125a19.88 19.88 0 01-15.53-7.81L2.48 92.26a10 10 0 0115-13.2l20.55 23.39a2.5 2.5 0 003.68.08l81-84.42a10.002 10.002 0 1114.5 13.78l-82.02 86.33A19.41 19.41 0 0139.94 125z\"/></svg> Success",
+      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M39.94 125a19.88 19.88 0 01-15.53-7.81L2.48 92.26a10 10 0 0115-13.2l20.55 23.39a2.5 2.5 0 003.68.08l81-84.42a10.002 10.002 0 1114.5 13.78l-82.02 86.33A19.41 19.41 0 0139.94 125z\"/></svg> Éxito",
       "classes": "c-pill--success"
     }
   },
   {
-    "name": "Alert",
+    "name": "alerta",
     "data": {
-      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zm-7.5 35a7.5 7.5 0 0115 0v30a7.5 7.5 0 01-15 0zm7.5 75a10 10 0 1110-10 10 10 0 01-10 10z\"/></svg> Alert",
+      "html": "<svg viewBox=\"0 0 140 140\" class=\" self-center mr-2 \"  aria-hidden=\"true\" width=\" .75em \" height=\" .75em \"><path fill=\"currentColor\" d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zm-7.5 35a7.5 7.5 0 0115 0v30a7.5 7.5 0 01-15 0zm7.5 75a10 10 0 1110-10 10 10 0 01-10 10z\"/></svg> Alerta",
       "classes": "c-pill--alert"
     }
   }