<!-------------------------------------------------
User Minute — Custom Colour version.
(code by jiko)
------------------------------
RULES
→ Read this thoroughly please, and maybe drop a small comment saying that you've read it? :'3
thank youu [ https://toyhou.se/~bulletins/127417.code-rules ]
→ turn OFF WYSIWYG (in display settings)
→ turn ON Code Editor
------------------------------
TIPPY TIPS
→ insert your img links INSIDE or quotation marks!!
→ looking for a good online code editor? try [ https://th.circlejourney.net/# ] !
------------------------------
ACCENTS
→ background ----------- #f9f9f9
→ accent --------------- #6897bb
→ main-text ------------ #666666
→ hr ------------------- #e7e7e7
use control/command + f to quickly change the colours!
------------------------------------------------->
<!--
→ feel free to adjust the code width below [max-width:86%]!
-->
<div class="mx-auto mt-2" style="max-width:86%; font-size:90%; letter-spacing:0.1px; line-height:20px; color:#666666;">
<!-------------------------------------------------
IMAGE BACKGROUND
------------------------------------------------->
<!--
→ remove [background-repeat:no-repeat] and [background-size:cover] if your background is tiled!
-->
<div class="p-4 w-100" style="border-radius:20px; background-color:#6897bb;
/* IMAGE HERE
---------------------------------------- */;
background-image:url(IMG_URL_HERE);
/* IMAGE SETTINGS
---------------------------------------- */;
background-position:center;
background-size:cover;
background-attachment:scroll;
background-repeat:no-repeat;">
<div class="row no-gutters">
<!-------------------------------------------------
PAGEDOLL (deletable)
------------------------------------------------->
<!--
→ best if a pagedoll, but feel free to change [background-size:contain] to [background-size:cover] if it has a background!
→ add [hidden-sm-down] in the CLASS if you want it to hide on mobile view!
-->
<div class="col m-auto p-3 order-lg-1 order-2">
<div class="w-100 tooltipster" style="height:350px;
/* IMAGE HERE
---------------------------------------- */;
background-image:url(https://file.toyhou.se/images/7745356_UbxFaTbtSE8Egg6.png);
/* IMAGE SETTINGS
---------------------------------------- */;
background-size:contain;
background-position:center;
background-repeat: no-repeat"
title="ARTIST @ site">
</div>
</div>
<!-------------------------------------------------
PROFILE
------------------------------------------------->
<div class="col-lg-7 order-lg-2 order-1 mx-auto">
<div class="card border-0 p-4 d-block d-lg-flex" style="min-height:100%; background:#f9f9f9; border-radius:15px">
<!--------------------------------------------
HEADER
--------------------------------------------->
<!--
→ view [fontawesome.com] for more icons!
-->
<h1 class="text-uppercase text-center lead" style="font-size:18px; letter-spacing:2px; color:#6897bb">
<i class="far fa-heart fa-fw fa-sm"></i>
USERNAME
<i class="far fa-heart fa-fw fa-sm"></i>
</h1>
<div class="text-center" style="font-size:85%">
describe • yourself • here
</div><hr class="w-75 my-3" style="border-color:#e7e7e7">
<div style="flex:1 1 0; min-height:150px; overflow:auto;">
<!--------------------------------------------
LINKS
--------------------------------------------->
<!--
→ other link examples can be links to your BYI/DNI/CARRD things, maybe your sona or mains!
→ delete if unnecessary
-->
<p class="text-center">
<a href="LINK_HERE" class="btn m-1 p-2"
style="background:#f9f9f9; border-color:#6897bb; color:#6897bb; border-radius:1em; font-size:100%; letter-spacing:1px;">
TOS
</a>
<a href="LINK_HERE" class="btn m-1 p-2"
style="background:#f9f9f9; border-color:#6897bb; color:#6897bb; border-radius:1em; font-size:100%; letter-spacing:1px;">
comms
</a>
<a href="LINK_HERE" class="btn m-1 p-2"
style="background:#f9f9f9; border-color:#6897bb; color:#6897bb; border-radius:1em; font-size:100%; letter-spacing:1px;">
trades
</a>
<!----- [ add/delete above THIS line ] ----->
</p>
<!--------------------------------------------
ABOUT
--------------------------------------------->
<!--
→ since the scroll box is relatively small, keep it nice and straight to the point >wo)9
-->
<div class="pt-3 about">
<p>Hello! Talk about yourself here, like interests and hobbies. This box scrolls AND scretches!!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia vel urna blandit lobortis. Morbi sed posuere lorem, id viverra ligula. Etiam libero ante, malesuada sit amet venenatis at, ullamcorper vel sem. Proin sed sollicitudin magna.</p>
<p>Fusce arcu quam, rutrum sit amet interdum vitae, viverra vel urna. Maecenas euismod urna sed nisi mattis laoreet. Aliquam tincidunt sollicitudin velit, eu vulputate justo pretium nec. Nunc tincidunt quam non feugiat malesuada. In sed commodo sem.</p>
</div>
</div><hr class="w-75 my-3" style="border-color:#e7e7e7">
<!--------------------------------------------
SOCIAL MEDIA
--------------------------------------------->
<!--
→ view [fontawesome.com] for more social media icons!
→ if the SNS doesn't exist there (e.g. artfight), just chose whatever you like instead ^^
-->
<p class="text-center pt-2">
<a href="LINK_HERE" class="m-2" style="color:#666666">
<i class="fab fa-deviantart fa-fw fa-lg"></i>
</a>
<a href="LINK_HERE" class="m-2" style="color:#666666">
<i class="fab fa-instagram fa-fw fa-lg"></i>
</a>
<a href="LINK_HERE" class="m-2" style="color:#666666">
<i class="fab fa-twitter fa-fw fa-lg"></i>
</a>
<a href="LINK_HERE" class="m-2 tooltipster" title="NAME#0000" style="color:#666666">
<i class="fab fa-discord fa-fw fa-lg"></i>
</a>
<!-- add/delete more above THIS line -->
</p>
</div></div></div></div>
<!-------------------------------------------------
CREDITS
(don't remove ty~!!)
------------------------------------------------->
<div class="p-1 text-white text-right">
<a href="https://toyhou.se/8299935.-f2u-minute" class="text-muted faded tooltipster" title="code by jiko">
<i class="far fa-code"></i>
</a>
</div></div>
