API tools faq
paste
hanthesunbeam1

gummy worms {cs}

hanthesunbeam1
Oct 16th, 2020 (edited)
97
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 18.67 KB | None | 0 0
raw download clone embed print report
  1. [comment]if you have any concerns, questions, reach out to me whenever. c: i hope you enjoy this code. [/comment]
  2. [border=0; display: flex; position: relative; box-sizing: border-box; background: var(--bg); max-width: 350px; height: 554px; line-height: 0px; margin: auto; overflow: hidden; padding: 10px; border-radius: 0px; justify-content: flex-start; flex-flow: column nowrap; align-items: center; border-radius: 2px; color: var(--textbody);
  3. --bg: #EBC85E;
  4. --detail3: #FFFAEA;
  5. --tags: #D5A927;
  6. --box: #FFEAAB;
  7. --text: #fff;
  8. --textbody: #000;
  9. --toppic: url(https://i.pinimg.com/474x/0a/b7/0d/0ab70dcc295fc4c0c9b99fbc613af8fa.jpg);
  10. --pic1: url(https://64.media.tumblr.com/7f58324e29847b804e8a52b8d3a0a848/58f2cc67deaa6fd2-f4/s500x750/390eaf2e96c0b0c4d9090780a8c67fee52dba314.jpg);
  11. --pic2: url(https://64.media.tumblr.com/15d510b54ecd297ccc83a0c0da3c5eca/58f2cc67deaa6fd2-e9/s2048x3072/2c488cfaf15b60f1e6c8c4ed60b8e064e62d5a16.jpg);
  12. --pic3: url(https://64.media.tumblr.com/d67f116eff000513431a76b2ecfbeb32/58f2cc67deaa6fd2-f9/s2048x3072/214c5cd1e3077b1a6efe641d4d9a3171aaea5cc8.jpg);
  13. --pic4: url(https://i.pinimg.com/474x/75/55/e8/7555e88a5ae03b50ab1ba1a1e768689e.jpg);]
  14. [border=3px solid var(--detail3); position: relative; box-sizing: border-box; display: flex; border-radius: 2px; width: 100%; height: 30%; padding: 5px; align-items: top; flex-flow: row nowrap; ][comment]
  15.  
  16. ---top scroll box[/comment][border=0; width: 150px; height: 95%; background: var(--box); box-sizing: border-box; padding-top: 0px; margin-bottom: 0px;][border=0; width: 100%; height: 100%; box-sizing: border-box; display: flex; flex-direction: column; overflow: hidden; text-align: justify; padding: 0px; margin-top: 0px;][border= 0; box-sizing: border-box; width: 200%; flex: 1; position: relative; overflow: auto; padding:0px;][border=0; box-sizing: border-box; padding: 0px; padding-left: 5px; padding-top: 5px; width: 125px; font-size: 12px; line-height: 16px;][comment]
  17.  
  18. ---content and tags[/comment][border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; margin-top: 5px; margin: 2px; margin-left: 0px; color: var(--text);]birth name[/border]
  19. info
  20. [border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; margin-top: 5px; margin: 2px; margin-left: 0px; color: var(--text);]courtesy names[/border]
  21. info
  22. [border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; margin-top: 5px; margin: 2px; margin-left: 0px; color: var(--text);]n.name[/border]
  23. info
  24. [border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; margin-top: 5px; margin: 2px; margin-left: 0px; color: var(--text);]age[/border]
  25. info
  26. [border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; margin-top: 5px; margin: 2px; margin-left: 0px;color: var(--text);]gender[/border]
  27. info
  28. [border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; margin-top: 5px; margin: 2px; margin-left: 0px;color: var(--text);]sexuality[/border]
  29. info
  30. [border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; margin-top: 5px; margin: 2px; margin-left: 0px; color: var(--text);]b.day[/border]
  31. info
  32. [border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; margin-top: 5px; margin: 2px; margin-left: 0px;color: var(--text);]p.o.b[/border]
  33. info
  34. [border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; margin-top: 5px; margin: 2px; margin-left: 0px;color: var(--text);]fc[/border]
  35. info[/border][/border][/border][/border]
  36. [border=0; box-sizing: border-box; background: var(--toppic); background-size: cover; background-position: center; width: 49%; height: 95%; margin-left: 2%;][/border]
  37.  
  38. [/border][comment]
  39.  
  40. ----tab container[/comment][border=0px; position: relative; box-sizing: border-box; display: flex; border-radius: 0px; width: 100%; height: 55%; margin-bottom: 7%; align-items: center; flex-flow: column nowrap; top:0; left:0;][border=0; postion: relative; z-index: 3; margin-top: -10%; margin-left: 3%; height: 100%; width: 70%; ][tabs][comment]
  41.  
  42. ---tab one start[/comment][tab=1][border=0px; position: absolute; background: var(--box); box-sizing: border-box; display: flex; border-radius: 2px; width: 100%; height: 100%; top: 7%; left: 0; align-items: center; flex-flow: row nowrap; z-index: 5; ][comment]
  43.  
  44. ---left picture[/comment][border=0; box-sizing: border-box; background: var(--pic1); background-size: cover; background-position: center; width: 49%; height: 100%; margin-right: 3%;][/border][comment]
  45.  
  46. ---scroll box[/comment][border=0; width: 150px; height: 100%; background: var(--box); box-sizing: border-box; display: flex; flex-direction: column; overflow: hidden; text-align: justify; padding:0px; margin-top: 0px;][border= 0; box-sizing: border-box; width: 200%; flex: 1; position: relative; overflow: auto; padding:0px;][border=0; box-sizing: border-box; padding: 0px; padding-top: 5px; width: 150px; font-size: 12px; color: black; line-height: 16px;][comment]
  47.  
  48. ---content[/comment][border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px; color: var(--text);]Lorem[/border] ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Velit dignissim sodales ut eu sem. Orci eu lobortis elementum nibh tellus molestie nunc non. Volutpat diam ut venenatis tellus in metus vulputate eu. Odio ut sem nulla pharetra diam sit amet. Massa tincidunt dui ut ornare lectus sit amet est. Enim ut sem viverra aliquet. At urna condimentum mattis pellentesque id. Enim nec dui nunc mattis enim ut tellus. Ultrices vitae auctor eu augue ut. Consequat nisl vel pretium lectus quam. Id faucibus nisl tincidunt eget nullam non nisi est. Adipiscing elit duis tristique sollicitudin nibh sit. Nam aliquam sem et tortor consequat. Lorem sed risus ultricies tristique nulla. Sed faucibus turpis in eu mi. Facilisis magna etiam tempor orci eu lobortis. Suspendisse sed nisi lacus sed viverra.
  49.  
  50. Velit ut tortor pretium viverra suspendisse potenti nullam ac. Pretium nibh ipsum consequat nisl vel pretium lectus quam id. Luctus accumsan tortor posuere ac ut consequat semper viverra nam. Arcu dictum varius duis at consectetur lorem donec massa. Parturient montes nascetur ridiculus mus mauris. Magna fringilla urna porttitor rhoncus dolor purus. Nisl purus in mollis nunc sed id semper risus. Neque volutpat ac tincidunt vitae semper quis lectus nulla. Eu facilisis sed odio morbi quis commodo. Risus at ultrices mi tempus imperdiet nulla. Volutpat est velit egestas dui id. Faucibus vitae aliquet nec ullamcorper sit amet risus nullam eget. Sagittis orci a scelerisque purus. Sed nisi lacus sed viverra tellus. Bibendum arcu vitae elementum curabitur. Placerat orci nulla pellentesque dignissim enim sit. At erat pellentesque adipiscing commodo. A pellentesque sit amet porttitor eget dolor morbi non. Vitae tempus quam pellentesque nec nam aliquam sem et.[/border][/border][/border][/border][comment]---tab one end
  51.  
  52. ---tab two start[/comment][/tab][tab=2][border=0px; position: absolute; background: var(--box); box-sizing: border-box; display: flex; border-radius: 2px; width: 100%; height: 100%; top: 7%; left: 0; align-items: center; flex-flow: row wrap; z-index: 5;][border=0px; background: var(--box); box-sizing: border-box; display: flex; border-radius: 2px; width: 100%; height: 49%; align-items: center; flex-flow: row nowrap; padding: 0px;][comment]
  53.  
  54. ---top left picture[/comment][border=0; box-sizing: border-box; background: var(--pic2); background-size: cover; background-position: top center; width: 49%; height: 100%; margin-right: 3%;][/border][comment]
  55.  
  56. ---top scroll box[/comment][border=0; width: 150px; height: 100%; background: var(--box); box-sizing: border-box; display: flex; flex-direction: column; overflow: hidden; text-align: justify; padding:0px; margin-top: 0px;][border= 0; box-sizing: border-box; width: 200%; flex: 1; position: relative; overflow: auto; padding:0px;][border=0; box-sizing: border-box; padding: 0px; padding-top: 5px; width: 150px; font-size: 12px; color: black; line-height: 16px;][comment]
  57.  
  58. ---content[/comment][border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px;color: var(--text);]Lorem[/border] ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Velit dignissim sodales ut eu sem. Orci eu lobortis elementum nibh tellus molestie nunc non. Volutpat diam ut venenatis tellus in metus vulputate eu. Odio ut sem nulla pharetra diam sit amet. Massa tincidunt dui ut ornare lectus sit amet est. Enim ut sem viverra aliquet. At urna condimentum mattis pellentesque id. Enim nec dui nunc mattis enim ut tellus. Ultrices vitae auctor eu augue ut. Consequat nisl vel pretium lectus quam. Id faucibus nisl tincidunt eget nullam non nisi est. Adipiscing elit duis tristique sollicitudin nibh sit. Nam aliquam sem et tortor consequat. Lorem sed risus ultricies tristique nulla. Sed faucibus turpis in eu mi. Facilisis magna etiam tempor orci eu lobortis. Suspendisse sed nisi lacus sed viverra.
  59.  
  60. Velit ut tortor pretium viverra suspendisse potenti nullam ac. Pretium nibh ipsum consequat nisl vel pretium lectus quam id. Luctus accumsan tortor posuere ac ut consequat semper viverra nam. Arcu dictum varius duis at consectetur lorem donec massa. Parturient montes nascetur ridiculus mus mauris. Magna fringilla urna porttitor rhoncus dolor purus. Nisl purus in mollis nunc sed id semper risus. Neque volutpat ac tincidunt vitae semper quis lectus nulla. Eu facilisis sed odio morbi quis commodo. Risus at ultrices mi tempus imperdiet nulla. Volutpat est velit egestas dui id. Faucibus vitae aliquet nec ullamcorper sit amet risus nullam eget. Sagittis orci a scelerisque purus. Sed nisi lacus sed viverra tellus. Bibendum arcu vitae elementum curabitur. Placerat orci nulla pellentesque dignissim enim sit. At erat pellentesque adipiscing commodo. A pellentesque sit amet porttitor eget dolor morbi non. Vitae tempus quam pellentesque nec nam aliquam sem et.[/border][/border][/border][/border][comment]
  61.  
  62. ---bottom scrollbox[/comment][border=0px; background: var(--box); box-sizing: border-box; display: flex; border-radius: 2px; width: 100%; height: 49%; align-items: center; flex-flow: row nowrap; padding: 0px; margin-top: 2%;][border=0; width: 150px; height: 100%; background: var(--box); box-sizing: border-box; display: flex; flex-direction: column; overflow: hidden; text-align: justify; padding:0px; margin-top: 0px;][border= 0; box-sizing: border-box; width: 200%; flex: 1; position: relative; overflow: auto; padding:0px;][border=0; box-sizing: border-box; padding: 0px; padding-top: 5px; width: 150px; font-size: 12px; color: black; line-height: 16px;][comment]
  63.  
  64. ---content[/comment][border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px;color: var(--text);]Lorem[/border] ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Velit dignissim sodales ut eu sem. Orci eu lobortis elementum nibh tellus molestie nunc non. Volutpat diam ut venenatis tellus in metus vulputate eu. Odio ut sem nulla pharetra diam sit amet. Massa tincidunt dui ut ornare lectus sit amet est. Enim ut sem viverra aliquet. At urna condimentum mattis pellentesque id. Enim nec dui nunc mattis enim ut tellus. Ultrices vitae auctor eu augue ut. Consequat nisl vel pretium lectus quam. Id faucibus nisl tincidunt eget nullam non nisi est. Adipiscing elit duis tristique sollicitudin nibh sit. Nam aliquam sem et tortor consequat. Lorem sed risus ultricies tristique nulla. Sed faucibus turpis in eu mi. Facilisis magna etiam tempor orci eu lobortis. Suspendisse sed nisi lacus sed viverra.
  65.  
  66. Velit ut tortor pretium viverra suspendisse potenti nullam ac. Pretium nibh ipsum consequat nisl vel pretium lectus quam id. Luctus accumsan tortor posuere ac ut consequat semper viverra nam. Arcu dictum varius duis at consectetur lorem donec massa. Parturient montes nascetur ridiculus mus mauris. Magna fringilla urna porttitor rhoncus dolor purus. Nisl purus in mollis nunc sed id semper risus. Neque volutpat ac tincidunt vitae semper quis lectus nulla. Eu facilisis sed odio morbi quis commodo. Risus at ultrices mi tempus imperdiet nulla. Volutpat est velit egestas dui id. Faucibus vitae aliquet nec ullamcorper sit amet risus nullam eget. Sagittis orci a scelerisque purus. Sed nisi lacus sed viverra tellus. Bibendum arcu vitae elementum curabitur. Placerat orci nulla pellentesque dignissim enim sit. At erat pellentesque adipiscing commodo. A pellentesque sit amet porttitor eget dolor morbi non. Vitae tempus quam pellentesque nec nam aliquam sem et.[/border][/border][/border][comment]
  67.  
  68. ---bottom right picture[/comment][border=0; box-sizing: border-box; background: var(--pic3); background-size: 135%; background-position: 40% 30%; width: 49%; height: 100%; margin-left: 3%;][/border][/border][/border][/tab][comment]---tab two end
  69.  
  70. ---tab three start[/comment][tab=3][border=0px; position: absolute; background: var(--box); box-sizing: border-box; display: flex; border-radius: 2px; width: 100%; height: 100%; top: 7%; left: 0; align-items: center; flex-flow: row nowrap; z-index: 5;][comment]
  71.  
  72. ---scroll box[/comment][border=0; height: 100%; width: 310px; background: var(--box); box-sizing: border-box; display: flex; flex-direction: column; overflow: hidden; text-align: justify; padding:0px; margin-top: 0px;][border= 0; box-sizing: border-box; width: 200%; flex: 1; position: relative; overflow: auto; padding:0px;][border=0; box-sizing: border-box; padding: 0px; width: 310px; font-size: 12px; color: black; line-height: 16px;][comment]
  73.  
  74. ---cover picture[/comment][border=0; box-sizing: border-box; display: flex; background: var(--pic4); background-size: cover; background-position: center; height: 257px; width: 100%; padding-top: 237px; color: var(--box);][font= Karla]- scroll up[/font][/border]
  75. [comment]
  76. ---content[/comment][border=0; position: relative; display: inline-block; padding-top: 5px; padding-bottom: 5px; font-size: 13px; border-radius: 2px; background: var(--tags); line-height: 12px;color: var(--text);]Lorem[/border] ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Velit dignissim sodales ut eu sem. Orci eu lobortis elementum nibh tellus molestie nunc non. Volutpat diam ut venenatis tellus in metus vulputate eu. Odio ut sem nulla pharetra diam sit amet. Massa tincidunt dui ut ornare lectus sit amet est. Enim ut sem viverra aliquet. At urna condimentum mattis pellentesque id. Enim nec dui nunc mattis enim ut tellus. Ultrices vitae auctor eu augue ut. Consequat nisl vel pretium lectus quam. Id faucibus nisl tincidunt eget nullam non nisi est. Adipiscing elit duis tristique sollicitudin nibh sit. Nam aliquam sem et tortor consequat. Lorem sed risus ultricies tristique nulla. Sed faucibus turpis in eu mi. Facilisis magna etiam tempor orci eu lobortis. Suspendisse sed nisi lacus sed viverra.
  77.  
  78. Velit ut tortor pretium viverra suspendisse potenti nullam ac. Pretium nibh ipsum consequat nisl vel pretium lectus quam id. Luctus accumsan tortor posuere ac ut consequat semper viverra nam. Arcu dictum varius duis at consectetur lorem donec massa. Parturient montes nascetur ridiculus mus mauris. Magna fringilla urna porttitor rhoncus dolor purus. Nisl purus in mollis nunc sed id semper risus. Neque volutpat ac tincidunt vitae semper quis lectus nulla. Eu facilisis sed odio morbi quis commodo. Risus at ultrices mi tempus imperdiet nulla. Volutpat est velit egestas dui id. Faucibus vitae aliquet nec ullamcorper sit amet risus nullam eget. Sagittis orci a scelerisque purus. Sed nisi lacus sed viverra tellus. Bibendum arcu vitae elementum curabitur. Placerat orci nulla pellentesque dignissim enim sit. At erat pellentesque adipiscing commodo. A pellentesque sit amet porttitor eget dolor morbi non. Vitae tempus quam pellentesque nec nam aliquam sem et.[/border][/border][/border][/border][/tab][/tabs][/border][/border][comment]---tabs end
  79.  
  80. ---bottom flex[/comment][border=0px; position: relative; box-sizing: border-box; display: flex; border-radius: 2px; width: 100%; height: 13%; text-align: right; align-items: center; justify-content: flex-start; ][border=0; background: var(--detail3); height: 5px; padding: 0px; border-radius: 20px; flex: 1;][/border][comment]
  81.  
  82. ---name[/comment][border=0; font-size: 35px; color: var(--detail3);][font=Ma Shan Zheng]任杰赫[/font][/border][/border][comment]
  83.  
  84. ---tabs cover[/comment][border=0; position: absolute; height: 8.9%; width: 100%; top: 144.7px; left: 0; box-sizing: border-box; pointer-events: none; display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; z-index: 4;][border=0; width: 59px; margin-right: 0px;][/border][comment]
  85.  
  86. ---tab one[/comment][border=0; box-sizing: border-box; height: 100%; width: 56px; background: var(--bg); margin-right: 7px; color: var(--detail3); padding: 5px; text-align: center; flex: 1;][fa]fas fa-balance-scale-right fa-lg[/fa][/border][comment]
  87.  
  88. ---tab two[/comment][border=0; box-sizing: border-box; height: 100%; width: 54px; background: var(--bg); margin-right: 7px; color: var(--detail3); padding: 5px; text-align: center; flex: 1;][fa]fas fa-chess fa-lg[/fa][/border][comment]
  89.  
  90. ---tab three[/comment][border=0; box-sizing: border-box; height: 100%; width: 54px; background: var(--bg); color: var(--detail3); padding: 5px; text-align: center; flex: 1;][fa]fas fa-snake fa-lg[/fa][/border][border=0; width: 100px; flex: 1;][/border][/border][/border][comment]
  91.  
  92. ---credit, do not remove please c:[/comment][border=0; position: relative; margin: auto; text-align: center; font-size: 10px; width: 100%; line-height: 12px;]coded by hanthesunbeam[/border]
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!