Profile
V1 CODE
<div class="container px-0 px-md-3">
<h1 class="bg-faded p-3 text-center" style="border-radius: 15px"><i class="fad fa-exclamation-circle text-primary"></i> This is placeholder code until this character gets fully coded!
</h1>
<!-- LEFT INFO BOX -->
<div class="row">
<div class="col-md-6 pr-md-1 mb-2">
<div class="bg-faded p-3" style="border-radius: 15px;">
<h2 style="letter-spacing: 5px" class="">BASIC INFORMATION <i class="fad fa-user-circle fa-fw pull-right text-primary"></i></h2>
<hr class="my-2 bg-primary">
<div class="row">
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Full Name</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Nicknames/Aliases</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Gender</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Age (and/or birthday)</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Species</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Height</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Sexuality</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Occupation</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Significant Other</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
</div>
</div>
</div>
<!--RIGHT INFO BOX -->
<div class="col-md-6 pl-md-1 mb-2">
<div class="bg-faded p-3 h-100" style="border-radius: 15px;">
<h2 style="letter-spacing: 5px">DESCRIPTION <i class="fad fa-tasks fa-fw pull-right text-primary"></i></h2>
<hr class="my-2 bg-primary">
<div class="p-1" style="overflow: auto; height: 311px">
<p>Use a ul list if you want the information here in bullet point format! This text box will scroll past a certain point.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Aliquet lectus proin nibh nisl condimentum id venenatis a. Interdum velit euismod in pellentesque massa placerat. Quisque id diam vel quam elementum pulvinar etiam non quam. </p>
</div>
</div>
</div>
</div>
<p class="pull-right" style="border-radius: 10px; font-size: 10px; margin-right: 10px; margin-top: -3px;"><a href="https://toyhou.se/somnibear"><i class="fad fa-code text-primary"></i><span class="text-muted"> somnibear</span></a></p>
</div>
V2 (MORE DETAILS) CODE
<div class="container px-0 px-md-3">
<h1 class="bg-faded p-3 text-center" style="border-radius: 15px"><i class="fad fa-exclamation-circle text-primary"></i> This is placeholder code until this character gets fully coded!
</h1>
<!-- LEFT INFO BOX -->
<div class="row">
<div class="col-md-6 pr-md-1 mb-2">
<div class="bg-faded p-3" style="border-radius: 15px;">
<h2 style="letter-spacing: 5px" class="">BASIC INFORMATION <i class="fad fa-user-circle fa-fw pull-right text-primary"></i></h2>
<hr class="my-2 bg-primary">
<div class="row">
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Full Name</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Nicknames/Aliases</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Gender</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Age (and/or birthday)</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Species</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Height</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Sexuality</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Occupation</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Significant Other</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
</div>
</div>
</div>
<!--RIGHT INFO BOX -->
<div class="col-md-6 pl-md-1 mb-2">
<div class="bg-faded p-3 h-100" style="border-radius: 15px;">
<h2 style="letter-spacing: 5px" class="">DESCRIPTION <i class="fad fa-tasks fa-fw pull-right text-primary"></i></h2>
<hr class="my-2 bg-primary">
<div class="p-1" style="overflow: auto; height: 311px; overflow-x: hidden">
<p>Use a ul list if you want the information here in bullet point format! This text box will scroll past a certain point.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Aliquet lectus proin nibh nisl condimentum id venenatis a. Interdum velit euismod in pellentesque massa placerat. Quisque id diam vel quam elementum pulvinar etiam non quam.</p>
<!-- likes n dislikes -->
<div class="row mt-3">
<div class="col-md-6">
<h6 class="mb-1">LIKES</h6>
<ul>
<li>Content</li>
<li>Content</li>
<li>Content</li>
<li>Content</li>
</ul>
</div>
<div class="col-md-6">
<h6 class="mb-1">DISLIKES</h6>
<ul>
<li>Content</li>
<li>Content</li>
<li>Content</li>
<li>Content</li>
</ul>
</div>
</div>
<!-- likes n dislikes (end)-->
<!-- relationships -->
<h6 class="mb-1">RELATIONSHIPS</h6>
<ul class="mb-0">
<li><a href="#">NAME</a></li>
<li><a href="#">NAME</a></li>
<li><a href="#">NAME</a></li>
<li><a href="#">NAME</a></li>
</ul>
<!-- relationships (end) -->
</div>
</div>
</div>
</div>
<p class="pull-right" style="border-radius: 10px; font-size: 10px; margin-right: 10px; margin-top: -3px;"><a href="https://toyhou.se/somnibear"><i class="fad fa-code text-primary"></i><span class="text-muted"> somnibear</span></a></p>
</div>
V3 (VOICE CLAIM) CODE
<div class="container px-0 px-md-3">
<h1 class="bg-faded p-3 text-center" style="border-radius: 15px"><i class="fad fa-exclamation-circle text-primary"></i> This is placeholder code until this character gets fully coded!
</h1>
<!-- LEFT INFO BOX -->
<div class="row">
<div class="col-md-6 pr-md-1 mb-2">
<div class="bg-faded p-3" style="border-radius: 15px;">
<h2 style="letter-spacing: 5px" class="">BASIC INFORMATION <i class="fad fa-user-circle fa-fw pull-right text-primary"></i></h2>
<hr class="my-2 bg-primary">
<div class="row">
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Full Name</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Nicknames/Aliases</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Gender</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Age (and/or birthday)</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Species</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Height</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Sexuality</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Occupation</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Significant Other</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Voice Claim</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
</div>
</div>
</div>
<!--RIGHT INFO BOX -->
<div class="col-md-6 pl-md-1 mb-2">
<div class="bg-faded p-3 h-100" style="border-radius: 15px;">
<h2 style="letter-spacing: 5px" class="">DESCRIPTION <i class="fad fa-tasks fa-fw pull-right text-primary"></i></h2>
<hr class="my-2 bg-primary">
<div class="p-1" style="overflow: auto; height: 346px">
<div></div>
<p>Use a ul list if you want the information here in bullet point format! This text box will scroll past a certain point.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Aliquet lectus proin nibh nisl condimentum id venenatis a. Interdum velit euismod in pellentesque massa placerat. Quisque id diam vel quam elementum pulvinar etiam non quam.</p>
<!-- likes n dislikes -->
<div class="row mt-3 mx-auto">
<div class="col-md-6">
<h6 class="mb-1">LIKES</h6>
<ul>
<li>Content</li>
<li>Content</li>
<li>Content</li>
<li>Content</li>
</ul>
</div>
<div class="col-md-6">
<h6 class="mb-1">DISLIKES</h6>
<ul>
<li>Content</li>
<li>Content</li>
<li>Content</li>
<li>Content</li>
</ul>
</div>
<!-- likes n dislikes (end)-->
<!-- relationships -->
<div class="col-12">
<h6 class="mb-1">RELATIONSHIPS</h6>
<ul class="mb-0">
<li><a href="#">NAME</a></li>
<li><a href="#">NAME</a></li>
<li><a href="#">NAME</a></li>
<li><a href="#">NAME</a></li>
</ul></div>
<!-- relationships (end) -->
</div>
</div>
</div>
</div>
</div>
<p class="pull-right" style="border-radius: 10px; font-size: 10px; margin-right: 10px; margin-top: -3px;"><a href="https://toyhou.se/somnibear"><i class="fad fa-code text-primary"></i><span class="text-muted"> somnibear</span></a></p>
</div>
V4 (VOICE CLAIM + AUDIO) CODE
<div class="container px-0 px-md-3">
<h1 class="bg-faded p-3 text-center" style="border-radius: 15px"><i class="fad fa-exclamation-circle text-primary"></i> This is placeholder code until this character gets fully coded!
</h1>
<!-- LEFT INFO BOX -->
<div class="row">
<div class="col-md-6 pr-md-1 mb-2">
<div class="bg-faded p-3" style="border-radius: 15px;">
<h2 style="letter-spacing: 5px" class="">BASIC INFORMATION <i class="fad fa-user-circle fa-fw pull-right text-primary"></i></h2>
<hr class="my-2 bg-primary">
<div class="row">
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Full Name</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Nicknames/Aliases</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Gender</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Age (and/or birthday)</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Species</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Height</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Sexuality</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Occupation</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Significant Other</span>
<span class="pull-right">Content</span>
<hr class="mt-1 mb-0">
</div>
<div class="col-12 my-1">
<span class="text-uppercase text-muted">Voice Claim</span>
<span class="pull-right">Content</span>
<!-- AUDIO SOURCE - USE A MP3 LINK - you can use audios hosted on discord or other linkable sitesfor this-->
<audio class="w-100 d-block mt-1 mb-2" controls="" style="padding:3px;height:25px;border-radius:50px;"><source src="https://cdn.discordapp.com/attachments/885680566668759081/886926210930720778/freddysample.mp3"></audio>
<hr class="mt-1 mb-0">
</div>
</div>
</div>
</div>
<!--RIGHT INFO BOX -->
<div class="col-md-6 pl-md-1 mb-2">
<div class="bg-faded p-3 h-100" style="border-radius: 15px;">
<h2 style="letter-spacing: 5px" class="">DESCRIPTION <i class="fad fa-tasks fa-fw pull-right text-primary"></i></h2>
<hr class="my-2 bg-primary">
<div class="p-1" style="overflow: auto; height: 379px">
<div></div>
<p>Use a ul list if you want the information here in bullet point format! This text box will scroll past a certain point.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Aliquet lectus proin nibh nisl condimentum id venenatis a. Interdum velit euismod in pellentesque massa placerat. Quisque id diam vel quam elementum pulvinar etiam non quam.</p>
<!-- likes n dislikes -->
<div class="row mt-3 mx-auto">
<div class="col-md-6">
<h6 class="mb-1">LIKES</h6>
<ul>
<li>Content</li>
<li>Content</li>
<li>Content</li>
<li>Content</li>
</ul>
</div>
<div class="col-md-6">
<h6 class="mb-1">DISLIKES</h6>
<ul>
<li>Content</li>
<li>Content</li>
<li>Content</li>
<li>Content</li>
</ul>
</div>
<!-- likes n dislikes (end)-->
<!-- relationships -->
<div class="col-12">
<h6 class="mb-1">RELATIONSHIPS</h6>
<ul class="mb-0">
<li><a href="#">NAME</a></li>
<li><a href="#">NAME</a></li>
<li><a href="#">NAME</a></li>
<li><a href="#">NAME</a></li>
</ul></div>
<!-- relationships (end) -->
</div>
</div>
</div>
</div>
</div>
<p class="pull-right" style="border-radius: 10px; font-size: 10px; margin-right: 10px; margin-top: -3px;"><a href="https://toyhou.se/somnibear"><i class="fad fa-code text-primary"></i><span class="text-muted"> somnibear</span></a></p>
</div>