minicode

<!--

  code by @cheet !!! please do not remove my credit :)
  do not redistribute or claim as your own

-->

<!-- NAMEPLATE START -->

<div class="mx-auto" style="max-width:600px; margin-top:50px;">

<div class="card border-0 bg-primary text-uppercase" style="

  background: url(https://i.imgur.com/GtAokTt.jpg) center fixed;

  padding: 10px; color: white; margin-bottom: 10px;">
  <h1 class="text-right justify-content-between my-auto">
    Name
    <i class="fas fa-bug"></i> <!-- SET ICON HERE -->
  </h1>
</div>

<!-- NAMEPLATE END -->

<div class="row no-gutters">

<!-- FOCAL IMAGE START -->

<div class="col-md-4 rounded" style="overflow: hidden;">
  <div style="

  background: url(https://cdn.discordapp.com/attachments/622903044111335435/686421810832605192/yeh-xintong-2U18DUzuL-E-unsplash.jpg);

  background-size: cover; background-position: center; height: 200px;"></div>
</div>

<!-- FOCAL IMAGE END -->

<!-- INFOBOX START -->

<div class="col-md-8 pl-md-3 mb-3 border-0 card bg-faded justify-content-between" style="padding: 20px; height: 200px; margin-bottom: 0px;">

  <div class="justify-content-between"><span class="text-uppercase faded" style="text-weight: bold;">
    Name
    </span>
    <span>Content</span>
  </div>

  <div class="justify-content-between"><span class="text-uppercase faded" style="text-weight: bold;">
    Age
    </span>
    <span>Content</span>
  </div>

  <div class="justify-content-between"><span class="text-uppercase faded" style="text-weight: bold;">
    Gender
    </span>
    <span>Content</span>
  </div>

  <div class="justify-content-between"><span class="text-uppercase faded" style="text-weight: bold;">
    Orientation
    </span>
    <span>Content</span>
  </div>

  <div class="justify-content-between"><span class="text-uppercase faded" style="text-weight: bold;">
    Alignment
    </span>
    <span>Content</span>
  </div>

  <div class="justify-content-between"><span class="text-uppercase faded" style="text-weight: bold;">
    Theme
    </span>
    <span><a href="https://youtu.be/5IXQ6f6eMxQ">Content <i class="fas fa-play"></i></a></span>
  </div>

</div>

<!-- INFOBOX END -->


</div>
<div class="row no-gutters">


<!-- BIO START -->

<div class="card col-md-12 border-0 bg-faded" style="padding: 20px; text-align: justify;">

  <p>write a short bio for your character here. this could be brief notes, a lengthy description, whatever - it will grow or shrink with the info you put into it. i am writing normal text in here now because frankly i think lorem ipsum text is a little bit fuck ugly LMFAO</p>
  <p>paragraph 2 baby!!!!!!!! once i found a caterpillar on my college campus and i was like fifteen minutes late to one of my classes because i kept fuckin playing with it. this happened on multiple occassions actually</p>

</div>

<!-- BIO END -->


</div>


<!-- MOODBOARD START -->

<div class="rounded" style="overflow: hidden;">
  <div class="row no-gutters">

    <div class="col-md-3 col-6">
      <div style="background: url(https://cdn.discordapp.com/attachments/622903044111335435/686421795485777950/sean-paul-kinnear-dVWMGsBwS30-unsplash.jpg); background-size: cover; background-position: center; height: 150px;"></div>
    </div>

    <div class="col-md-3 col-6">
      <div style="background: url(https://cdn.discordapp.com/attachments/622903044111335435/686421788489416729/luke-southern-N5GCFcsVbys-unsplash.jpg); background-size: cover; background-position: center; height: 150px;"></div>
    </div>

    <div class="col-md-3 col-6">
      <div style="background: url(https://cdn.discordapp.com/attachments/622903044111335435/686421810832605192/yeh-xintong-2U18DUzuL-E-unsplash.jpg); background-size: cover; background-position: center; height: 150px;"></div>
    </div>

    <div class="col-md-3 col-6">
      <div style="background: url(https://cdn.discordapp.com/attachments/622903044111335435/686421813114306625/andrew-neel-dC5YbKG2Qks-unsplash.jpg); background-size: cover; background-position: center; height: 150px;"></div>
    </div>

  </div>
</div>

<!-- MOODBOARD END -->



<!-- CREDIT START DO NOT REMOVE-->

<a class="float-right text-muted" href="https://toyhou.se/cheet"><i class="fas fa-frog"></i></a>

<!-- CREDIT END DO NOT REMOVE-->

</div>