API tools faq
paste
Advertisement
ooksie

memories (uxie x lipglossy.)

ooksie
Nov 25th, 2020 (edited)
259
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.15 KB | None | 0 0
raw download clone embed print report
  1. [border=transparent;
  2. *textures. change the textures of tape-1 and tape-2 if you want to adjust the patterns on the tapes;
  3. --texture: url('https://www.transparenttextures.com/patterns/wine-cork.png');
  4. --tape-1: url('https://www.transparenttextures.com/patterns/subtle-stripes.png');
  5. --tape-2: url('https://www.transparenttextures.com/patterns/worn-dots.png');
  6.  
  7. *corkboard colours;
  8. --bg-border: #875342;
  9. --bg-color: #986749;
  10. *picture frame colours;
  11. --picture: #fff;
  12. --picture-bg: #f4f4f4;
  13. --post-shadow: #5b403a;
  14.  
  15. *tape colours;
  16. --t1: #ff8eac;
  17. --t2: #b8e6fc;
  18.  
  19. *sticker colours (s1 and s3 are the hearts, s2 is the star);
  20. --s1: #f93b4b;
  21. --s2: #ffe070;
  22. --s3: #f7a5ec;
  23. --outline: #fff;
  24. --shadow: #56443a;
  25.  
  26. *details accent colour;
  27. --color-1: #ffd670;
  28.  
  29. *text colour;
  30. --t-color: #000;
  31.  
  32. *images (replace the url between the ' ' with your own!);
  33. --img-1: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  34. --img-2: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  35.  
  36. height:fit-content; width:100%; max-width:650px; padding:0; padding-bottom:25px; position:relative; line-height:0; margin:auto;][border=transparent; height:fit-content; width:100%; max-width:650px; padding:0; border:10px solid var(--bg-border); background: var(--texture), var(--bg-color); box-sizing:border-box; position:relative; display:flex; flex-flow: row wrap; justify-content:center; align-items:center;]
  37.  
  38. [comment]----left----[/comment]
  39. [border=transparent; height:420px; width:310px; padding:0; position:relative; margin:5px 0; display:flex; flex-flow: row nowrap; align-items:flex-end; justify-content:flex-start;]
  40.  
  41. [comment]----tabs----[/comment]
  42. [border=transparent; height:8%; width:45px; padding:0; overflow:hidden; margin:0 0 25px 30px;][border=transparent; padding:0; height:100%; width:180px; display:flex; justify-content:flex-end;][border=transparent; padding:0; margin:0 0 0 -25px;][tabs]
  43.  
  44. [comment]----image tab----[/comment]
  45. [tab=aaa][border=transparent; width:260px; padding:0;][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; pointer-events:none; display:flex; align-items:center; justify-content:flex-end;]
  46. [comment]----main content box----[/comment]
  47. [border=transparent; height:80%; width:82%; padding:10px 10px 30px 10px; background: var(--picture); box-sizing:border-box; position:relative; transform:rotate(-8deg); margin:10px 25px 0 auto; box-shadow:5px 5px 13px var(--post-shadow);]
  48.  
  49. [comment]----image 1----[/comment]
  50. [border=transparent; height:100%; width:100%; padding:0; background: var(--img-1); font-size:0; background-size:cover;
  51. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;]filler text[/border]
  52. [/border]
  53. [comment]----main content box end----[/comment]
  54. [/border][/border][/tab]
  55. [comment]----image tab end----[/comment]
  56.  
  57. [comment]----post contents tab----[/comment]
  58. [tab=aaa][border=transparent; width:45px; padding:0;][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; pointer-events:none; display:flex; align-items:center; justify-content:flex-end;]
  59. [comment]----main content box----[/comment]
  60. [border=transparent; height:80%; width:82%; padding:10px 10px 30px 10px; background: var(--picture); box-sizing:border-box; position:relative; transform:rotate(-8deg); margin:10px 25px 0 auto; box-shadow:5px 5px 13px var(--post-shadow);]
  61.  
  62. [comment]----* *post contents* *----[/comment]
  63. [border=transparent; height:100%; width:100%; padding:12px 0; box-sizing:border-box; background: var(--picture-bg); overflow:hidden; display:flex; flex-direction:column; pointer-events:auto;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 12px; box-sizing:border-box; text-align:justify; font-size:12px; color: var(--t-color); line-height:130%; margin:45px 0 30px 0;][font=Karla][comment]
  64. ----* * *text starts here----
  65. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam porta sodales nisi ac tincidunt. Nullam sed eleifend elit. Curabitur arcu quam, accumsan eget ex nec, tincidunt maximus ante. Integer pharetra tristique diam, at tempus massa posuere eu. Curabitur et lorem metus. Nullam a metus ac diam sollicitudin aliquam. Ut arcu dui, ornare ullamcorper nibh ac, ullamcorper aliquet dolor. Cras posuere mauris nec pharetra aliquet. Aliquam erat volutpat. In hac habitasse platea dictumst. Sed blandit mauris erat, id convallis nunc aliquam at.
  66.  
  67. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean cursus malesuada ipsum, id convallis dui porta sit amet. Donec aliquet arcu vitae quam condimentum sollicitudin non sit amet nibh. In in iaculis mauris. Donec nulla elit, finibus ullamcorper nunc sed, facilisis viverra tortor. Proin ac interdum velit. Aliquam vestibulum porta tempus. Proin eget malesuada massa, interdum facilisis mauris. Etiam blandit, sapien id tempus tempor, libero nulla hendrerit erat, pellentesque ultricies est risus et sem. Aliquam consequat pretium lectus, id pretium urna auctor in. Donec at accumsan lorem. Sed scelerisque tristique felis, blandit tincidunt dui euismod vel. Sed venenatis justo nec arcu pharetra, ac luctus tellus dapibus. Nam in mattis ex. Proin ultrices ut odio in volutpat. In sit amet nisl quis lacus tempor viverra.
  68. [/font][/border][/border][/border]
  69. [comment]----post contents end----[/comment]
  70. [/border]
  71. [comment]----main content box end----[/comment]
  72. [/border][/border][/tab]
  73. [comment]----post contents tab end----[/comment]
  74.  
  75. [/tabs][/border][/border][/border]
  76. [comment]----tabs end----[/comment]
  77.  
  78. [comment]----tape----[/comment]
  79. [border=transparent; height:35px; width:120px; padding:0; position:absolute; top:65px; left:-15px; z-index:5; transform:rotate(-58deg); background: var(--tape-1), var(--t1); opacity:0.8; background-size:100%; background-blend-mode:multiply;][/border]
  80.  
  81. [comment]----stickers----[/comment]
  82. [border=transparent; height:fit-content; width:fit-content; padding:0; position:absolute; bottom:5px; left:15px; z-index:5; color: var(--s1); line-height:100%; transform:rotate(-12deg); font-size:80px; -webkit-text-stroke:5px var(--outline); text-shadow:3px 3px 8px var(--shadow); pointer-events:none;][fa]fas fa-heart[/fa][/border]
  83. [border=transparent; height:fit-content; width:fit-content; padding:0; position:absolute; bottom:15px; left:105px; z-index:5; color: var(--s2); line-height:100%; transform:rotate(32deg); font-size:58px; -webkit-text-stroke:5px var(--outline); text-shadow:3px 3px 8px var(--shadow); pointer-events:none;][fa]fas fa-star[/fa][/border]
  84.  
  85. [/border]
  86. [comment]----left end----[/comment]
  87.  
  88. [comment]----right----[/comment]
  89. [border=transparent; height:420px; width:310px; padding:0; position:relative; margin:5px 0; display:flex; flex-flow: row nowrap; align-items:flex-start; justify-content:flex-end;]
  90.  
  91. [comment]----tabs----[/comment]
  92. [border=transparent; height:8%; width:45px; padding:0; overflow:hidden; margin:25px 30px 0 0;][border=transparent; padding:0; height:100%; width:170px; display:flex; justify-content:flex-end;][border=transparent; padding:0; margin:0 0 0 -35px;][tabs]
  93.  
  94. [comment]----image tab----[/comment]
  95. [tab=aaa][border=transparent; width:260px; padding:0;][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; pointer-events:none; display:flex; align-items:center; justify-content:flex-start;]
  96. [comment]----main content box----[/comment]
  97. [border=transparent; height:80%; width:85%; padding:10px 10px 30px 10px; background: var(--picture); box-sizing:border-box; position:relative; transform:rotate(5deg); margin:-35px 25px 0 auto; box-shadow:5px 5px 13px var(--post-shadow);]
  98.  
  99. [comment]----image 2----[/comment]
  100. [border=transparent; height:100%; width:100%; padding:0; background: var(--img-2); font-size:0; background-size:cover;
  101. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;]filler text[/border]
  102. [/border]
  103. [comment]----main content box end----[/comment]
  104. [/border][/border][/tab]
  105. [comment]----image tab end----[/comment]
  106.  
  107. [comment]----details contents tab----[/comment]
  108. [tab=aaa][border=transparent; width:45px; padding:0;][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; pointer-events:none; display:flex; align-items:center; justify-content:flex-start;]
  109. [comment]----main content box----[/comment]
  110. [border=transparent; height:80%; width:85%; padding:10px 10px 30px 10px; background: var(--picture); box-sizing:border-box; position:relative; transform:rotate(5deg); margin:-35px 25px 0 auto; box-shadow:5px 5px 13px var(--post-shadow);]
  111.  
  112. [comment]----* *details contents* *----[/comment]
  113. [border=transparent; height:100%; width:100%; padding:12px 0; box-sizing:border-box; background: var(--picture-bg); overflow:hidden; display:flex; flex-direction:column; pointer-events:auto;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 12px; box-sizing:border-box; display:flex; flex-flow: column nowrap; margin:40px 0 30px 0;]
  114.  
  115. [comment]----copy me to add one new tag!----[/comment]
  116. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; margin:5px 0;]
  117. [border=transparent; height:fit-content; width:fit-content; padding:2px 4px; box-sizing:border-box; border-bottom:8px solid var(--color-1); line-height:0%; color: var(--t-color); font-weight:bold; letter-spacing:0.5px; font-size:14px; flex-shrink:0; margin:5px 15px 0 0;][font=Karla][comment]
  118. ----* * * tag title here!----
  119. [/comment]mood[/font][/border]
  120.  
  121. [border=transparent; height:fit-content; flex-grow:1; padding:0; text-align:justify; font-size:13px; color: var(--t-color); line-height:130%;][font=Karla][comment]
  122. ----* * * tag info here!----
  123. [/comment]mood here[/font][/border]
  124. [/border]
  125. [comment]----copy me too!----[/comment]
  126.  
  127. [comment]----copy me to add one new tag!----[/comment]
  128. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; margin:5px 0;]
  129. [border=transparent; height:fit-content; width:fit-content; padding:2px 4px; box-sizing:border-box; border-bottom:8px solid var(--color-1); line-height:0%; color: var(--t-color); font-weight:bold; letter-spacing:0.5px; font-size:14px; flex-shrink:0; margin:5px 15px 0 0;][font=Karla][comment]
  130. ----* * * tag title here!----
  131. [/comment]location[/font][/border]
  132.  
  133. [border=transparent; height:fit-content; flex-grow:1; padding:0; text-align:justify; font-size:13px; color: var(--t-color); line-height:130%;][font=Karla][comment]
  134. ----* * * tag info here!----
  135. [/comment]location here[/font][/border]
  136. [/border]
  137. [comment]----copy me too!----[/comment]
  138.  
  139. [comment]----copy me to add one new tag!----[/comment]
  140. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; margin:5px 0;]
  141. [border=transparent; height:fit-content; width:fit-content; padding:2px 4px; box-sizing:border-box; border-bottom:8px solid var(--color-1); line-height:0%; color: var(--t-color); font-weight:bold; letter-spacing:0.5px; font-size:14px; flex-shrink:0; margin:5px 15px 0 0;][font=Karla][comment]
  142. ----* * * tag title here!----
  143. [/comment]outfit[/font][/border]
  144.  
  145. [border=transparent; height:fit-content; flex-grow:1; padding:0; text-align:justify; font-size:13px; color: var(--t-color); line-height:130%;][font=Karla][comment]
  146. ----* * * tag info here!----
  147. [/comment]outfit here[/font][/border]
  148. [/border]
  149. [comment]----copy me too!----[/comment]
  150.  
  151. [comment]----copy me to add one new tag!----[/comment]
  152. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; margin:5px 0;]
  153. [border=transparent; height:fit-content; width:fit-content; padding:2px 4px; box-sizing:border-box; border-bottom:8px solid var(--color-1); line-height:0%; color: var(--t-color); font-weight:bold; letter-spacing:0.5px; font-size:14px; flex-shrink:0; margin:5px 15px 0 0;][font=Karla][comment]
  154. ----* * * tag title here!----
  155. [/comment]interactions[/font][/border]
  156.  
  157. [border=transparent; height:fit-content; flex-grow:1; padding:0; text-align:justify; font-size:13px; color: var(--t-color); line-height:130%;][font=Karla][comment]
  158. ----* * * tag info here!----
  159. [/comment]interactions here[/font][/border]
  160. [/border]
  161. [comment]----copy me too!----[/comment]
  162.  
  163. [comment]----copy me to add one new tag!----[/comment]
  164. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; margin:5px 0;]
  165. [border=transparent; height:fit-content; width:fit-content; padding:2px 4px; box-sizing:border-box; border-bottom:8px solid var(--color-1); line-height:0%; color: var(--t-color); font-weight:bold; letter-spacing:0.5px; font-size:14px; flex-shrink:0; margin:5px 15px 0 0;][font=Karla][comment]
  166. ----* * * tag title here!----
  167. [/comment]tags[/font][/border]
  168.  
  169. [border=transparent; height:fit-content; flex-grow:1; padding:0; text-align:justify; font-size:13px; color: var(--t-color); line-height:130%;][font=Karla][comment]
  170. ----* * * tag info here!----
  171. [/comment]tags here[/font][/border]
  172. [/border]
  173. [comment]----copy me too!----[/comment]
  174.  
  175. [/border][/border][/border]
  176. [comment]----post contents end----[/comment]
  177. [/border]
  178. [comment]----main content box end----[/comment]
  179. [/border][/border][/tab]
  180. [comment]----post contents tab end----[/comment]
  181.  
  182. [/tabs][/border][/border][/border]
  183. [comment]----tabs end----[/comment]
  184.  
  185. [comment]----tape----[/comment]
  186. [border=transparent; height:30px; width:125px; padding:0; position:absolute; bottom:65px; right:-5px; z-index:5; transform:rotate(-38deg); background: var(--tape-2), var(--t2); opacity:0.8; background-size:100%; background-blend-mode:multiply;][/border]
  187.  
  188. [comment]----stickers----[/comment]
  189. [border=transparent; height:fit-content; width:fit-content; padding:0; position:absolute; top:0px; right:10px; z-index:5; color: var(--s3); line-height:100%; transform:rotate(12deg); font-size:80px; -webkit-text-stroke:5px var(--outline); text-shadow:3px 3px 8px var(--shadow); pointer-events:none;][fa]fas fa-heart[/fa][/border]
  190. [border=transparent; height:fit-content; width:fit-content; padding:0; position:absolute; top:10px; right:105px; z-index:5; color: var(--s2); line-height:100%; transform:rotate(-32deg); font-size:58px; -webkit-text-stroke:5px var(--outline); text-shadow:3px 3px 8px var(--shadow); pointer-events:none;][fa]fas fa-star[/fa][/border]
  191.  
  192. [/border]
  193. [comment]----right end----[/comment]
  194. [/border][comment]----signature! (do not remove!)-----
  195. [/comment][bg=transparent; height:fit-content; padding:0; width:100%; position:absolute; bottom:15px; left:10px; z-index:7;opacity:0.7;font-size:10px;text-align:center; line-height:100%; color: var(--t-color);][font=Open Sans]♡design by lipglossy., coded by uxie♡[/font][/bg][/border]
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!