Template:Vehicle Info: Difference between revisions

From vehicle Rental wiki demo

← Older edit
undoTanvir Wiki (talk | contribs)
Bureaucrats, Interface administrators, Administrators
39 edits
No edit summary
No edit summary
 
Line 1: Line 1:
<includeonly>
<includeonly>
<div style="border: none; border-radius: 16px; padding: 0; margin: 20px 0; background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%); box-shadow: 0 20px 30px -10px rgba(0,0,0,0.15), 0 8px 15px -6px rgba(0,0,0,0.1); overflow: hidden; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;">
<div style="border: 2px solid #1e3c5c; border-radius: 10px; padding: 15px; margin: 15px 0; background-color: #f9f9f9;">
 
   <h2 style="color: #1e3c5c; border-bottom: 2px solid #1e3c5c; padding-bottom: 8px; margin-top: 0;">🚗 {{{name|Vehicle Name}}}</h2>
   <!-- Header with vehicle name and badge -->
    
  <div style="background: linear-gradient(135deg, #1e3c5c 0%, #2b4c7c 100%); padding: 20px 25px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px;">
   <table style="width: 100%; border-collapse: collapse;">
    <h2 style="margin: 0; color: white; font-weight: 600; font-size: 1.8em; letter-spacing: -0.5px; text-shadow: 0 2px 4px rgba(0,0,0,0.2);">
     <tr>
      🚗 {{{name|Vehicle Name}}}
      <td style="padding: 10px; width: 30%; vertical-align: top;">
    </h2>
        <div style="text-align: center;">
    <span style="background-color: rgba(255,255,255,0.25); backdrop-filter: blur(5px); padding: 8px 20px; border-radius: 40px; color: white; font-weight: 600; font-size: 1.1em; border: 1px solid rgba(255,255,255,0.3); box-shadow: 0 4px 10px rgba(0,0,0,0.1);">
          {{#if:{{{image|}}}|[[File:{{{image}}}|center|200px|{{{name|}}}]]|<div style="background: #ddd; padding: 40px 20px; border-radius: 5px;">No Image</div>}}
      ⭐ {{{type|Category}}}
    </span>
   </div>
 
  <!-- Two column layout: Image + Key Specs -->
   <div style="display: grid; grid-template-columns: 1fr 1.2fr; gap: 0; background: white;">
   
     <!-- Left side: Image -->
    <div style="background-color: #f0f4f8; padding: 25px; display: flex; align-items: center; justify-content: center; border-right: 1px solid #e2e8f0;">
      <div style="width: 100%; text-align: center;">
        {{#if:{{{image|}}}|[[File:{{{image}}}|center|350px|{{{name|}}}]]|<div style="background: linear-gradient(145deg, #e6edf5, #d0ddee); padding: 60px 20px; border-radius: 24px; color: #4a5a6e; font-size: 1.2em;"><span style="font-size: 4em; display: block; margin-bottom: 10px;">🚘</span>No image available</div>}}
      </div>
    </div>
 
    <!-- Right side: Key Specifications -->
    <div style="padding: 25px; background: white;">
      <div style="margin-bottom: 20px; border-bottom: 2px solid #eef2f6; padding-bottom: 15px;">
        <h3 style="margin: 0; color: #1e3c5c; font-weight: 600; font-size: 1.4em; display: flex; align-items: center; gap: 8px;">
          <span style="background-color: #1e3c5c; width: 6px; height: 24px; border-radius: 3px; display: inline-block;"></span>
          Key Specifications
        </h3>
      </div>
 
      <!-- Specs grid -->
      <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 15px;">
        <!-- Daily Rate -->
        <div style="background: #f8fafc; border-radius: 14px; padding: 18px 12px; text-align: center; border: 1px solid #e9edf2; box-shadow: 0 4px 8px rgba(0,0,0,0.02);">
          <div style="font-size: 1.8em; margin-bottom: 5px;">💰</div>
          <div style="font-weight: 700; color: #1e3c5c; font-size: 1.3em;">{{{rate|0}}}</div>
          <div style="font-size: 0.85em; color: #64748b;">BDT/Day</div>
        </div>
 
        <!-- Transmission -->
        <div style="background: #f8fafc; border-radius: 14px; padding: 18px 12px; text-align: center; border: 1px solid #e9edf2; box-shadow: 0 4px 8px rgba(0,0,0,0.02);">
          <div style="font-size: 1.8em; margin-bottom: 5px;">⚙️</div>
          <div style="font-weight: 700; color: #1e3c5c; font-size: 1.3em;">{{{transmission|Auto}}}</div>
          <div style="font-size: 0.85em; color: #64748b;">Transmission</div>
        </div>
 
        <!-- AC -->
        <div style="background: #f8fafc; border-radius: 14px; padding: 18px 12px; text-align: center; border: 1px solid #e9edf2; box-shadow: 0 4px 8px rgba(0,0,0,0.02);">
          <div style="font-size: 1.8em; margin-bottom: 5px;">❄️</div>
          <div style="font-weight: 700; color: #1e3c5c; font-size: 1.3em;">{{{ac|Yes}}}</div>
          <div style="font-size: 0.85em; color: #64748b;">Air Conditioning</div>
         </div>
         </div>
 
      </td>
        <!-- Seats -->
      <td style="padding: 10px; vertical-align: top;">
        <div style="background: #f8fafc; border-radius: 14px; padding: 18px 12px; text-align: center; border: 1px solid #e9edf2; box-shadow: 0 4px 8px rgba(0,0,0,0.02);">
        <table style="width: 100%;">
          <div style="font-size: 1.8em; margin-bottom: 5px;">👥</div>
          <tr><th style="text-align: left; width: 40%;">Type:</th><td>{{{type|}}}</td></tr>
          <div style="font-weight: 700; color: #1e3c5c; font-size: 1.3em;">{{{seats|5}}}</div>
           <tr><th style="text-align: left;">Daily Rate:</th><td>{{{rate|}}} BDT</td></tr>
           <div style="font-size: 0.85em; color: #64748b;">Seats</div>
          <tr><th style="text-align: left;">Transmission:</th><td>{{{transmission|}}}</td></tr>
        </div>
           <tr><th style="text-align: left;">AC:</th><td>{{{ac|}}}</td></tr>
 
          <tr><th style="text-align: left;">Seats:</th><td>{{{seats|}}}</td></tr>
        <!-- Fuel Type -->
          <tr><th style="text-align: left;">Fuel Type:</th><td>{{{fuel|}}}</td></tr>
        <div style="background: #f8fafc; border-radius: 14px; padding: 18px 12px; text-align: center; border: 1px solid #e9edf2; box-shadow: 0 4px 8px rgba(0,0,0,0.02); grid-column: span 2;">
         </table>
           <div style="display: flex; align-items: center; justify-content: center; gap: 15px;">
       </td>
            <span style="font-size: 1.8em;">⛽</span>
    </tr>
            <span style="font-weight: 700; color: #1e3c5c; font-size: 1.2em;">{{{fuel|Petrol}}}</span>
  </table>
          </div>
 
         </div>
  <div style="margin-top: 10px; font-size: 0.9em; color: #666;">
       </div>
     [[Category:Fleet Vehicles]]
 
      <!-- Rental Badge -->
      <div style="margin-top: 20px; background: #eef7ff; border-radius: 12px; padding: 12px; text-align: center; border: 1px dashed #2b4c7c;">
        <span style="color: #1e3c5c; font-weight: 600;">✓ Available for immediate rental</span>
      </div>
     </div>
   </div>
   </div>
  <!-- Footer with category -->
  <div style="background-color: #f0f4f8; padding: 12px 25px; font-size: 0.9em; color: #4a5a6e; border-top: 1px solid #dde3ea; display: flex; gap: 15px; flex-wrap: wrap;">
    <span>📌 [[Category:Fleet Vehicles]]</span>
    <span style="margin-left: auto;">🔄 Last updated: {{CURRENTDAY}} {{CURRENTMONTHNAME}} {{CURRENTYEAR}}</span>
  </div>
</div>
</div>
</includeonly>
</includeonly>
<noinclude>
<noinclude>
<div style="background: linear-gradient(145deg, #f8fafc, #eef2f6); padding: 25px; border-radius: 20px; margin: 20px 0; border-left: 6px solid #1e3c5c; font-family: system-ui, -apple-system, sans-serif;">
<div style="background: #f0f0f0; padding: 15px; border-left: 5px solid #1e3c5c;">
   <h2 style="color: #1e3c5c; margin-top: 0;">📋 How to use this template</h2>
   <h3>How to use this template</h3>
   <p style="font-size: 1.1em;">Copy and paste the code below to display vehicle information in a professional card layout:</p>
   <p>Copy and paste the code below:</p>
 
   <pre>
   <div style="background: white; padding: 20px; border-radius: 12px; border: 1px solid #dde3ea; font-family: monospace; margin: 15px 0;">
    <pre style="margin: 0; white-space: pre-wrap;">
{{Vehicle Info
{{Vehicle Info
|name=Toyota Prius
|name=Toyota Prius
Line 102: Line 43:
|image=Toyota_Prius.jpg
|image=Toyota_Prius.jpg
}}
}}
    </pre>
  </pre>
   </div>
   <p><strong>Fields:</strong> name, type, rate, transmission, ac, seats, fuel, image</p>
 
  <h3 style="color: #1e3c5c;">📝 Field descriptions:</h3>
  <ul style="background: white; padding: 15px 30px; border-radius: 12px; border: 1px solid #dde3ea;">
    <li><strong>name</strong> - Vehicle model name</li>
    <li><strong>type</strong> - Vehicle category (SUV, Sedan, Hatchback, etc.)</li>
    <li><strong>rate</strong> - Daily rental rate in BDT</li>
    <li><strong>transmission</strong> - Automatic or Manual</li>
    <li><strong>ac</strong> - Yes/No</li>
    <li><strong>seats</strong> - Number of seats</li>
    <li><strong>fuel</strong> - Petrol, Diesel, Hybrid, Electric</li>
    <li><strong>image</strong> - Filename of uploaded image</li>
  </ul>
 
  <p style="margin-top: 15px; color: #2c3e50;">⚡ <strong>Note:</strong> After creating this template, go to your vehicle pages and add the code above.</p>
</div>
</div>
[[Category:Templates]]
[[Category:Templates]]
</noinclude>
</noinclude>

Latest revision as of 19:17, 14 March 2026


How to use this template

Copy and paste the code below:

{{Vehicle Info
|name=Toyota Prius
|type=Hybrid Hatchback
|rate=2500
|transmission=Automatic
|ac=Yes
|seats=5
|fuel=Hybrid
|image=Toyota_Prius.jpg
}}

Fields: name, type, rate, transmission, ac, seats, fuel, image

Retrieved from "https://vehiclerentalwikidemo.serix.group/index.php?title=Template:Vehicle_Info&oldid=11"