Whatsapp {EN} | Misc #006

*--------- READ: IMPORTANT ---------*
i. Don't remove the credit, please.
ii. All colors, fonts, images (backgrounds) can be modified. Don't change the code structure or use as base.
iii. If you have any questions or need any help with the codes, don't hesitate to send us an ask @ https://thecodecoven.tumblr.com
iv. Enjoy! (ﾉ◕ヮ◕)ﾉ～*:･ﾟ✧*:･ﾟ✧

*--------- WHATSAPP MESSAGES ---------*

<div id="whats"><div class="screenwts"><div class="s-top"><div class="st-left"><i class="bi bi-chevron-left"></i><img src="CONTACT PROFILE PICTURE" /><h5>CONTACT NAME</h5></div><div class="st-right"><i class="bi bi-camera-video"></i><i class="bi bi-telephone"></i></div></div>
<div class="s-btm"><i class="bi bi-plus-lg"></i><div class="sb-txt"></div><i class="bi bi-camera"></i><i class="bi bi-mic"></i></div>

<div class="s-mssg"><div class="mssg-cont">

<!-- MESSAGES START HERE -->
<!-- IF YOU WANT TO ADD A DATE TO A SERIES OF MESSAGES, USE THE CODE IN THE NEXT LINE AS MANY TIMES AS YOU WANT -->
<div class="mssg-date">monday</div>

<!-- CODE FOR NORMAL, TEXT ONLY, MESSAGES -->
<div class="mssg">gee brain, what are we gonna do tonight?<time>20:36</time></div>

<!-- CODE FOR NORMAL, TEXT ONLY, ANSWER. YOU CAN PLAY WITH THE "READ" CLASS. IF YOU DELETE IT, IT WILL LOOK LIKE YOUR MESSAGE HASN'T BEEN READ, JUST LIKE THE APP. -->
<div class="aswr read">The same thing we do every night, try to take over the world!<time>20:38</time></div>

<div class="mssg-date">today</div>

<!-- CODE FOR STICKERS, BOTH "SEND" AND "ANSWER". IMAGES RESIZE AUTOMATICALLY. -->
<div class="mssg-stckr">
<img src="https://i.imgur.com/dWgrjES.png"/>
<time>8:36</time>
</div>

<!-- STICKER ANSWER -->
<div class="aswr-stckr read">
<img src="https://i.imgur.com/OiYvTpD.png?1"/>
<time>21:26</time>
</div>

<!-- CODE FOR CHAIN MESSAGES AND ANSWERS. YOU CAN ADD AS MANY MESSAGES AS YOU WANT. REMEMBER TO WRAP EACH TEXT MESSAGE BETWEEN <p> <time>00:00</time></p> -->
<div class="mssg-chain">
<p>this is <time>10:36</time></p>
<p>a chain <time>10:36</time></p>
<p>of messages <time>10:37</time></p>
</div>

<!-- CHAIN MESSAGE ANSWER -->
<div class="aswr-chain read">
<p>here is <time>10:38</time></p>
<p>another chain <time>10:38</time></p>
<p>for an answer <time>10:38</time></p>
</div>

<!-- CODE FOR QUOTE MESSAGES. YOU CAN CHANGE THE COLOR FOR EACH QUOTE IN THE VARIABLES AT THE END OF THIS CODE -->
<div class="mssg-quote">
<div class="msgq"><h5>You</h5>
quoted message here. 3 lines max to stick to the original whatsapp design</div>
<span>an answer here</span>
<time>18:14</time>
</div>

<!-- QUOTE ANSWER -->
<div class="aswr-quote read">
<div class="msgq"><h5>CONTACT NAME</h5>
quote here</div>
<p>your answer here <time>18:17</time></p>
</div>

<!-- CODE FOR IMAGE MESSAGES. THE IMAGES RESIZE AUTOMATICALLY -->
<div class="mssg-img"><div class="mssgimgb">
<img src="IMAGE HERE"/>
<time>20:03</time>
</div></div>

<!-- IMAGE ANSWER -->
<div class="aswr-img read"><div class="aswrimgb">
<img src="IMAGE HERE"/>
<time>20:46</time>
</div></div>

<!-- CODE FOR ONE EMOJI ONLY MESSAGES -->
<div class="mssg-emoji">EMOJI HERE<time>20:53</time></div>

<div class="aswr-emoji read">EMOJI HERE<time>21:26</time></div>

</div></div></div></div>

<style>#whats {--fondo: url(WHATSAPP BACKGROUND); --colorA: QUOTE COLOR (YOUR MESSAGES); --colorB: QUOTE COLOR (YOUR CONTACT'S MESSAGES);}</style>
<link href="https://iconsax.gitlab.io/i/icons.css" rel="stylesheet">
<link href="https://files.jcink.net/uploads2/thecodecoven/WhatsMssg.css" rel="stylesheet">