Skip to content

Commit 7259dd9

Browse files
jwcooperjwcooper
committed
add section elements to home page
1 parent 19cdc03 commit 7259dd9

File tree

1 file changed

+124
-114
lines changed

1 file changed

+124
-114
lines changed

‎index.html

Lines changed: 124 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -4,124 +4,134 @@
44

55
<div id="home-page" class="common-layout">
66
<div class="content">
7-
<img class="responsive" src="{{ "/assets/images/blinka-computer.png" | relative_url }}" srcset="{{ "/assets/images/blinka-computer.png" | relative_url }} 1x,
8-
{{ "/assets/images/[email protected]" | relative_url }} 2x,
9-
{{ "/assets/images/[email protected]" | relative_url }} 3x" alt="Blinka at a computer">
10-
<h1>The easiest way to program microcontrollers</h1>
11-
<p>
12-
CircuitPython is a programming language designed to simplify experimenting
13-
and learning to code on low-cost microcontroller boards. It makes getting
14-
started easier than ever with no upfront desktop downloads needed. Once you
15-
get your board set up, open any text editor, and get started editing code.
16-
It's that simple.
17-
</p>
18-
<p>
19-
<a href="https://learn.adafruit.com/welcome-to-circuitpython">Get started with CircuitPython &gt;</a>
20-
</p>
7+
<section>
8+
<img class="responsive" src="{{ "/assets/images/blinka-computer.png" | relative_url }}" srcset="{{ "/assets/images/blinka-computer.png" | relative_url }} 1x,
9+
{{ "/assets/images/[email protected]" | relative_url }} 2x,
10+
{{ "/assets/images/[email protected]" | relative_url }} 3x" alt="Blinka at a computer">
11+
<h1>The easiest way to program microcontrollers</h1>
12+
<p>
13+
CircuitPython is a programming language designed to simplify experimenting
14+
and learning to code on low-cost microcontroller boards. It makes getting
15+
started easier than ever with no upfront desktop downloads needed. Once you
16+
get your board set up, open any text editor, and get started editing code.
17+
It's that simple.
18+
</p>
19+
<p>
20+
<a href="https://learn.adafruit.com/welcome-to-circuitpython">Get started with CircuitPython &gt;</a>
21+
</p>
22+
</section>
2123
<hr />
22-
<img class="responsive" src="{{ "/assets/images/python.png" | relative_url }}"
23-
srcset="{{ "/assets/images/python.png" | relative_url }} 1x,
24-
{{ "/assets/images/[email protected]" | relative_url }} 2x,
25-
{{ "/assets/images/[email protected]" | relative_url }} 3x" alt="Python Logo">
26-
<h1>Learn Python with CircuitPython</h1>
27-
<p>
28-
<a href="https://www.python.org/">Python</a> is the fastest growing programming language.
29-
It's taught in schools and universities. It's a high-level programming language which
30-
means it's designed to be easier to read, write and maintain. It supports modules and
31-
packages which means it's easy to reuse your code for other projects. It has
32-
a built in interpreter which means there are no extra steps, like compiling,
33-
to get your code to work. And of course, <a href="https://www.python.org/">Python</a>
34-
is Open Source Software which means it's free for anyone to use, modify or improve upon.
35-
</p>
36-
<p>
37-
CircuitPython adds hardware support to the core Python language. If you
38-
already have Python knowledge, you can easily apply that to using
39-
CircuitPython. If you have no previous experience, it's really simple to
40-
get started! Learning CircuitPython is learning Python.
41-
</p>
24+
<section>
25+
<img class="responsive" src="{{ "/assets/images/python.png" | relative_url }}"
26+
srcset="{{ "/assets/images/python.png" | relative_url }} 1x,
27+
{{ "/assets/images/[email protected]" | relative_url }} 2x,
28+
{{ "/assets/images/[email protected]" | relative_url }} 3x" alt="Python Logo">
29+
<h1>Learn Python with CircuitPython</h1>
30+
<p>
31+
<a href="https://www.python.org/">Python</a> is the fastest growing programming language.
32+
It's taught in schools and universities. It's a high-level programming language which
33+
means it's designed to be easier to read, write and maintain. It supports modules and
34+
packages which means it's easy to reuse your code for other projects. It has
35+
a built in interpreter which means there are no extra steps, like compiling,
36+
to get your code to work. And of course, <a href="https://www.python.org/">Python</a>
37+
is Open Source Software which means it's free for anyone to use, modify or improve upon.
38+
</p>
39+
<p>
40+
CircuitPython adds hardware support to the core Python language. If you
41+
already have Python knowledge, you can easily apply that to using
42+
CircuitPython. If you have no previous experience, it's really simple to
43+
get started! Learning CircuitPython is learning Python.
44+
</p>
45+
</section>
4246
<hr />
43-
<img class="responsive" src="{{ "/assets/images/microcontrollers.png" | relative_url }}"
44-
srcset="{{ "/assets/images/microcontrollers.png" | relative_url }} 1x,
45-
{{ "/assets/images/[email protected]" | relative_url }} 2x,
46-
{{ "/assets/images/[email protected]" | relative_url }} 3x" alt="Image of various microcontrollers">
47-
<h1>Supported by your favorite microcontroller</h1>
48-
<p>
49-
CircuitPython is designed to run on microcontroller boards. A
50-
microcontroller board is a circuit board with a microcontroller chip that's
51-
essentially an itty-bitty all-in-one computer. CircuitPython is easy to
52-
use because all you need is that little board, a USB cable, and a computer
53-
with a USB connection.
54-
</p>
55-
<p>
56-
<a href="/downloads">Search for a compatible board</a>
57-
</p>
47+
<section>
48+
<img class="responsive" src="{{ "/assets/images/microcontrollers.png" | relative_url }}"
49+
srcset="{{ "/assets/images/microcontrollers.png" | relative_url }} 1x,
50+
{{ "/assets/images/[email protected]" | relative_url }} 2x,
51+
{{ "/assets/images/[email protected]" | relative_url }} 3x" alt="Image of various microcontrollers">
52+
<h1>Supported by your favorite microcontroller</h1>
53+
<p>
54+
CircuitPython is designed to run on microcontroller boards. A
55+
microcontroller board is a circuit board with a microcontroller chip that's
56+
essentially an itty-bitty all-in-one computer. CircuitPython is easy to
57+
use because all you need is that little board, a USB cable, and a computer
58+
with a USB connection.
59+
</p>
60+
<p>
61+
<a href="/downloads">Search for a compatible board</a>
62+
</p>
63+
</section>
5864
<hr />
59-
<h1>More reasons to use CircuitPython</h1>
60-
<div class="home-table">
61-
<div class="item">
62-
<h3>Quick and Easy</h3>
63-
<p>
64-
Create a file, edit your code, save the file, and it runs immediately.
65-
There is no compiling, no downloading and no uploading needed.
66-
</p>
65+
<section>
66+
<h1>More reasons to use CircuitPython</h1>
67+
<div class="home-table">
68+
<div class="item">
69+
<h3>Quick and Easy</h3>
70+
<p>
71+
Create a file, edit your code, save the file, and it runs immediately.
72+
There is no compiling, no downloading and no uploading needed.
73+
</p>
74+
</div>
75+
<div class="item">
76+
<h3>Beginner Friendly</h3>
77+
<p>
78+
CircuitPython is designed with education in mind. It's easy to start
79+
learning how to code and you get immediate feedback from the board.
80+
</p>
81+
</div>
82+
<div class="item">
83+
<h3>Easy Code Updates</h3>
84+
<p>
85+
Since your code lives on the disk drive, you can edit it whenever you
86+
like, you can also keep multiple files around for easy experimentation.
87+
</p>
88+
</div>
89+
<div class="item">
90+
<h3>Serial Console + REPL</h3>
91+
<p>
92+
These allow for live feedback from your code and interactive programming.
93+
</p>
94+
</div>
95+
<div class="item">
96+
<h3>File Storage</h3>
97+
<p>
98+
The internal storage for CircuitPython makes it great for data-logging,
99+
playing audio clips, and otherwise interacting with files.
100+
</p>
101+
</div>
102+
<div class="item">
103+
<h3>Strong Hardware Support</h3>
104+
<p>
105+
There are many libraries and drivers for sensors, breakout boards
106+
and other external components.
107+
</p>
108+
</div>
67109
</div>
68-
<div class="item">
69-
<h3>Beginner Friendly</h3>
70-
<p>
71-
CircuitPython is designed with education in mind. It's easy to start
72-
learning how to code and you get immediate feedback from the board.
73-
</p>
74-
</div>
75-
<div class="item">
76-
<h3>Easy Code Updates</h3>
77-
<p>
78-
Since your code lives on the disk drive, you can edit it whenever you
79-
like, you can also keep multiple files around for easy experimentation.
80-
</p>
81-
</div>
82-
<div class="item">
83-
<h3>Serial Console + REPL</h3>
84-
<p>
85-
These allow for live feedback from your code and interactive programming.
86-
</p>
87-
</div>
88-
<div class="item">
89-
<h3>File Storage</h3>
90-
<p>
91-
The internal storage for CircuitPython makes it great for data-logging,
92-
playing audio clips, and otherwise interacting with files.
93-
</p>
94-
</div>
95-
<div class="item">
96-
<h3>Strong Hardware Support</h3>
97-
<p>
98-
There are many libraries and drivers for sensors, breakout boards
99-
and other external components.
100-
</p>
101-
</div>
102-
</div>
103-
<hr />
104-
<h1>Just the beginning...</h1>
105-
<p>
106-
CircuitPython continues to evolve, and is constantly being updated. We
107-
welcome and encourage feedback from the community, and we incorporate this
108-
into how we are developing CircuitPython. That's the core of the open source
109-
concept. This makes CircuitPython better for you and everyone who uses it!
110-
</p>
111-
<p>
112-
<a href="https://learn.adafruit.com/welcome-to-circuitpython">Get started with CircuitPython &gt;</a>
113-
</p>
110+
</section>
114111
<hr />
115-
<h1>Thanks</h1>
116-
<p>
117-
CircuitPython wouldn't exist without the awesome work of <a href="https://micropython.org">Damien George and the MicroPython community</a>. They did the hard work to reimplement Python on microcontrollers and continue to push the boundaries of what is possible.
118-
</p>
119-
<p>
120-
Thank you to <a href="https://adafruit.com">Adafruit</a> for continuing to support
121-
CircuitPython's beginner-focused development.
122-
</p>
123-
<p>
124-
Lastly, thank you to the CircuitPython community members who have spent time testing, triaging, fixing and enhancing CircuitPython, its libraries and its documentation. Together we're all making something incredible.
125-
</p>
112+
<section>
113+
<h1>Just the beginning...</h1>
114+
<p>
115+
CircuitPython continues to evolve, and is constantly being updated. We
116+
welcome and encourage feedback from the community, and we incorporate this
117+
into how we are developing CircuitPython. That's the core of the open source
118+
concept. This makes CircuitPython better for you and everyone who uses it!
119+
</p>
120+
<p>
121+
<a href="https://learn.adafruit.com/welcome-to-circuitpython">Get started with CircuitPython &gt;</a>
122+
</p>
123+
<hr />
124+
<h1>Thanks</h1>
125+
<p>
126+
CircuitPython wouldn't exist without the awesome work of <a href="https://micropython.org">Damien George and the MicroPython community</a>. They did the hard work to reimplement Python on microcontrollers and continue to push the boundaries of what is possible.
127+
</p>
128+
<p>
129+
Thank you to <a href="https://adafruit.com">Adafruit</a> for continuing to support
130+
CircuitPython's beginner-focused development.
131+
</p>
132+
<p>
133+
Lastly, thank you to the CircuitPython community members who have spent time testing, triaging, fixing and enhancing CircuitPython, its libraries and its documentation. Together we're all making something incredible.
134+
</p>
135+
</section>
126136
</div>
127137
</div>

0 commit comments

Comments
 (0)