HTML/CSS Popup Chat Window | Speed Code 🚀

Published: 31 August 2020
on channel: nonmunch

41,376

577

Github Repo:
https://github.com/hitchcliff/front-e...

Font Family: Nunito
Font Weights: Light Italic 300, Light 300, Regular 400, Semi Bold 600

Style.css:
{
box-sizing: border-box;
margin: 0;
padding: 0;
}

*, html {
--primaryGradient: linear-gradient(93.12deg, #581B98 0.52%, #9C1DE7 100%);
--secondaryGradient: linear-gradient(268.91deg, #581B98 -2.14%, #9C1DE7 99.69%);
--primaryBoxShadow: 0px 10px 15px rgba(0, 0, 0, 0.1);
--secondaryBoxShadow: 0px -10px 15px rgba(0, 0, 0, 0.1);
--light: 300;
--regular: 400;
--semiBold: 600;
--extraLight: 300;
--italic: 300;
--primary: #581B98;
}

body {
font-family: 'Nunito', sans-serif;
font-weight: 400;
font-size: 100%;
background: #F1F1F1;
}

Note: This is just an example, I've added the final version in Github Repo inside "Example" folder. Don't miss out typing.css(https://codepen.io/fusco/pen/XbpaYv) file as well.

Challenge yourself by adding names under block of each message. As well as widen the margin to top and bottom 😋

Follow me on Twitter: / nonmunch

On this page of the site you can watch the video online HTML/CSS Popup Chat Window | Speed Code 🚀 with a duration of hours minute second in good quality, which was uploaded by the user nonmunch 31 August 2020, share the link with friends and acquaintances, this video has already been watched 41,376 times on youtube and it was liked by 577 viewers. Enjoy your viewing!