[ F2U ] Small Pride Carrds (pansexual)

jiko

Info


Created
1 year, 10 months ago
Creator
jiko
Favorites
0

Profile


ABOUT ME

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.


COMMS
closed, prices here
TRADES
open
REQUESTS
closed
BOUNDARIES

BEFORE YOU INTERACT lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.

DO NOT INTERACT donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.


PLS TW THIS FOR ME curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.

LINKS

discord#0000


 <!-------------------------------------------------
 
 
        Pride Carrds — Pansexual 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 your display settings)
        → turn ON Code Editor
        
        ------------------------------
        
        TIPPY TIPS
        → insert your img links INSIDE brackets or quotation marks!!
        → looking for a good online code editor?  try [ https://th.circlejourney.net/# ] !
        
        ------------------------------
        
        PALETTE
        
        → pink --------------- #df6382
        → yellow ---------------- #eda960
        → blue ---------------- #5e7ad5
        
        
        → background ----------- #fefefe
        → text ----------------- #464346
        
        use control/command + f to quickly change the colours!
 
 
 ------------------------------------------------->
 <div class="py-sm-5 p-4" style="border-radius:30px;
 
 
 background-image:url(IMG_ADDRESS_HERE);
 
 
 background-color:#;
 background-size:#;
 background-position:#;

 ">
 <div class="mx-auto my-4" style="color:#464346; max-width:600px; font-size:10pt;">
 <div class="pt-4 px-4" style="border-radius:20px; background:
 linear-gradient(
 
 #df6382 0%, #df6382 33%,
 #eda960 33%, #eda960 66%,
 #5e7ad5 66%, #5e7ad5 100%
 
 );">
 <div class="card rounded-0 border-0 bg-transparent" style="overflow:hidden">
 <!-------------------------------------------------
 
 
                 PAGEDOLL
 

 ------------------------------------------------->
 <!--
 → tall, transparent pagedoll is required
 → [margin-bottom:-120px;] below may need adjustments depending on the size of the pagedoll, but you can delete that if you're cool with the fullsize of your pagedoll ^^
 -->
 <div style="margin-bottom:-120px; min-height:300px;
 
 
 background-image:url(https://cdn.discordapp.com/attachments/704981844843692094/991623407248613386/unknown.png);
 
 
 background-size:contain;
 background-repeat:no-repeat;
 background-position:center;
 
 ">
 </div>
 <!-------------------------------------------------
 
 
                 TAB BUTTONS
 

 ------------------------------------------------->
 <ul class="nav row no-gutters pb-3">
    <li class="col-4 p-1">
        <a href="#prideone" data-toggle="tab" class="w-100 btn btn-outline-primary border-0 text-reset" style="font-weight:900; font-family:serif; font-size:20px; background-color:#fefefe; box-shadow:none;">
            I.
        </a>
    </li>
    
    <li class="col-4 p-1">
        <a href="#pridetwo" data-toggle="tab" class="w-100 btn btn-outline-primary border-0 text-reset" style="font-weight:900; font-family:serif; font-size:20px; background-color:#fefefe; box-shadow:none;">
            II.
        </a>
    </li>
    
    <li class="col-4 p-1">
        <a href="#pridethree" data-toggle="tab" class="w-100 btn btn-outline-primary border-0 text-reset" style="font-weight:900; font-family:serif; font-size:20px; background-color:#fefefe; box-shadow:none;">
            III.
        </a>
    </li>
 </ul>
 </div>
 </div>
 <div class="mt-4">
 <div class="mx-auto mb-n1" style="background-color:#fefefe; height:30px; width:40px; clip-path:polygon(50% 0%,0% 100%,100% 100%);"></div>
 <div class="card shadow rounded-0 border-0 p-sm-4 p-3" style="border-radius:20px; background-color:#fefefe">
 <div class="tab-content">
 <!-------------------------------------------------
 
 
                 YOU SUMMARY
 

 ------------------------------------------------->
 <div class="tab-pane fade active show" id="prideone" style="transition-duration:0.3s">
    
    
    <!-- HEADER
    ----------------------------------------------->
    <div class="text-uppercase" style="letter-spacing:1px; font-weight:900; font-family:serif; font-size:20px;">
        <i class="fad fa-sparkles mr-2" style="color:#df6382"></i> ABOUT ME
    </div>
    <hr class="mt-2" style="border-style:dotted; border-color:#464346; opacity:0.2; border-top-width:2px;">
    
    
    <!-- SUMMARY ABOUT YOURSELF
    ----------------------------------------------->
    <div class="mb-0">
        
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p>
        
    </div>
    <hr class="w-100" style="border-style:dotted; border-color:#464346; opacity:0.2; border-top-width:2px;">
    
    
    <!-- ART STATUS
    ----------------------------------------------->
    <div class="row no-gutters text-center align-items-center">
        <div class="col-4 p-2">
            <b class="mr-2" style="font-weight:900; font-family:serif; font-size:15px;">COMMS</b><br>
            
            
            closed,
            
            <a href="LINK_HERE" class="text-reset" style="text-decoration:underline;">
                prices here
            </a>
            
            
        </div>
        <div class="col-4 p-2">
            <b class="mr-2" style="font-weight:900; font-family:serif; font-size:15px;">TRADES</b><br>
            
            open
            
        </div>
        <div class="col-4 p-2">
            <b class="mr-2" style="font-weight:900; font-family:serif; font-size:15px;">REQUESTS</b><br>
            
            closed
            
        </div>
    </div>
 </div>
 <!-------------------------------------------------
 
 
                 BOUNDARIES
 

 ------------------------------------------------->
 <div class="tab-pane fade" id="pridetwo" style="transition-duration:0.3s">
    
    
    <!-- HEADER
    ----------------------------------------------->
    <div class="text-uppercase" style="letter-spacing:1px; font-weight:900; font-family:serif; font-size:20px;">
        <i class="fad fa-sparkles mr-2" style="color:#eda960"></i> BOUNDARIES
    </div>
    <hr class="mt-2" style="border-style:dotted; border-color:#464346; opacity:0.2; border-top-width:2px;">
    
    
    <!-- BOUNDARIES
    ----------------------------------------------->
    <div class="mb-0">
        
        
        <!-- BYI ------------------------------------->
        <p><b class="mr-2" style="font-weight:900; font-family:serif; font-size:15px;">
            BEFORE YOU INTERACT</b>
            
            lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.
            
        </p>
        
        
        <!-- DNI ------------------------------------->
        <p><b class="mr-2" style="font-weight:900; font-family:serif; font-size:15px;">
            DO NOT INTERACT</b>
            
            donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.
            
        </p>
        <hr class="mt-2" style="border-style:dotted; border-color:#464346; opacity:0.2; border-top-width:2px;">
        
        
        <!-- CW/TW FOR YOU AND/OR OTHER USERS ------------------------------------->
        <p><b class="mr-2" style="font-weight:900; font-family:serif; font-size:15px;">
            PLS TW THIS FOR ME</b>
            
            curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.
            
        </p>
    </div>
 </div>
 <!-------------------------------------------------
 
 
                 SOCIAL MEDIA LINKS
 

 ------------------------------------------------->
 <div class="tab-pane fade" id="pridethree" style="transition-duration:0.3s">
    
    
    <!-- HEADER
    ----------------------------------------------->
    <div class="text-uppercase" style="letter-spacing:1px; font-weight:900; font-family:serif; font-size:20px;">
        <i class="fad fa-sparkles mr-2" style="color:#5e7ad5"></i> LINKS
    </div>
    <hr class="mt-2" style="border-style:dotted; border-color:#464346; opacity:0.2; border-top-width:2px;">
    
    
    <!-- ICONS
    ----------------------------------------------->
    <div class="text-center">
        
        
        <a href="LINK_HERE" class="text-reset mx-2" style="text-decoration:none;">
            <i class="fas fa-id-card fa-fw fa-3x"></i>
        </a>
        
        
        <a href="LINK_HERE" class="text-reset mx-2" style="text-decoration:none;">
            <i class="fab fa-twitter fa-fw fa-3x"></i>
        </a>
        
        
        <a href="LINK_HERE" class="text-reset mx-2" style="text-decoration:none;">
            <i class="fab fa-deviantart fa-fw fa-3x"></i>
        </a>
        
        
        <a href="LINK_HERE" class="text-reset mx-2" style="text-decoration:none;">
            <i class="fab fa-trello fa-fw fa-3x"></i>
        </a>
        
        
        <a href="LINK_HERE" class="text-reset mx-2" style="text-decoration:none;">
            <i class="fas fa-arrow-right-arrow-left fa-fw fa-3x"></i>
        </a>
        
        
        <!-- add more ABOVE this line! -->
        
        <p class="mt-3">
            
            discord#0000
            
        </p>
    </div>
 </div>
 </div>
 </div>
 </div>
 <!-------------------------------------------------
 
 
                 CREDITS
 

 ------------------------------------------------->
 <div class="mt-3 text-center small faded" style="letter-spacing:0.5px">
    
    <a href="https://toyhou.se/16487749.-f2u-pride-carrds" class="text-body" style="color:#HEXCODE">
        ( code by jiko )
    </a>
    <!--
    → if credits can't be seen due to background, change [text-body] to text-reset (the code's default font colour), text-dark OR text-light
    or manually set the text colour at the [color:#HEXCODE] (delete [class="text-body"] first), as long as it is visible!
    -->
    
 </div>
 </div>
 </div>