Python Beem Project: Fugly Friends List Frontend Redesign Part 3

in python •  4 years ago 

I made this beem friends list before
https://socialist-whistler-74621.herokuapp.com/

But I just didn't like the frontend design so I scratched everything and started redesigning using Bootstrap. I have used it before but don't have much experiences with so it is kind of fun to play with this frontend tool.
I wanted my site to look simple, clean, consistent, and responsive so that it looks good on desktop and mobile.
This is just what I came up with.
https://floating-meadow-28045.herokuapp.com/

1.png

2.png

It is very minimal but I kind of like this consistent look and feel. It looks good on different sizes.

Responsive part I just started with this template.

Then added favicon.

3.png

In the BODY section, I do everything inside div class="container".

This nav bar is just this

4.png

This thing is called jumbotron which just a big content display section for special attention or something.

5.png

And this part is going to be a list of links so used "list-group" and I can add bunch more stuff later.

6.png

Very easy pretty much all copy and paste, but it looks like a decent design using Bootstrap.

7.png

Next step is just adding the backend stuff to this design again 😂


Get Rewarded For Browsing! Are you Brave?


➡️ Website
➡️ Twitter

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

@upvu voted. voting percent : 3.33 %, delegate sp : 5003, token amount : 0, total sp of upvu : 2268259