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>
Serendipity's Comments