|
|
| Line 1: |
Line 1: |
| <div style="display:{{#if:{{{image|}}}|block|none}}; text-align:center" class="item-image"> | | <div class="recipe-visual" style="display:flex; flex-wrap:wrap; align-items:flex-start; gap:1em; padding:1em; margin-top:1em;"> |
| [[File:{{{image}}}|64px]]
| |
| </div>
| |
| <div style="display:{{#if:{{{categories|}}}|block|none}};" class="item-section">
| |
| <b>Categories:</b> {{{categories}}}
| |
| </div>
| |
| <div style="display:{{#if:{{{consumable|}}}|block|none}};" class="item-section">
| |
| <b>Consumable:</b> {{{consumable}}}
| |
| </div>
| |
| <div style="display:{{#if:{{{maxstack|}}}|block|none}};" class="item-section">
| |
| <b>Max Stack:</b> {{{maxstack}}}
| |
| </div>
| |
| <div style="display:{{#if:{{{dropondeath|}}}|block|none}};" class="item-section">
| |
| <b>Drop On Death:</b> {{{dropondeath}}}
| |
| </div>
| |
| | |
| quiero pasar eso a una wikitable
| |
| 20:20
| |
| | |
| Aquí tienes el código convertido a una wikitable:
| |
| html
| |
| | |
| {| class="wikitable"
| |
| {{#if:{{{image|}}}|
| |
| {{!}} style="text-align:center" {{!}} [[File:{{{image}}}|64px]]
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{categories|}}}|
| |
| ! Categories:
| |
| {{!}} {{{categories}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{consumable|}}}|
| |
| ! Consumable:
| |
| {{!}} {{{consumable}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{maxstack|}}}|
| |
| ! Max Stack:
| |
| {{!}} {{{maxstack}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{dropondeath|}}}|
| |
| ! Drop On Death:
| |
| {{!}} {{{dropondeath}}}
| |
| }}
| |
| |}
| |
| | |
| Cambios principales:
| |
| | |
| {| y |} delimitan la tabla
| |
| {{!}} se usa en lugar de | dentro de las condiciones #if
| |
| ! para las celdas de encabezado (etiquetas en negrita)
| |
| {{!}}- para separar las filas
| |
| La imagen se mantiene en su propia fila con colspan implícito
| |
| | |
| Si prefieres que las etiquetas y valores estén en columnas separadas de manera más consistente, o si quieres ajustar el estilo, dime y lo modifico.
| |
| | |
| Quiero añadirle el nombre encima de la imagen
| |
| 20:24
| |
| | |
| Aquí tienes el código con el nombre añadido encima de la imagen:
| |
| html
| |
| | |
| {| class="wikitable"
| |
| {{#if:{{{name|}}}|
| |
| ! colspan="2" style="text-align:center" {{!}} {{{name}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{image|}}}|
| |
| {{!}} colspan="2" style="text-align:center" {{!}} [[File:{{{image}}}|64px]]
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{categories|}}}|
| |
| ! Categories:
| |
| {{!}} {{{categories}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{consumable|}}}|
| |
| ! Consumable:
| |
| {{!}} {{{consumable}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{maxstack|}}}|
| |
| ! Max Stack:
| |
| {{!}} {{{maxstack}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{dropondeath|}}}|
| |
| ! Drop On Death:
| |
| {{!}} {{{dropondeath}}}
| |
| }}
| |
| |}
| |
| | |
| Cambios:
| |
| | |
| Añadido el parámetro {{{name}}} en la primera fila
| |
| Usado colspan="2" para que ocupe el ancho completo de la tabla
| |
| Ambas filas (nombre e imagen) centradas y ocupando las dos columnas
| |
| | |
| Me gustaria que el texto del nombre fuese mas grande
| |
| 20:26
| |
| | |
| Aquí tienes el código con el nombre en texto más grande:
| |
| html
| |
| | |
| {| class="wikitable"
| |
| {{#if:{{{name|}}}|
| |
| ! colspan="2" style="text-align:center; font-size:1.5em" {{!}} {{{name}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{image|}}}|
| |
| {{!}} colspan="2" style="text-align:center" {{!}} [[File:{{{image}}}|64px]]
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{categories|}}}|
| |
| ! Categories:
| |
| {{!}} {{{categories}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{consumable|}}}|
| |
| ! Consumable:
| |
| {{!}} {{{consumable}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{maxstack|}}}|
| |
| ! Max Stack:
| |
| {{!}} {{{maxstack}}}
| |
| {{!}}-
| |
| }}
| |
| {{#if:{{{dropondeath|}}}|
| |
| ! Drop On Death:
| |
| {{!}} {{{dropondeath}}}
| |
| }}
| |
| |}
| |
| | |
| Cambio:
| |
| | |
| Añadido font-size:1.5em al estilo del nombre para hacerlo 1.5 veces más grande
| |
| | |
| Si quieres que sea aún más grande, puedes cambiar el valor a 2em o 2.5em según prefieras.
| |
| | |
| <metadesc>Info about the Cobalt Pickaxe item on Hytale</metadesc>
| |
| {{ItemPage
| |
| |Name=Cobalt Pickaxe
| |
| |Icon=Tool_Pickaxe_Cobalt.png
| |
| |Description=
| |
| |Quote=
| |
| |Categories=
| |
| |Tags=None
| |
| |Consumable=False
| |
| |MaxStack=
| |
| |DropOnDeath=
| |
| |MaxDurability=300.0
| |
| |Armor=
| |
| |Tool={{ToolBlock
| |
| | gatherings = {{GatheringPowerRow|SoftBlocks|1}}
| |
| {{GatheringPowerRow|Soils|0.5}}
| |
| {{GatheringPowerRow|Woods|0.05}}
| |
| {{GatheringPowerRow|Rocks|0.5}}
| |
| {{GatheringPowerRow|Benches|0.5}}
| |
| {{GatheringPowerRow|VolcanicRocks|0.17}}
| |
| | durability = <div class="item-section"><b>Durability loss:</b> Stone, Rock, Ores, Soil → 0.25</div>
| |
| }}
| |
| |Recipe={{RecipeBlock
| |
| | ingredients = {{RecipeRow|File:Ingredient_Bar_Cobalt.png|Cobalt Ingot|7}}
| |
| {{RecipeRow|File:Ingredient_Leather_Heavy.png|Heavy Leather|2}}
| |
| {{RecipeRow|File:Ingredient_Fabric_Scrap_Shadoweave.png|Shadoweave Scraps|4}}
| |
| | bench = Workbench
| |
| | tier = None
| |
| | time = 4 seconds
| |
| | requirements = None
| |
| }}
| |
| |Weapon=
| |
| }}
| |
| | |
| que mejoras visuales me propones para esta pagina?
| |
| 20:27
| |
| | |
| Aquí te propongo varias mejoras visuales para la página:
| |
| 1. Sección de Estadísticas Principales
| |
| | |
| Añadir una caja destacada con las stats clave del item justo después del infobox:
| |
| | |
| Durabilidad máxima: 300
| |
| Tipo: Herramienta
| |
| Nivel/Tier del material
| |
| | |
| 2. Tabla de Gathering Power más visual
| |
| | |
| En lugar de solo listar los valores, usar barras de progreso o iconos:
| |
| | |
| Usar colores (verde para alto, amarillo para medio, rojo para bajo)
| |
| Añadir iconos para cada tipo de bloque
| |
| Mostrar porcentajes o valores comparativos
| |
| | |
| 3. Sección de Comparación
| |
| | |
| Añadir una tabla comparativa con otros picos del mismo tier o similares:
| |
| | |
| | Pickaxe | Durability | Rock Speed | Cost |
| |
| |----------------|------------|------------|-------|
| |
| | Cobalt Pickaxe | 300 | 0.5 | 7 ing |
| |
| | Iron Pickaxe | ... | ... | ... |
| |
| | |
| 4. Galería de imágenes
| |
| | |
| Si tienes sprites o capturas:
| |
| | |
| El item en inventario
| |
| El item equipado
| |
| Animación de minado (si aplica)
| |
| | |
| 5. Sección "Cómo obtener"
| |
| | |
| Además de la receta, añadir:
| |
| | |
| Dónde encontrar los materiales
| |
| Alternativas de obtención (drops, comercio, etc.)
| |
| | |
| 6. Tips y notas
| |
| | |
| Cuándo conviene craftear este pico
| |
| Para qué minerales es óptimo
| |
| Comparación coste/beneficio
| |
| | |
| ¿Te gustaría que desarrolle alguna de estas propuestas en código concreto?
| |
| | |
| Creame la pagina con esas mejoras
| |
| 20:27
| |
| Cobalt Pickaxe - Enhanced Wiki Page
| |
| Documento
| |
| | |
| He creado una versión mejorada de la página con las siguientes mejoras visuales:
| |
| ✨ Mejoras Implementadas:
| |
| | |
| Overview Section - Introducción descriptiva del item
| |
| Key Statistics Table - Tabla resumen con las stats principales y cálculos útiles (usos antes de romperse)
| |
| Gathering Power Analysis - Tabla con colores y ratings visuales:
| |
| Verde para excelente
| |
| Dorado para bueno
| |
| Naranja para aceptable
| |
| Rojo para pobre
| |
| Comparison Table - Compara el Cobalt Pickaxe con otros picos del juego (ordenable)
| |
| Crafting Guide Expandida:
| |
| Tabla con "Cómo Obtener" cada material
| |
| Proceso paso a paso
| |
| Usage Tips Section - Caja destacada con consejos prácticos:
| |
| Cuándo usarlo
| |
| Gestión de durabilidad
| |
| Análisis coste/beneficio
| |
| Obtaining Materials - Guía detallada de dónde conseguir cada ingrediente
| |
| Gallery Section - Espacio para imágenes del item
| |
| Additional Sections:
| |
| Trivia
| |
| See Also con links relacionados
| |
| Categorías apropiadas
| |
| | |
| Nota: He usado algunos templates como {{ProgressBar}} que necesitarás crear en tu wiki para las barras de progreso visuales. Si no los tienes, puedo mostrarte versiones alternativas con HTML/CSS básico.
| |
|
| |
|
| <div class="recipe-visual" style="display:flex; flex-wrap:wrap; align-items:flex-start; gap:1em; padding:1em; margin-top:1em;">
| |
| <!-- Ingredients --> | | <!-- Ingredients --> |
| <div style="flex:1; min-width:250px;"> | | <div style="flex:1; min-width:250px;"> |
| Line 270: |
Line 11: |
| {{{ingredients}}} | | {{{ingredients}}} |
| </table> | | </table> |
| | |
| <!-- Bench / Tier --> | | <!-- Bench / Tier --> |
| <div style="margin-top:1em; font-size:90%;"> | | <div style="margin-top:1em; font-size:90%;"> |
| Line 277: |
Line 19: |
| <span style="font-weight:bold;">Requirements:</span> {{{requirements}}} | | <span style="font-weight:bold;">Requirements:</span> {{{requirements}}} |
| </div> | | </div> |
| | |
| </div> | | </div> |
| </div>
| |
|
| |
| Se ve así, hazme una propuesta mejor
| |
| 20:31
| |
| Improved Recipe Block Template
| |
| Código
| |
|
| |
| He creado una versión mejorada del bloque de recetas con estas mejoras:
| |
| 🎨 Mejoras Visuales:
| |
|
| |
| Diseño en 2 Columnas
| |
| Ingredientes a la izquierda
| |
| Detalles de crafteo a la derecha
| |
| Layout má
| |
|
| |
| ¿Quieres recibir una notificación cuando Claude responda?
| |
|
| |
|
| |
| Claude es IA y puede cometer errores. Por favor, verifica las respuestas.
| |
| <div class="recipe-container" style="
| |
| background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
| |
| border: 2px solid #0f4c75;
| |
| border-radius: 12px;
| |
| padding: 1.5em;
| |
| margin: 1.5em 0;
| |
| box-shadow: 0 4px 15px rgba(0,0,0,0.3);
| |
| ">
| |
| <!-- Header -->
| |
| <div style="
| |
| display: flex;
| |
| align-items: center;
| |
| gap: 0.5em;
| |
| margin-bottom: 1.5em;
| |
| padding-bottom: 0.75em;
| |
| border-bottom: 2px solid #0f4c75;
| |
| ">
| |
| <span style="font-size: 1.5em;">🔨</span>
| |
| <h3 style="margin: 0; color: #3498db; font-size: 1.3em;">Crafting Recipe</h3>
| |
| </div>
| |
|
| |
| <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 2em;">
| |
|
| |
| <!-- Left Column: Ingredients -->
| |
| <div>
| |
| <h4 style="color: #3498db; margin-top: 0; margin-bottom: 1em; font-size: 1.1em;">
| |
| 📦 Required Materials
| |
| </h4>
| |
|
| |
| <table style="width: 100%; border-collapse: separate; border-spacing: 0;">
| |
| <thead>
| |
| <tr style="background: rgba(52, 152, 219, 0.1); border-bottom: 2px solid #0f4c75;">
| |
| <th style="padding: 8px; text-align: left; color: #3498db; width: 50px;">Icon</th>
| |
| <th style="padding: 8px; text-align: left; color: #3498db;">Material</th>
| |
| <th style="padding: 8px; text-align: center; color: #3498db; width: 70px;">Qty</th>
| |
| </tr>
| |
| </thead>
| |
| <tbody>
| |
| {{{ingredients}}}
| |
| </tbody>
| |
| </table>
| |
| </div>
| |
|
| |
| <!-- Right Column: Crafting Info -->
| |
| <div>
| |
| <h4 style="color: #3498db; margin-top: 0; margin-bottom: 1em; font-size: 1.1em;">
| |
| ⚙️ Crafting Details
| |
| </h4>
| |
|
| |
| <div style="background: rgba(15, 76, 117, 0.2); border-radius: 8px; padding: 1em;">
| |
|
| |
| <!-- Workbench -->
| |
| <div style="display: flex; align-items: center; gap: 0.5em; margin-bottom: 0.75em; padding: 0.5em; background: rgba(52, 152, 219, 0.1); border-radius: 6px;">
| |
| <span style="font-size: 1.2em;">🔧</span>
| |
| <div>
| |
| <div style="font-size: 0.85em; color: #95a5a6;">Workbench</div>
| |
| <div style="font-weight: bold; color: #ecf0f1;">[[{{{bench}}}]]</div>
| |
| </div>
| |
| </div>
| |
|
| |
| <!-- Tier -->
| |
| <div style="display: flex; align-items: center; gap: 0.5em; margin-bottom: 0.75em; padding: 0.5em; background: rgba(52, 152, 219, 0.1); border-radius: 6px;">
| |
| <span style="font-size: 1.2em;">⭐</span>
| |
| <div>
| |
| <div style="font-size: 0.85em; color: #95a5a6;">Required Tier</div>
| |
| <div style="font-weight: bold; color: #ecf0f1;">{{{tier}}}</div>
| |
| </div>
| |
| </div>
| |
|
| |
| <!-- Time -->
| |
| <div style="display: flex; align-items: center; gap: 0.5em; margin-bottom: 0.75em; padding: 0.5em; background: rgba(52, 152, 219, 0.1); border-radius: 6px;">
| |
| <span style="font-size: 1.2em;">⏱️</span>
| |
| <div>
| |
| <div style="font-size: 0.85em; color: #95a5a6;">Crafting Time</div>
| |
| <div style="font-weight: bold; color: #ecf0f1;">{{{time}}}</div>
| |
| </div>
| |
| </div>
| |
|
| |
| <!-- Requirements -->
| |
| <div style="display: flex; align-items: center; gap: 0.5em; padding: 0.5em; background: rgba(52, 152, 219, 0.1); border-radius: 6px;">
| |
| <span style="font-size: 1.2em;">📋</span>
| |
| <div>
| |
| <div style="font-size: 0.85em; color: #95a5a6;">Requirements</div>
| |
| <div style="font-weight: bold; color: #ecf0f1;">{{{requirements}}}</div>
| |
| </div>
| |
| </div>
| |
|
| |
| </div>
| |
|
| |
| <!-- Output Product (opcional) -->
| |
| <div style="
| |
| margin-top: 1em;
| |
| padding: 1em;
| |
| background: linear-gradient(135deg, rgba(46, 213, 115, 0.15), rgba(52, 152, 219, 0.15));
| |
| border: 2px solid #2ecc71;
| |
| border-radius: 8px;
| |
| text-align: center;
| |
| ">
| |
| <div style="font-size: 0.85em; color: #95a5a6; margin-bottom: 0.5em;">Produces</div>
| |
| <div style="font-weight: bold; color: #2ecc71; font-size: 1.1em;">1x Cobalt Pickaxe</div>
| |
| </div>
| |
| </div>
| |
|
| |
|
| </div>
| |
| </div> | | </div> |
