Template:Product: Difference between revisions

Latest revision as of 20:33, 23 December 2023

Usage

Please use this string:

{{Product|image=###image class=img-fluid(default)|as-is(without resizing)###description=###|category1=###|category2=### |documentation={{DocBox|system={Android,Linux,Yocto,Hardware}|content=###}} |cpu=### |ram=### |display=### |gfx=### |storage=### |rtc=### |i2c=### |spi=### |net=### |temp=Commercial\Extended |usb=### |audio=### |uart=### |dim=### |wire=###}}

Product

[[File:{{{image}}}|class=img-fluid mb-3|Product]]

{{{description}}}

{{{documentation}}}

Specs summary

CPU	{{{cpu}}}
Memory	{{{ram}}}
GPU	{{{gfx}}}
Display	{{{display}}}
Storage	{{{storage}}}
Network	{{{net}}}
RTC	{{{rtc}}}
I2C	{{{i2c}}}
One-Wire	{{{wire}}}
SPI	{{{spi}}}
CAN bus	{{{can}}}
UARTs	{{{uart}}}
USB	{{{usb}}}
Audio	{{{audio}}}
Temperature Range	{{{temp}}}
Dimensions	{{{dim}}}

To the top

[[Category:{{{category1}}}]] [[Category:{{{category2}}}]]

@@ Line 1: / Line 1: @@
-<noinclude>{{TemplateGen|params=<nowiki>image=###description=###|category1=###|category2=###</nowiki><br/><nowiki>|documentation={{DocBox|system={Android,Linux,Yocto,Hardware}|content=###}}</nowiki><br/><nowiki>|cpu=###|mpu=###|gfx=###|ram=###|lcd=###|hdmi=###|rtc=###|i2c=###|spi=###|sd_mmc=###|nand=###|power=###|temp=###|usb=###|ethernet=###|audio=###|wireless=###|canbus=###|bluetooth=###|touch=###|serial=###</nowiki>}}</noinclude>
+<noinclude>{{TemplateGen|params=<nowiki>image=###image class=img-fluid(default)|as-is(without resizing)###description=###|category1=###|category2=###</nowiki><br/><nowiki>|documentation={{DocBox|system={Android,Linux,Yocto,Hardware}|content=###}}</nowiki><br/><nowiki>|cpu=###</nowiki><br/><nowiki>|ram=###</nowiki><br/><nowiki>|display=###</nowiki><br/><nowiki>|gfx=###</nowiki><br/><nowiki>|storage=###</nowiki><br/><nowiki>|rtc=###</nowiki><br/><nowiki>|i2c=###</nowiki><br/><nowiki>|spi=###</nowiki><br/><nowiki>|net=###</nowiki><br/><nowiki>|temp=Commercial\Extended </nowiki><br/><nowiki>|usb=###</nowiki><br/><nowiki>|audio=###</nowiki><br/><nowiki>|uart=###</nowiki><br/><nowiki>|dim=###</nowiki><br/><nowiki>|wire=###</nowiki>}}</noinclude>__notoc__<!--Description-->
-__notoc__
+<div class="mt-3 card bg-light border-0">
-<!--Description-->
+<div class="card-header bg-main text-white">
-<div style=" width:100%;">
+<div class="lead font-weight-bold">{{PAGENAME}}</div>
-{|
-|-
-{| style="padding:15px; background-color: #0066c7; color: white; width:100%; font-size:25px;  border-top-left-radius:5px; border-top-right-radius:5px; "
-|{{PAGENAME}}
-|}
-|-
-|
-{|style="background-color: #F0F0FF; width:100%; "
-|style="width:250px; padding:5px 25px 5px 25px;"|[[File:{{{image}}}|height=100px|{{PAGENAME}}]]
-|style="padding:20px 30px 0px 0px; vertical-align:top;"|{{{description}}}
-|}
-|}
 </div>
-<!--
+<div class="card-body row p-3">
-<!--Documentation-->
+<div class="product-header text-center col-md-5 col-lg-5 col-xl-4">[[File:{{{image}}}|class={{{image class|img-fluid}}} mb-3|{{PAGENAME}}]]</div>
-<div style="overflow:hidden;">
+<div class="col-md-7 col-lg-7 col-xl-8 d-flex flex-column justify-content-between pb-3" style="font-size:17px;line-height:1.3em">
-{{{documentation}}}
+{{{description}}}
+{{#if: {{{spec link|}}}
+  |<div>[{{{spec link|}}} <span class="mw-ui-button mw-ui-progressive mt-3">Product Specifications</span>]</div>
+}}
 </div>
+</div>
-<div style="margin: 0 auto; width:80%;">
+</div><!-- SEO -->{{#seo:
-{|
+  |description={{#sub:{{{seo description|{{{description|}}}}}}|0|{{#expr:180 - ( 0{{#len:{{#explode:{{#sub:{{{seo description|{{{description|}}}}}}|0|180}}| |-1}}}} + 1 ) }} }}...
-{|style="padding:15px; background-color: #0066c7; color: white; width:100%; font-size:25px;  border-top-left-radius:5px; border-top-right-radius:5px;"
+  |modified_time={{REVISIONYEAR}}-{{REVISIONMONTH}}-{{REVISIONDAY2}}
-|Specification
+}}<!--Documentation--><div class="card-deck flex-column flex-lg-row">{{{documentation}}}
-|}
+<div class="mt-3 card specs bg-light border-0">
-|-
+<div class="card-header bg-blue text-white"  style="font-size: 12pt;">
-|<table  style="border:1px solid #0066c7; background-color: #F0F0FF; width:100%; ">
+<div class="font-weight-bold">Specs summary</div>
-|style="width:30%;"|
+</div>
-{{#if:{{{cpu}}}|<tr><td>CPU</td><td>{{{cpu}}}</td></tr>|}}
+<div class="card-body row px-3 py-0 align-items-start">
-{{#if:{{{mpu}}}|<tr style="border: 1px solid black;"><td>MPU</td><td>{{{mpu}}}</td></tr>|}}
+<table id="specs" class="table bg-light py-0" style="font-size:90%"><!--
-{{#if:{{{gfx}}}|<tr><td>GFX</td><td>{{{gfx}}}</td></tr>|}}
+-->{{#if:{{{cpu}}}|<tr><td style="width:90px">'''CPU'''</td><td>{{{cpu}}}</td></tr>}}<!--
-{{#if:{{{ram}}}|<tr><td>RAM</td><td>{{{ram}}}</td></tr>|}}
+-->{{#if:{{{ram}}}|<tr><td>'''Memory'''</td><td>{{{ram}}}</td></tr>|}}<!--
-{{#if:{{{RAM}}}|<tr><td>LCD</td><td>{{{RAM}}}</td></tr>|}}
+-->{{#if:{{{gfx}}}|<tr><td>'''GPU'''</td><td>{{{gfx}}}</td></tr>|}}<!--
-{{#if:{{{rtc}}}|<tr><td>RTC</td><td>{{{rtc}}}</td></tr>|}}
+-->{{#if:{{{display}}}|<tr><td>'''Display'''</td><td>{{{display}}}</td></tr>|}}<!--
-{{#if:{{{i2c}}}|<tr><td>I2C</td><td>{{{i2c}}}</td></tr>|}}
+-->{{#if:{{{storage}}}|<tr><td>'''Storage'''</td><td>{{{storage}}}</td></tr>|}}<!--
-{{#if:{{{spi}}}|<tr><td>SPI</td><td>{{{spi}}}</td></tr>|}}
+-->{{#if:{{{net}}}|<tr><td>'''Network'''</td><td>{{{net}}}</td></tr>|}}<!--
-{{#if:{{{sd_mmc}}}|<tr><td>SD/MMC</td><td>{{{sd_mmc}}}</td></tr>|}}
+-->{{#if:{{{rtc}}}|<tr><td>'''RTC'''</td><td>{{{rtc}}}</td></tr>|}}<!--
-{{#if:{{{nand}}}|<tr><td>NAND Flash</td><td>{{{nand}}}</td></tr>|}}
+-->{{#if:{{{i2c}}}|<tr><td>'''I2C'''</td><td>{{{i2c}}}</td></tr>|}}<!--
-{{#if:{{{power}}}|<tr><td>Typical power consumtpion</td><td>{{{power}}}</td></tr>|}}
+-->{{#if:{{{wire}}}|<tr><td>'''One-Wire'''</td><td>{{{wire}}}</td></tr>|}}<!--
-{{#if:{{{temp}}}|<tr><td>Temp Range</td><td>{{{temp}}}</td></tr>|}}
+-->{{#if:{{{spi}}}|<tr><td>'''SPI'''</td><td>{{{spi}}}</td></tr>|}}<!--
-{{#if:{{{usb}}}|<tr><td>USB</td><td>{{{usb}}}</td></tr>|}}
+-->{{#if:{{{can}}}|<tr><td>'''CAN bus'''</td><td>{{{can}}}</td></tr>|}}<!--
-{{#if:{{{ethernet}}}|<tr><td>Ethernet</td><td>{{{ethernet}}}</td></tr>|}}
+-->{{#if:{{{uart}}}|<tr><td>'''UARTs'''</td><td>{{{uart}}}</td></tr>|}}<!--
-{{#if:{{{audio}}}|<tr><td>Audio codec</td><td>{{{audio}}}</td></tr>|}}
+-->{{#if:{{{usb}}}|<tr><td>'''USB'''</td><td>{{{usb}}}</td></tr>|}}<!--
-{{#if:{{{wireless}}}|<tr><td>Wireless</td><td>{{{wireless}}}</td></tr>|}}
+-->{{#if:{{{audio}}}|<tr><td>'''Audio'''</td><td>{{{audio}}}</td></tr>|}}<!--
-{{#if:{{{canbus}}}|<tr><td>Can-Bus controller</td><td>{{{canbus}}}</td></tr>|}}
+-->{{#if:{{{temp}}}|<tr><td>'''Temperature Range'''</td><td>{{{temp}}}</td></tr>|}}<!--
-{{#if:{{{bluetooth}}}|<tr><td>Bluetooth</td><td>{{{bluetooth}}}</td></tr>|}}
+-->{{#if:{{{dim}}}|<tr><td>'''Dimensions'''</td><td>{{{dim}}}</td></tr>|}}
-{{#if:{{{touch}}}|<tr><td>Touch panel controller</td><td>{{{touch}}}</td></tr>|}}
-{{#if:{{{serial}}}|<tr><td>Serial Interfaces</td><td>{{{serial}}}</td></tr>|}}
 </table>
-|}
+</div>
+</div>
+</div>
+</div>
+<div class="text-right d-inline-block d-md-none">
+[[#top|<span class="mw-ui-button mw-ui-progressive my-3">To the top</span>]]
+</div>
 <!--Categories-->
 {{#if:{{{category1}}}|[[Category:{{{category1}}}]]|}}
 {{#if:{{{category2}}}|[[Category:{{{category2}}}]]|}}