Python for Entrepreneurs Transcripts
Chapter: Web design: CSS Frontend frameworks and Bootstrap
Lecture: Incorporating a theme: wrap up
Login or
purchase this course
to watch this video and the rest of the course contents.
0:01
I think we've done it, I think we've built the page, we've adapted the landing page into our site the way we want it,
0:07
if we look through, you can see we've got our great little banner we've got this "get notified", we've got upcoming events, we've got band members,
0:15
and "book us", and we've got even our cool little footer. There is two final things I'd like to talk about here,
0:21
one is I want to get this become dark like the rest of the site, so let's see how we can do that. It may be easy.
0:29
If we go over to our site, here you can see the color is black, let's set the color to be white, in fact, white is not the best color,
0:36
you maybe want just a shade off of white little less, and let's set this; black also is not the best option,
0:43
so I really like when I am doing the dark theme, 222 it's not that different
0:48
from the PyCharm editor actually, if you want of course you can come over here
0:52
and pull this up in an editor and say look I want a really bright version of this,
0:56
and I want this green and it will pop it in there but I am just going to go with that,
1:00
now, let's just see what effect this has, it's not going to be perfect but it will definitely darken some things.
1:08
Here you can see it's darken the few of them but we have these alternate ones, why is that this color, let's find out.
1:14
It turns out, when you're on one of these section "a", the section "a" has a color- and that's our alternating color,
1:25
so here we'll go like this and instead of having that dark, let's set it to like 333. Now how does that look?
1:37
The color, I like the colors pretty well, maybe it's a shade light, not entirely sure,
1:41
but I don't really like the bars, these are supposed to be borders in the previous examples, let's look and see where are they coming from.
1:57
OK, on section "b", you can see there is these borders, let's go ahead and take these over here and have a thought about them.
2:04
Alright, what do we want to do? See how I copied it straight out of Firefox, that's beautiful,
2:10
so the padding is OK, maybe we want to tighten that up a little bit, this one not so much, let's set that to "none", and similarly down here,
2:21
OK, that's pretty good, it may make sense to have a border, right, if we really wanted a border, we could do something like this to 1px solid #111
2:33
and then there will be this little border here, but I don't think it's necessary given the contrast that we already have
2:39
between the two levels, right, this is a pretty good contrast going on here. Alright, so there you can see we've got this whole page more or less
2:48
looking like what we wanted it, and I know this section, this demo section here at the end of this chapter is kind of long,
2:56
but we went from like zero to a really pretty good-looking website, I could get behind having this be my website if I was this band
3:05
or if this was somehow representing my business, I think we could actually do better,
3:10
but it's certainly not bad, and we did that by grabbing the theme. Really great, I am pretty happy with where we've come from,
3:20
hopefully you feel inspired to be able to go grab one of these themes, apply it to whatever it is you are building and make it awesome.
3:27
We have one more thing to come back and look at before we are done with this chapter.