Advertisement
CrispinAsheYA

Explore OC's Bedroom!

Nov 16th, 2023 (edited)
971
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 6.02 KB | Source Code | 0 0
  1. <!-- PLEASE SEE HERE FOR MY CODE RULES: https://toyhou.se/12931952.bonus-content/17098747.03-terms-of-service --
  2.  
  3. Version: 1.0
  4.  
  5. Default Colours
  6. -Text White: #FFFFFF
  7. -Border Black: #000000
  8.  
  9. Scroll To The Bottom for every single "Find & Replace" Variable! (Feel free to move to the top when you turn this into a personal template, I just keep it at the bottom for organisation.)
  10.  
  11. Thank you for reading!
  12. Crispin
  13.  
  14. -->
  15.  
  16. <!-- Start Bedroom Image -->
  17. <div class="mx-auto" style="background:url([IMGBACKGROUND]); background-size:cover; height:600px; width:1192px;">
  18.  
  19.   <!-- Start Star Placements -->
  20.   <ul class="nav">
  21.     <li class="nav-item border-0"><a href="#point1" class="nav-link" data-toggle="tab" style="position:absolute; left:420px; top:280px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  22.     <li class="nav-item border-0"><a href="#point2" class="nav-link" data-toggle="tab" style="position:absolute; left:460px; top:420px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  23.     <li class="nav-item border-0"><a href="#point3" class="nav-link" data-toggle="tab" style="position:absolute; left:480px; top:300px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  24.     <li class="nav-item border-0"><a href="#point4" class="nav-link" data-toggle="tab" style="position:absolute; left:600px; top:200px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  25.     <li class="nav-item border-0"><a href="#point5" class="nav-link" data-toggle="tab" style="position:absolute; left:600px; top:300px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  26.     <li class="nav-item border-0"><a href="#point6" class="nav-link" data-toggle="tab" style="position:absolute; left:760px; top:200px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  27.     <li class="nav-item border-0"><a href="#point7" class="nav-link" data-toggle="tab" style="position:absolute; left:840px; top:200px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  28.     <li class="nav-item border-0"><a href="#point8" class="nav-link" data-toggle="tab" style="position:absolute; left:1000px; top:300px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  29.     <li class="nav-item border-0"><a href="#point9" class="nav-link" data-toggle="tab" style="position:absolute; left:1150px; top:550px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  30.     <li class="nav-item border-0"><a href="#point10" class="nav-link" data-toggle="tab" style="position:absolute; left:900px; top:550px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  31.     <li class="nav-item border-0"><a href="#point11" class="nav-link" data-toggle="tab" style="position:absolute; left:750px; top:550px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  32.     <li class="nav-item border-0"><a href="#point12" class="nav-link" data-toggle="tab" style="position:absolute; left:50px; top:600px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  33.     <li class="nav-item border-0"><a href="#point13" class="nav-link" data-toggle="tab" style="position:absolute; left:100px; top:550px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  34.     <li class="nav-item border-0"><a href="#point14" class="nav-link" data-toggle="tab" style="position:absolute; left:200px; top:450px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  35.     <li class="nav-item border-0"><a href="#point15" class="nav-link" data-toggle="tab" style="position:absolute; left:320px; top:460px; font-size:1.5rem; color:#FFFFFF;"><i class="fas fa-star"></i></a></li>
  36.   </ul>
  37.   <!-- End Star Placements -->
  38.  
  39.   <!-- Start Descriptions -->
  40.   <div style="margin-top:500px;" class="tab-content p-2">
  41.    
  42.     <div class="tab-pane fade bg-dark p-3" id="point1" style="border:#000000 8px solid;">
  43.       <p>[DESCRIPTION]</p>
  44.     </div>
  45.    
  46.     <div class="tab-pane fade bg-dark p-3" id="point2" style="border:#000000 8px solid;">
  47.       <p>[DESCRIPTION]</p>
  48.     </div>
  49.    
  50.     <div class="tab-pane fade bg-dark p-3" id="point3" style="border:#000000 8px solid;">
  51.       <p>[DESCRIPTION]</p>
  52.     </div>
  53.    
  54.     <div class="tab-pane fade bg-dark p-3" id="point4" style="border:#000000 8px solid;">
  55.       <p>[DESCRIPTION]</p>
  56.     </div>
  57.    
  58.     <div class="tab-pane fade bg-dark p-3" id="point5" style="border:#000000 8px solid;">
  59.       <p>[DESCRIPTION]</p>
  60.     </div>
  61.    
  62.     <div class="tab-pane fade bg-dark p-3" id="point6" style="border:#000000 8px solid;">
  63.       <p>[DESCRIPTION]</p>
  64.     </div>
  65.    
  66.     <div class="tab-pane fade bg-dark p-3" id="point7" style="border:#000000 8px solid;">
  67.       <p>[DESCRIPTION]</p>
  68.     </div>
  69.    
  70.     <div class="tab-pane fade bg-dark p-3" id="point8" style="border:#000000 8px solid;">
  71.       <p>[DESCRIPTION]</p>
  72.     </div>
  73.    
  74.     <div class="tab-pane fade bg-dark p-3" id="point9" style="border:#000000 8px solid;">
  75.       <p>[DESCRIPTION]</p>
  76.     </div>
  77.    
  78.     <div class="tab-pane fade bg-dark p-3" id="point10" style="border:#000000 8px solid;">
  79.       <p>[DESCRIPTION]</p>
  80.     </div>
  81.    
  82.     <div class="tab-pane fade bg-dark p-3" id="point11" style="border:#000000 8px solid;">
  83.       <p>[DESCRIPTION]</p>
  84.     </div>
  85.    
  86.     <div class="tab-pane fade bg-dark p-3" id="point12" style="border:#000000 8px solid;">
  87.       <p>[DESCRIPTION]</p>
  88.     </div>
  89.    
  90.     <div class="tab-pane fade bg-dark p-3" id="point13" style="border:#000000 8px solid;">
  91.       <p>[DESCRIPTION]</p>
  92.     </div>
  93.    
  94.     <div class="tab-pane fade bg-dark p-3" id="point14" style="border:#000000 8px solid;">
  95.       <p>[DESCRIPTION]</p>
  96.     </div>
  97.    
  98.   </div>
  99.   <!-- End Descriptions -->
  100.  
  101. </div>
  102. <!-- End Bedroom Image -->
  103.  
  104. <!-- CREDIT, DO NOT REMOVE -->
  105. <p class="text-center"><a href="https://toyhou.se/24397532.explore-ocs-bedroom"><i class="fas fa-code"></i> Code by TomcatCodes / CrispinAsheYA <i class="fas fa-code"></i></a></p>
  106.  
  107. <!--
  108. [IMGBACKGROUND] | [DESCRIPTION]
  109. -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement