Crypto Streams teaser website!

This is a teaser website for Crypto Streams!

Crypto Streams goal is to become one of the leading streaming platforms!

Website: Crypto Streams

Purpose of the project

On this teaser website people will be able to read about the project and what's to come.

There is also a guide on how to invest in our crypto token for those who want to do it already.

There is also a sign up form on the website for those who want to have an account ready for when we go live.

Features

This website is a 2 page website with 4 sections on the main page.

The 4 sections

The first section (header and marketing)

This what the user will se first when the user comes to the website.

The navbar is on the top of the website.

The logo is right under the navbar.

Under the logo there is a image you can click on that will take you to DEXTools to check the live price of our token.

And under the DEXTools image there's some advertisement.

Navigation

The navbar helps the user to navigatet easily through 3 of the 4 sections on the website.

The navbar is fixed so it moves up and down with the user.

You can't press on the navbar to get to the first section of the website.

The second section (Plans)

Pretty self explanatory. On this section there's information on what features to expect and iformation about the token tokenomics.

The third section (Invest)

On this section there's a guide on how to invest in our token with a image of the pancakeswaps logo with a hover effect that you can press on that will take you to the pancakeswap website.

The fourth section (sign up)

On this section there's a simple sign up form that takes you to the second page after you sign up.

The footer (social links)

The footer is located right under the sign up form.

There are a image links to twitter and instagram.

The second page (sign up page)

The page you get to after you sign up. The navbar takes you back to the main page.

future features

Like it sais on the website we will have a lot of features in the future.

Features we have planned for now:

Community live chatt.

Live chatt with streamers.

Clip section to upload short clips from your streams.

Both live and on-demand video content.

Phone app

Mint memorable moments from your streams as NFTs

Tournaments hosted by us for streamers on our platform

Typography and color scheme

Text font from google fonts link: https://fonts.google.com/specimen/Anton#standard-styles

for the color scheme i started with red and black theme on the website but it did not look so good. I changed the color scheme to white, red and black. I still think that it does not look good but it looks a bit better atleast.

Testing

I tested that this website works in: Google chrome, Microsoft edge and google chrome on my phone.

I tested this websites responsiveness using devtools device toolbar.

Everything looks good except for one thing. the website is allmost fully responsive it's just a small thing that i can't figure out no matter what. There is still something that goes beyond the width of smaller devices so you can scroll a little bit left and right.

Deployment

I deployed the website with github-pages.

I had to change the main page file name to index.html so it loads up correctly.
In the Github repository. I navigated to the settings tab.
From the source drop-down menu I selected the master branch.
After I selected the master branch I waited a minute or two and got the deployed working link.

Bugs

Only bug I have is the one with the responsiveness that i explained in the "Testing" section of the readme. I've asced for help in slack, tutor assistance atleast twice just about this, my mentor, youtube and google. No matter what I've done i havent been able to fully fix it. Last time i asked about this from tutor assistance it allmost got fixed they told me to use the extension unicorn to see what's causing this. I managed to sort the most of it thanks to the lovely tutors but I can't find the last things that are causing this responsiveness issue. when I look at it with unicorn I can see that there is something that is going beyond the width of the smaller device sizes but it's not clear what it is. I've managed to sort allmost all of it but from what i can see in unicorn it should be 2-3 elements that goes beyond the smaller width sizes.

I just noticed another bug. the dextools image does not load on github pages but it loads everything when I run a server in gitpod. I've checked and all the files are were they should be. This bug cleared on it's own.