fclsegvds
even if its a false god.
so i'm using a bbcode template in my workshop, and i'm not sure how to get the tabs to open up, some will and some won't? am i doing something wrong by just copy and pasting the code into the code tab?
Follow along with the video below to see how to install our site as a web app on your home screen.
Note: This feature currently requires accessing the site using the built-in Safari browser.
[code][/code]
tags around it so nothing breaks when you post!)
Rich (BB code):
home
currently logged in as
first name
jump back in!
your opened apps
requisite
personality
backstory
miscellaneous
recent posts :
character name
#hr
location
short short post
short post
4.20k
666k
+2
character name
#hr
location
long post
long long post
post so long
4.20k
666k
- homeaaaaaaaaaaaaaaaaaaa
- aaaaaaaaaaaaaaaaaaaaaaa
- aaaaaaaaaaaaaaaaaaaaaaa
- aaaaaaaaaaaaaaaaaaaaaaa
- aaaaaaaaaaaaaaaaaaaaaaa
- aaaaaaaaaaaaaaaaaaaaaaa
- aaaaaaarequisite
- aaaaapersonality
- aaaaaabackstory
- aaamiscellaneous
-
new message!
contact name
short text message
- filler tab
- filler tab
- filler tab
- filler tab
- filler tab
-
requisite
full name
answer
nickname
answer
birthplace
answer
faceclaim
answer
height
answer
-
personality
vices
answer
virtues
answer
likes
answer
dislikes
answer
-
backstory
history
answer
family
answer
relations
answer
extra
answer
♡design by erosful, coded by uxie♡
[comment]
heavily inspired by https://khevinday.tumblr.com/henrietta.#
[/comment][border=transparent;
*the background image of the tab content area;
--bg: url('https://images.unsplash.com/photo-1499856871958-5b9627545d1a?ixlib=rb-1.2.1&auto=format&fit=crop&w=1000&q=80');
*the background of the sidebar;
--bg-color: #E8E8E8;
*the off-white background of most of the lil tabs;
--color-1: #f5f5f5;
*the light gray;
--color-2: #caccc3;
*the color of the header texts;
--color-3: #665A53;
*the color of the buttons;
--color-4: #C2C3B7;
*the color of the text;
--t-color: #000;
*the color of the follow button;
--follow: #6e9ed1;
*this is the main icon;
--img-1: url('https://i.pinimg.com/originals/33/95/76/33957674e3c28000fd2289befc17b953.png');
*this is the contact picture used for the text message on the first page;
--img-2: url('https://64.media.tumblr.com/3d00af80e22b928a5825d411fec82974/tumblr_pj9yxbAyJX1wlgxm5o2_250.png');
*these are the pictures used for the character posts at the bottom;
--img-3: url('https://64.media.tumblr.com/52256407e9b6e4ba82a49a29654043f4/tumblr_oxh5il9VdN1w6f1yao5_250.png');
--img-4: url('https://64.media.tumblr.com/199077759741e669cc72d70b05ab59f5/tumblr_pc11o5xVwx1wmlo63o9_250.png');
*this is the icon of the instagram page;
--img-5: url('https://i.pinimg.com/564x/7f/47/ba/7f47baad8457eabe144992b7ecf2dc93.jpg');
*gallery pics on the instagram page;
--img-6: url('https://data.whicdn.com/images/342004801/original.jpg');
--img-7: url('https://64.media.tumblr.com/38422eb1dbeccb37ebf63eb4b7a33c25/tumblr_pdgnwfCInY1vzztm0o9_r1_250.png');
--img-8: url('https://64.media.tumblr.com/b2187efb57df4bf4e183b1402beb3391/tumblr_pg2bhdQzKv1xc7mggo2_250.png');
--img-9: url('https://64.media.tumblr.com/c4b2edeb94756ff7177bc11764e43680/tumblr_pdj5t8z5Rd1wlgxz9o3_250.png');
--img-10: url('https://64.media.tumblr.com/5fa1c1aea414129d080de5459ec1c564/tumblr_pd1tkyPQrC1xtzds5o1_250.jpg');
--img-11: url('https://64.media.tumblr.com/25a32d1126d9eded0f4d68fe6afc2251/tumblr_pdj5t8z5Rd1wlgxz9o6_250.png');
--img-12: url('https://64.media.tumblr.com/1e03ba22947f96adfb6fb340dfe1c438/7209393c6a2bd96d-42/s640x960/83dc3e0c2421af6119ae1fd98d03eb23b14edd55.png');
--img-13: url('https://64.media.tumblr.com/66221fba3b0b941f459fed8fdf6ad477/7209393c6a2bd96d-b9/s640x960/accdac5126f4604992cd58e5b2e97b19f2b925bd.png');
--img-14: url('https://64.media.tumblr.com/1138298993d36cd8cedb1c6c19d50872/7209393c6a2bd96d-81/s640x960/f2c809047467c8b87103bc5c5b76c9dc2e7000ef.png');
--img-post: url('https://pbs.twimg.com/media/EkT7QFbXsAIe7Wi?format=jpg&name=medium');
*only add to this one if you want to put an image in one of the sidebar posts;
--more-img: url('xx');
height:600px; width:800px; margin:auto; padding:0; padding-bottom:25px; line-height:0; position:relative;]
[comment]----main container----[/comment]
[border=transparent; height:100%; width:100%; padding:0; display:flex; flex-flow: row nowrap; position:relative; overflow:hidden;]
[comment]----content image----[/comment]
[border=transparent; height:100%; width:67%; padding:0; background: var(--bg) 60% 50%; background-blend-mode:overlay; background-size:cover; /*remove this if you're changing the colours!*/ -webkit-filter: grayscale(1);][border=transparent; height:100%; width:100%; background-color: var(--color-4); padding:0; opacity:0.25;][/border][/border]
[comment]----sidebar cover----[/comment]
[border=transparent; height:100%; width:33%; padding:0; background-color: var(--bg-color); position:absolute; top:0; right:0; pointer-events:none;][border=transparent; height:100%; width:100%; padding:30px 25px 10px 25px; box-sizing:border-box; position:relative; display:flex; flex-flow: row wrap; align-content:space-between; justify-content:center;]
[comment]----blob----[/comment]
[border=transparent; height:300px; width:300px; padding:0; position:absolute; top:-170px; right:-120px; background-color: var(--color-4); border-radius:40% 0 60% 70%;][/border]
[comment]----pointer null----[/comment]
[border=transparent; height:3%; width:90%; position:absolute; top:0; left:0; padding:0; pointer-events:auto; z-index:2;][/border]
[border=transparent; height:38%; width:100%; position:absolute; top:3%; left:0; padding:0; pointer-events:auto; z-index:2;][/border]
[comment]----home button----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:5px; font-weight:bold; position:absolute; top:0; right:0; color: var(--color-3); font-size:8px; text-transform:uppercase; line-height:130%;][font=Montserrat]home[/font][/border]
[comment]----user info----[/comment]
[border=transparent; height:27%; width:100%; padding:0; position:relative; display:flex; flex-flow: row wrap; justify-content:center;]
[border=transparent; height:68%; width:100%; background-color:var(--color-1); border-radius:15px; align-self:flex-end; padding:28px 0 0 0; box-sizing:border-box; display:flex; flex-flow: row wrap; align-items:center; align-content:center; justify-content:center;]
[border=transparent; height:fit-content; width:100%; color: var(--color-2); padding:0; font-size:7px; text-transform:uppercase; letter-spacing:1px; text-align:center; line-height:130%; margin:8px 0 -3px 0;][font=Montserrat]currently logged in as[/font][/border]
[border=transparent; height:fit-content; width:100%; color: var(--color-3); padding:0; text-shadow:0 0 4px var(--color-3); text-align:center; letter-spacing:0.3px; text-transform:uppercase; line-height:160%; font-size:24px;][font=Montserrat][comment]
---- * * *your character's first name here ----
[/comment]first name[/font][/border]
[/border]
[comment]---icon----[/comment]
[border=transparent; height:75px; width:75px; border:8px solid var(--color-1); border-radius:50%; background: var(--img-1); background-size:cover; padding:0; position:absolute; top:0;][/border]
[/border]
[comment]----user info end----[/comment]
[comment]----tabs cover----[/comment]
[border=transparent; height:42%; width:100%; background-color: var(--color-1); padding:8px 18px 15px 18px; box-sizing:border-box; border-radius:15px; display:flex; flex-flow: column nowrap; justify-content:space-between; align-items:center;]
[comment]----tabs header----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row wrap; margin-bottom:5px;]
[border=transparent; height:fit-content; width:100%; padding:0; color: var(--color-3); text-shadow:0 0 3px var(--color-3); font-size:19px; line-height:130%;][font=Montserrat]jump back in[i]![/i][/font][/border]
[border=transparent; height:fit-content; width:100%; padding:0 3px 0 0; box-sizing:border-box; color: var(--t-color); text-transform:uppercase; font-size:8px; text-align:right; line-height:130%; font-weight:bold;][font=Montserrat]your opened apps[/font][/border]
[/border]
[comment]----tab button----[/comment]
[border=transparent; height:fit-content; width:100%; background-color: var(--color-4); border-radius:6px; padding:8px 0; color: var(--t-color); text-shadow:0px 0px 3px var(--color-3); text-transform:uppercase; font-weight:bold; text-transform:uppercase; line-height:100%; display:flex; align-items:center; justify-content:center; font-size:13px; letter-spacing:1.5px;][font=Montserrat]requisite[/font][/border]
[comment]----tab button----[/comment]
[border=transparent; height:fit-content; width:100%; background-color: var(--color-4); border-radius:6px; padding:8px 0; color: var(--t-color); text-shadow:0px 0px 3px var(--color-3); text-transform:uppercase; font-weight:bold; text-transform:uppercase; line-height:100%; display:flex; align-items:center; justify-content:center; font-size:13px; letter-spacing:1.5px;][font=Montserrat]personality[/font][/border]
[comment]----tab button----[/comment]
[border=transparent; height:fit-content; width:100%; background-color: var(--color-4); border-radius:6px; padding:8px 0; color: var(--t-color); text-shadow:0px 0px 3px var(--color-3); text-transform:uppercase; font-weight:bold; text-transform:uppercase; line-height:100%; display:flex; align-items:center; justify-content:center; font-size:13px; letter-spacing:1.5px;][font=Montserrat]backstory[/font][/border]
[comment]----tab button----[/comment]
[border=transparent; height:fit-content; width:100%; background-color: var(--color-4); border-radius:6px; padding:8px 0; color: var(--t-color); text-shadow:0px 0px 3px var(--color-3); text-transform:uppercase; font-weight:bold; text-transform:uppercase; line-height:100%; display:flex; align-items:center; justify-content:center; font-size:13px; letter-spacing:1.5px;][font=Montserrat]miscellaneous[/font][/border]
[/border]
[comment]----tabs cover end----[/comment]
[comment]----filler box----[/comment]
[border=transparent; height:25%; width:100%; padding:0;][/border]
[/border][/border]
[comment]----sidebar cover end----[/comment]
[comment]----recent posts----[/comment]
[border=transparent; height:27%; width:65%; padding:0; position:absolute; bottom:0; right:0;][border=transparent; height:100%; width:100%; padding:0 0 12px 45px; box-sizing:border-box; position:relative; display:flex; flex-flow: row wrap; align-items:center; justify-content:space-around;]
[comment]----header----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0 10px 5px 0; box-sizing:border-box; color: var(--color-3); font-size:12px; text-transform:uppercase; letter-spacing:1px; font-weight:bold; line-height:130%; text-align:right;][font=Montserrat]recent posts :[/font][/border]
[comment]----post seat----[/comment]
[border=transparent; height:80%; width:100%; position:absolute; bottom:-35px; left:0; z-index:1; background: var(--color-4); border-radius:100px 0 0 100px; padding:0;][/border]
[comment]----post----[/comment]
[border=transparent; height:73%; width:46%; background-color:var(--color-1); border-radius:15px; padding:12px 15px 8px 15px; box-sizing:border-box; position:relative; z-index:2; display:flex; flex-flow: column nowrap;]
[comment]----user info----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap;]
[comment]----icon----[/comment]
[border=transparent; height:40px; width:40px; background: var(--img-3); background-size:cover; padding:0; border-radius:50%; flex-shrink:0;][/border]
[comment]----details----[/comment]
[border=transparent; height:fit-content; flex-grow:1; padding:5px 0 0 0; box-sizing:border-box; display:flex; flex-flow: row wrap; margin-left:5px;]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start;]
[border=transparent; height:fit-content; width:fit-content; padding:0; line-height:130%; font-size:12px; color: var(--color-3); text-shadow:0 0 2px var(--color-3); letter-spacing:0.5px;][font=Montserrat][comment]
----you can put another character's name here, or your own character's name
[/comment]character name[/font][/border]
[comment]---post time----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:3px 0 0 0; font-size:8px; color: var(--color-2); display:flex; align-items:center; margin-left:8px;]
[border=transparent; height:3px; width:3px; border-radius:50%; padding:0; background-color: var(--color-2); margin-right:5px; flex-shrink:0;][/border]
[border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-weight:normal; letter-spacing:.5px;][font=Helvetica] #hr[/font][/border]
[/border]
[/border]
[border=transparent; height:fit-content; width:100%; padding:0; line-height:120%; color: var(--t-color); text-transform:uppercase; letter-spacing:0.5px; font-size:7.5px; font-weight:bold;][font=Montserrat][fa]fas fa-map-marker-alt[/fa] location[/font][/border]
[/border]
[comment]----details end----[/comment]
[/border]
[comment]----user info end----[/comment]
[comment]----post content----[/comment]
[border=transparent; flex-grow:1; width:73%; margin-top:5px; padding:0 0 0 2px; box-sizing:border-box; display:flex; flex-flow:column nowrap; align-items:flex-start; justify-content:flex-end;]
[border=transparent; flex-grow:1; width:100%; padding:0; color: var(--t-color); font-size:10px; line-height:110%; overflow:hidden;][font=Helvetica][comment]
---- * * *you can write a short post here, 2 lines max ----
[/comment] short short post
short post
[/font][/border]
[border=transparent; flex-shrink:0; height:fit-content; width:90px; padding:0; color: var(--color-3); margin:auto 0 0 -4px; display:flex; flex-flow: row nowrap; justify-content:space-between;]
[border=transparent; height:fit-content; width:fit-content; padding:0; line-height:110%; font-size:8px;][font=Helvetica][fa]fal fa-heart[/fa] 4.20k[/font][/border]
[border=transparent; height:fit-content; width:fit-content; padding:0; line-height:110%; font-size:8px;][font=Helvetica][fa]fal fa-comments-alt[/fa] 666k[/font][/border]
[/border]
[/border]
[comment]----more pictures----[/comment]
[border=transparent; height:40px; width:40px; padding:0; border-radius:3px; background: var(--color-3) var(--more-img); background-size:cover; background-blend-mode: overlay; position:absolute; bottom:25px; right:18px; display:flex; align-items:center; justify-content:center; line-height:120%; color: var(--color-1); font-size:10px;][font=Helvetica]+2[/font][/border]
[/border]
[comment]----post end----[/comment]
[comment]----post----[/comment]
[border=transparent; height:73%; width:46%; background-color:var(--color-1); border-radius:15px; padding:12px 15px 8px 15px; box-sizing:border-box; position:relative; z-index:2; display:flex; flex-flow: column nowrap;]
[comment]----user info----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap;]
[comment]----icon----[/comment]
[border=transparent; height:40px; width:40px; background: var(--img-4); background-size:cover; padding:0; border-radius:50%; flex-shrink:0;][/border]
[comment]----details----[/comment]
[border=transparent; height:fit-content; flex-grow:1; padding:5px 0 0 0; box-sizing:border-box; display:flex; flex-flow: row wrap; margin-left:5px;]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start;]
[border=transparent; height:fit-content; width:fit-content; padding:0; line-height:130%; font-size:12px; color: var(--color-3); text-shadow:0 0 2px var(--color-3); letter-spacing:0.5px;][font=Montserrat][comment]
----you can put another character's name here, or your own character's name
[/comment]character name[/font][/border]
[comment]---post time----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:3px 0 0 0; font-size:8px; color: var(--color-2); display:flex; align-items:center; margin-left:8px;]
[border=transparent; height:3px; width:3px; border-radius:50%; padding:0; background-color: var(--color-2); margin-right:5px; flex-shrink:0;][/border]
[border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-weight:normal; letter-spacing:.5px;][font=Helvetica] #hr[/font][/border]
[/border]
[/border]
[border=transparent; height:fit-content; width:100%; padding:0; line-height:120%; color: var(--t-color); text-transform:uppercase; letter-spacing:0.5px; font-size:7.5px; font-weight:bold;][font=Montserrat][fa]fas fa-map-marker-alt[/fa] location[/font][/border]
[/border]
[comment]----details end----[/comment]
[/border]
[comment]----user info end----[/comment]
[comment]----post content----[/comment]
[border=transparent; flex-grow:1; width:100%; margin-top:4px; padding:0 0 0 2px; box-sizing:border-box; display:flex; flex-flow: column nowrap; align-items:flex-start; justify-content:flex-end;]
[border=transparent; flex-grow:1; width:100%; padding:0; color: var(--t-color); font-size:9px; line-height:110%; overflow:hidden;][font=Helvetica][comment]
---- * * *you can write a longer post here, 3 lines max ----
[/comment] long post
long long post
post so long
[/font][/border]
[border=transparent; flex-shrink:0; height:fit-content; width:90px; padding:0; color: var(--color-3); margin:auto 0 0 -4px; display:flex; flex-flow: row nowrap; justify-content:space-between;]
[border=transparent; height:fit-content; width:fit-content; padding:0; line-height:110%; font-size:8px;][font=Helvetica][fa]fal fa-heart[/fa] 4.20k[/font][/border]
[border=transparent; height:fit-content; width:fit-content; padding:0; line-height:110%; font-size:8px;][font=Helvetica][fa]fal fa-comments-alt[/fa] 666k[/font][/border]
[/border]
[/border]
[/border]
[comment]----post end----[/comment]
[/border][/border]
[comment]----recent posts end----[/comment]
[comment]----sidebar tabs----[/comment]
[border=transparent; height:100%; width:33%; padding:0; overflow:hidden;][border=transparent; padding:0; margin-left:25px; margin-top:0px; line-height:252%;][tabs]
[tab=homeaaaaaaaaaaaaaaaaaaa][border=transparent; height:100%; width:67%; padding:15px; box-sizing:border-box; position:absolute; top:0; left:0; line-height:0; display:flex; justify-content: flex-end; align-items:flex-start;]
[comment]----text message----[/comment]
[border=transparent; height:12%; width:42%; background-color: var(--color-1); padding:5px 15px 3px 15px; box-sizing:border-box; position:relative; display:flex; flex-flow: row nowrap; border-radius:8px; align-items:center;]
[border=transparent; height:fit-content; width:fit-content; color: var(--color-2); padding:0; text-transform:uppercase; font-size:7px; line-height:110%; position:absolute; top:5px; right:5px; letter-spacing:0.8px; font-weight:bold;][font=Montserrat]new message![/font][/border]
[border=transparent; height:42px; width:42px; padding:0; border-radius:50%; background: var(--img-2); background-size:cover; flex-shrink:0;][/border]
[border=transparent; height:fit-content; flex-grow:1; padding:0; margin-left:8px; display:flex; flex-flow: row wrap; align-content:center;]
[border=transparent; height:fit-content; width:100%; color: var(--color-3); font-size:12px; padding:0; line-height:110%; font-weight:bold;][font=Montserrat]contact name[/font][/border]
[border=transparent; height:fit-content; width:100%; padding:0; color: var(--t-color); font-size:10px; line-height:130%;][font=Helvetica]short text message[/font][/border]
[/border]
[/border]
[/border][/tab]
[comment]----filler tab zone (ignore!)----[/comment]
[tab=aaaaaaaaaaaaaaaaaaaaaaa][border=0; font-size:0;]filler tab[/border][/tab]
[tab=aaaaaaaaaaaaaaaaaaaaaaa][border=0; font-size:0;]filler tab[/border][/tab]
[tab=aaaaaaaaaaaaaaaaaaaaaaa][border=0; font-size:0;]filler tab[/border][/tab]
[tab=aaaaaaaaaaaaaaaaaaaaaaa][border=0; font-size:0;]filler tab[/border][/tab]
[tab=aaaaaaaaaaaaaaaaaaaaaaa][border=0; font-size:0;]filler tab[/border][/tab]
[comment]----filler tab zone end (ignore!)----[/comment]
[comment]----requisite tab----[/comment]
[tab=aaaaaaarequisite][border=transparent; height:85%; width:67%; padding:45px 45px 55px 45px; box-sizing:border-box; position:absolute; top:0; left:0; line-height:0; display:flex;]
[comment]----tab container----[/comment]
[border=transparent; height:100%; width:100%; background-color: var(--bg-color); border-radius:5px; padding:50px 25px 25px 25px; box-sizing:border-box; position:relative;]
[comment]----title----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:11px 18px; box-sizing:border-box; border-radius:23px; position:absolute; top:-16px; left:25px; background-color: var(--bg-color); border:1px solid var(--color-4); font-size:16px; color: var(--color-3); text-transform:uppercase; text-shadow: 1px 1px 3px var(--color-3); display:flex; flex-flow:row nowrap; align-items:center; justify-content:center;]
[border=transparent; padding:0; line-height:90%;][font=Montserrat]requisite[/font][/border]
[/border]
[comment]----tab content (this scrolls!)----[/comment]
[border=transparent; height:100%; width:100%; background-color: var(--color-1); border-radius:15px; padding:11px 0px; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:auto;]
[comment]----basics area----[/comment]
[border=transparent; height:fit-content; width:50%; padding:0 15px; box-sizing:border-box; display:flex; flex-flow: column nowrap;]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; flex-shrink:0; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]full name[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; flex-shrink:0; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]nickname[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; flex-shrink:0; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]birthplace[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[/border]
[comment]----basics area end----[/comment]
[comment]----appearance area----[/comment]
[border=transparent; height:fit-content; width:50%; padding:0 15px; box-sizing:border-box; display:flex; flex-flow: column nowrap; margin-top:15px;]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; flex-shrink:0; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]faceclaim[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; flex-shrink:0; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]height[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[/border]
[comment]----appearance area end----[/comment]
[/border][/border]
[comment]----tab content end----[/comment]
[/border]
[comment]----tab container end----[/comment]
[/border][/tab]
[comment]----requisite tab end----[/comment]
[comment]----personality tab----[/comment]
[tab=aaaaapersonality][border=transparent; height:85%; width:67%; padding:45px 45px 55px 45px; box-sizing:border-box; position:absolute; top:0; left:0; line-height:0; display:flex;]
[comment]----tab container----[/comment]
[border=transparent; height:100%; width:100%; background-color: var(--bg-color); border-radius:5px; padding:50px 25px 25px 25px; box-sizing:border-box; position:relative;]
[comment]----title----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:11px 18px; box-sizing:border-box; border-radius:23px; position:absolute; top:-16px; left:25px; background-color: var(--bg-color); border:1px solid var(--color-4); font-size:16px; color: var(--color-3); text-transform:uppercase; text-shadow: 1px 1px 3px var(--color-3); display:flex; flex-flow:row nowrap; align-items:center; justify-content:center;]
[border=transparent; padding:0; line-height:90%;][font=Montserrat]personality[/font][/border]
[/border]
[comment]----tab content (this scrolls!)----[/comment]
[border=transparent; height:100%; width:100%; background-color: var(--color-1); border-radius:15px; padding:11px 0px; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:auto;]
[comment]----personality area----[/comment]
[border=transparent; height:fit-content; width:50%; padding:0 15px; box-sizing:border-box; display:flex; flex-flow: column nowrap;]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; flex-shrink:0; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]vices[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; flex-shrink:0; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]virtues[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; flex-shrink:0; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]likes[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; flex-shrink:0; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]dislikes[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[/border]
[comment]----personality area end----[/comment]
[/border][/border]
[comment]----tab content end----[/comment]
[/border]
[comment]----tab container end----[/comment]
[/border][/tab]
[comment]----personality tab end----[/comment]
[comment]----backstory tab----[/comment]
[tab=aaaaaabackstory][border=transparent; height:85%; width:67%; padding:45px 45px 55px 45px; box-sizing:border-box; position:absolute; top:0; left:0; line-height:0; display:flex;]
[comment]----tab container----[/comment]
[border=transparent; height:100%; width:100%; background-color: var(--bg-color); border-radius:5px; padding:50px 25px 25px 25px; box-sizing:border-box; position:relative;]
[comment]----title----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:11px 18px; box-sizing:border-box; border-radius:23px; position:absolute; top:-16px; left:25px; background-color: var(--bg-color); border:1px solid var(--color-4); font-size:16px; color: var(--color-3); text-transform:uppercase; text-shadow: 1px 1px 3px var(--color-3); display:flex; flex-flow:row nowrap; align-items:center; justify-content:center;]
[border=transparent; padding:0; line-height:90%;][font=Montserrat]backstory[/font][/border]
[/border]
[comment]----tab content (this scrolls!)----[/comment]
[border=transparent; height:100%; width:100%; background-color: var(--color-1); border-radius:15px; padding:11px 0px; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:auto;]
[comment]----backstory area----[/comment]
[border=transparent; height:fit-content; width:50%; padding:0 15px; box-sizing:border-box; display:flex; flex-flow: column nowrap;]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]history[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]family[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]relations[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[comment]----copy this entire thing if you want to add another tag!!!----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:4px 0;]
[comment]----tag----[/comment]
[border=transparent; height:fit-content; min-width:27%; max-width:40%; padding:0; font-size:13px; color: var(--color-3); text-transform:uppercase; line-height:120%; font-weight:bold; letter-spacing:0.5px;][font=Montserrat][comment]---* * *put in the title of ur info here!----
[/comment]extra[/font][/border]
[comment]----tag content----[/comment]
[border=transparent; height:fit-content; flex-grow:1; margin:1px 0 0 10px; font-size:11px; color: var(--t-color); padding:0; line-height:120%;][font=Helvetica][comment]
----* * *put in the info itself here!----
[/comment]answer[/font][/border]
[/border]
[comment]----up until this comment!----[/comment]
[/border]
[comment]----backstory area end----[/comment]
[/border][/border]
[comment]----tab content end----[/comment]
[/border]
[comment]----tab container end----[/comment]
[/border][/tab]
[comment]----backstory tab end----[/comment]
[comment]----misc tab----[/comment]
[tab=aaamiscellaneous][border=transparent; height:85%; width:67%; padding:0; position:absolute; top:0; left:0; line-height:0;][border=transparent; height:100%; width:100%; padding:40px 40px 5px 35px; box-sizing:border-box; display:flex; flex-flow:row wrap; align-content:space-between;]
[comment]----instagram page----[/comment]
[border=transparent; height:69%; width:65%; background-color: var(--bg-color); border-radius:5px; padding:35px 20px 10px 20px; box-sizing:border-box; position:relative; display:flex; flex-flow: column nowrap;]
[comment]----title----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:11px 25px; box-sizing:border-box; border-radius:23px; position:absolute; top:-16px; left:25px; background-color: var(--bg-color); border:1px solid var(--color-4); font-size:16px; color: var(--color-3); text-transform:uppercase; text-shadow: 1px 1px 3px var(--color-3); display:flex; flex-flow:row nowrap; align-items:center; justify-content:center;]
[border=transparent; padding:0; line-height:90%;][font=Montserrat]misc[/font][/border]
[/border]
[comment]----ig user info----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:center;]
[comment]----icon----[/comment]
[border=transparent; height:75px; width:75px; padding:0; background: var(--img-5); padding:0; background-size:cover; border-radius:50%; flex-shrink:0;][/border]
[comment]----ig details----[/comment]
[border=transparent; height:66%; flex-grow:1; padding:0; margin:0 12px; display:flex; flex-flow: column nowrap;]
[border=transparent; flex-grow:1; width:100%; padding:0 0 5px 0; box-sizing:border-box; display:flex; flex-flow: row nowrap; align-items:center;]
[comment]----posts----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:0; display:flex; flex-flow: row wrap; justify-content:center;]
[border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--color-3); text-shadow:0 0 3px var(--color-4); font-size:11px; line-height:150%; text-shadow:0 0 3px var(--color-4); font-weight:bold;][font=Helvetica]13[/font][/border]
[border=transparent; height:fit-content; width:100%; text-align:center; padding:0; color: var(--t-color); text-transform:uppercase; font-size:6px; line-height:100%;][font=Montserrat]posts[/font][/border]
[/border]
[comment]----followers----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:0; display:flex; flex-flow: row wrap; justify-content:center;]
[border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--color-3); text-shadow:0 0 3px var(--color-4); font-size:11px; line-height:150%; text-shadow:0 0 3px var(--color-4); font-weight:bold;][font=Helvetica]6.9m[/font][/border]
[border=transparent; height:fit-content; width:100%; text-align:center; padding:0; color: var(--t-color); text-transform:uppercase; font-size:6px; line-height:100%;][font=Montserrat]followers[/font][/border]
[/border]
[comment]----following----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:0; display:flex; flex-flow: row wrap; justify-content:center;]
[border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--color-3); text-shadow:0 0 3px var(--color-4); font-size:11px; line-height:150%; text-shadow:0 0 3px var(--color-4); font-weight:bold;][font=Helvetica]420[/font][/border]
[border=transparent; height:fit-content; width:100%; text-align:center; padding:0; color: var(--t-color); text-transform:uppercase; font-size:6px; line-height:100%;][font=Montserrat]following[/font][/border]
[/border]
[/border]
[comment]----ig buttons----[/comment]
[border=transparent; height:25%; max-height:16px; width:100%; max-width:160px; padding:0; box-sizing:border-box; display:flex; position:relative; flex-shrink:0;]
[comment]----button cover----[/comment]
[border=transparent; height:100%; width:100%; background: var(--bg-color); position:absolute; top:0; left:0; padding:0 0 0 5px; box-sizing:border-box; display:flex; flex-flow: row nowrap; justify-content:flex-start; align-items:flex-start; pointer-events:none;]
[border=transparent; height:16px; width:55%; padding:3px 0px; box-sizing:border-box; border:1px solid var(--color-3); border-radius:3px; text-align:center; color: var(--t-color); font-weight:bold; letter-spacing:2px; text-transform:uppercase; line-height:120%; font-size:6px; pointer-events:auto; cursor:pointer;][font=Montserrat]message[/font][/border]
[border=transparent; height:15px; width:16%; padding:3px 0px 3px 3px; box-sizing:border-box; border:1px solid var(--color-3); border-radius:3px; text-align:center; color: var(--t-color); font-weight:bold; letter-spacing:3px; text-transform:uppercase; line-height:100%; font-size:6px; margin:auto;][fa]fas fa-user-check[/fa][/border]
[/border]
[comment]----just for fun lol----[/comment]
[border=transparent; height:100%; width160px; margin-left:auto; padding:0; overflow:hidden; display:flex; flex-flow:nowrap; justify-content:flex-end;][border=transparent; padding:0; margin-left:8px;][tabs]
[tab=.][border=transparent; height:16px; width:35%; padding:3px 0px 0px 2px; position:absolute; top:0; right:5px; border:1px solid var(--follow); box-sizing:border-box; background-color:var(--follow); border-radius:3px; text-align:center; color: var(--color-1); font-weight:bold; letter-spacing:1px; text-transform:uppercase; line-height:120%; font-size:6px; pointer-events:none;][font=Montserrat]follow[/font][/border][/tab]
[tab=.][border=transparent; width:180px; height:0px; padding:0;]h[/border][/tab]
[tab=.][border=transparent; height:16px; width:35%; padding:3px 0px 0px 2px; position:absolute; top:0; right:5px; border:1px solid var(--follow); box-sizing:border-box; background-color:var(--follow); border-radius:3px; text-align:center; color: var(--color-1); font-weight:bold; letter-spacing:1px; text-transform:uppercase; line-height:120%; font-size:6px; pointer-events:none;][font=Montserrat]follow[/font][/border][/tab]
[/tabs][/border][/border]
[/border]
[/border]
[comment]----ig details end----[/comment]
[/border]
[comment]----ig user info end----[/comment]
[comment]----ig bio----[/comment]
[border=transparent; flex-shrink:0; height:fit-content; width:100%; padding:0; line-height:150%; color: var(--color-3); font-size:12px; font-weight:bold; margin-top:3px;][font=Montserrat][comment]
----* * *put your character's display name here----
[/comment]display name[/font][/border]
[border=transparent; flex-shrink:0; height:fit-content; max-height:10px; width:100%; padding:0; line-height:120%; color: var(--t-color); font-size:8px; overflow:hidden; margin-bottom:3px;][font=Helvetica][comment]
----* * *put your character's bio here----
[/comment]short little bio one line only go crazy!!![/font][/border]
[comment]----ig pics (this scrolls!)----[/comment]
[border=transparent; flex-grow:1; width:95%; padding:5px 0 0 0; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll; flex:1;]
[border=transparent; height:auto; width:50%; padding:0; display:flex; flex-flow: row wrap;]
[comment]----row of pics (3 per row)----
copy this entire section to add a new row! edit the numbers next to the img- and add in images with the variables at the top ----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; justify-content:space-between; margin:5px 0 5px -3px;]
[border=transparent; height:70px; width:70px; padding:0; background: var(--img-6); background-size:cover;][/border]
[border=transparent; height:70px; width:70px; padding:0; background: var(--img-7); background-size:cover;][/border]
[border=transparent; height:70px; width:70px; padding:0; background: var(--img-8); background-size:cover;][/border]
[/border]
[comment]----copy me too!---[/comment]
[comment]----row of pics (3 per row)----
copy this entire section to add a new row! edit the numbers next to the img- and add in images with the variables at the top ----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; justify-content:space-between; margin:5px 0 5px -3px;]
[border=transparent; height:70px; width:70px; padding:0; background: var(--img-9); background-size:cover;][/border]
[border=transparent; height:70px; width:70px; padding:0; background: var(--img-10); background-size:cover;][/border]
[border=transparent; height:70px; width:70px; padding:0; background: var(--img-11); background-size:cover;][/border]
[/border]
[comment]----copy me too!---[/comment]
[comment]----row of pics (3 per row)----
copy this entire section to add a new row! edit the numbers next to the img- and add in images with the variables at the top ----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; justify-content:space-between; margin:5px 0 5px -3px;]
[border=transparent; height:70px; width:70px; padding:0; background: var(--img-12); background-size:cover;][/border]
[border=transparent; height:70px; width:70px; padding:0; background: var(--img-13); background-size:cover;][/border]
[border=transparent; height:70px; width:70px; padding:0; background: var(--img-14); background-size:cover;][/border]
[/border]
[comment]----copy me too!---[/comment]
[/border]
[/border][/border]
[/border]
[comment]----instagram page end----[/comment]
[comment]----instagram post----[/comment]
[border=transparent; height:65%; width:41%; background-color: var(--color-1); padding:0; border-radius:15px; position:absolute; right:30px; top:70px; display:flex; flex-flow: column nowrap; overflow:hidden; box-shadow:-1.5px 1px var(--color-4);]
[comment]----user info----[/comment]
[border=transparent; height:13%; width:100%; padding:3px 15px 3px 10px; box-sizing:border-box; display:flex; flex-flow: row nowrap; align-items:center;]
[comment]----post icon----[/comment]
[border=transparent; flex-shrink:0; height:28px; width:28px; padding:0; border-radius:50%; background: var(--img-5); background-size:cover; image-rendering:crisp-edges;][/border]
[comment]----username & location----[/comment]
[border=transparent; flex-grow:1; height:fit-content; padding:0; margin:0 8px; display:flex; flex-flow: column nowrap;]
[border=transparent; height:fit-content; width:100%; padding:0; color: var(--color-3); font-size:11.5px; font-weight:bold; line-height:130%;][font=Montserrat]username[/font][/border]
[border=transparent; height:fit-content; width:100%; padding:0; color: var(--t-color); font-size:6px; font-weight:bold; text-transform:uppercase; line-height:120%; letter-spacing:0.5px;][font=Montserrat]location[/font][/border]
[/border]
[comment]----3 dots lol----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:0; font-size:14px; color: var(--color-3);][fa]fal fa-ellipsis-h[/fa][/border]
[/border]
[comment]----user info end----[/comment]
[comment]----post image----[/comment]
[border=transparent; height:69%; width:100%; padding:0; background: var(--img-post); /*edit the following to adjust the cropping of the image*/ background-position: 50% 50%; background-size:cover; image-rendering:auto;][/border]
[comment]----post interactions----[/comment]
[border=transparent; height:fit-content; width:100%; padding:5px 10px; box-sizing:border-box; font-size:12px; color: var(--color-4); letter-spacing:4px; line-height:130%;][fa]fal fa-heart[/fa] [fa]fal fa-comments-alt[/fa] [fa]fal fa-paper-plane[/fa][/border]
[comment]----post caption----[/comment]
[border=transparent; height:fit-content; width:100%; display:flex; flex-flow: row nowrap; align-items:center; padding:0px 10px; box-sizing:border-box;]
[border=transparent; height:fit-content; width:fit-content; color: var(--color-3); font-weight:bold; font-size:9px; padding:0; line-height:100%;][font=Montserrat]username[/font][/border]
[border=transparent; height:fit-content; flex-grow:1; margin-left:5px; padding:0; font-size:9px; color: var(--t-color); line-height:110%;][font=Helvetica]short caption one line only![/font][/border]
[/border]
[comment]----more comments----[/comment]
[border=transparent; height:fit-content; width:100%; margin-top:auto; padding:0 10px 12px 10px; box-sizing:border-box; color: var(--t-color); text-transform:uppercase; font-size:6px; font-weight:bold; line-height:150%;][font=Montserrat]view all 420 comments[/font][/border]
[/border]
[comment]----instagram post end----[/comment]
[comment]----music player----[/comment]
[border=transparent; height:23%; width:52%; background-color: var(--bg-color); padding:15px 10px; box-sizing:border-box; border-radius:15px; position:relative; display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center; line-height:0;]
[comment]----music player cover----[/comment]
[border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--t-color); font-size:8px; font-weight:bold; text-transform:uppercase; line-height:120%;][font=Montserrat]currently playing[/font][/border]
[border=transparent; height:fit-content; width:100%; padding:0; color: var(--color-3); text-shadow:0 0 2px var(--color-3); font-size:15px; line-height:110%; text-align:center; margin:3px 0;][font=Montserrat][comment]
----* * * put the name of the song here!----
[/comment]made me this way[/font][/border]
[border=transparent; height:fit-content; width:100%; padding:0; color: var(--color-4); text-align:center; letter-spacing:0.2px; font-size:7px; font-weight:bold; text-transform:uppercase; line-height:120%; margin:0 0 8px 0;][font=Montserrat][comment]
---* * * put the artist name here----
[/comment]seraphine[/font][/border]
[comment]----play button----[/comment]
[border=transparent; height:46%; width:70%; padding:0; display:flex; flex-flow: row nowrap; justify-content:space-between; align-items:center; pointer-events:none; position:relative; z-index:4; background-color: var(--bg-color);]
[border=transparent; height:fit-content; width:fit-content; padding:0; font-size:12px; color: var(--t-color); line-height:100%;][fa]fas fa-step-backward[/fa][/border]
[border=transparent; height:30px; width:31px; padding:0; font-size:10px; color: var(--bg-color); background-color: var(--color-4); display:flex; justify-content:center; align-items:center; border-radius:50%; line-height:90%; flex-shrink:0;][fa]fas fa-play[/fa][/border]
[border=transparent; height:fit-content; width:fit-content; padding:0; font-size:12px; color: var(--t-color); line-height:100%;][fa]fas fa-step-forward[/fa][/border]
[/border]
[comment]----actual player (note this is soundcloud only! youtube links will not work!)----[/comment]
[border=transparent; height:20px; width:65px; overflow:hidden; padding:0; position:absolute; z-index:3; bottom:20px; left:100px;][border=transparent; padding:0; margin-top:-10px;]
[media=soundcloud]https://soundcloud.com/seradotwav/made-me-this-way[/media]
[/border][/border]
[/border]
[/border][/border][/tab]
[comment]----misc tab end----[/comment]
[/tabs][/border][/border]
[/border]
[comment]----main container end----[/comment]
[comment]----signature! do not remove!----[/comment][bg=transparent; height:fit-content; padding:0; width:100%; margin:auto; z-index:4;opacity:0.7;font-size:10px;text-align:center; line-height:130%; margin-top:3px; color: var(--color-3); position:absolute; bottom:6px; left:0;][font=Open Sans]♡design by erosful, coded by uxie♡[/font][/bg]
[/border]
[CODE=rich]