*+☽ ━ badbye / storage - Printable Version

Code:

[align=center][div style="width: 365px; height: auto; font-family: georgia; font-size: 10pt; color: black; letter-spacing: -1px; border-bottom: .5px dashed #BF7147;"][b][color=#BF7147]happycamper aestas[/color] / tags / plot / hub / roleplayed by [member=1886]guppy[/member] [/b][/div]

[div style="width: 365px; height: auto; font-family: verdana; font-size: 7pt; color: black; letter-spacing: -.7px; margin-top: 0px; text-align: justify; line-height: 11px;"] my [color=#BF7147]name[/color] is my [color=#BF7147]life[/color], a [color=#BF7147]hopeful vibe[/color], [color=#BF7147]positive[/color] rather than a negative [color=#BF7147]type[/color]. i live up to my name but [color=#BF7147]ain't no price[/color] ━- [i]say hello to [color=#BF7147][b]my hope world[/b][/color], this is my world, [color=#BF7147][b]my own story[/b][/color][/i][/div][/align]

Code:

[align=center][div style="width: 500px; height: auto; font-family: georgia; font-size: 11pt; color: black; letter-spacing: 3px;"]「 [b]get a load of this monster[/b] 」[/div][div style="width: 500px; height: auto; font-family: verdana; font-size: 7pt; color: black; letter-spacing: 2.7px; margin-top: -5px;"]he doesn't know how to communicate[/div][div style="width: 500px; height: auto; font-family: verdana; font-size: 7pt; color: black; letter-spacing: 4px; margin-top: -5px;"]his mind is in a different place[/div][div style="width: 500px; height: auto; font-family: verdana; font-size: 7pt; color: black; letter-spacing: .2px; margin-top: -5px;"]❝ will everybody please give him a little bit of [url=hub][abbr=hub & extras][color=black]space[/color][/abbr][/url]? ❞[/div][/align]

[table][tr][td]

[/td][td]

KIM NAMJOON

welcome to the monster plaza

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius, diam sit amet sodales cursus, dolor mi tristique lectus, sed interdum mauris mauris sed ipsum. Maecenas bibendum, neque sit amet efficitur pretium, odio metus tristique diam, vehicula viverra nulla libero sit amet diam. Ut efficitur, purus quis elementum malesuada, neque mi commodo diam, in tincidunt lorem nulla sit amet nisi. Nam in magna eu risus posuere congue in in massa. Cras pulvinar luctus vehicula. Etiam nibh felis, pretium vel nisi vitae, pretium porta turpis. Nullam hendrerit augue ut gravida auctor. Suspendisse potenti.

Donec cursus sodales iaculis. Vivamus blandit, turpis sit amet feugiat hendrerit, enim urna feugiat leo, in commodo lectus metus eget ligula. Vestibulum tincidunt feugiat auctor. Integer sed orci eu elit consequat vulputate varius quis elit. Morbi facilisis, neque et facilisis semper, augue leo porttitor erat, id scelerisque lectus felis in neque. Donec vestibulum, diam et lobortis mollis, nisi mauris auctor ipsum, eu scelerisque ex dui bibendum eros. Duis vestibulum eget odio vel posuere. Sed nisl nisl, feugiat at scelerisque eget, ultricies eget erat.

[/td][/tr][/table]

it stretches / image & border are technically overlays, thus image is darker (doesn't work well if border isn't black):

inspired by/based off this jcink code
original image here

Code:
[align=center][table][tr][td][div style="width: 150px; height: 200px; background-color: #000;"][/div]

[div style="width: 150px; height: 200px; background-image:url(https://66.media.tumblr.com/ab81f5e1380adb0640c52c9c86833413/tumblr_p1ipbjoUXI1wxye4do2_400.gif); background-size: 100%; background-position: center; border: 10px solid #000; margin-top: -200px; opacity: 0.50;"][/div][/td][td][div style="width: 250px; height: 35px; background-color:; font-family: georgia; font-size: 24.9pt; color: black; padding-top: 2px; padding-left: 6px; letter-spacing: -3px;"][b]KIM NAMJOON[/b][/div][div style="width: 250px; height: auto; font-family: verdana; font-size: 7pt; color: black; padding-left: 6px; padding-right: 3px; letter-spacing: 3px; text-align: center; margin-top: -15px;"]welcome to the monster plaza[/div][div style="width: 250px; height: overflow; overflow: stretch; background-color: black; margin-top: 5px; font-family: verdana; font-size: 7pt; color: #5E5A5B; text-align: justify; padding: 10px; line-height: 13px;"]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius, diam sit amet sodales cursus, dolor mi tristique lectus, sed interdum mauris mauris sed ipsum. Maecenas bibendum, neque sit amet efficitur pretium, odio metus tristique diam, vehicula viverra nulla libero sit amet diam. Ut efficitur, purus quis elementum malesuada, neque mi commodo diam, in tincidunt lorem nulla sit amet nisi. Nam in magna eu risus posuere congue in in massa. Cras pulvinar luctus vehicula. Etiam nibh felis, pretium vel nisi vitae, pretium porta turpis. Nullam hendrerit augue ut gravida auctor. Suspendisse potenti.

Donec cursus sodales iaculis. Vivamus blandit, turpis sit amet feugiat hendrerit, enim urna feugiat leo, in commodo lectus metus eget ligula. Vestibulum tincidunt feugiat auctor. Integer sed orci eu elit consequat vulputate varius quis elit. Morbi facilisis, neque et facilisis semper, augue leo porttitor erat, id scelerisque lectus felis in neque. Donec vestibulum, diam et lobortis mollis, nisi mauris auctor ipsum, eu scelerisque ex dui bibendum eros. Duis vestibulum eget odio vel posuere. Sed nisl nisl, feugiat at scelerisque eget, ultricies eget erat.[/div][/td][/tr][/table][/align]

wip / click the spoiler for info and code:

also inspired by a jcink template i saw ages ago and hope i can find again. not sure if it's spot on but oh well
i took too damn long coding the battery icon and the blinking message icons yikes, but at least the battery icon can be adjusted to be at any percentage of battery
need to code a space for the actual keyboard
im just v tired

Code:
[align=center][div style="width: 280px; max-height: 530px; background: linear-gradient(#937d62, black); border-radius: 50px; border: 15px solid white; padding-bottom: 25px;"][table][tr][td][div style="width: 45px; height: 25px; background-color:; font-family: arial; font-size: 9pt; color: white; padding-top: 6px; padding-left: 12px;"]5:10[/div][/td][td][div style="width: 140px; height: 25px; background-color: white; border-radius:0em 0em 2em 2em;"][/div][/td][td][div style="width: 45px; height: 25px; background-color:; font-family: arial; font-size: 9pt; color: white; padding-top: 11px; padding-left: 12px;"][table][tr][td][div style="width: 18px; height: 9px; border: 1px solid white;"][div style="width: 3px; height: 7px; background-color: red;"][/div][/div][/td][td][div style="width: 2px; height: 3px; background-color: white; margin-top: 2.5px;"][/div][/td][/tr][/table][/div][/td][/tr][/table]

[div style="width: 100px; height: 100px; background-image:url(https://data.whicdn.com/images/318904682/original.gif); background-size: 100%; background-size: center; border-radius: 100px; border: 5px solid white; margin-top: 40px;"][/div]

[div style="width: 100px; height: auto; font-family: roboto; font-size: 15pt; color: white; text-align: center; margin-top: 20px;"][b]Boy[/b][/div]

[div style="width: 100px; height: auto; font-family: roboto; font-size: 8pt; color: white; text-align: center; margin-top: 5px; letter-spacing: 1px;"]IS TYPING...[/div]

[div style="width: 250px; max-height: 242px; height: overflow; overflow: scroll; background-color:; border-radius:0em 0em 3em 3em; margin-top: 20px; padding-bottom: 20px;"][div style="max-width: 190px; height: overflow; overflow: stretch; background-color: #a9967f; font-family: roboto; font-size: 9pt; color: white; text-align: justify; padding: 10px; border-radius:2em 2em 0em 2em; margin-left: 30px;"]Lorem ipsum dolor sit amet ... :)[/div][div style="max-width: 190px; height: overflow; overflow: stretch; background-color: #a9967f; font-family: roboto; font-size: 9pt; color: white; text-align: justify; padding: 10px; border-radius:2em 2em 0em 2em; margin-left: 30px; margin-top: 10px;"]Consectetur adipiscing elit. Proin varius, diam sit amet sodales cursus, dolor mi tristique lectus, sed interdum mauris mauris sed ipsum.[/div][div style="max-width: 190px; height: overflow; overflow: stretch; background-color: #a9967f; font-family: roboto; font-size: 9pt; color: white; text-align: justify; padding: 10px; border-radius:1em 1em 0em 1em; margin-left: 30px; margin-top: 10px;"]Maecenas bibendum, neque sit amet efficitur pretium, odio metus tristique diam, vehicula viverra nulla libero sit amet diam.[/div][div style="max-width: 50px; height: 30px; background-color: #beb1a0; font-family: roboto; font-size: 9pt; color: white; text-align: justify; border-radius:1em 1em 1em 0em; margin-right: 170px; margin-top: 15px; padding-left: 11px; padding-top: 8px;"][div style="width: 26px; height: 13px; background-image:url(https://i.imgur.com/kbRYP1P.gif); background-size: 100%;"][/div][/div][/div][/div][/align]