API tools faq
paste
kaliforhnia

spotify (2: scroll)

kaliforhnia
Sep 22nd, 2018
3,793
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.74 KB | None | 0 0
raw download clone embed print report
  1. <div style="margin:auto;width:350px;height:530px;">
  2. <div style="float:left;width:320px;height:520px;border:1px solid #000;border-radius:10px;">
  3.  
  4. <div style="float:left;width:318px;height:250px;background-color:#828282;border-radius:10px 10px 0px 0px;">
  5.  
  6. <div style="float:left;width:320px;margin-top:5px;"><div style="font-family:calibri;text-transform:uppercase;font-size:18px;letter-spacing:-0.5px;color:#1db954;text-align:center;"><b>username</b></div></div>
  7.  
  8. <div style="float:left;margin:5px;width:310px;height:170px;">
  9. <div style="float:left;width:310px;height:170px;overflow:hidden;">
  10. <div style="width:330px;height:170px;overflow:auto;">
  11. <div style="width:310px;">
  12.  
  13. <div style="float:left;width:310px;height:170px;"><div style="text-align:center;color:#000;font-family:calibri;text-transform:uppercase;font-size:9px;margin-top:60px;line-height:9px;">insert quote or status here. not overflow, try to keep to a few lines.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus porttitor nunc urna, et ornare nibh hendrerit nec.</div>
  14. <div style="text-align:center;color:#000;font-family:calibri;text-transform:uppercase;font-size:9px;margin-top:10px;line-height:9px;">▼</div></div>
  15.  
  16. <div style="float:left;width:300px;height:160px;background-color:#000;margin-left:5px;margin-top:0px;">
  17. <div style="float:left;width:290px;height:110px;overflow:hidden;margin:5px;">
  18. <div style="width:310px;height:110px;overflow:auto;">
  19. <div style="width:290px;">
  20. <div style="font-style:calibri;text-transform:uppercase;font-size:8px;line-height:8px;color:#fff;text-align:justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vitae viverra mi. Donec rhoncus ligula et purus interdum fringilla. Phasellus sodales dapibus dolor vel ultrices. Ut ut lorem nec ligula eleifend convallis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed eget tortor elit. Pellentesque vehicula porta sollicitudin. Maecenas mi quam, ultricies vel lacus id, consequat convallis risus. Mauris a velit facilisis, pretium turpis sit amet, consectetur lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet odio nulla. Aliquam ac libero dui. Curabitur eu tempus odio. Duis porta mi eu felis pellentesque tempus. Nam scelerisque metus porttitor, fringilla enim id, volutpat lacus. Morbi sed congue enim, at tempor eros. Morbi ut massa sit amet velit pellentesque bibendum. Suspendisse quis ligula turpis. Sed vitae aliquam sapien, quis porta libero. Pellentesque pretium libero at placerat pretium. Nullam massa purus, lobortis sit amet diam vitae, eleifend tempor est. Aliquam orci justo, finibus ut laoreet ut, luctus a leo.</div>
  21. </div></div></div>
  22. <div style="float:left;width:290px;height:30px;background-color:#1db954;border-radius:5px;margin:5px;">
  23. <div style="float:left;width:20px;height:20px;border-radius:100%;background-color:#000;margin:5px;"><div style="font-family:calibri;font-size:9px;color:#1db954;text-align:center;margin-top:4px;"><b>#01</b></div></div>
  24. <div style="float:right;font-family:calibri;text-transform:uppercase;font-size:9px;color:#000;margin:9px 5px;"><b>section title</b></div></div></div>
  25.  
  26. <div style="float:left;width:300px;height:160px;background-color:#000;margin-left:5px;margin-top:10px;">
  27. <div style="float:left;width:290px;height:110px;overflow:hidden;margin:5px;">
  28. <div style="width:310px;height:110px;overflow:auto;">
  29. <div style="width:290px;">
  30. <div style="font-style:calibri;text-transform:uppercase;font-size:8px;line-height:8px;color:#fff;text-align:justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vitae viverra mi. Donec rhoncus ligula et purus interdum fringilla. Phasellus sodales dapibus dolor vel ultrices. Ut ut lorem nec ligula eleifend convallis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed eget tortor elit. Pellentesque vehicula porta sollicitudin. Maecenas mi quam, ultricies vel lacus id, consequat convallis risus. Mauris a velit facilisis, pretium turpis sit amet, consectetur lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet odio nulla. Aliquam ac libero dui. Curabitur eu tempus odio. Duis porta mi eu felis pellentesque tempus. Nam scelerisque metus porttitor, fringilla enim id, volutpat lacus. Morbi sed congue enim, at tempor eros. Morbi ut massa sit amet velit pellentesque bibendum. Suspendisse quis ligula turpis. Sed vitae aliquam sapien, quis porta libero. Pellentesque pretium libero at placerat pretium. Nullam massa purus, lobortis sit amet diam vitae, eleifend tempor est. Aliquam orci justo, finibus ut laoreet ut, luctus a leo.</div>
  31. </div></div></div>
  32. <div style="float:left;width:290px;height:30px;background-color:#1db954;border-radius:5px;margin:5px;">
  33. <div style="float:left;width:20px;height:20px;border-radius:100%;background-color:#000;margin:5px;"><div style="font-family:calibri;font-size:9px;color:#1db954;text-align:center;margin-top:4px;"><b>#02</b></div></div>
  34. <div style="float:right;font-family:calibri;text-transform:uppercase;font-size:9px;color:#000;margin:9px 5px;"><b>section title</b></div></div></div>
  35.  
  36. <div style="float:left;width:300px;height:160px;background-color:#000;margin-left:5px;margin-top:10px;">
  37. <div style="float:left;width:290px;height:110px;overflow:hidden;margin:5px;">
  38. <div style="width:310px;height:110px;overflow:auto;">
  39. <div style="width:290px;">
  40. <div style="font-style:calibri;text-transform:uppercase;font-size:8px;line-height:8px;color:#fff;text-align:justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vitae viverra mi. Donec rhoncus ligula et purus interdum fringilla. Phasellus sodales dapibus dolor vel ultrices. Ut ut lorem nec ligula eleifend convallis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed eget tortor elit. Pellentesque vehicula porta sollicitudin. Maecenas mi quam, ultricies vel lacus id, consequat convallis risus. Mauris a velit facilisis, pretium turpis sit amet, consectetur lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet odio nulla. Aliquam ac libero dui. Curabitur eu tempus odio. Duis porta mi eu felis pellentesque tempus. Nam scelerisque metus porttitor, fringilla enim id, volutpat lacus. Morbi sed congue enim, at tempor eros. Morbi ut massa sit amet velit pellentesque bibendum. Suspendisse quis ligula turpis. Sed vitae aliquam sapien, quis porta libero. Pellentesque pretium libero at placerat pretium. Nullam massa purus, lobortis sit amet diam vitae, eleifend tempor est. Aliquam orci justo, finibus ut laoreet ut, luctus a leo.</div>
  41. </div></div></div>
  42. <div style="float:left;width:290px;height:30px;background-color:#1db954;border-radius:5px;margin:5px;">
  43. <div style="float:left;width:20px;height:20px;border-radius:100%;background-color:#000;margin:5px;"><div style="font-family:calibri;font-size:9px;color:#1db954;text-align:center;margin-top:4px;"><b>#03</b></div></div>
  44. <div style="float:right;font-family:calibri;text-transform:uppercase;font-size:9px;color:#000;margin:9px 5px;"><b>section title</b></div></div></div>
  45. </div></div></div></div></div>
  46.  
  47. <div style="float:left;width:310px;height:185px;margin-left:5px;margin-top:70px;">
  48. <div style="float:left;width:310px;height:185px;overflow:hidden;">
  49. <div style="width:330px;height:185px;overflow:auto;">
  50. <div style="width:310px;">
  51. <div style="float:left;width:308px;border-bottom:1px solid #ecebe8;">
  52. <div style="float:left;width:90px;height:85px;">
  53. <div style="float:left;width:80px;height:80px;border:1px solid #1db954;"><img alt="" src="https://66.media.tumblr.com/f72295538937f5e6db54d1ecf5f2e9c6/tumblr_p5orau9JTw1wc6zt3o1_1280.jpg" style="height:70px;width:70px;margin:4px;" title="song 1" /></div>
  54.  
  55. <div style="background:#1db954;width:30px;height:30px;float:left;margin-left:-55px;margin-top:25px;border-radius:100%;overflow:hidden;"><iframe frameborder="0" height="30" scrolling="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/480069207&amp;color=1db954&amp;inverse=false&amp;&amp;show_user=true" width="100%"></iframe></div>
  56. </div>
  57.  
  58. <div style="float:left;width:215px;margin-top:10px;">
  59. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>artist&#39;s name</b><span style="float:right;color:#1db954;">song title</span></div>
  60. </div>
  61.  
  62. <div style="float:left;width:215px;margin-top:5px;">
  63. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>rating</b><span style="float:right;color:#1db954;">★★★★★</span></div>
  64. </div>
  65.  
  66. <div style="float:left;width:215px;margin-top:5px;">
  67. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#828282;line-height:9px;text-align:justify;">❝ quote from song, max two lines. lorem ipsum dolor sit amet consectetur ❞</div>
  68. </div>
  69. </div>
  70.  
  71. <div style="float:left;width:308px;border-bottom:1px solid #ecebe8;margin-top:5px;">
  72. <div style="float:left;width:90px;height:85px;">
  73. <div style="float:left;width:80px;height:80px;border:1px solid #1db954;"><img alt="" src="https://66.media.tumblr.com/65aa38ff9543bf50f510a3e5f100e73f/tumblr_p5orau9JTw1wc6zt3o3_1280.jpg" style="height:70px;width:70px;margin:4px;" title="song 2" /></div>
  74.  
  75. <div style="background:#1db954;width:30px;height:30px;float:left;margin-left:-55px;margin-top:25px;border-radius:100%;overflow:hidden;"><iframe frameborder="0" height="30" scrolling="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/480069207&amp;color=1db954&amp;inverse=false&amp;&amp;show_user=true" width="100%"></iframe></div>
  76. </div>
  77.  
  78. <div style="float:left;width:215px;margin-top:10px;">
  79. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>artist&#39;s name</b><span style="float:right;color:#1db954;">song title</span></div>
  80. </div>
  81.  
  82. <div style="float:left;width:215px;margin-top:5px;">
  83. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>rating</b><span style="float:right;color:#1db954;">★★★★★</span></div>
  84. </div>
  85.  
  86. <div style="float:left;width:215px;margin-top:5px;">
  87. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#828282;line-height:9px;text-align:justify;">❝ quote from song, max two lines. lorem ipsum dolor sit amet consectetur ❞</div>
  88. </div>
  89. </div>
  90.  
  91. <div style="float:left;width:308px;border-bottom:1px solid #ecebe8;margin-top:5px;">
  92. <div style="float:left;width:90px;height:85px;">
  93. <div style="float:left;width:80px;height:80px;border:1px solid #1db954;"><img alt="" src="https://66.media.tumblr.com/3d6153a41361bb045baca481b5acf2c0/tumblr_p5orau9JTw1wc6zt3o4_1280.jpg" style="height:70px;width:70px;margin:4px;" title="song 3" /></div>
  94.  
  95. <div style="background:#1db954;width:30px;height:30px;float:left;margin-left:-55px;margin-top:25px;border-radius:100%;overflow:hidden;"><iframe frameborder="0" height="30" scrolling="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/480069207&amp;color=1db954&amp;inverse=false&amp;&amp;show_user=true" width="100%"></iframe></div>
  96. </div>
  97.  
  98. <div style="float:left;width:215px;margin-top:10px;">
  99. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>artist&#39;s name</b><span style="float:right;color:#1db954;">song title</span></div>
  100. </div>
  101.  
  102. <div style="float:left;width:215px;margin-top:5px;">
  103. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>rating</b><span style="float:right;color:#1db954;">★★★★★</span></div>
  104. </div>
  105.  
  106. <div style="float:left;width:215px;margin-top:5px;">
  107. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#828282;line-height:9px;text-align:justify;">❝ quote from song, max two lines. lorem ipsum dolor sit amet consectetur ❞</div>
  108. </div>
  109. </div>
  110.  
  111. <div style="float:left;width:308px;border-bottom:1px solid #ecebe8;margin-top:5px;">
  112. <div style="float:left;width:90px;height:85px;">
  113. <div style="float:left;width:80px;height:80px;border:1px solid #1db954;"><img alt="" src="https://66.media.tumblr.com/3a23c50c6fd8f3eeac4b574f3be45906/tumblr_p5orau9JTw1wc6zt3o6_1280.jpg" style="height:70px;width:70px;margin:4px;" title="song 4" /></div>
  114.  
  115. <div style="background:#1db954;width:30px;height:30px;float:left;margin-left:-55px;margin-top:25px;border-radius:100%;overflow:hidden;"><iframe frameborder="0" height="30" scrolling="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/480069207&amp;color=1db954&amp;inverse=false&amp;&amp;show_user=true" width="100%"></iframe></div>
  116. </div>
  117.  
  118. <div style="float:left;width:215px;margin-top:10px;">
  119. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>artist&#39;s name</b><span style="float:right;color:#1db954;">song title</span></div>
  120. </div>
  121.  
  122. <div style="float:left;width:215px;margin-top:5px;">
  123. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>rating</b><span style="float:right;color:#1db954;">★★★★★</span></div>
  124. </div>
  125.  
  126. <div style="float:left;width:215px;margin-top:5px;">
  127. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#828282;line-height:9px;text-align:justify;">❝ quote from song, max two lines. lorem ipsum dolor sit amet consectetur ❞</div>
  128. </div>
  129. </div>
  130.  
  131. <div style="float:left;width:308px;border-bottom:1px solid #ecebe8;margin-top:5px;">
  132. <div style="float:left;width:90px;height:85px;">
  133. <div style="float:left;width:80px;height:80px;border:1px solid #1db954;"><img alt="" src="https://66.media.tumblr.com/7abe81dae67b4e99abf472790e5185b6/tumblr_p5orau9JTw1wc6zt3o7_1280.jpg" style="height:70px;width:70px;margin:4px;" title="song 5" /></div>
  134.  
  135. <div style="background:#1db954;width:30px;height:30px;float:left;margin-left:-55px;margin-top:25px;border-radius:100%;overflow:hidden;"><iframe frameborder="0" height="30" scrolling="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/480069207&amp;color=1db954&amp;inverse=false&amp;&amp;show_user=true" width="100%"></iframe></div>
  136. </div>
  137.  
  138. <div style="float:left;width:215px;margin-top:10px;">
  139. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>artist&#39;s name</b><span style="float:right;color:#1db954;">song title</span></div>
  140. </div>
  141.  
  142. <div style="float:left;width:215px;margin-top:5px;">
  143. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>rating</b><span style="float:right;color:#1db954;">★★★★★</span></div>
  144. </div>
  145.  
  146. <div style="float:left;width:215px;margin-top:5px;">
  147. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#828282;line-height:9px;text-align:justify;">❝ quote from song, max two lines. lorem ipsum dolor sit amet consectetur ❞</div>
  148. </div>
  149. </div>
  150.  
  151. <div style="float:left;width:308px;margin-top:5px;">
  152. <div style="float:left;width:90px;height:85px;">
  153. <div style="float:left;width:80px;height:80px;border:1px solid #1db954;"><img alt="" src="https://66.media.tumblr.com/bde95173743bae628acdf550cd761392/tumblr_p5orau9JTw1wc6zt3o9_540.jpg" style="height:70px;width:70px;margin:4px;" title="song 6" /></div>
  154.  
  155. <div style="background:#1db954;width:30px;height:30px;float:left;margin-left:-55px;margin-top:25px;border-radius:100%;overflow:hidden;"><iframe frameborder="0" height="30" scrolling="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/480069207&amp;color=1db954&amp;inverse=false&amp;&amp;show_user=true" width="100%"></iframe></div>
  156. </div>
  157.  
  158. <div style="float:left;width:215px;margin-top:10px;">
  159. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>artist&#39;s name</b><span style="float:right;color:#1db954;">song title</span></div>
  160. </div>
  161.  
  162. <div style="float:left;width:215px;margin-top:5px;">
  163. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#000;"><b>rating</b><span style="float:right;color:#1db954;">★★★★★</span></div>
  164. </div>
  165.  
  166. <div style="float:left;width:215px;margin-top:5px;">
  167. <div style="font-family:calibri;text-transform:uppercase;font-size:10px;color:#828282;line-height:9px;text-align:justify;">❝ quote from song, max two lines. lorem ipsum dolor sit amet consectetur ❞</div>
  168. </div>
  169. </div>
  170. </div>
  171. </div>
  172. </div>
  173. </div>
  174.  
  175. <div style="float:left;width:100px;height:100px;border-radius:100%;background-color:#000;margin-top:-295px;margin-left:110px;"><img alt="" src="https://78.media.tumblr.com/92c58201d2ab39a17e8cebe44ccfef7c/tumblr_pf0q575HS11x407gho6_400.png" style="width:100px;height:100px;border-radius:100%;border:1px solid #1db954;">
  176. </div></div>
  177.  
  178. <div style="width:320px;float:left;text-align:right;font-size:7px;line-height:15px;text-transform:uppercase;color:#000;"><a href="https://www.roleplayrepublic.com/roleplay/view_desc/23164/" title="do not remove."><span style="color:#000000;">cr.ᴷ</span></a></div>
  179. </div>
Advertisement
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!