LivvyAh

MODULAR: PLAYLIST 1.1-ReColor

Feb 13th, 2022 (edited)
71
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.84 KB | None | 0 0
  1. <!-- PLAYLIST START
  2. Please for the love of god don't do just one song or try to replace the embed. Will break.-->
  3. <div class="row">
  4. <!-- VIDEO START -->
  5. <div class="col p-2">
  6. <div class="p-2 h-100" style="background: url(IMG HERE);
  7. background-size: cover;
  8. background-position: center;
  9. background-attachment: fixed;
  10. background-color:#E1DDE3">
  11. <table style="height: 100%; border-width: 3px; border-color:#5464B6; width:100%;">
  12. <tbody>
  13. <tr>
  14. <td class="align-middle text-center">
  15. <!-- YOUTUBE EMBED START
  16. If you want to change the video height you can here, just know that it's that height on all screen sizes.
  17. Don't touch the width unless u want it to break.-->
  18. <iframe style="border-radius:0rem;width:90%;height:200px;" frameborder="0"
  19. src="https://www.youtube.com/embed/videoseries?list= ">
  20. <!-- HOW TO ADD YOUR PLAYLIST
  21. 1) Go to the playlist. If you go directly into a video click the title on the side.
  22. It should look like this:
  23. https://cdn.discordapp.com/attachments/682715826910003211/721256686324547634/unknown.png
  24. 2) On the url copy everything after " list= "
  25. 3) Paste that string of random symbols to the end of the url above.
  26. 4) You should be good! Congrats!-->
  27. </iframe>
  28. </tr>
  29. </tbody>
  30. </table>
  31. </div>
  32. </div>
  33. <!-- VIDEO END -->
  34. <!-- TRACKLIST START -->
  35. <div class="col-xl-8 col-l-8 col-md-7 col-s-12 col-xs-12 p-2">
  36. <div class="p-3" style="background-color:#F1DAC4">
  37. <div class="text-uppercase d-flex justify-content-between" style="letter-spacing:3px; font-size:20px; color:#0D0C1D">
  38. Playlist
  39. </div>
  40. <hr style="border-color: #474973;" class="w-100">
  41. <div class="table-responsive p-1" style="color:#707EC2">
  42. <p>
  43. <!-- LIST CODE START
  44. -->
  45. <ul>
  46. <li><div style="color:#161B33"><i>"If you want to have cities, You've Got To Build Roads."</i></div></li>
  47. <ul><li><div style="color:#161B33">Comanche - CAKE</div></li></ul>
  48. <li><div style="color:#161B33">two</div></li>
  49. <ul><li><div style="color:#161B33">indented three</div></li></ul>
  50. <li><div style="color:#161B33">four</div></li>
  51. </ul>
  52. </p>
  53. </div>
  54. <!-- LIST CODE END -->
  55. <div style="color:#161B33"> You could even do a description of the story that the playlist or song is taking you through, that's neat. Do know this expands but doesn't scroll. The box will grow to match it but doesn't shrink to match it. If you don't want this plain text just delete it easy peasy.
  56. </p>
  57. </div>
  58. </div>
  59. </div>
  60. <!-- TRACKLIST END -->
  61. </div>
  62. <!-- PLAYLIST END -->
  63.  
Add Comment
Please, Sign In to add comment