Serendipity's Comments


Heh, jing you posted the same bday image twice <3 sorry if this bothers you!

gahh nuu im stupid ToT srry, no prob xD

are you sure? QwQ i dont see it

oh no i mean you sent me the same image twice

<!---
 f2u stitched in
 by alyeong
 
 free to use, modify, etc
 credit not required
 no redistribution
 
 *default bg from subtle patterns
 https://www.toptal.com/designers/subtlepatterns/
 
 BG: #fcf4e8
 INNER BG: #fcf9f2
 BORDER (STITCHES & OUTLINE): #a67668
 BORDER (TEXT AREAS): #c49689
 TEXT: #6e5047
--->
 
<!--- change background url
 here for a diff bg! it
 is set to be repeating. --->
<div class="container rounded py-4" style="background: transparent url('https://cdn.discordapp.com/attachments/745787349761523824/856693820749119538/sakura.png') repeat top center; color: #6e5047; max-width: 850px; border: 1px dashed #a67668; box-shadow: 0 0 0 5px #fcf4e8, 0 0 0 7px #a67668;">
 <!--- HEADER START --->
 <div class="row no-gutters">
 <div class="col-12 p-3 d-flex justify-content-between align-items-center" style="border-radius: 50px 0 0 50px; background-color: #fcf4e8; border: 3px dashed #a67668; box-shadow: 0 0 0 5px #fcf4e8, 0 0 0 7px #a67668; font-family: 'Brush Script MT'; font-size: 2rem;">
 
 <span class="mx-2 px-4 pb-2 pt-3" style="background-color: #fcf9f2; border-radius: 50%; border: 2px solid #c49689; font-size: 1.75rem;">
 <!--- FONTAWESOME ICON;
 if you want a perfect
 circle you may have to
 adjust the px and pt/pb
 numbers above! --->
 <i class="fad fa-cut"></i>
 </span>
 
 <span>
 Name Here
 </span>
 
 </div>
 </div>
 <!--- HEADER END --->
 
 <!--- IMAGE & DETAILS START --->
 <div class="row no-gutters my-4">
 <div class="col-sm-4 p-sm-1 px-0 flex-column">
 <div class="card p-3 mb-4 mb-sm-0 h-100" style="border-radius: 0 25px 25px 0; background-color: #fcf4e8; border: 3px dashed #a67668; box-shadow: 0 0 0 5px #fcf4e8, 0 0 0 7px #a67668;">
 
 <!--- CHARACTER IMAGE;
 replace the url
 in background! --->
 <div class="card h-100" style="background: #fcf9f2 url('https://dummyimage.com/250x300/ccc/ffffff&text=image+here') no-repeat center center; background-size: cover; min-height: 250px; border-radius: 0 25px 25px 0; border: 2px solid #c49689;"></div>
 
 </div>
 </div>
 
 <div class="col-sm-8 pl-sm-4 py-sm-1 px-0">
 <div class="card px-3" style="border-radius: 25px 0 0 25px; background-color: #fcf4e8; border: 3px dashed #a67668; box-shadow: 0 0 0 5px #fcf4e8, 0 0 0 7px #a67668;">
 <div class="d-flex justify-content-between align-items-center" style="font-size: 1.85rem; font-family: 'Brush Script MT';">
 <span class="ml-2 my-1">
 Details —
 </span>
 <i class="fas fa-address-book"></i>
 </div>
 
 <!--- INFO FIELDS START --->
 <div class="card py-2 px-4 mb-3" style="background-color: #fcf9f2; border: 2px solid #c49689; border-radius: 10px;">
 <div class="d-flex justify-content-between my-1">
 <span class="font-weight-bold">
 Name
 </span>
 <span style="opacity: 0.85;">
 name here.
 </span>
 </div>
 
 <div class="d-flex justify-content-between my-1">
 <span class="font-weight-bold">
 Age
 </span>
 <span style="opacity: 0.85;">
 age here.
 </span>
 </div>
 
 <div class="d-flex justify-content-between my-1">
 <span class="font-weight-bold">
 Gender
 </span>
 <span style="opacity: 0.85;">
 gender here.
 </span>
 </div>
 
 <div class="d-flex justify-content-between my-1">
 <span class="font-weight-bold">
 Pronouns
 </span>
 <span style="opacity: 0.85;">
 pronouns here.
 </span>
 </div>
 
 <div class="d-flex justify-content-between my-1">
 <span class="font-weight-bold">
 Sexuality
 </span>
 <span style="opacity: 0.85;">
 sexuality here.
 </span>
 </div>
 
 <div class="d-flex justify-content-between my-1">
 <span class="font-weight-bold">
 Birthday
 </span>
 <span style="opacity: 0.85;">
 birthday here.
 </span>
 </div>
 
 <div class="d-flex justify-content-between my-1">
 <span class="font-weight-bold">
 Theme
 </span>
 <span style="opacity: 0.85;">
 <a href="#LINK-HERE" style="color: #6e5047;">
 themesong here.
 </a>
 </span>
 </div>
 
 <div class="d-flex justify-content-between my-1">
 <span class="font-weight-bold">
 Creator
 </span>
 <span style="opacity: 0.85;">
 <a href="#LINK-HERE" style="color: #6e5047;">
 creator here.
 </a>
 </span>
 </div>
 </div>
 <!--- INFO FIELDS END --->
 
 </div>
 </div>
 </div>
 <!--- IMAGE & DETAILS END --->
 
 <!--- LIKES START --->
 <div class="row no-gutters mb-4">
 <div class="col-sm-8 px-3 pb-3 pt-2" style="border-radius: 0 25px 25px 0; background-color: #fcf4e8; border: 3px dashed #a67668; box-shadow: 0 0 0 5px #fcf4e8, 0 0 0 7px #a67668;">
 <div class="d-flex justify-content-between align-items-center px-sm-2" style="font-size: 1.55rem; font-family: 'Brush Script MT';">
 <span class="ml-1">
 Likes —
 </span>
 <i class="fas fa-heart"></i>
 </div>
 
 <div class="card pt-3 px-4 w-100" style="background-color: #fcf9f2; border: 2px solid #c49689; border-radius: 10px;">
 <ul class="overflow-auto" style="max-height: 65px;">
 
 <li>Like one</li>
 <li>Like two</li>
 <li>Like three</li>
 
 </ul>
 </div>
 </div>
 </div>
 <!--- LIKES END --->
 
 <!--- DISLIKES START --->
 <div class="row no-gutters justify-content-end mb-4">
 <div class="col-sm-8 px-3 pb-3 pt-2" style="border-radius: 25px 0 0 25px; background-color: #fcf4e8; border: 3px dashed #a67668; box-shadow: 0 0 0 5px #fcf4e8, 0 0 0 7px #a67668;">
 <div class="d-flex justify-content-between align-items-center px-sm-2" style="font-size: 1.55rem; font-family: 'Brush Script MT';">
 <span class="ml-1">
 Dislikes —
 </span>
 <i class="fas fa-heart-broken"></i>
 </div>
 
 <div class="card pt-3 px-4 w-100" style="background-color: #fcf9f2; border: 2px solid #c49689; border-radius: 10px;">
 <ul class="overflow-auto" style="max-height: 65px;">
 
 <li>Dislike one</li>
 <li>Dislike two</li>
 <li>Dislike three</li>
 
 </ul>
 </div>
 </div>
 </div>
 <!--- DISLIKES END --->
 
 <!--- PALETTE START --->
 <div class="row no-gutters">
 <div class="col-12 p-3 d-flex justify-content-between align-items-center" style="border-radius: 0 50px 50px 0; background-color: #fcf4e8; border: 3px dashed #a67668; box-shadow: 0 0 0 5px #fcf4e8, 0 0 0 7px #a67668;">
 <!--- PALETTE ROW;
 supports up to max
 12 colours...! just
 duplicate the col h-100
 div and change background
 hexcode for each colour. --->
 <div class="row no-gutters w-100" style="background-color: #fcf9f2; border: 2px solid #c49689; border-radius: 10px; height: 75px;">
 <!--- FIRST COLOUR --->
 <div class="col h-100" style="background-color: #ffb5a7; border-radius: 7px 0 0 7px;"></div>
 
 <div class="col h-100" style="background-color: #fcd5ce;"></div>
 <div class="col h-100" style="background-color: #f8edeb;"></div>
 <div class="col h-100" style="background-color: #f9dcc4;"></div>
 
 <!--- LAST COLOUR --->
 <div class="col h-100" style="background-color: #fec89a; border-radius: 0 7px 7px 0;"></div>
 </div>
 
 <span class="ml-3 mr-2 px-4 py-3" style="background-color: #fcf9f2; border-radius: 50%; border: 2px solid #c49689; font-size: 1.75rem;">
 <i class="fas fa-palette"></i>
 </span>
 </div>
 </div>
 <!--- PALETTE END --->
</div>
 
<!--- CREDIT;
 optional, you can
 take this out --->
<div class="text-center my-2" style="font-size: 0.75em;">
 <a href="https://toyhou.se/alyeong" data-toggle="tooltip" data-placement="bottom" title="code by alyeong">
 <i class="fal fa-umbrella"></i>
 </a>
</div>