[Free] Trade Preferences (TH Theme 1 Row)

LeafJelly

Profile


<!---------------------
Free to Use Trade Prefrences by LeafJelly
Version: TH Theme 1 Rows

------------------------
        Rules
1. DO NOT REMOVE credits
2. DO NOT redistribute purchased codes 
3. Turn off WYSIWYG before using my HTML codes and while editing, it'll break otherwise
4. You can modify and frankestein my codes with credit to all the source codes, and only if the other coders allow it.
5. You may NOT redistribute frankesteined codes under your own name, claiming it as your own work. Copy and pasting parts of my code without credit is theft, and takes advantage of my work that's provided for free.
6.You're allowed to heavily modify my codes, as long as credit to me stays on the page. If the credit breaks, feel free to write it in somewhere instead or at the bottom.
----------------------->
<div class="row no-gutters mx-auto" style="max-width:1300px">

<!----- Header ---->
<div class="col-12 card bg-primary text-center p-1" style="border-radius:15px 15px 0 0; border-bottom:none; letter-spacing:1.5px; font-size:1.7em; font-weight:500;">
     <span>
     
     Username's Trade Preferences
     
</span></div>

<div class="col-12 card p-1" style="border-radius:0 0 15px 15px; border-top:none"><div class="row no-gutters d-flex justify-content-center">

<!----- Key ---->
<div class="col-12 col-md-4 p-2"><div class="card p-2 text-center" style="border-radius:8px">
    <span style="font-size:1.2em; font-weight:500">Key</span><hr class="m-1">
    <ul class="list-unstyled m-1">
         <li><i class="fas fa-star text-primary"></i> Actively Seeking</li>
         <li><i class="fas fa-heart text-success"></i> Love</li>
         <li><i class="fas fa-check text-info"></i> Like</li>
         <li><i class="fas fa-xmark text-warning"></i> Dislike</li>
         <li><i class="fas fa-ban text-danger"></i> Hard No</li>
    </ul>
</div></div>

<!----- Contact ---->
<div class="col-12 col-md-6 p-2"><div class="card p-2 text-center h-100" style="border-radius:8px">
     <span style="font-size:1.2em; font-weight:500">Contact</span><hr class="m-1">
    <!----- ----->
     <p class="m-auto">
         DM me on Discord or Toyhouse to Offer. Write what you want here.
     </p>
    
     <!---- Buttons ----
     Delete the ones you don't need
     ------------------>
     <div class="row no-gutters m-auto justify-content-center">
     <!--- TH DM button, add your username to the end of the url --->
     <a href="https://toyhou.se/~messages/create/username" class="btn btn-primary m-1" style="border-radius:6px"><i class="fas fa-envelope pr-1"></i> Message me</a>
     <!---TH Button End--->
     
     <!--- Trade Bulletin --->
     <a href="URL_HERE" class="btn btn-primary m-1" style="border-radius:6px"><i class="fas fa-comments pr-1"></i> Trade Bulletin</a>
     <!---Bulletin Button End--->
     
     <!--- Discord This isnt a button --->
     <div class="card card-outline-secondary text-secondary my-auto" style="border-radius:6px; padding:.5em 1em"><span><i class="fab fa-discord pr-1"></i> 
         Username
     </span></div>
     <!---Discord End--->
     
     <!---- Copy and paste above here for more buttons ----->
     </div>
</div></div>
</div>

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

        DESIGNER
        
Click the little arrow 2 lines below this to collapse the entire section for easier navigation
-------------------------------->
<div class="col-12 p-2 mx-auto">
     <div class="card bg-faded text-center p-1" style="border-radius:8px 8px 0 0;letter-spacing:1.2px; font-size:1.2em; font-weight:500;">
         <span>
             <i class="fas fa-user  p-1"></i>
             Designer</span>
         </div>
     <div class="card p-2" style="border-radius:0 0 8px 8px; border-top:none"><div class="row no-gutters">

     <!----- Active Seeking 1st column----->
     <ul class="col-6 col-md-3  list-unstyled m-0">
         <li><i class="fas fa-star text-primary fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Three
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Four
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Love 2nd Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <li><i class="fas fa-heart text-success fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Three
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Four
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Five
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Like 3rd Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <li><i class="fas fa-check text-info "></i>
             One
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Two
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Three
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Four
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Dislike and Hard No 4th Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <!--- Dislike -->
         <li><i class="fas fa-xmark text-warning"></i>
             One
         </li>
         
         <li><i class="fas fa-xmark text-warning"></i>
             two
         </li>
         
         <!--- Hard No --->
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             Three
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
    </div></div>
</div>

<!------------------------------

        Species
        
Click the little arrow 2 lines below this to collapse the entire section
-------------------------------->
<div class="col-12 p-2 mx-auto">
     <div class="card bg-faded text-center p-1" style="border-radius:8px 8px 0 0;letter-spacing:1.2px; font-size:1.2em; font-weight:500;">
         <span>
             <i class="fas fa-paw  p-1"></i>
             Species
         </span></div>
     <div class="card p-2" style="border-radius:0 0 8px 8px; border-top:none"><div class="row no-gutters">

     <!----- Active Seeking 1st column----->
     <ul class="col-6 col-md-3  list-unstyled m-0">
         <li><i class="fas fa-star text-primary fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Three
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Four
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Love 2nd Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <li><i class="fas fa-heart text-success fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Three
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Four
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Five
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Like 3rd Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <li><i class="fas fa-check text-info "></i>
             One
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Two
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Three
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Four
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Dislike and Hard No 4th Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <!--- Dislike -->
         <li><i class="fas fa-xmark text-warning"></i>
             One
         </li>
         
         <li><i class="fas fa-xmark text-warning"></i>
             two
         </li>
         
         <!--- Hard No --->
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             Three
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
    </div></div>
</div>


<!------------------------------

        COLOR PALETTES
        
Click the little arrow 2 lines below this to collapse the entire section
-------------------------------->
<div class="col-12 p-2 mx-auto">
     <div class="card bg-faded text-center p-1" style="border-radius:8px 8px 0 0;letter-spacing:1.2px; font-size:1.2em; font-weight:500;">
         <span>
             <i class="fas fa-palette  p-1"></i>
             Color Palettes
         </span></div>
     <div class="card p-2" style="border-radius:0 0 8px 8px; border-top:none"><div class="row no-gutters">

     <!----- Active Seeking 1st column----->
     <ul class="col-6 col-md-3  list-unstyled m-0">
         <li><i class="fas fa-star text-primary fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Three
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Four
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Love 2nd Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <li><i class="fas fa-heart text-success fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Three
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Four
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Five
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Like 3rd Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <li><i class="fas fa-check text-info "></i>
             One
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Two
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Three
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Four
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Dislike and Hard No 4th Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <!--- Dislike -->
         <li><i class="fas fa-xmark text-warning"></i>
             One
         </li>
         
         <li><i class="fas fa-xmark text-warning"></i>
             two
         </li>
         
         <!--- Hard No --->
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             Three
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
    </div></div>
</div>

<!------------------------------

        THEMES
        
Click the little arrow 2 lines below this to collapse the entire section
-------------------------------->
<div class="col-12 p-2 mx-auto">
     <div class="card bg-faded text-center p-1" style="border-radius:8px 8px 0 0;letter-spacing:1.2px; font-size:1.2em; font-weight:500;">
         <span>
             <i class="fas fa-image  p-1"></i>
             Themes
         </span></div>
     <div class="card p-2" style="border-radius:0 0 8px 8px; border-top:none"><div class="row no-gutters">

     <!----- Active Seeking 1st column----->
     <ul class="col-6 col-md-3  list-unstyled m-0">
         <li><i class="fas fa-star text-primary fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Three
         </li>
         
         <li><i class="fas fa-star text-primary fa-sm"></i>
             Four
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Love 2nd Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <li><i class="fas fa-heart text-success fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Three
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Four
         </li>
         
         <li><i class="fas fa-heart text-success fa-sm"></i>
             Five
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Like 3rd Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <li><i class="fas fa-check text-info "></i>
             One
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Two
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Three
         </li>
         
         <li><i class="fas fa-check text-info "></i>
             Four
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
     <!----- Dislike and Hard No 4th Column----->
     <ul class="col-6 col-md-3 list-unstyled m-0">
         <!--- Dislike -->
         <li><i class="fas fa-xmark text-warning"></i>
             One
         </li>
         
         <li><i class="fas fa-xmark text-warning"></i>
             two
         </li>
         
         <!--- Hard No --->
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             One
         </li>
         
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             Two
         </li>
         
         <li><i class="fas fa-ban text-danger fa-sm"></i>
             Three
         </li>
         <!--- Copy & Paste Above here for more --->
     </ul>
     
    </div></div>
</div>


<!--- Collapse the Section then copy and paste it above here for another box ----->
</div></div></div>

<!----- Credit DO NOT REMOVE ------>
<span class="d-flex justify-content-center">
    <a href="/LeafJelly" class="tooltipster" title="HTML by LeafJelly">
        <i class="far fa-leaf"></i>
    </a>
</span>