#100DaysOfWeb in Python Transcripts
Chapter: Days 13-16: CSS Layout and Design
Lecture: Demo app introduction
0:00 Let's talk about the demo application
0:02 that we're going to use throughout this chapter
0:03 that lets us explore the CSS selectors
0:07 and properties and so on.
0:09 So I call this Selectorville
0:10 and now this is, of course, in the GitHub repo
0:13 under Days 13 to 16, CSS Basics and Demos.
0:17 You can check it out.
0:18 It doesn't actually require anything special to run.
0:20 It's just a bunch of static HTML files and whatnot
0:24 but let's go ahead and have a look.
0:26 Now there's this index.html page
0:28 and the only thing this does is really provide navigation
0:31 to the other parts that are relevant.
0:33 So let's go ahead and open this up.
0:36 So here you can see this is our design foundations
0:39 CSS idea app.
0:41 We have things like CSS selectors, the box model
0:44 layout, that's like display modes, and floating items.
0:47 Now notice, when I went over here and ran this in WebStorm
0:50 it popped this up.
0:51 Let's just call this something a little cleaner like
0:54 run site, or something like that.
0:56 So now I can see we can click run site, great!
0:59 So here's our app.
1:00 Like I said, you don't have to run it in WebStorm.
1:02 You just double click the index.html
1:04 and it'll open up and go
1:05 and we're going to go through
1:07 all of these different elements
1:09 and build up this app as we go.
1:10 Some of it's going to be pre-built, like the CSS selectors
1:13 we just get to play with.
1:14 Others, like the layout and floating items
1:17 we're going to built that up more from scratch.