Jeff Epler
6f0b124e5b
This means that the user can hit anywhere on the big target like "Adafruit" instead of only being able to click the small checkbox. It may also improve accessibility. Additionally, the mouse cursor over the checkbox and its label is changed to the "pointer" to indicate an action is available by clicking.
108 lines
4.7 KiB
HTML
108 lines
4.7 KiB
HTML
---
|
|
layout: default
|
|
title: Blinka
|
|
permalink: /blinka
|
|
---
|
|
|
|
<div id="downloads-page">
|
|
<h1>Blinka</h1>
|
|
<p>
|
|
Blinka brings CircuitPython APIs and, therefore, CircuitPython libraries to single board computers (SBCs). It is a <a href="https://pypi.org/project/Adafruit-Blinka/">pip installable Python library</a> that runs in normal "desktop" Python. The CircuitPython runtime isn't used. <a href="https://pypi.org/search/?q=adafruit-circuitpython">CircuitPython libraries</a> can also be installed via pip. See <a href="https://learn.adafruit.com/circuitpython-on-raspberrypi-linux"> the guide</a> for further details.
|
|
</p>
|
|
<div class="downloads-inputs">
|
|
<div class="downloads-search">
|
|
<label class="search-wrapper">
|
|
<input aria-label="Search for Blinka boards" type="text" id="search" placeholder="Search for Blinka boards" />
|
|
</label>
|
|
</div>
|
|
<div class="downloads-filter">
|
|
<button class="filter" title="Filter Boards"><i class="fas fa-sliders-h"
|
|
aria-hidden="true"></i> Filters</button>
|
|
</div>
|
|
<div class="downloads-filter-tags">
|
|
</div>
|
|
</div>
|
|
<div class="downloads-filter-content">
|
|
<div class="filter-buttons">
|
|
<button class="save-changes" title="Close and Save Changes"><i class="fas fa-times" aria-hidden="true"></i></button>
|
|
</div>
|
|
<div>
|
|
<div class="manufacturers filter-tall">
|
|
<fieldset>
|
|
<legend>Manufacturers</legend>
|
|
<ul class="content"></ul>
|
|
</fieldset>
|
|
</div>
|
|
<div class="features filter-tall">
|
|
<fieldset>
|
|
<legend>Features</legend>
|
|
<ul class="content"></ul>
|
|
</fieldset>
|
|
</div>
|
|
<div class="sort-by">
|
|
<fieldset>
|
|
<legend>Sort By</legend>
|
|
<ul class="content">
|
|
<li><input type="radio" name="sort-by" value="downloads" aria-label="Downloads" id="sortby-downloads" checked><label for="sortby-downloads">Downloads</label></li>
|
|
<li><input type="radio" name="sort-by" value="alpha-asc" aria-label="Board Name (A to Z)" id="sortby-alpha-asc" ><label for="sortby-alpha-asc">Board Name (A to Z)</label></li>
|
|
<li><input type="radio" name="sort-by" value="alpha-desc" aria-label="Board Name (Z to A)" id="sortby-alpha-desc"><label for="sortby-alpha-desc">Board Name (Z to A)</label></li>
|
|
<li><input type="radio" name="sort-by" value="date-desc" aria-label="Date Added (Newest First)" id="sortby-date-desc"><label for="sortby-date-desc">Date Added (Newest First)</label></li>
|
|
<li><input type="radio" name="sort-by" value="date-asc" aria-label="Date Added (Oldest First)" id="sortby-date-asc"><label for="sortby-date-asc">Date Added (Oldest First)</label></li>
|
|
</ul>
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="download-count">
|
|
{% comment %}
|
|
Display the total number of boards.
|
|
{% endcomment %}
|
|
{% assign board_count = 0 %}
|
|
{% for board in site.blinka %}
|
|
{% if board.downloads_display == false %}
|
|
{% continue %}
|
|
{% endif %}
|
|
{% assign board_count = board_count | plus: 1 %}
|
|
{% endfor %}
|
|
Displaying <span id="board_count">{{ board_count }}</span> boards.
|
|
</div>
|
|
<div class="downloads-section">
|
|
{% comment %}
|
|
Display the boards. If an image is missing, it is replaced with unknown.jpg.
|
|
{% endcomment %}
|
|
{% for board in site.blinka %}
|
|
{% if board.downloads_display == false %}
|
|
{% continue %}
|
|
{% endif %}
|
|
{% assign board_path = "/assets/images/boards/small/" | append: board.board_image %}
|
|
{% assign board_image = 'unknown.jpg' %}
|
|
{% for static_file in site.static_files %}
|
|
{% if static_file.path == board_path %}
|
|
{% assign board_image = board.board_image %}
|
|
{% break %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
<div class="download" data-id="{{ board.board_id }}"
|
|
data-name="{{ board.name }}"
|
|
data-downloads="0"
|
|
data-manufacturer="{{ board.manufacturer }}"
|
|
data-mcufamily="{{ info.family }}"
|
|
data-features="{{ board.features | join: ','}}"
|
|
data-date="{{ board.date_added }}">
|
|
<a href="{{ board.url | relative_url }}">
|
|
<div>
|
|
<div class="img-responsive-4by3">
|
|
{% include downloads/board_image.html board_image=board_image %}
|
|
</div>
|
|
<div class="details">
|
|
<h3>{{ board.name }}</h3>
|
|
By {{ board.manufacturer }}
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/assets/javascript/downloads.js"></script>
|