API tools faq
paste
sundustboy

Toyhouse Code - Soft Stars Default

sundustboy
Apr 18th, 2019 (edited)
1,546
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 10.13 KB | None | 0 0
raw download clone embed print report
  1. <!-----------------------------------------
  2. -------------------------------------------
  3.  
  4.            |                              ____.......__
  5.            |\      .'           _.--""''``             ``''--._
  6.           | \   .'/      ..--'`                             .-'`
  7.     .._    |  \.' /  ..-''                                .-'
  8.      '.`'"-:  '  .-'`                                  .-'
  9.       '.             __...----""""""""""--..           \
  10.       -         ..-''                       ``""-._     \
  11.     .'  _.      \                                  `"-   \
  12.     _.-'` |  /-.  \                                    `-. \
  13.          | /   `. \                                      `.\
  14.          |/      `-\                                       `.
  15.          |    ,---.  ,--.                ,--.
  16. ,---.  ,---. /  .-',-'  '-.       ,---.,-'  '-. ,--,--.,--.--. ,---.  
  17. (  .-' | .-. ||  `-,'-.  .-'      (  .-''-.  .-'' ,-.  ||  .--'(  .-'  
  18. .-'  `)' '-' '|  .-'  |  |        .-'  `) |  |  \ '-'  ||  |   .-'  `)
  19. `----'  `---' `--'    `--'         `----'  `--'   `--`--'`--'   `----'  
  20.  
  21.   (DEFAULT PALETTE VERSION)
  22.  
  23.   a free character profile code by DUSTCHOMPS
  24.  
  25.   Custom color palette:
  26.   https://pastebin.com/yNr1Tv0B
  27.  
  28.   Default color palette:
  29.   https://pastebin.com/M2dYtRb6
  30.  
  31. ------------------------------------------>
  32.  
  33. <!-- CONTAINER -->
  34. <div class="card rounded container bg-secondary text-dark" style="width:100%; padding-top:15px; border:none;">
  35.   <div class="row">
  36.  
  37.   <!-- HEADER -->
  38.   <div class="col-12"><div class="card rounded bg-dark text-light" style="width:100%; margin-left:auto; margin-right:auto; margin-bottom:20px; overflow:hidden;">
  39.    
  40.     <!-- NAME -->
  41.     <div class="bg-primary text-light" style="padding:10px; text-align:center; font-size:24px; font-weight:bold; text-transform:uppercase;">
  42.       <i class="fa fa-star"></i>
  43.       NAME
  44.       <i class="fa fa-star"></i>
  45.     </div>
  46.    
  47.     <!-- BASICS -->
  48.     <div style="padding:10px; text-align:center; font-size:16px; text-transform:uppercase;">
  49.       gender <i class="fa fa-star text-info" style="margin:5px;"></i>
  50.       species <i class="fa fa-star text-info" style="margin:5px;"></i>
  51.       age <i class="fa fa-star text-info" style="margin:5px;"></i>
  52.       sexuality
  53.     </div>
  54.    
  55.   </div></div>
  56.   <!-- END HEADER -->
  57.  
  58.   <!-- INFO BOX START -->
  59.   <div class="col-sm-12 col-md-6 col-lg-5"><div class="card rounded bg-dark text-light" style="width:100%; max-width:800px; margin-left:auto; margin-right:auto; margin-bottom:20px; overflow:hidden; ">
  60.    
  61.     <!-- PROFILE IMG -->
  62.     <div class="bg-light" style="height:auto; max-height:440px; margin:auto; overflow:hidden;">
  63.       <!--Image link goes in the src=""--><img src="https://i.imgur.com/sC3m1uA.png" style="width:auto; max-width:100%;" alt="profile image">
  64.     </div>
  65.     <!-- PROFILE IMG END -->
  66.    
  67.     <!-- REFERENCES -->
  68.     <div style="width:100%; height:58px; overflow-x:auto; overflow-y:hidden;">
  69.     <table style="width:100%; border:none;"><tr>
  70.      
  71.       <!-- Delete or copy as many of these as you need below this line (works best with 1 or 2) -->
  72.      
  73.       <!-- Reference Link -->
  74.       <td>
  75.         <!--Link goes in the href=""--><a href="" class="btn rounded bg-info text-dark" style="width:100%; padding:10px; text-align:center; font-size:18px; font-weight:bold; font-style:none;" role="button">
  76.         Reference Sheet
  77.       </a></td>
  78.       <!--Reference Link End-->
  79.      
  80.     </tr></table>
  81.     </div>
  82.     <!-- REFERENCES END -->
  83.    
  84.   </div></div>
  85.   <!-- INFO BOX END -->
  86.  
  87.   <!-- second column --><div class="col-sm-12 col-md-6 col-lg-7">
  88.  
  89.     <!-- ABOUT BOX -->
  90.     <div class="card rounded bg-dark text-light" style="height:280px; width:100%; max-width:800px; margin-left:auto; margin-right:auto; margin-bottom:20px; overflow-x:hidden; overflow-y:auto; ">
  91.       <div class="bg-primary text-light" style="padding:10px; text-align:center; font-size:20px; font-weight:bold;">ABOUT</div>
  92.      
  93.       <div style="padding:10px; overflow-x:hidden; overflow-y:auto;">
  94.         <!-- BASICS -->
  95.         <div style="padding:10px; text-align:center; font-size:16px; text-transform:uppercase;">
  96.           <!--PERSONALITY TRAITS-->
  97.           personality <i class="fa fa-star text-info" style="margin:5px;"></i> traits <i class="fa fa-star text-info" style="margin:5px;"></i> go <i class="fa fa-star text-info" style="margin:5px;"></i> here</div>
  98.        
  99.         <!-- DETAILS -->
  100.         Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
  101.        
  102.         <!------- LIKES/DISLIKES ------->
  103.         <div class="row mx-auto justify-content-center" style="width:100%; padding-top:20px;">
  104.          
  105.           <!-- LIKES -->
  106.           <div class="card rounded col-md-10 col-lg-5 mx-3 bg-info text-dark" style="margin-bottom:20px; padding-bottom:5px; ">
  107.             <div style="padding:10px; text-align:center; font-size:16px; font-weight:bold;">LIKES</div>
  108.            
  109.             <!-- LIKES LIST -->
  110.             <div>
  111.               <li>
  112.                 <!-- Delete or copy as many of these as you need below this line -->
  113.                 <ul style="line-height:1;">likes</ul>
  114.                 <ul style="line-height:1;">likes</ul>
  115.                 <ul style="line-height:1;">likes</ul>
  116.                 <ul style="line-height:1;">likes</ul>
  117.                 <ul style="line-height:1;">likes</ul>
  118.               </li>
  119.             </div>
  120.             <!-- LIKES LIST END -->
  121.          
  122.           </div>
  123.           <!-- LIKES END -->
  124.          
  125.           <!-- DISLIKES -->
  126.           <div class="card rounded col-md-10 col-lg-5 mx-3 bg-info text-dark" style="margin-bottom:20px; padding-bottom:5px; ">
  127.             <div style="padding:10px; padding-bottom:20px; text-align:center; font-size:16px; font-weight:bold;">DISLIKES</div>
  128.            
  129.             <!-- DISLIKES LIST -->
  130.             <div>
  131.               <li>
  132.                 <!-- Delete or copy as many of these as you need below this line -->
  133.                 <ul style="line-height:1;">dislikes</ul>
  134.                 <ul style="line-height:1;">dislikes</ul>
  135.                 <ul style="line-height:1;">dislikes</ul>
  136.                 <ul style="line-height:1;">dislikes</ul>
  137.               </li>
  138.             </div>
  139.             <!-- DISLIKES LIST END -->
  140.          
  141.           </div>
  142.           <!-- DISLIKES END -->
  143.          
  144.         </div>
  145.         <!------- LIKES/DISLIKES END -------->
  146.        
  147.       </div>
  148.      
  149.     </div>
  150.     <!-- ABOUT BOX END -->
  151.    
  152.     <!-- RELATIONSHIPS BOX START -->
  153.     <div class="card rounded bg-dark text-light" style="height:200px; overflow-x:auto; overflow-y:auto; width:100%; max-width:800px; margin-left:auto; margin-right:auto; margin-bottom:20px;  padding-right:10px;">
  154.       <div class="row justify-content-center" style="width:auto; max-width:800%; margin-left:auto; margin-right:auto; margin-bottom:-10px;">
  155.        
  156.         <!-- Delete or copy as many of these as you need below this line -->
  157.        
  158.         <!-- Relationship -->
  159.         <!--Character link goes in href=""--><a href="" class="btn rounded bg-info text-dark" style="width:140px; height:177px; padding:10px; margin-top:10px; margin-left:10px; margin-bottom:10px; text-align:center; font-size:16px; font-style:none; overflow:hidden; vertical-align: text-bottom;">
  160.           <!-- Looks best with a square or circular icon -->
  161.           <!--Icon image link goes in src=""--><img src="https://i.imgur.com/bh1ykVH.png" class="rounded" alt="" style="display:block; margin:auto;">
  162.           <b>
  163.           name</b><br>
  164.           relationship
  165.         </a>
  166.         <!---->
  167.         <!-- Relationship End -->
  168.        
  169.         <!-- Relationship -->
  170.         <!--Character link goes in href=""--><a href="" class="btn rounded bg-info text-dark" style="width:140px; height:177px; padding:10px; margin-top:10px; margin-left:10px; margin-bottom:10px; text-align:center; font-size:16px; font-style:none; overflow:hidden; vertical-align: text-bottom;">
  171.           <!-- Looks best with a square or circular icon -->
  172.           <!--Icon image link goes in src=""--><img src="https://i.imgur.com/bh1ykVH.png" class="rounded" alt="" style="display:block; margin:auto;">
  173.           <b>
  174.           name</b><br>
  175.           relationship
  176.         </a>
  177.         <!---->
  178.         <!-- Relationship End -->
  179.        
  180.         <!-- Relationship -->
  181.         <!--Character link goes in href=""--><a href="" class="btn rounded bg-info text-dark" style="width:140px; height:177px; padding:10px; margin-top:10px; margin-left:10px; margin-bottom:10px; text-align:center; font-size:16px; font-style:none; overflow:hidden; vertical-align: text-bottom;">
  182.           <!-- Looks best with a square or circular icon -->
  183.           <!--Icon image link goes in src=""--><img src="https://i.imgur.com/bh1ykVH.png" class="rounded" alt="" style="display:block; margin:auto;">
  184.           <b>
  185.           name</b><br>
  186.           relationship
  187.         </a>
  188.         <!---->
  189.         <!-- Relationship End -->
  190.        
  191.         <!-- Relationship -->
  192.         <!--Character link goes in href=""--><a href="" class="btn rounded bg-info text-dark" style="width:140px; height:177px; padding:10px; margin-top:10px; margin-left:10px; margin-bottom:10px; text-align:center; font-size:16px; font-style:none; overflow:hidden; vertical-align: text-bottom;">
  193.           <!-- Looks best with a square or circular icon -->
  194.           <!--Icon image link goes in src=""--><img src="https://i.imgur.com/bh1ykVH.png" class="rounded" alt="" style="display:block; margin:auto;">
  195.           <b>
  196.           name</b><br>
  197.           relationship
  198.         </a>
  199.         <!---->
  200.         <!-- Relationship End -->
  201.        
  202.       </div>
  203.     </div>
  204.     <!-- RELATIONSHIPS BOX END -->
  205.  
  206.   </div><!-- second column end -->
  207.  
  208.  </div>
  209. </div>
  210. <!-- CONTAINER END -->
  211.  
  212. <!-- CREDIT (DO NOT REMOVE) --><div style="width:100%; max-width:1140px; margin-top:5px; margin-left:auto; margin-right:auto; text-align:right; font-size:11px; margin-bottom:-20px;">code by @dustchomps</div>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!