Advertisement
LivvyAh

MODULAR: Tabs 1.0-ReColor

Feb 13th, 2022 (edited)
156
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.98 KB | None | 0 0
  1. <!-- TABS START
  2. Oh god this is so fragile, really don't use this if you can't navigate a code with some level of competence.
  3. PLEASE pay attention to these header notes as you move around.
  4. This module ALWAYS looks broken in code editors, check how it looks on your actual profile before you give up on it!
  5.  
  6. You can technically put Any of the modules in here but image modules will have some box stuff around them, especially the Ref Image module. You can also put multiple modules in the same tab. Probably don't put another tabs in though? I haven't tried but I think that would not work lol.
  7.  
  8. Just be mindful yknow.
  9. -->
  10. <div class="container-fluid px-0" style="max-width: 750px; letter-spacing: .45px;">
  11. <div class="row">
  12. <div class="col-12 p-2">
  13. <!--HEADER IMAGE -->
  14. <ul class="nav" style="background: url(IMG HERE);
  15. background-size: cover;
  16. background-position: center;
  17. background-attachment: fixed;
  18. background-color:#E1DDE3">
  19. <!--NAV TABS START
  20. Please for the love of god don't add new tabs, it will break things and will make mobile users cry really hard.
  21. Just change the titles.
  22. If you want more things to be in tabs, just add another Tab module. Maybe put a few Images Modules inbetween. It'll be better that way.
  23. Again, don't add more tabs, you're just gonna break it. -->
  24. <li class="nav-item">
  25. <a class="nav-link active text-uppercase" data-toggle="tab" style="letter-spacing:3px;background-color:#F1DAC4;color:#0D0C1D" href="#TAB1">
  26. TITLE 1
  27. </a>
  28. </li>
  29. <li class="nav-item">
  30. <a class="nav-link text-uppercase " data-toggle="tab" style="letter-spacing:3px;background-color:#F1DAC4;color:#0D0C1D" href="#TAB2">
  31. TITLE 2
  32. </a>
  33. </li>
  34. <li class="nav-item">
  35. <a class="nav-link text-uppercase " data-toggle="tab" style="letter-spacing:3px;background-color:#F1DAC4;color:#0D0C1D" href="#TAB3">
  36. TITLE 3
  37. </a>
  38. </li>
  39. <!--NAV TABS END -->
  40. <div class="tab-content p-2" style="background-color:#F1DAC4">
  41. <!--TAB1 START
  42. This is the tab that's open on default, jsyk-->
  43. <div id="TAB1" class="tab-pane fade active show" style="background-color:#F1DAC4">
  44. <!--PASTE ENTIRE MODULE HERE, DON'T CUT ANYTHING!!!!-->
  45. </div>
  46. <!--TAB1 END-->
  47. <!--TAB2 START-->
  48. <div id="TAB2" class="tab-pane fade" style="background-color:#F1DAC4">
  49. <!--PASTE ENTIRE MODULE HERE, DON'T CUT ANYTHING!!!!-->
  50. </div>
  51. <!--TAB2 END-->
  52. <!--TAB3 START-->
  53. <div id="TAB3" class="tab-pane fade" style="background-color:#F1DAC4">
  54. <!--PASTE ENTIRE MODULE HERE, DON'T CUT ANYTHING!!!!-->
  55. </div>
  56. <!--TAB3 END-->
  57. </div>
  58. </div>
  59. </div>
  60. </div>
  61. <!--TABS END -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement