Crear infobox en Wiki (sin plugins)

Creo que, en el caso de los escritores con alma de worldbuilder (constructor de mundos), no hay nada mejor que añadir información para un personaje propio, y yo que encontré el truco de cómo imitar las infobox de Wikipedia, ¿qué mejor que usar Tiddlyhost para imitar dicho estilo? Si quieren curiosear, hablo específicamente de esto, que lo habrán visto más de una vez:

Ejemplo de una Infobox insertada en Tiddlyhost/Tiddlywiki.

 

Primero, tenemos que crear, con ayuda del tag $:/tags/Stylesheet, la configuración inicial de este widget llamativo por medio de un tiddler. Llamémoslo $:/InfoBoxPersonalizada o simplemente $:/InfoBox para que encaje dentro del sistema. Luego, añadimos a ese tiddler el siguiente código:

.infobox {

    float: right;

    width: 250px;

    border: 1px solid #334455; /* Borde oscuro para que no desentone */

    margin-left: 10px;

    background-color: #212933; /* Color de fondo oscuro (ajusta según tu tema) */

    padding: 0;

    font-size: 0.9em;

    color: #e0e0e0; /* Color del texto general */

}/* Encabezado de la ficha */

.infobox th {

    background-color: #313e4d; /* Un tono un poco más claro para el título */

    color: #ffffff;

    padding: 8px;

    text-align: center;

}/* Filas de la tabla */

.infobox td {

    padding: 5px;

    border-bottom: 1px solid #334455;

}/* Asegurar que los enlaces dentro de la ficha se vean bien */

.infobox a {

    color: #a0c0ff; /* Un azul claro que resalte sobre el fondo oscuro */

}

Si lográs que la configuración encaje, ¡felicidades! Solo falta un paso más, que es el añadir el siguiente código en el tiddler que quieras tenerlo:

<table class="infobox">

    <tr><th colspan="2" style="background:#352B47; text-align:center;">Información</th></tr>

    <tr><td><strong>Nacionalidad</strong></td><td>argentina</td></tr>

    <tr><td><strong>Etnia</strong></td><td>española</td></tr>

    <tr><td><strong>Especie</strong></td><td>[[Hada]]</td></tr>

    <tr><td><strong>Padres</strong></td><td>[[modifica con un nombre 1]] (madre), [[modifica con otro nombre 2]] (padre)</td></tr>

    <tr><td><strong>Mundo</strong></td><td>[[Tierra]] (permanente)</td></tr>

</table>

Aclaración: los nombres dentro de los corchetes son modificables, y si querés añadir más casillas con distintas características para tus personajes, solo tenés que multiplicar, por ejemplo, esta parte:     <tr><td><strong>Mundo</strong></td><td>[[Tierra]] (permanente)</td></tr> y cambiarle los nombres de las propiedades como Tierra (permanente) o Mundo sin tocar mucho el código.