Add Pi orientation graphic to legend
This commit is contained in:
parent
77d8f24149
commit
6d1171cb49
@ -4,52 +4,55 @@
|
|||||||
{{nav}}
|
{{nav}}
|
||||||
</nav>
|
</nav>
|
||||||
<div id="legend">
|
<div id="legend">
|
||||||
<h2>Legend</h2>
|
<div>
|
||||||
<p>Orientate your Pi with the GPIO on the right and the HDMI port on the left.</p>
|
<h2>Legend</h2>
|
||||||
<ul>
|
<p>Orientate your Pi with the GPIO on the right and the HDMI port on the left.</p>
|
||||||
<li class="gpio">
|
<ul>
|
||||||
<a href="/pinout/wiringpi" title="GPIO (General Purpose IO)">
|
<li class="gpio">
|
||||||
<span class="default"></span>
|
<a href="/pinout/wiringpi" title="GPIO (General Purpose IO)">
|
||||||
<span class="pin"></span> GPIO <small>(General Purpose IO)</small>
|
<span class="default"></span>
|
||||||
</a>
|
<span class="pin"></span> GPIO <small>(General Purpose IO)</small>
|
||||||
</li>
|
</a>
|
||||||
<li class="spi">
|
</li>
|
||||||
<a href="/pinout/spi" title="SPI (Serial Peripheral Interface)">
|
<li class="spi">
|
||||||
<span class="default"></span>
|
<a href="/pinout/spi" title="SPI (Serial Peripheral Interface)">
|
||||||
<span class="pin"></span> SPI <small>(Serial Peripheral Interface)</small>
|
<span class="default"></span>
|
||||||
</a>
|
<span class="pin"></span> SPI <small>(Serial Peripheral Interface)</small>
|
||||||
</li>
|
</a>
|
||||||
<li class="i2c">
|
</li>
|
||||||
<a href="/pinout/i2c" title="I2C (Inter-integrated Circuit)">
|
<li class="i2c">
|
||||||
<span class="default"></span>
|
<a href="/pinout/i2c" title="I2C (Inter-integrated Circuit)">
|
||||||
<span class="pin"></span> I<sup>2</sup>C <small>(Inter-integrated Circuit)</small>
|
<span class="default"></span>
|
||||||
</a>
|
<span class="pin"></span> I<sup>2</sup>C <small>(Inter-integrated Circuit)</small>
|
||||||
</li>
|
</a>
|
||||||
<li class="uart">
|
</li>
|
||||||
<a href="/pinout/uart" title="UART (Universal Asyncronous Receiver/Transmitter)">
|
<li class="uart">
|
||||||
<span class="default"></span>
|
<a href="/pinout/uart" title="UART (Universal Asyncronous Receiver/Transmitter)">
|
||||||
<span class="pin"></span> UART <small>(Universal Asyncronous Receiver/Transmitter)</small>
|
<span class="default"></span>
|
||||||
</a>
|
<span class="pin"></span> UART <small>(Universal Asyncronous Receiver/Transmitter)</small>
|
||||||
</li>
|
</a>
|
||||||
<li class="gnd">
|
</li>
|
||||||
<a href="/pinout/ground" title="Ground">
|
<li class="gnd">
|
||||||
<span class="default"></span>
|
<a href="/pinout/ground" title="Ground">
|
||||||
<span class="pin"></span> Ground
|
<span class="default"></span>
|
||||||
</a>
|
<span class="pin"></span> Ground
|
||||||
</li>
|
</a>
|
||||||
<li class="pow5v">
|
</li>
|
||||||
<a href="/pinout/5v_power" title="5v (Power)">
|
<li class="pow5v">
|
||||||
<span class="default"></span>
|
<a href="/pinout/5v_power" title="5v (Power)">
|
||||||
<span class="pin"></span> 5v <small>(Power)</small>
|
<span class="default"></span>
|
||||||
</a>
|
<span class="pin"></span> 5v <small>(Power)</small>
|
||||||
</li>
|
</a>
|
||||||
<li class="pow3v3">
|
</li>
|
||||||
<a href="/pinout/3v3_power" title="3.3v (Power)">
|
<li class="pow3v3">
|
||||||
<span class="default"></span>
|
<a href="/pinout/3v3_power" title="3.3v (Power)">
|
||||||
<span class="pin"></span> 3.3v <small>(Power)</small>
|
<span class="default"></span>
|
||||||
</a>
|
<span class="pin"></span> 3.3v <small>(Power)</small>
|
||||||
</li>
|
</a>
|
||||||
</ul>
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<img src="{{resource_url}}pi-orientation.png" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="content">
|
<div id="content">
|
||||||
|
BIN
resources/pi-orientation.png
Normal file
BIN
resources/pi-orientation.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 7.9 KiB |
@ -602,6 +602,14 @@ nav {
|
|||||||
margin-top:5px;
|
margin-top:5px;
|
||||||
margin-bottom:5px;
|
margin-bottom:5px;
|
||||||
}
|
}
|
||||||
|
div {
|
||||||
|
width: 300px;
|
||||||
|
float: left;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
img {width:196px;height:auto;margin-top:4px;
|
||||||
|
float: left;
|
||||||
|
display: block;}
|
||||||
p {
|
p {
|
||||||
font-size:$base-font-size * 0.7;
|
font-size:$base-font-size * 0.7;
|
||||||
padding: 0 10px 10px 0;
|
padding: 0 10px 10px 0;
|
||||||
|
@ -459,6 +459,16 @@ nav {
|
|||||||
#legend h2 {
|
#legend h2 {
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
margin-bottom: 5px; }
|
margin-bottom: 5px; }
|
||||||
|
#legend div {
|
||||||
|
width: 300px;
|
||||||
|
float: left;
|
||||||
|
display: block; }
|
||||||
|
#legend img {
|
||||||
|
width: 196px;
|
||||||
|
height: auto;
|
||||||
|
margin-top: 4px;
|
||||||
|
float: left;
|
||||||
|
display: block; }
|
||||||
#legend p {
|
#legend p {
|
||||||
font-size: 0.84em;
|
font-size: 0.84em;
|
||||||
padding: 0 10px 10px 0; }
|
padding: 0 10px 10px 0; }
|
||||||
|
Loading…
Reference in New Issue
Block a user