Toggle search
Toggle menu
3.2K
2.8K
4
30.3K
HytaleWiki
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Template:RecipeBlock: Difference between revisions

Template page
More actions
← Older edit
undoHytalewiki (talk | contribs)
Bureaucrats, Interface administrators, Administrators
26,738 edits
VisualWikitext
No edit summary
No edit summary
 
(4 intermediate revisions by the same user not shown)
Line 1: Line 1:
<div class="recipe-container" style="
<div class="recipe-container">
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
   <h3 class="recipe-header">Crafting Recipe</h3>
  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;
  ">
    <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;">
   <div class="recipe-grid">
      
      
     <!-- Left Column: Ingredients -->
     <!-- Left Column: Ingredients -->
     <div>
     <div>
       <h4 style="color: #3498db; margin-top: 0; margin-bottom: 1em; font-size: 1.1em;">
       <h4 class="recipe-section-title">📦 Required Materials</h4>
        📦 Required Materials
      </h4>
        
        
       <table style="width: 100%; border-collapse: separate; border-spacing: 0;">
       <table class="recipe-table">
         <tr style="background: rgba(52, 152, 219, 0.1); border-bottom: 2px solid #0f4c75;">
         <tr class="recipe-table-header">
           <th style="padding: 8px; text-align: left; color: #3498db; width: 50px;">Icon</th>
           <th>Icon</th>
           <th style="padding: 8px; text-align: left; color: #3498db;">Material</th>
           <th>Material</th>
           <th style="padding: 8px; text-align: center; color: #3498db; width: 70px;">Qty</th>
           <th>Qty</th>
         </tr>
         </tr>
         {{{ingredients}}}
         {{{ingredients}}}
Line 39: Line 20:
     <!-- Right Column: Crafting Info -->
     <!-- Right Column: Crafting Info -->
     <div>
     <div>
       <h4 style="color: #3498db; margin-top: 0; margin-bottom: 1em; font-size: 1.1em;">
       <h4 class="recipe-section-title">⚙️ Crafting Details</h4>
        ⚙️ Crafting Details
      </h4>
        
        
       <div style="background: rgba(15, 76, 117, 0.2); border-radius: 8px; padding: 1em;">
       <div class="crafting-details">
          
          
        <!-- Workbench -->
         <div class="detail-item">
         <div style="display: grid; grid-template-columns: 40px 1fr; gap: 0.75em; align-items: center; margin-bottom: 0.75em; padding: 0.75em; background: rgba(52, 152, 219, 0.1); border-radius: 6px;">
           <div class="detail-icon">{{{bench_icon}}}</div>
           <div style="width: 40px; height: 40px; background: rgba(0,0,0,0.3); border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 1.2em;">🔧</div>
           <div>
           <div>
             <div style="font-size: 0.85em; color: #95a5a6;">Workbench</div>
             <div class="detail-label">Workbench</div>
             <div style="font-weight: bold; color: #ecf0f1;">[[{{{bench}}}]]</div>
             <div class="detail-value">[[{{{bench}}}]]</div>
           </div>
           </div>
         </div>
         </div>


        <!-- Tier -->
         <div class="detail-item">
         <div style="display: grid; grid-template-columns: 40px 1fr; gap: 0.75em; align-items: center; margin-bottom: 0.75em; padding: 0.75em; background: rgba(52, 152, 219, 0.1); border-radius: 6px;">
           <div class="detail-icon">⭐</div>
           <div style="width: 40px; height: 40px; background: rgba(0,0,0,0.3); border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 1.2em;">⭐</div>
           <div>
           <div>
             <div style="font-size: 0.85em; color: #95a5a6;">Workbench Tier</div>
             <div class="detail-label">Workbench Tier</div>
             <div style="font-weight: bold; color: #ecf0f1;">{{{tier}}}</div>
             <div class="detail-value">{{{tier}}}</div>
           </div>
           </div>
         </div>
         </div>


        <!-- Time -->
         <div class="detail-item">
         <div style="display: grid; grid-template-columns: 40px 1fr; gap: 0.75em; align-items: center; margin-bottom: 0.75em; padding: 0.75em; background: rgba(52, 152, 219, 0.1); border-radius: 6px;">
           <div class="detail-icon">⏱️</div>
           <div style="width: 40px; height: 40px; background: rgba(0,0,0,0.3); border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 1.2em;">⏱️</div>
           <div>
           <div>
             <div style="font-size: 0.85em; color: #95a5a6;">Crafting Time</div>
             <div class="detail-label">Crafting Time</div>
             <div style="font-weight: bold; color: #ecf0f1;">{{{time}}}</div>
             <div class="detail-value">{{{time}}}</div>
           </div>
           </div>
         </div>
         </div>


        <!-- Requirements -->
         <div class="detail-item">
         <div style="display: grid; grid-template-columns: 40px 1fr; gap: 0.75em; align-items: center; padding: 0.75em; background: rgba(52, 152, 219, 0.1); border-radius: 6px;">
           <div class="detail-icon">📋</div>
           <div style="width: 40px; height: 40px; background: rgba(0,0,0,0.3); border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 1.2em;">📋</div>
           <div>
           <div>
             <div style="font-size: 0.85em; color: #95a5a6;">Requirements</div>
             <div class="detail-label">Requirements</div>
             <div style="font-weight: bold; color: #ecf0f1;">{{{requirements}}}</div>
             <div class="detail-value">{{{requirements}}}</div>
           </div>
           </div>
         </div>
         </div>
Line 86: Line 61:
   </div>
   </div>
</div>
</div>
<noinclude>
== Usage ==
<pre>
{{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
| output = 1x Cobalt Pickaxe
}}
</pre>
== Parameters ==
* '''ingredients''' - Use {{tl|RecipeRow}} template for each ingredient
* '''bench''' - Crafting station required
* '''tier''' - Required tier/level
* '''time''' - Crafting duration
* '''requirements''' - Additional requirements (optional)
* '''output''' - What the recipe produces (optional)
[[Category:Templates]]
</noinclude>

Latest revision as of 00:13, 19 January 2026

Crafting Recipe

📦 Required Materials

{{{ingredients}}}
Icon Material Qty

⚙️ Crafting Details

{{{bench_icon}}}
Workbench
[[{{{bench}}}]]
⭐
Workbench Tier
{{{tier}}}
⏱️
Crafting Time
{{{time}}}
📋
Requirements
{{{requirements}}}
Retrieved from "https://hytalewiki.info/index.php?title=Template:RecipeBlock&oldid=12494"