API tools faq
paste
Advertisement
CrispinAsheYA

Galactica (Custom Colours)

CrispinAsheYA
May 9th, 2023 (edited)
721
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 37.95 KB | Source Code | 0 0
raw download clone embed print report
  1. <!------- PLEASE SEE HERE FOR MY CODE RULES: https://toyhou.se/12931952.bonus-content/17036656.-06-code-rules -------
  2.  
  3. Version: 1.0
  4.  
  5. Default Colours
  6. -Light-Fill / Text Colour: #33449B
  7. -Dark-Fill : #131635
  8. -Text White: #FFFFFF
  9. -Border Black: #000000
  10. -Font Awesome Icons: fas fa-roller-coaster | fas fa-star
  11.  
  12. There are no find and replace variables in this code. By using this code, you agree that you are somewhat familiar with HTML and how it works. There are also less comments in this code than usual, simply because this code is so long already.
  13.  
  14. Most user-changeable varibles are set as # if that helps.
  15.  
  16. Thank you for reading!
  17. Crispin
  18.  
  19. -->
  20.  
  21. <!------------------------------- START BACKGROUND -------------------------------->
  22.  
  23. <!-- No Image -->
  24. <div class="m-0 p-0">
  25.  
  26. <!-- If you want An Image, delete above div and Uncomment code on the line below. -->
  27. <!-- <div style="background-image:url(#); background-size:cover; background-position:top-center; overflow:auto;" class="card-block"> -->
  28.  
  29.   <!------------------------------- START ACTUAL CODE -------------------------------->
  30.   <div class="col-12 p-0" style="font-size:1rem; font-family:'comic sans ms'; background-color:#FFFFFF; border:none;">
  31.    
  32.     <!------------------------------- START HEADING -------------------------------->
  33.     <div class="col-12 p-0" style="border:#000000 8px solid; border-bottom:none;">
  34.       <div class="card rounded-0" style="background:url(#); background-position:center; background-size:cover; border:none;"><p class="justify-content-between display-4 m-1 p-3" style="color:#FFFFFF; background:rgba(0,0,0,0.7);">
  35.         <span><a href="https://toyhou.se/21470022.galactica" data-toggle="tooltip" title="Code by: TomcatCodes / CrispinAsheYA" data-original-title="Code by: TomcatCodes / CrispinAsheYA"><span style="color:#FFFFFF;"><i class="fas fa-star fa-flip-horizontal"></i></span></a> # - #</span></p></div>
  36.     </div>
  37.     <!------------------------------- END HEADING -------------------------------->
  38.    
  39.    
  40.     <!------------------------------- START BUTTONS -------------------------------->
  41.     <div class="col-12 p-0" style="border:#000000 4px solid; border-bottom:none;">
  42.       <ul class="nav nav-tabs card-header-tabs row p-0 m-0" style="text-align:center;">
  43.         <li class="col-12 col-lg-2 nav-item p-0 m-0"><a class="nav-link px-0" data-toggle="tab" href="#one" style="color:#FFFFFF; background:#33449B; border:#000000 4px solid; border-radius:0px">About</a></li>
  44.         <li class="col-12 col-lg-2 nav-item p-0 m-0"><a class="nav-link px-0" data-toggle="tab" href="#two" style="color:#FFFFFF; background:#33449B; border:#000000 4px solid; border-radius:0px">Personality</a></li>
  45.         <li class="col-12 col-lg-2 nav-item p-0 m-0"><a class="nav-link px-0" data-toggle="tab" href="#three" style="color:#FFFFFF; background:#33449B; border:#000000 4px solid; border-radius:0px">Story</a></li>
  46.         <li class="col-12 col-lg-2 nav-item p-0 m-0"><a class="nav-link px-0" data-toggle="tab" href="#four" style="color:#FFFFFF; background:#33449B; border:#000000 4px solid; border-radius:0px">Background</a></li>
  47.         <li class="col-12 col-lg-1 nav-item p-0 m-0"><a class="nav-link px-0" data-toggle="tab" href="#five" style="color:#FFFFFF; background:#33449B; border:#000000 4px solid; border-radius:0px">Design</a></li>
  48.         <li class="col-12 col-lg-1 nav-item p-0 m-0"><a class="nav-link px-0" data-toggle="tab" href="#six" style="color:#FFFFFF; background:#33449B; border:#000000 4px solid; border-radius:0px">Buddies</a></li>
  49.         <li class="col-12 col-lg-1 nav-item p-0 m-0"><a class="nav-link px-0" data-toggle="tab" href="#seven" style="color:#FFFFFF; background:#33449B; border:#000000 4px solid; border-radius:0px">Trivia</a></li>
  50.         <li class="col-12 col-lg-1 nav-item p-0 m-0"><a class="nav-link px-0" data-toggle="tab" href="#eight" style="color:#FFFFFF; background:#33449B; border:#000000 4px solid; border-radius:0px">Extras</a></li>
  51.       </ul>
  52.     </div>
  53.     <!------------------------------- END BUTTONS -------------------------------->
  54.    
  55.     <!------------------------------- START MIDDLE SECTION -------------------------------->
  56.     <div class="col-12 mx-auto p-0 row" style="background-color:#131635; border:#000000 4px solid; border-top:none;">
  57.    
  58.       <div class="col-12 col-lg-3 p-0">
  59.        
  60.         <div class="col-12 p-3" style="color:FFFFFF; font-size:1.2rem; background:#33449B; border:#000000 4px solid;"><i class="fas fa-roller-coaster fa-flip-horizontal"></i> Playlist</div>
  61.        
  62.         <!------------------------------- START PLAYLIST -------------------------------->
  63.         <div class="col-12" style="height:688px; overflow:auto; border:#000000 4px solid;">
  64.           <div class="container p-3">
  65.             <div class="p-3 text-center">
  66.               <ul class="list-unstyled">
  67.                
  68.                 <!------ START SONG ----->
  69.                 <td style="width:100%; text-align:center; background-color:transparent; border-color:transparent; border-style:double;">
  70.                   <p="text-center" style="color:33449B; text-shadow:0px 0px;"><b># - #</b></p>
  71.                   <audio controls="" style="border-radius:0px; background:33449B; padding:2px; width:200px; height:35px;"><source src="#"></audio></td><br><p style="color:#131635;">-</p>
  72.                 <!------ END SONG ----->
  73.                
  74.               </ul>
  75.             </div>
  76.           </div>
  77.         </div>
  78.         <!------------------------------- End PLAYLIST -------------------------------->
  79.        
  80.       </div>
  81.        
  82.        
  83.         <!------------------------------- START INFO -------------------------------->
  84.         <div class="col-12 col-lg-9 p-0" style="background-color:#131635; border:none;">
  85.           <div class="tab-content" style="border:#000000 4px solid;">
  86.             <div class="col-12 p-3" style="color:FFFFFF; font-size:1.2rem; background:#33449B; border-bottom:#000000 8px solid;"><i class="fas fa-roller-coaster fa-flip-horizontal"></i> Info</div>
  87.            
  88.             <!------------------------------- START TAB 1 -------------------------------->
  89.             <div class="tab-pane active show" id="one"><!-- Start Tab-->
  90.               <div class="card-body p-3 table-responsive" style="height:680px;"><!--Start Tab Set-Up-->
  91.                
  92.                 <div class="col-12 row">
  93.                  
  94.                   <div class="col-12 col-lg-8">
  95.                    
  96.                     <!------ START INTRODUCTION ----->
  97.                     <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Introduction</span><hr class="mt-1 mb-2">
  98.                     <p class="col-12 pb-3">#</p>
  99.                     <!------ START INTRODUCTION ----->
  100.                    
  101.                     <!------ START LOGO ----->
  102.                     <div class="col-12 my-2 mb-3 text-center">
  103.                       <img src="#" width="200" height="200">
  104.                     </div>
  105.                     <!------ END LOGO ----->
  106.                    
  107.                     <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Character Information</span><hr class="mt-1 mb-2">
  108.                    
  109.                     <div class="col-12 row mb-2 pb-3 p-0 text-center">
  110.                       <div class="col-12">
  111.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  112.                           <p class="mr-2" style="flex-grow:0;">Full-Name</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  113.                         </div>
  114.                       </div>
  115.                       <div class="col-12 col-lg-6">
  116.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  117.                           <p class="mr-2" style="flex-grow:0;">Species</p><hr style="flex-grow:1;"><span class="ml-2"><a href="https://toyhou.se/~world/145067.oblivionce/page/89843.coaster-species" style="color:#33449B;">Coaster</a></span>
  118.                         </div>
  119.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  120.                           <p class="mr-2" style="flex-grow:0;">Birthday</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  121.                         </div>
  122.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  123.                           <p class="mr-2" style="flex-grow:0;">Stagnant-Age</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  124.                         </div>
  125.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  126.                           <p class="mr-2" style="flex-grow:0;">Gender</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  127.                         </div>
  128.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  129.                           <p class="mr-2" style="flex-grow:0;">Status</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  130.                         </div>
  131.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  132.                           <p class="mr-2" style="flex-grow:0;">Ethnicity</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  133.                         </div>
  134.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  135.                           <p class="mr-2" style="flex-grow:0;">Race</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  136.                         </div>
  137.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  138.                           <p class="mr-2" style="flex-grow:0;">Voiceclaim</p><hr style="flex-grow:1;"><span class="ml-2"><a href="#" style="color:#33449B;">#</a></span>
  139.                         </div>
  140.                       </div>
  141.                       <div class="col-12 col-lg-6">
  142.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  143.                           <p class="mr-2" style="flex-grow:0;">Manufacturer</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  144.                         </div>
  145.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  146.                           <p class="mr-2" style="flex-grow:0;">Height-Restriction</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  147.                         </div>
  148.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  149.                           <p class="mr-2" style="flex-grow:0;">Actual-Age</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  150.                         </div>
  151.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  152.                           <p class="mr-2" style="flex-grow:0;">Park</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  153.                         </div>
  154.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  155.                           <p class="mr-2" style="flex-grow:0;">Area</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  156.                         </div>
  157.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  158.                           <p class="mr-2" style="flex-grow:0;">Top-Speed</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  159.                         </div>
  160.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  161.                           <p class="mr-2" style="flex-grow:0;">Inversions</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  162.                         </div>
  163.                         <div class="d-flex" style="flex-direction:row; align-items:center;">
  164.                           <p class="mr-2" style="flex-grow:0;">Material</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  165.                         </div>
  166.                       </div>
  167.                      
  168.                     </div>
  169.                    
  170.                   </div>
  171.                   <!------ END TEXT ----->
  172.                  
  173.                   <!------ START Image ----->
  174.                   <div class="col-12 col-lg-4 text-center">
  175.                     <img src="#" height="400" width="200">
  176.                   </div>
  177.                   <!------ END Image ----->
  178.                
  179.                 </div>
  180.                
  181.               </div><!--End Tab Set-Up-->
  182.             </div><!-- End Tab -->
  183.             <!------------------------------- END TAB 1 -------------------------------->
  184.              
  185.             <!------------------------------- START TAB 2 -------------------------------->
  186.             <div class="tab-pane fade" id="two"><!-- Start Tab-->
  187.               <div class="card-body p-3 table-responsive" style="height:680px;" style="height:680px;"><!--Start Tab Set-Up-->
  188.                  
  189.                 <!------ START TEXT ----->
  190.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Personality</span><hr class="mt-1 mb-2">
  191.                 <p class="col-12 pb-3">#</p>
  192.                 <!------ END TEXT ----->
  193.                
  194.                 <!------ START Q&A ----->
  195.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Favourites</span><hr class="mt-1 mb-2">
  196.                 <div class="col-12 row mb-4 p-0 text-center">
  197.                   <div class="col-12 col-lg-6">
  198.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  199.                       <p class="mr-2" style="flex-grow:0;">Snack Food</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  200.                     </div>
  201.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  202.                       <p class="mr-2" style="flex-grow:0;">Meal</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  203.                     </div>
  204.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  205.                       <p class="mr-2" style="flex-grow:0;">Cold Drink</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  206.                     </div>
  207.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  208.                       <p class="mr-2" style="flex-grow:0;">Hot Drink</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  209.                     </div>
  210.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  211.                       <p class="mr-2" style="flex-grow:0;">Animal</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  212.                     </div>
  213.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  214.                       <p class="mr-2" style="flex-grow:0;">Colour</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  215.                     </div>
  216.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  217.                       <p class="mr-2" style="flex-grow:0;">Time Of Day</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  218.                     </div>
  219.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  220.                       <p class="mr-2" style="flex-grow:0;">Season</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  221.                     </div>
  222.                   </div>
  223.                   <div class="col-12 col-lg-6">
  224.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  225.                       <p class="mr-2" style="flex-grow:0;">Holiday</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  226.                     </div>
  227.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  228.                       <p class="mr-2" style="flex-grow:0;">Sport</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  229.                     </div>
  230.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  231.                       <p class="mr-2" style="flex-grow:0;">Song</p><hr style="flex-grow:1;"><span class="ml-2"><a href="#" style="color:#33449B;">Unknown</a></span>
  232.                     </div>
  233.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  234.                       <p class="mr-2" style="flex-grow:0;">Band</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  235.                     </div>
  236.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  237.                       <p class="mr-2" style="flex-grow:0;">Music Genre</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  238.                     </div>
  239.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  240.                       <p class="mr-2" style="flex-grow:0;">Book</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  241.                     </div>
  242.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  243.                       <p class="mr-2" style="flex-grow:0;">Film</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  244.                     </div>
  245.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  246.                       <p class="mr-2" style="flex-grow:0;">Book/Film Genre</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  247.                     </div>
  248.                   </div>
  249.                 </div>
  250.                 <!------ END Q&A ----->
  251.                
  252.                 <!------ START TEXT ----->
  253.                 <div class="col-12 row mb-4">
  254.                   <div class="col-12 col-lg-6 mb-4 text-center">
  255.                     <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Likes</span><hr class="mt-1 mb-2">
  256.                     <p>
  257.                       #<br>
  258.                       #<br>
  259.                       #<br>
  260.                     </p>
  261.                   </div>
  262.                   <div class="col-12 col-lg-6 mb-4 text-center">
  263.                     <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Dislikes</span><hr class="mt-1 mb-2">
  264.                     <p>
  265.                       #<br>
  266.                       #<br>
  267.                       #<br>
  268.                     </p>
  269.                   </div>
  270.                 </div>
  271.                 <!------ END TEXT ----->
  272.                
  273.                 <!------ START TEXT ----->
  274.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Pass-Times</span><hr class="mt-1 mb-2">
  275.                 <div class="col-12 row">
  276.                  
  277.                   <div class="col-12">
  278.                     <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">#</span><hr class="mt-1 mb-2">
  279.                     <p class="col-12 pb-3">#</p>
  280.                   </div>
  281.                   <div class="col-12">
  282.                     <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">#</span><hr class="mt-1 mb-2">
  283.                     <p class="col-12 pb-3">#</p>
  284.                   </div>
  285.                   <div class="col-12">
  286.                     <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">#</span><hr class="mt-1 mb-2">
  287.                     <p class="col-12 pb-3">#</p>
  288.                   </div>
  289.                  
  290.                 </div>
  291.                 <!------ END TEXT ----->
  292.  
  293.               </div><!--End Tab Set-Up-->
  294.             </div><!-- End Tab -->
  295.             <!------------------------------- END TAB 2 -------------------------------->
  296.            
  297.             <!------------------------------- START TAB 3 -------------------------------->
  298.             <div class="tab-pane fade" id="three"><!-- Start Tab-->
  299.               <div class="card-body p-3 table-responsive" style="height:680px;"><!--Start Tab Set-Up-->
  300.                
  301.                 <!------ START TEXT ----->
  302.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Story-Name</span><hr class="mt-1 mb-2">
  303.                 <p class="pb-3">#</p>
  304.                 <!------ END TEXT ----->
  305.                
  306.               </div><!--End Tab Set-Up-->
  307.             </div><!-- End Tab -->
  308.             <!------------------------------- END TAB 3 -------------------------------->
  309.              
  310.             <!------------------------------- START TAB 4 -------------------------------->
  311.             <div class="tab-pane fade" id="four"><!-- Start Tab-->
  312.               <div class="card-body p-3 table-responsive" style="height:680px;"><!--Start Tab Set-Up-->
  313.                
  314.                 <!------ START TEXT ----->
  315.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Pre-Release</span><hr class="mt-1 mb-2">
  316.                 <p>#</p>
  317.                 <p style="color:#131635;">-</p>
  318.                 <!------ END TEXT ----->
  319.                
  320.                 <!------ START TEXT ----->
  321.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Release</span><hr class="mt-1 mb-2">
  322.                 <p>#</p>
  323.                 <p style="color:#131635;">-</p>
  324.                 <!------ END TEXT ----->
  325.                
  326.                 <!------ START TEXT ----->
  327.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">(Specific Year(s))</span><hr class="mt-1 mb-2">
  328.                 <p>#</p>
  329.                 <p style="color:#131635;">-</p>
  330.                 <!------ END TEXT ----->
  331.                
  332.               </div><!--End Tab Set-Up-->
  333.             </div><!-- End Tab -->
  334.             <!------------------------------- END TAB 4 -------------------------------->
  335.            
  336.             <!------------------------------- START TAB 5 -------------------------------->
  337.             <div class="tab-pane fade" id="five"><!-- Start Tab-->
  338.               <div class="card-body p-3 table-responsive" style="height:680px;"><!--Start Tab Set-Up-->
  339.                
  340.                 <!------ START IMAGE ------>
  341.                 <div class="card bg-transparent border-0 rounded-0" style="max-width:600px; margin-left:auto; margin-right:auto;">
  342.                   <img src="#">
  343.                   <a href="#" data-toggle="tooltip" title="Full Size" style="color:#FFFFFF; position:absolute; top:3px; right:7px; font-size:1.4rem"> <i class="fas fa-roller-coaster"></i></a>
  344.                 </div>
  345.                 <!------ END IMAGE ------>
  346.                
  347.                 <!------------------------------- START COLOUR-PALETTE -------------------------------->
  348.                 <div class="col-12 my-3 px-0" style="border:#000000 4px solid;">
  349.                   <ul class="nav nav-justified" style="font-size:1rem;">
  350.                     <li class="nav-item m-0" style="color:#33449B; font-size:1rem; background:#33449B;">I</li>
  351.                     <li class="nav-item m-0" style="background:#33449B;"></li>
  352.                     <!-- Copy and paste the 2ND LINE ONLY just above this comment to add more! -->
  353.                   </ul>
  354.                 </div>
  355.                 <!------------------------------- END COLOUR-PALETTE -------------------------------->
  356.                  
  357.                 <div class="row my-3" style="max-width:700px; margin-left:auto; margin-right:auto">
  358.                  
  359.                   <!------ START DESIGN NOTES ------>
  360.                   <div class="col-12 col-xl-5 mt-2 mb-3 mb-xl-0">
  361.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  362.                       <p class="mr-2" style="flex-grow:0;">Hair-Type</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  363.                     </div>
  364.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  365.                       <p class="mr-2" style="flex-grow:0;">Hair-Length</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  366.                     </div>
  367.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  368.                       <p class="mr-2" style="flex-grow:0;">Hair-Colour</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  369.                     </div>
  370.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  371.                       <p class="mr-2" style="flex-grow:0;">Eye-Colour</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  372.                     </div>
  373.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  374.                       <p class="mr-2" style="flex-grow:0;">Eye-Vibe</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  375.                     </div>
  376.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  377.                       <p class="mr-2" style="flex-grow:0;">Body-Type</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  378.                     </div>
  379.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  380.                       <p class="mr-2" style="flex-grow:0;">Skin-Tone</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  381.                     </div>
  382.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  383.                       <p class="mr-2" style="flex-grow:0;">Height</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  384.                     </div>
  385.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  386.                       <p class="mr-2" style="flex-grow:0;">Weight</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  387.                     </div>
  388.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  389.                       <p class="mr-2" style="flex-grow:0;">Piercings</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  390.                     </div>
  391.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  392.                       <p class="mr-2" style="flex-grow:0;">Tattoos</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  393.                     </div>
  394.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  395.                       <p class="mr-2" style="flex-grow:0;">Clothing-Style</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  396.                     </div>
  397.                     <div class="d-flex mt-2" style="flex-direction:row; align-items:center;">
  398.                       <p class="mr-2" style="flex-grow:0;">Presentation</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  399.                     </div>
  400.                   </div>
  401.                   <!------ END DESIGN NOTES ------>
  402.                  
  403.                   <!------ START EXTRA NOTES ------>
  404.                   <div class="col-12 col-xl-7">
  405.                     <span style="color:#33449B; font-size:1.4rem;"> Extra Notes</span><hr class="mt-0 mb-2">
  406.                     <ul>
  407.                       <li>Some of his body parts and accessories correlate to certain parts of his ride experience. Interacting with them can cause damage/changes to the rollercoaster itself. These are:</li>
  408.                       <ul>
  409.                         <li>#</li>
  410.                       </ul>
  411.                       <li>#</li>
  412.                     </ul>
  413.                   </div>
  414.                   <!------ END EXTRA NOTES ------>
  415.                  
  416.                 </div>
  417.                
  418.               </div><!--End Tab Set-Up-->
  419.             </div><!-- End Tab -->
  420.             <!------------------------------- END TAB 5 -------------------------------->
  421.              
  422.             <!------------------------------- START TAB 6 -------------------------------->
  423.             <div class="tab-pane fade" id="six"><!-- Start Tab-->
  424.               <div class="card-body p-3 table-responsive" style="height:680px;"><!--Start Tab Set-Up-->
  425.                
  426.                 <!-- START MATEY -->
  427.                 <div class="row">
  428.                   <div class="col-12 col-sm-9 col-md-8 col-xl-9 order-2 order-sm-1">
  429.                     <a href="#" style="font-size:1.2rem; color:#33449B">#</a>
  430.                     <span class="pull-right" style="font-size:1.2rem; color:#33449B">#</span><hr class="mt-0 mb-2">
  431.                     <p>#</p>
  432.                     <p style="color:#131635;">-</p>
  433.                   </div>
  434.                   <div class="col-12 col-sm-3 col-md-4 col-xl-3 mb-2 mb-sm-0 order-1 order-sm-2">
  435.                     <div class="card bg-transparent border-0" style="max-width:150px; margin-left:auto; margin-right:auto;">
  436.                       <a data-toggle="tooltip" href="#"><img src="#"></a>
  437.                     </div>
  438.                   </div>
  439.                 </div>
  440.                 <!-- END MATEY -->
  441.                
  442.                 <!-- START MATEY -->
  443.                 <div class="row">
  444.                   <div class="col-12 col-sm-9 col-md-8 col-xl-9 order-2 order-sm-1">
  445.                     <a href="#" style="font-size:1.2rem; color:#33449B">#</a>
  446.                     <span class="pull-right" style="font-size:1.2rem; color:#33449B">#</span><hr class="mt-0 mb-2">
  447.                     <p>#</p>
  448.                     <p style="color:#131635;">-</p>
  449.                   </div>
  450.                   <div class="col-12 col-sm-3 col-md-4 col-xl-3 mb-2 mb-sm-0 order-1 order-sm-2">
  451.                     <div class="card bg-transparent border-0" style="max-width:150px; margin-left:auto; margin-right:auto;">
  452.                       <a data-toggle="tooltip" href="#"><img src="#"></a>
  453.                     </div>
  454.                   </div>
  455.                 </div>
  456.                 <!-- END MATEY -->
  457.                
  458.                 <!-- START MATEY -->
  459.                 <div class="row">
  460.                   <div class="col-12 col-sm-9 col-md-8 col-xl-9 order-2 order-sm-1">
  461.                     <a href="#" style="font-size:1.2rem; color:#33449B">#</a>
  462.                     <span class="pull-right" style="font-size:1.2rem; color:#33449B">#</span><hr class="mt-0 mb-2">
  463.                     <p>#</p>
  464.                     <p style="color:#131635;">-</p>
  465.                   </div>
  466.                   <div class="col-12 col-sm-3 col-md-4 col-xl-3 mb-2 mb-sm-0 order-1 order-sm-2">
  467.                     <div class="card bg-transparent border-0" style="max-width:150px; margin-left:auto; margin-right:auto;">
  468.                       <a data-toggle="tooltip" href="#"><img src="#"></a>
  469.                     </div>
  470.                   </div>
  471.                 </div>
  472.                 <!-- END MATEY -->
  473.                
  474.               </div><!--End Tab Set-Up-->
  475.             </div><!-- End Tab -->
  476.             <!------------------------------- END TAB 6 -------------------------------->
  477.            
  478.             <!------------------------------- START TAB 7 -------------------------------->
  479.             <div class="tab-pane fade" id="seven"><!-- Start Tab-->
  480.               <div class="card-body p-3 table-responsive" style="height:680px;"><!--Start Tab Set-Up-->
  481.                
  482.                 <!------ START TRIVIA ----->
  483.                 <div class="col-12 row mb-2 pb-3 p-0 text-center">
  484.                   <div class="col-12 col-lg-6">
  485.                     <div class="d-flex" style="flex-direction:row; align-items:center;">
  486.                       <p class="mr-2" style="flex-grow:0;">Created By</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  487.                     </div>
  488.                     <div class="d-flex" style="flex-direction:row; align-items:center;">
  489.                       <p class="mr-2" style="flex-grow:0;">Designed By</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  490.                     </div>
  491.                     <div class="d-flex" style="flex-direction:row; align-items:center;">
  492.                       <p class="mr-2" style="flex-grow:0;">Assosciated Lore By</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  493.                     </div>
  494.                     <div class="d-flex" style="flex-direction:row; align-items:center;">
  495.                       <p class="mr-2" style="flex-grow:0;">Character Arc By</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  496.                     </div>
  497.                   </div>
  498.                   <div class="col-12 col-lg-6">
  499.                     <div class="d-flex" style="flex-direction:row; align-items:center;">
  500.                       <p class="mr-2" style="flex-grow:0;">Created At</p><hr style="flex-grow:1;"><span class="ml-2">#</span>
  501.                     </div>
  502.                   </div>
  503.                 </div>
  504.                 <!------ END TRIVIA ----->
  505.                
  506.                 <!------ START TEXT ----->
  507.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Canon Trivia</span><hr class="mt-1 mb-2">
  508.                 <ul class="pb-3">
  509.                   <li>#</li>
  510.                 </ul>
  511.                 <!------ END TEXT ----->
  512.                
  513.                 <!------ START TEXT ----->
  514.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">"Word-Of-God" Trivia</span><hr class="mt-1 mb-2">
  515.                 <ul class="pb-3">
  516.                   <li>#</li>
  517.                 </ul>
  518.                 <!------ END TEXT ----->
  519.                
  520.                 <!------ START TEXT ----->
  521.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Developmental Trivia</span><hr class="mt-1 mb-2">
  522.                 <ul class="pb-3">
  523.                   <li>#</li>
  524.                 </ul>
  525.                 <!------ END TEXT ----->
  526.                
  527.                 <!------ START TEXT ----->
  528.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Coaster Trivia</span><hr class="mt-1 mb-2">
  529.                 <ul class="pb-3">
  530.                   <li>#</li>
  531.                 </ul>
  532.                 <!------ END TEXT ----->
  533.                
  534.                 <!------ START TEXT ----->
  535.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Retcons/Mistakes</span><hr class="mt-1 mb-2">
  536.                 <ul class="pb-3">
  537.                   <li>#</li>
  538.                 </ul>
  539.                 <!------ END TEXT ----->
  540.                
  541.                 <!------ START AWARDS ----->
  542.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">Awards Cabinet</span><hr class="mt-1 mb-2">
  543.                 <div class="col-12">
  544.                   <div class="row p-3" style="text-align:center;">
  545.                    
  546.                     <!-- Award -->
  547.                     <div class="tooltipster px-3 pb-3" title="【 # 】"><a href="#">
  548.                     <img src="#" class="tooltipster" width="50" height="50" data-placement="bottom" title="#"></a></div>
  549.                     <!-- Award -->
  550.                    
  551.                   </div>
  552.                 </div>
  553.                 <!------ END AWARDS ----->
  554.                
  555.               </div><!--End Tab Set-Up-->
  556.             </div><!-- End Tab -->
  557.             <!------------------------------- END TAB 7 -------------------------------->
  558.            
  559.             <!------------------------------- START TAB 8 -------------------------------->
  560.             <div class="tab-pane fade" id="eight"><!-- Start Tab-->
  561.               <div class="card-body p-3 table-responsive" style="height:680px;"><!--Start Tab Set-Up-->
  562.                
  563.                 <!------ START TEXT ----->
  564.                 <span style="color:#33449B; font-family:'comic sans ms'; font-size:1.4rem;">#</span><hr class="mt-1 mb-2">
  565.                 <p class="pb-3">#</p>
  566.                 <!------ END TEXT ----->
  567.                
  568.               </div><!--End Tab Set-Up-->
  569.             </div><!-- End Tab -->
  570.             <!------------------------------- END TAB 8 -------------------------------->
  571.              
  572.             </div>
  573.           </div>
  574.           <!------------------------------- END INFO -------------------------------->
  575.          
  576.         </div>
  577.         <!------------------------------- END MIDDLE SECTION -------------------------------->
  578.      
  579.       <!------------------------------- START GALLERY-BUTTON -------------------------------->
  580.       <div class="col-12 py-3 text-center" style="background-color:#33449B; border-top:none; border-left:#000000 8px solid; border-right:#000000 8px solid; border-bottom:#000000 8px solid;">
  581.         <a href="#" style="color:#FFFFFF; font-size:1.4rem;"><i class="fas fa-roller-coaster fa-flip-horizontal"></i> GALLERY <i class="fas fa-roller-coaster"></i></li>
  582.       </div>
  583.       <!------------------------------- END GALLERY-BUTTON -------------------------------->
  584.      
  585.       <!------------------------------- START CREDITS LIST -------------------------------->
  586.       <div class="col-12 py-2 text-center" style="font-size:1.2rem; background-color:#33449B; border-top:none; border-left:#000000 8px solid; border-right:#000000 8px solid; border-bottom:#000000 8px solid;">
  587.        
  588.         <a href="#" data-toggle="tooltip" title="Header Image Source"><span style="color:#FFFFFF;"><i class="fas fa-roller-coaster fa-flip-horizontal"></i></span></a>
  589.         <a href="https://toyhou.se/16006417.overlay" data-toggle="tooltip" title="Header Code Frankensteined From: CuckooHoopoe"><span style="color:#FFFFFF;"><i class="fas fa-roller-coaster fa-flip-horizontal"></i></span></a>
  590.         <a href="https://toyhou.se/21470022.galactica" data-toggle="tooltip" title="Code By: TomcatCodes / CrispinAsheYA"><span style="color:#FFFFFF;"><i class="fas fa-star"></i></span></a>
  591.         <a href="#" data-toggle="tooltip" title="Logo Source"><span style="color:#FFFFFF;"><i class="fas fa-roller-coaster"></i></span></a>
  592.         <a href="https://toyhou.se/15560571.ribbon-repository-upd8-2-14-" data-toggle="tooltip" title="Ribbon Awards From: RadioStorage"><span style="color:#FFFFFF;"><i class="fas fa-roller-coaster"></i></span></a>
  593.        
  594.       </div>
  595.       <!------------------------------- END CREDITS LIST -------------------------------->
  596.      
  597.      
  598.     </div>
  599.   </div>
  600.   <!------------------------------- END ACTUAL CODE -------------------------------->
  601.  
  602. </div> <!-- End Background -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!