welpo · welpo · Jun 27, 2024 · Jun 27, 2024
@@ -1,7 +1,7 @@
 +++
 title = "Shortcodes personalitzats"
 date = 2023-02-19
-updated = 2024-05-18
+updated = 2024-06-27
 description = "Aquest tema inclou alguns shortcodes personalitzats útils que pots utilitzar per millorar les teves publicacions. Ja sigui per mostrar imatges que s'adapten als temes clar i fosc, o per donar format a una secció de referències amb un aspecte professional, aquests shortcodes personalitzats t'ajudaran."
 
 [taxonomies]
@@ -167,14 +167,14 @@ Destaca informació amb aquests shortcodes. Hi ha cinc tipus (`type`): `note`, `
 
 {{ admonition(type="danger", text="Contingut amb **sintaxi** *Markdown*. Consulta [aquesta `api`](#).") }}
 
-Pots personalitzar el títol amb el paràmetre `title`:
+Pots canviar el `title` i la `icon` de l'advertència. Ambdós paràmetres accepten text i per defecte coincideixen amb el tipus d'advertència. `icon` pot ser qualsevol dels tipus d'advertència disponibles.
 
-{{ admonition(type="info", title="Título personalizado", text="Contingut amb **sintaxi** *Markdown*. Consulta [aquesta `api`](#).") }}
+{{ admonition(type="note", icon="tip", title="Títol i icona personalitzats", text="Contingut amb **sintaxi** *Markdown*. Consulta [aquesta `api`](#).") }}
 
 #### Ús
 
 ```
-{{/* admonition(type="info", title="Títol opcional", text="Quelcom.") */}}
+{{/* admonition(type="danger", icon="tip", title="Un consell important", text="Mantingues-te hidratat") */}}
 ```
 
 ### Cites multillenguatge

@@ -1,7 +1,7 @@
 +++
 title = "Shortcodes personalizados"
 date = 2023-02-19
-updated = 2024-05-18
+updated = 2024-06-27
 description = "Este tema incluye algunos shortcodes personalizados útiles que puedes utilizar para mejorar tus publicaciones. Puedes mostrar imágenes que se adapten a los temas claro y oscuro, dar formato a una sección de referencias con un aspecto profesional, y más."
 
 [taxonomies]
@@ -168,14 +168,14 @@ Destaca información con estos shortcodes. Hay cinco tipos (`type`): `note`, `ti
 
 {{ admonition(type="danger", text="Contenido con **sintaxis** *Markdown*. Consulta [esta `api`](#).") }}
 
-Puedes personalizar el título con el parámetro `title`:
+Puedes cambiar el `title` y el `icon` de la advertencia. Ambos parámetros aceptan texto y por defecto coinciden con el tipo de advertencia. `icon` puede ser cualquiera de los tipos de advertencia disponibles.
 
-{{ admonition(type="info", title="Título personalizado", text="Contenido con **sintaxis** *Markdown*. Consulta [esta `api`](#).") }}
+{{ admonition(type="note", icon="tip", title="Título e icono personalizados", text="Contenido con **sintaxis** *Markdown*. Consulta [esta `api`](#).") }}
 
 #### Uso
 
 ```
-{{/* admonition(type="info", title="Título opcional", text="Algo.") */}}
+{{/* admonition(type="danger", icon="tip", title="Un consejo importante", text="Mantente hidratado") */}}
 ```
 
 ### Citas multilenguaje

@@ -1,7 +1,7 @@
 +++
 title = "Custom shortcodes"
 date = 2023-02-19
-updated = 2024-05-18
+updated = 2024-06-27
 description = "This theme includes some useful custom shortcodes that you can use to enhance your posts. Whether you want to display images that adapt to light and dark themes, or format a professional-looking reference section, these custom shortcodes have got you covered."
 
 [taxonomies]
@@ -167,14 +167,14 @@ Bring attention to information with these admonition shortcodes. They come in fi
 
 {{ admonition(type="danger", text="Some **content** with _Markdown_ `syntax`. Check [this `api`](#).") }}
 
-You can set a custom title with the `title` parameter:
+You can change the `title` and `icon` of the admonition. Both parameters take a string and default to the type of admonition. `icon` can be any of the available admonition types.
 
-{{ admonition(type="note", title="Custom title", text="Some **content** with _Markdown_ `syntax`. Check [this `api`](#).") }}
+{{ admonition(type="note", icon="tip", title="Custom title and icon", text="Some **content** with _Markdown_ `syntax`. Check [this `api`](#).") }}
 
 #### Usage
 
 ```
-{{/* admonition(type="info", title="Optional custom title", text="Something.") */}}
+{{/* admonition(type="danger", icon="tip", title="An important tip", text="Stay hydrated~") */}}
 ```
 
 ### Multilingual quotes

@@ -116,11 +116,6 @@
             background-color: var(--admonition-note-border);
         }
     }
-
-    .admonition-icon {
-        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M440-280h80v-240h-80v240Zm40-320q17 0 28.5-11.5T520-640q0-17-11.5-28.5T480-680q-17 0-28.5 11.5T440-640q0 17 11.5 28.5T480-600Zm0 520q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z'/%3E%3C/svg%3E");
-        background-color: var(--admonition-note-border);
-    }
 }
 
 .admonition.tip {
@@ -139,11 +134,6 @@
             background-color: var(--admonition-tip-border);
         }
     }
-
-    .admonition-icon {
-        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M480-78.258q-33.718 0-56.974-22.166-23.256-22.167-23.59-55.885h161.128q-.334 33.718-23.59 55.885Q513.718-78.258 480-78.258ZM318.257-210.515v-67.588h323.486v67.588H318.257Zm7.846-121.128q-67.692-42.487-106.896-109.134-39.205-66.648-39.205-147.479 0-123.769 88.149-211.884 88.149-88.115 211.967-88.115 123.817 0 211.849 88.115 88.031 88.115 88.031 211.884 0 80.831-38.999 147.479-39 66.647-107.102 109.134H326.103Zm21.927-67.588h264.351q46.311-32 73.17-81.681 26.859-49.68 26.859-107.144 0-96.918-68-164.765-68-67.846-164.564-67.846t-164.41 67.713q-67.846 67.712-67.846 164.725 0 57.52 26.859 107.259t73.581 81.739Zm131.97 0Z'/%3E%3C/svg%3E");
-        background-color: var(--admonition-tip-border);
-    }
 }
 
 .admonition.info {
@@ -162,11 +152,6 @@
             background-color: var(--admonition-info-border);
         }
     }
-
-    .admonition-icon {
-        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M479.789-288Q495-288 505.5-298.289q10.5-10.29 10.5-25.5Q516-339 505.711-349.5q-10.29-10.5-25.5-10.5Q465-360 454.5-349.711q-10.5 10.29-10.5 25.5Q444-309 454.289-298.5q10.29 10.5 25.5 10.5ZM444-432h72v-240h-72v240Zm36.276 336Q401-96 331-126q-70-30-122.5-82.5T126-330.958q-30-69.959-30-149.5Q96-560 126-629.5t82.5-122Q261-804 330.958-834q69.959-30 149.5-30Q560-864 629.5-834t122 82.5Q804-699 834-629.276q30 69.725 30 149Q864-401 834-331q-30 70-82.5 122.5T629.276-126q-69.725 30-149 30ZM480-168q130 0 221-91t91-221q0-130-91-221t-221-91q-130 0-221 91t-91 221q0 130 91 221t221 91Zm0-312Z'/%3E%3C/svg%3E");
-        background-color: var(--admonition-info-border);
-    }
 }
 
 .admonition.warning {
@@ -185,12 +170,6 @@
             background-color: var(--admonition-warning-border);
         }
     }
-
-    .admonition-icon {
-        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M109-120q-11 0-20-5.5T75-140q-5-9-5.5-19.5T75-180l370-640q6-10 15.5-15t19.5-5q10 0 19.5 5t15.5 15l370 640q6 10 5.5 20.5T885-140q-5 9-14 14.5t-20 5.5H109Zm69-80h604L480-720 178-200Zm302-40q17 0 28.5-11.5T520-280q0-17-11.5-28.5T480-320q-17 0-28.5 11.5T440-280q0 17 11.5 28.5T480-240Zm0-120q17 0 28.5-11.5T520-400v-120q0-17-11.5-28.5T480-560q-17 0-28.5 11.5T440-520v120q0 17 11.5 28.5T480-360Zm0-100Z'/%3E%3C/svg%3E");
-
-        background-color: var(--admonition-warning-border);
-    }
 }
 
 .admonition.danger {
@@ -209,10 +188,45 @@
             background-color: var(--admonition-danger-border);
         }
     }
+}
 
-    .admonition-icon {
-        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M239.256-400q0 58.091 27.975 108.995t76.13 81.237q-5.616-8.513-8.487-18.398-2.872-9.885-2.872-19.167 1.333-26.436 12.153-50.307 10.821-23.872 31.41-43.461L480-443.921l105.819 102.82q18.923 19.311 29.885 43.321 10.961 24.011 12.294 50.447 0 9.282-2.872 19.167-2.871 9.885-7.82 18.398 47.488-30.333 75.796-81.237Q721.41-341.909 721.41-400q0-47.622-19.258-93.169-19.259-45.547-53.998-82.549-19.951 13.41-42.202 19.859Q583.7-549.41 561-549.41q-62.448 0-105.108-38.039-42.661-38.038-51.225-98.628v-9.744q-39.385 31.949-69.898 67.68-30.513 35.73-51.987 74.166t-32.5 77.464Q239.256-437.483 239.256-400ZM480-349.539l-57.436 56.436q-12.154 11.821-17.731 26.029-5.577 14.208-5.577 29.074 0 32.769 23.498 55.757 23.497 22.987 57.246 22.987 33.432 0 57.421-22.906 23.989-22.906 23.989-55.561 0-16.162-6.116-30.162-6.116-13.999-17.454-25.154l-57.84-56.5Zm-11.002-469.022V-708q0 38.637 26.832 64.819 26.831 26.183 65.17 26.183 15.609 0 30.818-5.923 15.208-5.923 28.131-17.718l22.615-24.102q67.564 44.128 106.999 114.917 39.435 70.79 39.435 150.156 0 128.206-89.846 218.103Q609.307-91.668 480-91.668q-129.027 0-218.68-89.652-89.652-89.653-89.652-218.68 0-119.178 79.371-232.447t217.959-186.114Z'/%3E%3C/svg%3E");
+.admonition-icon-note {
+    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M440-280h80v-240h-80v240Zm40-320q17 0 28.5-11.5T520-640q0-17-11.5-28.5T480-680q-17 0-28.5 11.5T440-640q0 17 11.5 28.5T480-600Zm0 520q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z'/%3E%3C/svg%3E");
+}
 
-        background-color: var(--admonition-danger-border);
-    }
+.admonition-icon-tip {
+    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M480-78.258q-33.718 0-56.974-22.166-23.256-22.167-23.59-55.885h161.128q-.334 33.718-23.59 55.885Q513.718-78.258 480-78.258ZM318.257-210.515v-67.588h323.486v67.588H318.257Zm7.846-121.128q-67.692-42.487-106.896-109.134-39.205-66.648-39.205-147.479 0-123.769 88.149-211.884 88.149-88.115 211.967-88.115 123.817 0 211.849 88.115 88.031 88.115 88.031 211.884 0 80.831-38.999 147.479-39 66.647-107.102 109.134H326.103Zm21.927-67.588h264.351q46.311-32 73.17-81.681 26.859-49.68 26.859-107.144 0-96.918-68-164.765-68-67.846-164.564-67.846t-164.41 67.713q-67.846 67.712-67.846 164.725 0 57.52 26.859 107.259t73.581 81.739Zm131.97 0Z'/%3E%3C/svg%3E");
+}
+
+.admonition-icon-info {
+    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M479.789-288Q495-288 505.5-298.289q10.5-10.29 10.5-25.5Q516-339 505.711-349.5q-10.29-10.5-25.5-10.5Q465-360 454.5-349.711q-10.5 10.29-10.5 25.5Q444-309 454.289-298.5q10.29 10.5 25.5 10.5ZM444-432h72v-240h-72v240Zm36.276 336Q401-96 331-126q-70-30-122.5-82.5T126-330.958q-30-69.959-30-149.5Q96-560 126-629.5t82.5-122Q261-804 330.958-834q69.959-30 149.5-30Q560-864 629.5-834t122 82.5Q804-699 834-629.276q30 69.725 30 149Q864-401 834-331q-30 70-82.5 122.5T629.276-126q-69.725 30-149 30ZM480-168q130 0 221-91t91-221q0-130-91-221t-221-91q-130 0-221 91t-91 221q0 130 91 221t221 91Zm0-312Z'/%3E%3C/svg%3E");
+}
+
+.admonition-icon-warning {
+    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M109-120q-11 0-20-5.5T75-140q-5-9-5.5-19.5T75-180l370-640q6-10 15.5-15t19.5-5q10 0 19.5 5t15.5 15l370 640q6 10 5.5 20.5T885-140q-5 9-14 14.5t-20 5.5H109Zm69-80h604L480-720 178-200Zm302-40q17 0 28.5-11.5T520-280q0-17-11.5-28.5T480-320q-17 0-28.5 11.5T440-280q0 17 11.5 28.5T480-240Zm0-120q17 0 28.5-11.5T520-400v-120q0-17-11.5-28.5T480-560q-17 0-28.5 11.5T440-520v120q0 17 11.5 28.5T480-360Zm0-100Z'/%3E%3C/svg%3E");
+}
+
+.admonition-icon-danger {
+    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' %3E%3Cpath d='M239.256-400q0 58.091 27.975 108.995t76.13 81.237q-5.616-8.513-8.487-18.398-2.872-9.885-2.872-19.167 1.333-26.436 12.153-50.307 10.821-23.872 31.41-43.461L480-443.921l105.819 102.82q18.923 19.311 29.885 43.321 10.961 24.011 12.294 50.447 0 9.282-2.872 19.167-2.871 9.885-7.82 18.398 47.488-30.333 75.796-81.237Q721.41-341.909 721.41-400q0-47.622-19.258-93.169-19.259-45.547-53.998-82.549-19.951 13.41-42.202 19.859Q583.7-549.41 561-549.41q-62.448 0-105.108-38.039-42.661-38.038-51.225-98.628v-9.744q-39.385 31.949-69.898 67.68-30.513 35.73-51.987 74.166t-32.5 77.464Q239.256-437.483 239.256-400ZM480-349.539l-57.436 56.436q-12.154 11.821-17.731 26.029-5.577 14.208-5.577 29.074 0 32.769 23.498 55.757 23.497 22.987 57.246 22.987 33.432 0 57.421-22.906 23.989-22.906 23.989-55.561 0-16.162-6.116-30.162-6.116-13.999-17.454-25.154l-57.84-56.5Zm-11.002-469.022V-708q0 38.637 26.832 64.819 26.831 26.183 65.17 26.183 15.609 0 30.818-5.923 15.208-5.923 28.131-17.718l22.615-24.102q67.564 44.128 106.999 114.917 39.435 70.79 39.435 150.156 0 128.206-89.846 218.103Q609.307-91.668 480-91.668q-129.027 0-218.68-89.652-89.652-89.653-89.652-218.68 0-119.178 79.371-232.447t217.959-186.114Z'/%3E%3C/svg%3E");
+}
+
+/* Admonition type styles */
+.admonition.note .admonition-icon {
+    background-color: var(--admonition-note-border);
+}
+
+.admonition.tip .admonition-icon {
+    background-color: var(--admonition-tip-border);
+}
+
+.admonition.info .admonition-icon {
+    background-color: var(--admonition-info-border);
+}
+
+.admonition.warning .admonition-icon {
+    background-color: var(--admonition-warning-border);
+}
+
+.admonition.danger .admonition-icon {
+    background-color: var(--admonition-danger-border);
 }
@@ -1,8 +1,9 @@
 {%- set type = type | default(value="info") -%}
 {%- set title = title | default(value=type | upper) -%}
+{%- set icon = icon | default(value=type) -%}
 
 <div class="admonition {{ type }}">
-    <div class="admonition-icon"></div>
+    <div class="admonition-icon admonition-icon-{{ icon }}"></div>
     <div class="admonition-content">
         <strong class="admonition-title">{{ title | safe }}</strong>
         {{ text | markdown | safe }}