Advertisement
ooksie

finsta (uxie x dreamglow)

Apr 22nd, 2021 (edited)
271
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 35.01 KB | None | 0 0
  1. [comment]coded by uxie!
  2.  
  3. fonts used:
  4. [font=Roboto]headers[/font]
  5. [font=Segoe UI]details[/font]
  6. [font=Roboto]body[/font]
  7. [font=Cookie]app placement[/font]
  8.  
  9. to replace fonts, add/replace them here, and then in the variables below under *fonts; check uxie's tech support in nine lives for more details ( ‾́ ◡ ‾́ )
  10.  
  11. [/comment][border=transparent;
  12. *background colour;
  13. --bg-color: #f9f9f9;
  14. *border colour;
  15. --border:#ededed;
  16.  
  17. *accent colour one (light gray -- dividers, borders);
  18. --color-1: #d6d6d6;
  19. *accent colour two (dark gray -- post buttons);
  20. --color-2: #262626;
  21. *accent colour three (heart button, details buttons);
  22. --color-3: #f47258;
  23. *details color (medium gray);
  24. --color-4: #a8a8a8;
  25.  
  26. *header text colour -- username, character name, details;
  27. --h1: #000;
  28. *main text colour;
  29. --t-color:#000;
  30. *notif app colour (make sure its readable on accent colour three);
  31. --t-color-2: #fff;
  32.  
  33. *verified tag;
  34. --verified: #3897F0;
  35.  
  36. *fonts used;
  37. --header: 'Roboto', sans-serif;
  38. --details: 'Segoe UI', sans-serif;
  39. --body: 'Roboto', sans-serif;
  40. --app: 'Cookie', display;
  41.  
  42. *user icon;
  43. --icon: url('https://64.media.tumblr.com/ea5d7443bda63d1024c45d53d334a245/68820b6e247651dc-cd/s1280x1920/7b73a283ce92beeeb94ffc039dcebe10266f5d2e.jpg');
  44. *main post image;
  45. --img-1: url('https://i.imgur.com/qPkKRL6.png');
  46.  
  47. height:530px; width:100%; max-width:365px; padding:0; padding-bottom:20px; position:relative; line-height:0; margin:auto; overflow:hidden;][border=transparent; height:100%; width:100%; max-width:365px; padding:2px; box-sizing:border-box; background: var(--bg-color); border:1px solid var(--border); display:flex; flex-flow:column nowrap; position:relative;]
  48.  
  49. [comment]----iphone info (ignore if you don't want to customise!)----[/comment]
  50. [border=transparent; height:fit-content; width:100%; padding:clamp(10px, 6vw, 15px) clamp(10px, 6vw, 13px) 0 clamp(20px, 6vw + 10px, 23px); box-sizing:border-box; display:flex; flex-flow: row nowrap; align-items:center; flex:auto 0; color: var(--color-2); font-size:clamp(11px, 6vw, 12px);]
  51. [comment]----time----[/comment]
  52. [border=transparent; height:fit-content; width:fit-content; padding:0; font-family: var(--header); line-height:100%; margin-right:auto; flex:auto 0; font-weight:bold; font-size:clamp(12px, 8vw, 14px);][comment]
  53. ----* * * time here----
  54. [/comment]4:20[/border]
  55.  
  56. [comment]----iphone icons----[/comment]
  57. [border=transparent; height:fit-content; width:fit-content; padding:0; margin:0 3px; line-height:100%;][fa]fas fa-signal-alt[/fa][/border]
  58. [border=transparent; height:fit-content; width:fit-content; padding:0; margin:0 3px; line-height:100%;][fa]fas fa-wifi[/fa][/border]
  59. [border=transparent; height:fit-content; width:fit-content; padding:0; margin:0 3px; line-height:100%;][fa]fas fa-battery-bolt[/fa][/border]
  60. [/border]
  61. [comment]----iphone info end----[/comment]
  62.  
  63. [comment]----main container----[/comment]
  64. [border=transparent; height:92%; width:100%; padding:0 clamp(10px, 6vw, 13px) clamp(10px, 6vw, 15px) clamp(10px, 6vw, 13px); box-sizing:border-box; margin-top:10px; position:relative;]
  65. [comment]----tabs----[/comment]
  66. [border=transparent; height:100%; width:60%; padding:0; overflow:hidden;][border=transparent; padding:0; margin:-200px 0 0 -20px; line-height:432px;][tabs]
  67.  
  68. [comment]----cover tab (image)----[/comment]
  69. [tab=aaa.][border=transparent; height:100%; width:100%; padding:0 0 clamp(10px, 6vw, 13px) 0; box-sizing:border-box; position:absolute; top:0; left:0; z-index:3; pointer-events:none; line-height:0; display:flex; flex-flow:column nowrap; background: var(--bg-color);]
  70. [comment]----app info (ignore!)----[/comment]
  71. [border=transparent; height:fit-content; width:100%; padding:0 5px 5px clamp(10px, 6vw, 13px); box-sizing:border-box; display:flex; flex-flow: row nowrap; align-items:center; color: var(--color-2); pointer-events:auto;]
  72. [comment]----app name----[/comment]
  73. [border=transparent; height:fit-content; width:fit-content; padding:0; font-family: var(--app); font-weight:bold; letter-spacing:clamp(0px, 0.2vw, 0.5px); line-height:100%; font-size:35px; margin-right:auto; flex:auto 0;][comment]
  74. ----* * * app name----
  75. [/comment]Uxiegram[/border]
  76.  
  77. [comment]----app icons----[/comment]
  78. [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:18px; line-height:100%; flex:auto 0; margin:0 8px;][fa]far fa-plus-square[/fa][/border]
  79. [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:18px; line-height:100%; flex:auto 0; margin:0 8px;][fa]far fa-heart[/fa][/border]
  80. [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:18px; line-height:100%; flex:auto 0; margin:0 8px;][fa]far fa-comment-lines[/fa][/border]
  81. [/border]
  82. [comment]----app info end----[/comment]
  83.  
  84. [comment]----user info----[/comment]
  85. [border=transparent; height:fit-content; width:100%; padding:8px clamp(10px, 6vw, 13px); box-sizing:border-box; margin-top:5px; border-top:1px solid var(--color-1); display:flex; flex-flow: row nowrap; align-items:center;]
  86. [comment]----user icon----[/comment]
  87. [border=transparent; height:30px; width:30px; min-width:30px; padding:0; background: var(--icon); border-radius:50%; background-size:cover; background-position:50% 50%; flex:auto 0;][/border]
  88.  
  89. [comment]----username----[/comment]
  90. [border=transparent; height:fit-content; width:fit-content; padding:0; font-family: var(--header); font-size:15px; font-weight:bold; line-height:100%; margin-left:10px; pointer-events:auto; flex:auto 0;][comment]----* * * link to cs here----
  91. [/comment][url='https://www.rpnation.com/threads/code-machine-go-brrrr-by-uxie.481269/post-10825701'][comment]
  92.  
  93. [/comment][border=transparent; padding:0; color: var(--h1); text-decoration:underline var(--bg-color);][comment]
  94.  
  95. ----* * * username here----
  96. [/comment]username[/border][/url][/border]
  97.  
  98. [comment]----verified----[/comment]
  99. [border=transparent; height:fit-content; width:fit-content; padding:0; margin-left:5px; color: var(--verified); font-size:13px; line-height:15px;
  100. /*add display:none; next to this if you don't want the verified badge!*/
  101. ][fa]fas fa-badge-check[/fa][/border]
  102. [border=transparent; padding:0; height:fit-content; width:fit-content; margin-left:auto; color: var(--color-2); font-size:15px;][fa]far fa-ellipsis-h[/fa][/border]
  103. [/border]
  104. [comment]----user info end----[/comment]
  105.  
  106. [comment]----image----[/comment]
  107. [border=transparent; flex:1; width:clamp(100% - 26px, 100% - 12vw, 100% - 20px); padding:0; background: var(--img-1); background-size:cover; margin:3px clamp(10px, 6vw, 13px) 0 clamp(10px, 6vw, 13px);
  108.  
  109. /*edit the following to adjust the cropping of the image*/ background-position:20% 10%;][/border]
  110.  
  111. [comment]----image post info----[/comment]
  112. [border=transparent; height:fit-content; width:100%; padding:10px clamp(10px, 6vw, 13px) 3px clamp(10px, 6vw, 13px); box-sizing:border-box;]
  113. [comment]----icons----[/comment]
  114. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; color: var(--color-2); font-size:18px;]
  115. [border=transparent; height:fit-content; width:fit-content; padding:0; flex:auto 0; line-height:100%; color: var(--color-3);][fa]fas fa-heart[/fa][/border]
  116. [border=transparent; height:fit-content; width:fit-content; padding:0; margin:0 10px; flex:auto 0; line-height:100%;][fa]fal fa-comment[/fa][/border]
  117. [border=transparent; height:fit-content; width:fit-content; padding:0; flex:auto 0; line-height:100%;][fa]fal fa-paper-plane[/fa][/border]
  118. [border=transparent; height:fit-content; width:fit-content; padding:0; margin-left:auto; flex:auto 0; line-height:100%;][fa]fal fa-bookmark[/fa][/border]
  119. [/border]
  120. [comment]----icons end----[/comment]
  121.  
  122. [comment]----image details----[/comment]
  123. [border=transparent; height:fit-content; width:100%; padding:0; color: var(--color-2); font-family: var(--header); line-height:100%; font-weight:bold; font-size:12px; letter-spacing:0.5px; margin:12px 0 0 0;][comment]
  124. ----* * * no. of likes here----
  125. [/comment]420,000 likes[/border]
  126.  
  127. [comment]----caption container----[/comment]
  128. [border=transparent; height:fit-content; max-height:40px; width:100%; padding:6px 0 3px 0; box-sizing:border-box; pointer-events:auto; font-size:12px; line-height:16px; color: var(--t-color); font-family: var(--body); overflow:hidden; white-space:nowrap; text-overflow:ellipsis; position:relative;][border=transparent; height:fit-content; width:fit-content; min-width:fit-content; padding:0; float:left; color: var(--color-2); font-family: var(--header); font-weight:bold; font-size:12.5px; cursor:pointer; margin:0 4px 0 0; position:relative;][comment]
  129. ----* * * user name here----
  130. [/comment]username[/border][comment]
  131. ----verified badge----
  132. [/comment][border=transparent; height:fit-content; width:fit-content; padding:0; margin:0 7px 0 0; color: var(--verified); font-size:10px; float:left;
  133. /*add display:none; next to this if you don't want the verified badge!*/
  134. ][fa]fas fa-badge-check[/fa][/border][comment]
  135. [/comment](cont. in comments) [comment]
  136. ----* * * caption here----
  137. [/comment]the resolve to forget you wavers from one wind, as if the promise to erase you was a lie as well.[comment]
  138. [/comment][/border]
  139. [comment]----caption container end----[/comment]
  140.  
  141. [comment]----button----[/comment]
  142. [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:11px; color: var(--color-4); font-family: var(--details); line-height:100%; margin-top:3px;][comment]
  143. ----* * * button here----
  144. [/comment]View all 69 comments[/border]
  145. [/border]
  146. [comment]----image post info end----[/comment]
  147.  
  148. [comment]----extra notif! (ignore if you don't want it!)----[/comment]
  149. [border=transparent; height:fit-content; max-height:70px; width:100%; padding:0; display:flex; position:absolute; top:-20px; left:0; z-index:5; justify-content:center; opacity:0.9;
  150.  
  151. /*notif is on default disabled! to enable it, remove this!*/ display:none;
  152.  
  153. ][border=transparent; height:100%; width:90%; max-width:280px; padding:5px 10px; box-sizing:border-box; position:relative; border-radius:5px; background: #fff; border:1px solid var(--color-1); display:flex; flex-flow:column nowrap; pointer-events:auto;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-1); opacity:0.6; position:absolute; bottom:-6px; right:-5px; z-index:-1; border-radius:5px; backdrop-filter:blur(6px);][/border]
  154.  
  155. [comment]----notif app/info----[/comment]
  156. [border=transparent; height:fit-content; width:100%; padding:0; color: var(--color-1); display:flex; flex-flow: row nowrap; align-items:center;]
  157. [border=transparent; height:fit-content; width:fit-content; padding:4px; box-sizing:border-box;background: var(--color-3); border-radius:5px; color: var(--t-color-2); font-size:10px; line-height:100%; flex:auto 0;][fa]fas fa-comment[/fa][/border]
  158. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--color-4); text-transform:uppercase; font-family: var(--header); letter-spacing:0.8px; font-size:10px; margin-left:5px; flex:auto 0; line-height:10px;]messages[/border]
  159. [comment]----date----[/comment]
  160. [border=transparent; height:fit-content; width:fit-content; padding:0; flex:auto 0; color: var(--color-4); font-family: var(--details); font-size:10px; line-height:8px; margin:-4px 0 0 auto;][comment]
  161. ----* * * date received----
  162. [/comment]9:06pm[/border]
  163. [/border]
  164. [comment]----notif app/info end----[/comment]
  165.  
  166. [comment]----notif contents----[/comment]
  167. [border=transparent; height:fit-content; width:100%; padding:0; flex:auto 0; display:flex; flex-flow:column nowrap;]
  168. [border=transparent; height:fit-content; width:fit-content; padding:0; font-weight:bold; color: var(--color-2); font-family: var(--header); line-height:100%; font-size:11px; font-weight:bold; margin:8px 0 5px 0; ][comment]
  169. ----* * * sender name----
  170. [/comment]TOM FROM SCHOOL[/border]
  171.  
  172. [border=transparent; height:15px; width:100%; padding:0; color: var(--t-color); font-family: var(--body); line-height:100%; font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis][comment]
  173. ----* * * notif info----
  174. [/comment]is my contact name still "from school" on your phone[/border]
  175. [/border]
  176. [comment]----notif contents end----[/comment]
  177. [/border][/border]
  178. [comment]----notif end----[/comment]
  179.  
  180. [/border][/tab]
  181. [comment]----cover tab end----[/comment]
  182.  
  183.  
  184. [comment]----post tab (text)----[/comment]
  185. [tab=aaaaaaaaaaa][border=transparent; height:100%; width:100%; padding:0 0 clamp(10px, 6vw, 15px) 0; box-sizing:border-box; position:absolute; top:0; left:0; z-index:3; pointer-events:none; line-height:0; display:flex; flex-flow:column nowrap; background: var(--bg-color);]
  186. [comment]----comments header----[/comment]
  187. [border=transparent; height:fit-content; width:100%; padding:5px clamp(10px, 6vw, 13px) 10px clamp(10px, 6vw, 13px); box-sizing:border-box; display:flex; flex-flow: row nowrap; align-items:center; color: var(--color-2); font-size:18px; flex:auto 0;]
  188. [comment]----back button----[/comment]
  189. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:100%; margin-right:3px; flex:auto 0;][fa]far fa-chevron-left[/fa][/border]
  190.  
  191. [comment]----title----[/comment]
  192. [border=transparent; height:fit-content; flex:1; padding:0; font-weight:bold; font-family: var(--header); line-height:18px; font-size:14px; text-align:center; -webkit-text-stroke:0.3px var(--color-2); letter-spacing:0.3px; pointer-events:auto; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin:0 clamp(10px, 7vw, 15px);][comment]
  193. ----* * * maybe a character name here? or you can just leave it as comments tbh----
  194. [/comment]Comments[/border]
  195.  
  196. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:100%; flex:auto 0; font-size:16px; pointer-events:auto;][fa]far fa-paper-plane[/fa][/border]
  197. [/border]
  198. [comment]----comments header end----[/comment]
  199.  
  200. [comment]----post container----[/comment]
  201. [border=transparent; height:78%; width:100%; padding:5px 0; box-sizing:border-box; border-top:1px solid var(--color-1); border-bottom:1px solid var(--color-1); overflow:hidden; display:flex; flex-direction:column; pointer-events:auto; flex:auto 0;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;]
  202.  
  203. [comment]----caption container----[/comment]
  204. [border=transparent; height:fit-content; width:100%; padding:0; border-bottom:1px solid var(--color-1);][border=transparent; height:fit-content; width:50%; padding:0; display:flex; flex-flow:row nowrap; padding:3px clamp(10px, 6vw, 13px) 12px clamp(10px, 6vw, 13px); box-sizing:border-box;]
  205. [comment]----user icon----[/comment]
  206. [border=transparent; height:30px; width:30px; min-width:30px; padding:0; background: var(--icon); border-radius:50%; background-size:cover; background-position:50% 50%; flex:auto 0; margin-right:10px;][/border]
  207.  
  208. [comment]----caption contents (put your caption here again! make sure it's the same as the top)----[/comment]
  209. [border=transparent; height:fit-content; flex:1; padding:3px 0; box-sizing:border-box; pointer-events:auto; display:flex; flex-flow:column nowrap;]
  210. [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:12px; line-height:16px; color: var(--t-color); font-family: var(--body);][border=transparent; height:fit-content; width:fit-content; min-width:fit-content; padding:0; float:left; color: var(--color-2); font-family: var(--header); font-weight:bold; font-size:12.5px; cursor:pointer; margin:0 4px 0 0;][comment]
  211. ----* * * user name here----
  212. [/comment]username[/border][comment]
  213. ----verified badge----
  214. [/comment][border=transparent; height:fit-content; width:fit-content; padding:0; margin:0 7px 0 0; color: var(--verified); font-size:10px; float:left;
  215. /*add display:none; next to this if you don't want the verified badge!*/
  216. ][fa]fas fa-badge-check[/fa][/border][comment]
  217. [/comment](cont. in comments) [comment]
  218. ----* * * caption here----
  219. [/comment]the resolve to forget you wavers from one wind, as if the promise to erase you was a lie as well.[/border]
  220. [comment]----date----[/comment]
  221. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--color-4); font-family: var(--details); font-size:11px; margin:5px 0 0 0; line-height:100%;][comment]
  222. ----* * * date posted here---
  223. [/comment]3h ago[/border]
  224. [/border]
  225. [comment]----caption contents end----[/comment]
  226. [/border][/border]
  227. [comment]----caption container end----[/comment]
  228.  
  229. [comment]---- !!! actual ic post !!!----[/comment]
  230. [border=transparent; height:100%; width:100%; padding:12px 0; box-sizing:border-box;][border=transparent; height:100%; width:50%; padding:0; padding:3px clamp(10px, 6vw, 13px) 12px clamp(10px, 6vw, 13px); box-sizing:border-box; display:flex; flex-flow:row nowrap;]
  231. [comment]----user icon----[/comment]
  232. [border=transparent; height:30px; width:30px; min-width:30px; padding:0; background: var(--icon); border-radius:50%; background-size:cover; background-position:50% 50%; flex:auto 0; margin-right:10px; position:sticky; top:1px;][/border]
  233.  
  234. [comment]----post contents----[/comment]
  235. [border=transparent; height:100%; flex:1; padding:0; pointer-events:auto; color: var(--t-color); font-size:12px; font-family: var(--body); text-align:justify; line-height:16px;][comment]
  236. ----* * * text starts here----
  237. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur nisi nibh, mollis a sollicitudin vel, dignissim vel arcu. Morbi sed augue cursus, malesuada nisi vitae, tempus purus. Mauris accumsan eros enim, laoreet semper tellus facilisis at. Fusce est purus, faucibus sit amet porta eu, aliquet nec ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis id euismod tortor, sed blandit nulla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Integer finibus neque tincidunt, blandit magna vitae, sollicitudin ex. Pellentesque eleifend faucibus scelerisque. Proin vestibulum eu nisi vel pulvinar. Vestibulum convallis mi mi, in aliquam velit blandit in.
  238.  
  239. Sed pharetra ante a ante dapibus imperdiet. Etiam sit amet velit et nisi finibus placerat quis interdum ante. Nam varius ex urna, sit amet vulputate nisl ullamcorper a. Donec in pulvinar elit. Aliquam molestie suscipit lobortis. Cras hendrerit eu nisl ac fermentum. Donec posuere tellus ac magna malesuada, eget rutrum augue luctus. Nam blandit tortor a arcu luctus, eu tincidunt nunc molestie.
  240. [/border]
  241. [comment]----post contents end----[/comment]
  242. [/border][/border]
  243. [comment]----actual ic post end----[/comment]
  244.  
  245. [/border][/border]
  246. [comment]----post container end----[/comment]
  247.  
  248.  
  249. [comment]----stats/details container----[/comment]
  250. [border=transparent; height:15%; width:100%; padding:5px clamp(10px, 6vw, 13px) 0 clamp(10px, 6vw, 13px); box-sizing:border-box;][border=transparent; height:100%; width:100%; padding:0; position:relative; display:flex; flex-flow:column nowrap; position:relative; pointer-events:auto;]
  251.  
  252. [comment]----!!! stats/details tabs !!!----[/comment]
  253. [border=transparent; height:36%; width:calc(100% - 8px); padding:0; overflow:hidden; margin:0 4px;][border=transparent; padding:0; letter-spacing:clamp(-26px, -28px + 9vw, 9.5px); margin:3px -40px 0 clamp(-94px, -26vw, -89px);][tabs]
  254. [tab=.][border=0; padding:0; font-size:0; letter-spacing:0;]filler tab. ignore![/border][/tab]
  255.  
  256. [comment]----mood tab----[/comment]
  257. [tab=.][border=transparent; height:100%; width:100%; padding:0; position:absolute; bottom:0; right:0; z-index:2; display:flex; align-items:flex-end; letter-spacing:0; pointer-events:none;]
  258.  
  259. [comment]----tab contents----[/comment]
  260. [border=transparent; height:35px; width:100%; padding:0; margin-top:auto; display:flex; flex-flow:row nowrap; align-items:center; pointer-events:auto;]
  261. [border=transparent; height:30px; width:30px; padding:0; flex:auto 0; margin-right:10px;][/border]
  262. [border=transparent; height:100%; flex:1; padding:0; background: var(--bg-color); display:flex; align-items:center;][border=transparent; height:fit-content; max-height:42px; width:100%; padding:4px 0; box-sizing:border-box; border:1px solid var(--color-1); border-radius:15px; overflow:hidden; display:flex; flex-direction:column; margin-top:5px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:auto;][border=transparent; height:auto; width:50%; padding:0 10px; box-sizing:border-box; font-size:12px; font-family: var(--body); line-height:16px; color: var(--t-color);][comment]
  263. ----* * * mood here (scrolls w/ extra content!)----
  264. [/comment]mood! mood mood[/border]
  265. [/border][/border][/border]
  266. [/border]
  267. [comment]----tab contents end----[/comment]
  268.  
  269. [comment]----button select (ignore!)----[/comment]
  270. [border=transparent; height:35%; width:100%; padding:12px 10px 15px 10px; box-sizing:border-box; position:absolute; top:0; left:0; z-index:1; display:flex; flex-flow: row nowrap; align-items:center; pointer-events:none; color: var(--color-3); font-size:15px;]
  271.  
  272. [comment]----selected button----[/comment]
  273. [border=transparent; height:fit-content; width:20px; text-align:center; background: var(--bg-color); padding:0; line-height:100%; flex:auto 0;][fa]fas fa-heart[/fa][/border]
  274. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  275.  
  276. [comment]----filler button----[/comment]
  277. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  278. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  279. [comment]----filler button----[/comment]
  280. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  281. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  282. [comment]----filler button----[/comment]
  283. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  284. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  285. [comment]----filler button----[/comment]
  286. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  287. [/border]
  288. [comment]----stats/details tabs cover end----[/comment]
  289. [/border][/tab]
  290. [comment]----mood tab end----[/comment]
  291.  
  292.  
  293. [comment]----outfit tab----[/comment]
  294. [tab=.][border=transparent; height:100%; width:100%; padding:0; position:absolute; bottom:0; right:0; z-index:2; display:flex; align-items:flex-end; letter-spacing:0; pointer-events:none;]
  295.  
  296. [comment]----tab contents----[/comment]
  297. [border=transparent; height:35px; width:100%; padding:0; margin-top:auto; display:flex; flex-flow:row nowrap; align-items:center; pointer-events:auto;]
  298. [border=transparent; height:30px; width:30px; padding:0; flex:auto 0; margin-right:10px;][/border]
  299. [border=transparent; height:100%; flex:1; padding:0; background: var(--bg-color); display:flex; align-items:center;][border=transparent; height:fit-content; max-height:42px; width:100%; padding:4px 10px; box-sizing:border-box; border:1px solid var(--color-1); border-radius:15px; overflow:hidden; margin-top:5px; font-size:12px; font-family: var(--body); line-height:16px; color: var(--t-color);][comment]
  300. ----* * * outfit link----
  301. [/comment][url='xx'][comment]
  302. [/comment][border=0; padding:0; color: var(--t-color);][comment]
  303. ----* * * outfit text here (doesn't scroll)----
  304. [/comment]check out my fit![comment]
  305. [/comment][/border][/url][/border]
  306. [/border]
  307. [/border]
  308. [comment]----tab contents end----[/comment]
  309.  
  310. [comment]----button select (ignore!)----[/comment]
  311. [border=transparent; height:35%; width:100%; padding:12px 10px 15px 10px; box-sizing:border-box; position:absolute; top:0; left:0; z-index:1; display:flex; flex-flow: row nowrap; align-items:center; pointer-events:none; color: var(--color-3); font-size:15px;]
  312. [comment]----filler button----[/comment]
  313. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  314. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  315.  
  316. [comment]----selected button----[/comment]
  317. [border=transparent; height:fit-content; width:20px; text-align:center; background: var(--bg-color); padding:0; line-height:100%; flex:auto 0;][fa]fas fa-tshirt[/fa][/border]
  318. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  319.  
  320. [comment]----filler button----[/comment]
  321. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  322. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  323. [comment]----filler button----[/comment]
  324. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  325. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  326. [comment]----filler button----[/comment]
  327. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  328. [/border]
  329. [comment]----stats/details tabs cover end----[/comment]
  330. [/border][/tab]
  331. [comment]----outfit tab end----[/comment]
  332.  
  333.  
  334. [comment]----location tab----[/comment]
  335. [tab=.][border=transparent; height:100%; width:100%; padding:0; position:absolute; bottom:0; right:0; z-index:2; display:flex; align-items:flex-end; letter-spacing:0; pointer-events:none;]
  336.  
  337. [comment]----tab contents----[/comment]
  338. [border=transparent; height:35px; width:100%; padding:0; margin-top:auto; display:flex; flex-flow:row nowrap; align-items:center; pointer-events:auto;]
  339. [border=transparent; height:30px; width:30px; padding:0; flex:auto 0; margin-right:10px;][/border]
  340. [border=transparent; height:100%; flex:1; padding:0; background: var(--bg-color); display:flex; align-items:center;][border=transparent; height:fit-content; max-height:42px; width:100%; padding:4px 0; box-sizing:border-box; border:1px solid var(--color-1); border-radius:15px; overflow:hidden; display:flex; flex-direction:column; margin-top:5px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:auto;][border=transparent; height:auto; width:50%; padding:0 10px; box-sizing:border-box; font-size:12px; font-family: var(--body); line-height:16px; color: var(--t-color);][comment]
  341. ----* * * location here (scrolls w/ extra content!)----
  342. [/comment]turn on ur location settings[/border]
  343. [/border][/border][/border]
  344. [/border]
  345. [comment]----tab contents end----[/comment]
  346.  
  347. [comment]----button select (ignore!)----[/comment]
  348. [border=transparent; height:35%; width:100%; padding:12px 10px 15px 10px; box-sizing:border-box; position:absolute; top:0; left:0; z-index:1; display:flex; flex-flow: row nowrap; align-items:center; pointer-events:none; color: var(--color-3); font-size:15px;]
  349. [comment]----filler button----[/comment]
  350. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  351. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  352. [comment]----filler button----[/comment]
  353. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  354. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  355.  
  356. [comment]----selected button----[/comment]
  357. [border=transparent; height:fit-content; width:20px; text-align:center; background: var(--bg-color); padding:0; line-height:100%; flex:auto 0;][fa]fas fa-map-marker-alt[/fa][/border]
  358. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  359.  
  360. [comment]----filler button----[/comment]
  361. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  362. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  363. [comment]----filler button----[/comment]
  364. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  365. [/border]
  366. [comment]----stats/details tabs cover end----[/comment]
  367. [/border][/tab]
  368. [comment]----location tab end----[/comment]
  369.  
  370.  
  371. [comment]----tags tab----[/comment]
  372. [tab=.][border=transparent; height:100%; width:100%; padding:0; position:absolute; bottom:0; right:0; z-index:2; display:flex; align-items:flex-end; letter-spacing:0; pointer-events:none;]
  373.  
  374. [comment]----tab contents----[/comment]
  375. [border=transparent; height:35px; width:100%; padding:0; margin-top:auto; display:flex; flex-flow:row nowrap; align-items:center; pointer-events:auto;]
  376. [border=transparent; height:30px; width:30px; padding:0; flex:auto 0; margin-right:10px;][/border]
  377. [border=transparent; height:100%; flex:1; padding:0; background: var(--bg-color); display:flex; align-items:center;][border=transparent; height:fit-content; max-height:42px; width:100%; padding:4px 0; box-sizing:border-box; border:1px solid var(--color-1); border-radius:15px; overflow:hidden; display:flex; flex-direction:column; margin-top:5px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:auto;][border=transparent; height:auto; width:50%; padding:0 10px; box-sizing:border-box; font-size:12px; font-family: var(--body); line-height:16px; color: var(--t-color);][comment]
  378. ----* * * tags here (scrolls w/ extra content!)----
  379. [/comment]it's short and i hate scrolling tiny spaces. tag them for the sake of tagging ;;[/border]
  380. [/border][/border][/border]
  381. [/border]
  382. [comment]----tab contents end----[/comment]
  383.  
  384. [comment]----button select (ignore!)----[/comment]
  385. [border=transparent; height:35%; width:100%; padding:12px 10px 15px 10px; box-sizing:border-box; position:absolute; top:0; left:0; z-index:1; display:flex; flex-flow: row nowrap; align-items:center; pointer-events:none; color: var(--color-3); font-size:15px;]
  386. [comment]----filler button----[/comment]
  387. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  388. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  389. [comment]----filler button----[/comment]
  390. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  391. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  392. [comment]----filler button----[/comment]
  393. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  394. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  395.  
  396. [comment]----selected button----[/comment]
  397. [border=transparent; height:fit-content; width:20px; text-align:center; background: var(--bg-color); padding:0; line-height:100%; flex:auto 0;][fa]fas fa-comments[/fa][/border]
  398. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  399.  
  400. [comment]----filler button----[/comment]
  401. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][/border]
  402. [/border]
  403. [comment]----stats/details tabs cover end----[/comment]
  404. [/border][/tab]
  405. [comment]----tags tab end----[/comment]
  406.  
  407. [tab=.][border=0; padding:0; font-size:0; letter-spacing:0;]filler tab. ignore![/border][/tab]
  408. [/tabs][/border][/border]
  409. [comment]----stats/details tabs end----[/comment]
  410.  
  411. [comment]----stats/details tabs cover----[/comment]
  412. [border=transparent; height:35%; width:100%; padding:12px 10px 15px 10px; box-sizing:border-box; background: var(--bg-color); position:absolute; top:0; left:0; z-index:1; display:flex; flex-flow: row nowrap; align-items:center; pointer-events:none; color: var(--color-4); font-size:15px;]
  413. [comment]----button----[/comment]
  414. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][fa]fas fa-heart[/fa][/border]
  415. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  416.  
  417. [comment]----button----[/comment]
  418. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][fa]fas fa-tshirt[/fa][/border]
  419. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  420.  
  421. [comment]----button----[/comment]
  422. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][fa]fas fa-map-marker-alt[/fa][/border]
  423. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  424.  
  425. [comment]----button----[/comment]
  426. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][fa]fas fa-comments[/fa][/border]
  427. [border=transparent; height:25px; flex:1; padding:0; pointer-events:auto;][/border]
  428.  
  429. [comment]----button----[/comment]
  430. [border=transparent; height:fit-content; width:20px; text-align:center; padding:0; line-height:100%; flex:auto 0;][fa]fas fa-home[/fa][/border]
  431. [/border]
  432. [comment]----stats/details tabs cover end----[/comment]
  433.  
  434.  
  435. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top:auto;]
  436. [comment]----user icon----[/comment]
  437. [border=transparent; height:30px; width:30px; min-width:30px; padding:0; background: var(--icon); border-radius:50%; background-size:cover; background-position:50% 50%; flex:auto 0; margin-right:10px;][/border]
  438. [comment]----comment box----[/comment]
  439. [border=transparent; height:fit-content; flex:1; padding:6px 10px; box-sizing:border-box; border:1px solid var(--color-1); border-radius:15px; background: var(--bg-color); color: var(--color-4); line-height:100%; font-size:12px; font-family: var(--details);]Add a comment...[/border]
  440. [/border]
  441. [/border][/border]
  442. [comment]----stats/details container end----[/comment]
  443.  
  444. [/border][/tab]
  445. [comment]----post tab end----[/comment]
  446. [/tabs][/border][/border]
  447. [comment]----tabs end----[/comment]
  448. [/border]
  449. [comment]----main container----[/comment]
  450.  
  451. [/border][comment]----signature! (do not remove!)-----
  452. [/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(--color-4);][font=Open Sans]♡requested by dreamglow, coded by uxie♡[/font][/bg][/border]
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement