-
-
Save Nefelibatax/17a786fc43e893229b122b2dd121ed37 to your computer and use it in GitHub Desktop.
✱ Hasty Drugs : Profile Set
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- /// READ ME /// | |
| TIP: To change certain items/colors/etc. search the following keywords or Hex colours (e.g. #000000) while in HTML Editor mode. | |
| To do so press CTRL+F or CMD+F and use the keywords in the list to find each section. | |
| [ COLORS ] | |
| • [!] Can't be changed as 'Ripped Paper Texture' is set to this colour // Background Colour : Eerie Black (#161718) | |
| • Light BG Shade : Eerie Black 1.0 (#1b1c1d) | |
| • Lighter BG Shade : Eerie Black 2.0 (#202223) | |
| • Left Section — Sub Catrgory Colour : Davys Grey (#4c4e51) | |
| • Right Section — Categories : Jet (#303234) | |
| • White (#fff) | |
| — Colour Palette: | |
| • Main Colour : Chinese Red (#a0391d) | |
| • Black Shadows (#b2a5a3) | |
| • Roman Silver (#86838e) | |
| • Rich Black FOGRA (#131b22) | |
| [ IMAGES ] | |
| To Change images you can do so in Code by replacing the code in 'SRC' or simply change it in AFF Editor // Main BG can not be changed in editor mode! Please edit through Source | |
| • Background Image : HBGImg (Max-Dimensions:922×465) | |
| • S/O Image : HSOImg (116×116) | |
| [ TEXT ] | |
| • Title : HTitle | |
| • Quote/Sub Title : HQuote | |
| • About : HAbout | |
| • S/O Name : HMainSOName | |
| • S/O Info : HMainSOInfo | |
| • Personal Information : HInfo | |
| • Disclaimer (OOC) : HDisclaimer | |
| [ DIVS ] | |
| • Most Divs are responsive and will adjust on how much you type in so do not adjust heights or widths unless you're familiar with code. | |
| • Music Player : HMusic | |
| ** Replace 'src="https://www.youtube.com/embed/puDfbLgMjfs"' with your own youtube url to change the song! ** | |
| • Adjustable Bars : HBar (4 Should appear, unless more are added) | |
| • Adjustable Colour Palette : HPalette (4 Should appear, unless more are added) | |
| [ MISC ] | |
| • Important sections will be marked for easier adjustments // AFF automatically removes comments in codes so if possible make changes before saving to avoid instructions from disappearing or keep RAW code open on a different tab | |
| --> | |
| <div style="max-width:1014px;margin:auto;"> | |
| <div style="background:#161718;max-width:986px;float:left;border:14px solid #161718;"> | |
| <div style="max-width:986px;float:left;overflow:hidden;"> | |
| <img class="HMainBG" src="https://i.imgur.com/usqB70s.png" style="width:100%;" /> | |
| </div> | |
| <!-- /// MUSIC PLAYER /// --> | |
| <div style="background:#161718;width:20px;height:20px;float:right;margin:-49.4% 15px 0px 0px;line-height:10px;overflow:hidden;"> | |
| <img src="https://img.icons8.com/material-sharp/12/ffffff/play--v1.png" style="margin:4px;" /> | |
| <div class="HMusic" style="width:560;height:315px;float:left;margin:-70px 0px 0px;border-radius:100%;opacity:0.01;"> | |
| <iframe width="560" height="315" src="https://www.youtube.com/embed/puDfbLgMjfs" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> | |
| </div> | |
| </div> | |
| <!-- /// END OF MUSIC PLAYER --> | |
| <div style="max-width:986px;height:120px;float:left;margin:-11.5% 0 0;overflow:hidden;"> | |
| <img src="https://i.imgur.com/If80ZEq.png" style="width:100%" /> | |
| </div> | |
| <!-- /// TITLE AND SUB TITLE /// --> | |
| <div style="max-width:986px;width:100%;float:left;margin:-95px 0px 0px;overflow:hidden;"> | |
| <p class="HTitle" style="font-family:Arial;font-size:65px;color:#a0391d;font-weight:900;text-transform:uppercase;text-align:center;letter-spacing:-1px;line-height:65px;margin:0;"> | |
| Hasty | |
| </p> | |
| <p class="HQuote" style="font-family:Arial;font-size:7px;color:#fff;text-transform:uppercase;text-align:center;line-height:5px;margin:10px 0px;letter-spacing:1px;"> | |
| <span style="border:1px solid #fff;padding:7px 30px;">Are you f*cking kidding me?</span> | |
| </p> | |
| </div> | |
| <!-- /// END OF TITLE AND SUB TITLE /// --> | |
| <!-- /// LEFT CONTENT /// --> | |
| <div style="width:49%;float:left;margin:5% 0;"> | |
| <!-- BACKGROUND/ABOUT --> | |
| <div style="width:100%;float:left;"> | |
| <p style="font-family:Arial;font-size:12px;color:#fff;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:15px;margin:0;"> | |
| <span style="color:#a0391d">✕</span> Basics | |
| </p> | |
| <p class="HAbout" style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:5px 0px 0px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. A iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Blandit libero volutpat sed cras ornare arcu dui. Tellus rutrum tellus pellentesque eu tincidunt tortor. Nibh praesent tristique magna sit amet purus gravida quis blandit. Quam lacus suspendisse faucibus interdum. Massa sed elementum tempus egestas sed sed risus. Amet justo donec enim diam. Lectus sit amet est placerat. Amet volutpat consequat mauris nunc congue nisi vitae suscipit. Dictumst vestibulum rhoncus est pellentesque. Nunc faucibus a pellentesque sit amet porttitor eget dolor. Sollicitudin tempor id eu nisl nunc.<br /><br /> | |
| Sit amet facilisis magna etiam. Orci eu lobortis elementum nibh tellus. Quisque id diam vel quam elementum pulvinar etiam. Amet cursus sit amet dictum sit. Tristique senectus et netus et malesuada fames ac turpis. Sed faucibus turpis in eu mi bibendum neque egestas. Odio pellentesque diam volutpat commodo. Odio euismod lacinia at quis risus. Porttitor massa id neque aliquam vestibulum morbi blandit cursus. Ridiculus mus mauris vitae ultricies leo integer malesuada nunc. A diam maecenas sed enim ut sem viverra aliquet. | |
| </p> | |
| </div> | |
| <!-- END OF BACKGROUND/ABOUT --> | |
| <!-- EXTRA INFO --> | |
| <div style="width:100%;float:left;margin:5% 0px 0px;"> | |
| <p style="font-family:Arial;font-size:12px;color:#fff;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:15px;margin:0;"> | |
| <span style="color:#a0391d">✕</span> Dig Deeper | |
| </p> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:5px 0px 0px;"><b style="color:#4c4e51;font-family:Courier New;font-size:9px;">Personality</b> — Integer quis auctor elit sed vulputate mi sit amet mauris. Tortor pretium viverra suspendisse potenti nullam ac tortor vitae purus. Ornare quam viverra orci sagittis eu volutpat. Ipsum dolor sit amet consectetur adipiscing elit ut aliquam. Euismod quis viverra nibh cras pulvinar mattis nunc sed blandit. | |
| </p> | |
| <div style="width:49%;float:left;"> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:0;"> | |
| <span style="border-bottom:2px solid #a0391d;padding: 0px 2px 3px;line-height:30px;">Likes</span><br /> | |
| ⋄ Her<br /> | |
| ⋄ Buster<br /> | |
| ⋄ Tattoos<br /> | |
| ⋄ Pizza<br /> | |
| ⋄ 8-Bit Video Games<br /> | |
| ⋄ Skateboarding | |
| </p> | |
| </div> | |
| <div style="width:49%;float:left;"> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:0;"> | |
| <span style="border-bottom:2px solid #a0391d;padding: 0px 2px 3px;line-height:30px;">Dislikes</span><br /> | |
| ⋄ Cats<br /> | |
| ⋄ Alcohol<br /> | |
| ⋄ Dairy | |
| </p> | |
| </div> | |
| <div style="width:100%;float:left;margin:5px 0px 0px;"> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:5px 0px 0px;"><b style="color:#4c4e51;font-family:Courier New;font-size:9px;">Appearance</b> — Velit dignissim sodales ut eu sem integer vitae. Urna neque viverra justo nec. Nunc congue nisi vitae suscipit. Augue ut lectus arcu bibendum at varius vel pharetra. Id diam maecenas ultricies mi eget mauris pharetra. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF EXTRA INFO --> | |
| <!-- RELATIONSHIPS --> | |
| <div style="width:100%;float:left;margin:5% 0px 0px;"> | |
| <p style="font-family:Arial;font-size:12px;color:#fff;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:15px;margin:0;"> | |
| <span style="color:#a0391d">✕</span> Connections | |
| </p> | |
| <!-- SIGNIFICANT OTHER --> | |
| <div style="width:100%;float:left;margin:5px 0px 0px;"> | |
| <div style="background:#1b1c1d;width:136px;height:136px;float:left;margin:0px 10px 10px 0px;"> | |
| <div style="width:116px;height:116px;float:left;overflow:hidden;margin:10px;"> | |
| <img class="HSOImg" src="https://i.imgur.com/byjazZq.png" style="width:116px;" /> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:left;letter-spacing:1px;line-height:12px;margin:0;"> | |
| <span class="HMainSOName" style="border-bottom:2px solid #a0391d;padding: 0px 2px 3px;">♡ Her Name</span> | |
| </p> | |
| <p class="HMainSOInfo" style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:10px 0px 5px;">You can't take that ring off anymore. No take backs. Velit dignissim sodales ut eu sem integer vitae. Urna neque viverra justo nec. Nunc congue nisi vitae suscipit. Augue ut lectus arcu bibendum at varius vel pharetra. Id diam maecenas ultricies mi eget mauris pharetra. | |
| </p> | |
| </div> | |
| <!-- END OF SIGNIFICANT OTHER --> | |
| <!-- EXTRA R/S --> | |
| <div style="width:100%;float:left;"> | |
| <!-- SECTION 01 --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:left;border-right:1px solid #202223;"> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:right;letter-spacing:1px;line-height:13px;margin:0 5% 0 0;"><span style="border-bottom:2px solid #a0391d;padding: 0px 2px 3px;line-height:25px;">☆ Buster</span><br />Cutest Pitbull you'll ever meet. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 01 --> | |
| <!-- SECTION 02 --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:right;border-left:1px solid #202223;"> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:left;letter-spacing:1px;line-height:13px;margin:0 0 0 5%;"><span style="border-bottom:2px solid #a0391d;padding: 0px 2px 3px;line-height:25px;">Sample Name Two</span><br /> | |
| Parturient montes nascetur ridiculus mus mauris vitae. Molestie ac feugiat sed lectus vestibulum mattis. Molestie nunc non blandit massa enim nec dui. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 02 --> | |
| <!-- SECTION 03 --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:left;border-right:1px solid #202223;"> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:right;letter-spacing:1px;line-height:13px;margin:0 5% 0 0;"><span style="border-bottom:2px solid #a0391d;padding: 0px 2px 3px;line-height:25px;">Sample Name Three</span><br /> | |
| Turpis egestas pretium aenean pharetra. Sit amet cursus sit amet dictum sit amet. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 03 --> | |
| <!-- SECTION 04 // TO ADD MORE SECTIONS COPY FROM HERE TO END OF *SECTION 05* --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:right;border-left:1px solid #202223;"> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:left;letter-spacing:1px;line-height:13px;margin:0 0 0 5%;"><span style="border-bottom:2px solid #a0391d;padding: 0px 2px 3px;line-height:25px;">Sample Name Four</span><br /> | |
| Dignissim suspendisse in est ante in nibh mauris cursus. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 04 --> | |
| <!-- SECTION 05 --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:left;border-right:1px solid #202223;"> | |
| <p style="font-family:Arial;font-size:8px;color:#fff;text-transform:uppercase;text-align:right;letter-spacing:1px;line-height:13px;margin:0 5% 0 0;"><span style="border-bottom:2px solid #a0391d;padding: 0px 2px 3px;line-height:25px;">Sample Name Five</span><br /> | |
| Sed tempus urna et pharetra pharetra. Vel turpis nunc eget lorem dolor sed viverra. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 05 // ONCE COPIED, PASTE DIRECTLY BELOW THIS LINE --> | |
| </div> | |
| <!-- END OF EXTRA R/S --> | |
| </div> | |
| <!-- END OF RELATIONSHIPS --> | |
| </div> | |
| <!-- /// END OF LEFT CONTENT /// --> | |
| <!-- /// RIGHT CONTENT /// --> | |
| <div style="width:49%;float:right;margin:5% 0;"> | |
| <!-- BIO INFO, STATS, AND TRIVIA --> | |
| <div style="background:#1b1c1d;width:100%;float:left;"> | |
| <!-- BIO INFO --> | |
| <div style="width:90%;float:left;margin:5%;"> | |
| <p style="font-family:Arial;font-size:12px;color:#303234;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:18px;margin:0;"> | |
| Information. | |
| </p> | |
| <p class="HInfo" style="font-family:Arial;font-size:7px;color:#fff;text-transform:uppercase;text-align:left;letter-spacing:1px;line-height:16px;margin:0;"> | |
| <b style="background:#a0391d;padding:2px 3px;">Name</b> Full Name<br /> | |
| <b style="background:#a0391d;padding:2px 3px;">Birthday</b> 00 • 00 • 0000<br /> | |
| <b style="background:#a0391d;padding:2px 3px;">Gender and Sexuality</b> Male, Bisexual<br /> | |
| <b style="background:#a0391d;padding:2px 3px;">Relationship Status</b> Married<br /> | |
| <b style="background:#a0391d;padding:2px 3px;">Nationality</b> Chinese<br /> | |
| <b style="background:#a0391d;padding:2px 3px;">Languages</b> English, Chinese<br /> | |
| <b style="background:#a0391d;padding:2px 3px;">Residency</b> Los Angeles, California <br /> | |
| <b style="background:#a0391d;padding:2px 3px;">Occupation</b> Skateshop Expert<br /> | |
| </p> | |
| </div> | |
| <!-- END OF BIO INFO --> | |
| <!-- STATS // TO CHANGE STATS CHANGE WIDTH OF DIV 'HBAR' TO YOUR DESIRED PERCENT --> | |
| <div style="width:90%;float:left;margin:0 5% 5%;"> | |
| <p style="font-family:Arial;font-size:12px;color:#303234;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:20px;margin:0;"> | |
| mood levels. | |
| </p> | |
| <!-- BAR 01 --> | |
| <div style="background:#202223;border-radius:3px;width:100%;height:10px;float:left;margin:0px 0px 5px;"> | |
| <div class="HBar" style="background:#a0391d;border-radius:5px;width:50%;height:10px;float:leftt;"> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:7px;color:#fff;text-transform:uppercase;text-align:justify;line-height:7px;letter-spacing:1px;margin:0;">Bored (50%) | |
| </p> | |
| <!-- END OF BAR 01 --> | |
| <!-- BAR 02 --> | |
| <div style="background:#202223;border-radius:3px;width:100%;height:10px;float:left;margin:5px 0px;"> | |
| <div class="HBar" style="background:#a0391d;border-radius:5px;width:10%;height:10px;float:leftt;"> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:7px;color:#fff;text-transform:uppercase;text-align:justify;line-height:7px;letter-spacing:1px;margin:0;">Inspiration (10%) | |
| </p> | |
| <!-- END OF BAR 02 --> | |
| <!-- BAR 03 --> | |
| <div style="background:#202223;border-radius:3px;width:100%;height:10px;float:left;margin:5px 0px;"> | |
| <div style="background:#a0391d;border-radius:5px;width:5%;height:10px;float:leftt;"> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:7px;color:#fff;text-transform:uppercase;text-align:justify;line-height:7px;letter-spacing:1px;margin:0;">Online Activity (5%) | |
| </p> | |
| <!-- END OF BAR 03 --> | |
| <!-- BAR 04 // TO ADD MORE COPY FROM HERE TO END OF *BAR 04* --> | |
| <div style="background:#202223;border-radius:3px;width:100%;height:10px;float:left;margin:5px 0px;"> | |
| <div style="background:#a0391d;border-radius:5px;width:100%;height:10px;float:leftt;"> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:7px;color:#fff;text-transform:uppercase;text-align:justify;line-height:7px;letter-spacing:1px;margin:0;">Lurking (100%) | |
| </p> | |
| <!-- END OF BAR 04 // ONCE COPIED, PASTE DIRECTLY BELOW THIS LINE --> | |
| </div> | |
| <!-- END OF STATS --> | |
| <!-- COLOUR PALETTE // TO CHANGE COLOURS REPLACE BACKGROUND COLOUR IN DIV 'HPalette' WITH YOUR DESIRED COLOUR --> | |
| <div style="width:90%;float:left;margin:0 5% 5%;"> | |
| <p style="font-family:Arial;font-size:12px;color:#303234;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:20px;margin:0;"> | |
| colour palette. | |
| </p> | |
| <!-- COLOUR 01 --> | |
| <div class="HPalette" style="background:#b2a5a3;width:49%;height:50px;float:left;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;font-weight:700;text-align:center;letter-spacing:1px;line-height:8px;margin:23px 0px;"> | |
| #b2a5a3 | |
| </p> | |
| </div> | |
| <!-- END OF COLOUR 01 --> | |
| <!-- COLOUR 02 --> | |
| <div class="HPalette" style="background:#86838e;width:49%;height:50px;float:right;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;font-weight:700;text-align:center;letter-spacing:1px;line-height:8px;margin:23px 0px;"> | |
| #86838e | |
| </p> | |
| </div> | |
| <!-- END OF COLOUR 02 --> | |
| <!-- COLOUR 03 // TO ADD MORE COPY FROM HERE TO END OF *COLOUR 04* --> | |
| <div class="HPalette" style="background:#a0391d;width:49%;height:50px;float:left;margin:2% 0 0;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;font-weight:700;text-align:center;letter-spacing:1px;line-height:8px;margin:23px 0px;"> | |
| #a0391d | |
| </p> | |
| </div> | |
| <!-- END OF COLOUR 03 --> | |
| <!-- COLOUR 04 --> | |
| <div class="HPalette" style="background:#131b22;width:49%;height:50px;float:right;margin:2% 0 0;"> | |
| <p style="font-family:Arial;font-size:8px;color:#aaa;text-transform:uppercase;font-weight:700;text-align:center;letter-spacing:1px;line-height:8px;margin:23px 0px;"> | |
| #131b22 | |
| </p> | |
| </div> | |
| <!-- END OF COLOUR 04 // ONCE COPIED, PASTE DIRECTLY BELOW THIS LINE --> | |
| </div> | |
| <!-- END OF COLOUR PALETTE --> | |
| </div> | |
| <!-- END OF BIO INFO, STATS, AND TRIVIA --> | |
| <!-- DISCLAIMER --> | |
| <div style="width:100%;border-top:2px solid #1b1c1d;border-bottom:2px solid #1b1c1d;float:left;margin:5% 0 2%;"> | |
| <p class="HDisclaimer" style="font-family:Arial;font-size:8px;color:#4c4e51;text-transform:uppercase;font-weight:700;text-align:justify;letter-spacing:1px;line-height:12px;margin:2%;"><b style="color:#a0391d;font-family:Courier New;font-size:9px;">[!] Read Me</b><br /> | |
| Felis eget velit aliquet sagittis id. Vestibulum lorem sed risus ultricies tristique nulla aliquet. Nunc mi ipsum faucibus vitae. Ac placerat vestibulum lectus mauris. Scelerisque eleifend donec pretium vulputate sapien. Lacus viverra vitae congue eu consequat ac. At elementum eu facilisis sed odio morbi. Consectetur a erat nam at lectus urna.</p> | |
| <p style="font-family:Arial;font-size:8px;color:#4c4e51;text-transform:uppercase;font-weight:700;text-align:left;letter-spacing:1px;line-height:12px;margin:2%;"> | |
| <span style="border-left:2px solid #a0391d;padding-left:5px;">Writing Stye: Multi-Literacy</span><br /> | |
| <span style="border-left:2px solid #a0391d;padding-left:5px;">Roleplay Preference: Detailed Interactions, No Premade Starters; Plotting preferred </span><br /> | |
| <span style="border-left:2px solid #a0391d;padding-left:5px;">Timezone: GMT +/-00</span><br /> | |
| <span style="border-left:2px solid #a0391d;padding-left:5px;">Age Restrictions: Certain roleplay interactions are limited if below 18</span><br /> | |
| </p> | |
| </div> | |
| <!-- END OF DISCLAIMER --> | |
| <p style="font-family:Arial;font-size:8px;color:#4c4e51;text-transform:uppercase;text-align:right;letter-spacing:0.5px;line-height:11px;margin:0px;"> | |
| <a title="Theme Credit : NT" href="https://www.asianfanfics.com/story/view/528148/nt" style="color:#4c4e51;text-decoration:none;">𝖓𝖙𝖍𝖊𝖒𝖊𝖘.</a> | |
| </p> | |
| </div> | |
| <!-- /// END OF RIGHT CONTENT /// --> | |
| </div> | |
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- /// READ ME /// | |
| TIP: To change certain items/colors/etc. search the following keywords or Hex colours (e.g. #000000) while in HTML Editor mode. | |
| To do so press CTRL+F or CMD+F and use the keywords in the list to find each section. | |
| [ COLORS ] | |
| • [!] Can't be changed as 'Ripped Paper Texture' is set to this colour // Background Colour : Gainsboro (#dadada) | |
| • Light BG Shade : Platinum (#e6e6e6) | |
| • Lighter BG Shade : Cultured (#eee) | |
| • Left Section — Sub Catrgory Colour : White 1.0 (#fcfcfc) | |
| • Right Section — Categories : Gainsboro (#dadada) | |
| • Black (#000) | |
| — Colour Palette: | |
| • Main Colour : Hunter Green (#465c43) | |
| • Black Shadows (#b2a5a3) | |
| • Olive Drab (#53472e) | |
| • Manatee (#99959d) | |
| [ IMAGES ] | |
| To Change images you can do so in Code by replacing the code in 'SRC' or simply change it in AFF Editor // Main BG can not be changed in editor mode! Please edit through Source | |
| • Background Image : HBGImg (Max-Dimensions:922×465) | |
| • S/O Image : HSOImg (116×116) | |
| [ TEXT ] | |
| • Title : HTitle | |
| • Quote/Sub Title : HQuote | |
| • About : HAbout | |
| • S/O Name : HMainSOName | |
| • S/O Info : HMainSOInfo | |
| • Personal Information : HInfo | |
| • Disclaimer (OOC) : HDisclaimer | |
| [ DIVS ] | |
| • Most Divs are responsive and will adjust on how much you type in so do not adjust heights or widths unless you're familiar with code. | |
| • Music Player : HMusic | |
| ** Replace 'src="https://www.youtube.com/embed/IEur84kOKm4"' with your own youtube url to change the song! ** | |
| • Adjustable Bars : HBar (4 Should appear, unless more are added) | |
| •Adjustable Colour Palette : HPalette (4 Should appear, unless more are added) | |
| [ MISC ] | |
| • Important sections will be marked for easier adjustments // AFF automatically removes comments in codes so if possible make changes before saving to avoid instructions from disappearing or keep RAW code open on a different tab | |
| --> | |
| <div style="max-width:1014px;margin:auto;"> | |
| <div style="background:#dadada;max-width:986px;float:left;border:14px solid #dadada;"> | |
| <div style="max-width:986px;float:left;overflow:hidden;"> | |
| <img class="HMainBG" src="https://i.imgur.com/kQloVQE.png" style="width:100%;" /> | |
| </div> | |
| <!-- /// MUSIC PLAYER /// --> | |
| <div style="background:#dadada;width:20px;height:20px;float:right;margin:-49.4% 15px 0px 0px;line-height:10px;overflow:hidden;"> | |
| <img src="https://img.icons8.com/material-sharp/12/000000/play--v1.png" style="margin:4px;" /> | |
| <div class="HMusic" style="width:560;height:315px;float:left;margin:-70px 0px 0px;border-radius:100%;opacity:0.01;"> | |
| <iframe width="560" height="315" src="https://www.youtube.com/embed/IEur84kOKm4" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> | |
| </div> | |
| </div> | |
| <!-- /// END OF MUSIC PLAYER --> | |
| <div style="max-width:986px;height:120px;float:left;margin:-11.5% 0 0;overflow:hidden;"> | |
| <img src="https://i.imgur.com/tq5Q497.png" style="width:100%" /> | |
| </div> | |
| <!-- /// TITLE AND SUB TITLE /// --> | |
| <div style="max-width:986px;width:100%;float:left;margin:-95px 0px 0px;overflow:hidden;"> | |
| <p class="HTitle" style="font-family:Arial;font-size:65px;color:#465c43;font-weight:900;text-transform:uppercase;text-align:center;letter-spacing:-1px;line-height:65px;margin:0;"> | |
| Drugs | |
| </p> | |
| <p class="HQuote" style="font-family:Arial;font-size:7px;color:#000;text-transform:uppercase;text-align:center;line-height:5px;margin:10px 0px;letter-spacing:1px;"> | |
| <span style="border:1px solid #000;padding:7px 30px;">Only need it sorta kinda</span> | |
| </p> | |
| </div> | |
| <!-- /// END OF TITLE AND SUB TITLE /// --> | |
| <!-- /// LEFT CONTENT /// --> | |
| <div style="width:49%;float:left;margin:5% 0;"> | |
| <!-- BACKGROUND/ABOUT --> | |
| <div style="width:100%;float:left;"> | |
| <p style="font-family:Arial;font-size:12px;color:#000;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:15px;margin:0;"> | |
| <span style="color:#465c43">✱</span> From the Start | |
| </p> | |
| <p class="HAbout" style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:5px 0px 0px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. A iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Blandit libero volutpat sed cras ornare arcu dui. Tellus rutrum tellus pellentesque eu tincidunt tortor. Nibh praesent tristique magna sit amet purus gravida quis blandit. Quam lacus suspendisse faucibus interdum. Massa sed elementum tempus egestas sed sed risus. Amet justo donec enim diam. Lectus sit amet est placerat. Amet volutpat consequat mauris nunc congue nisi vitae suscipit. Dictumst vestibulum rhoncus est pellentesque. Nunc faucibus a pellentesque sit amet porttitor eget dolor. Sollicitudin tempor id eu nisl nunc.<br /><br /> | |
| Sit amet facilisis magna etiam. Orci eu lobortis elementum nibh tellus. Quisque id diam vel quam elementum pulvinar etiam. Amet cursus sit amet dictum sit. Tristique senectus et netus et malesuada fames ac turpis. Sed faucibus turpis in eu mi bibendum neque egestas. Odio pellentesque diam volutpat commodo. Odio euismod lacinia at quis risus. Porttitor massa id neque aliquam vestibulum morbi blandit cursus. Ridiculus mus mauris vitae ultricies leo integer malesuada nunc. A diam maecenas sed enim ut sem viverra aliquet. | |
| </p> | |
| </div> | |
| <!-- END OF BACKGROUND/ABOUT --> | |
| <!-- EXTRA INFO --> | |
| <div style="width:100%;float:left;margin:5% 0px 0px;"> | |
| <p style="font-family:Arial;font-size:12px;color:#000;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:15px;margin:0;"> | |
| <span style="color:#465c43">✱</span> Nitty Gritty | |
| </p> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:5px 0px 0px;"><b style="color:#fcfcfc;font-family:Courier New;font-size:9px;">Personality</b> — Integer quis auctor elit sed vulputate mi sit amet mauris. Tortor pretium viverra suspendisse potenti nullam ac tortor vitae purus. Ornare quam viverra orci sagittis eu volutpat. Ipsum dolor sit amet consectetur adipiscing elit ut aliquam. Euismod quis viverra nibh cras pulvinar mattis nunc sed blandit. | |
| </p> | |
| <div style="width:49%;float:left;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:0;"> | |
| <span style="border-bottom:2px solid #465c43;padding: 0px 2px 3px;line-height:30px;">Likes</span><br /> | |
| ⋄ Him<br /> | |
| ⋄ Cinammon and Farina<br /> | |
| ⋄ Record Players<br /> | |
| ⋄ Pottery<br /> | |
| ⋄ Pasta<br /> | |
| ⋄ Recreational Drugs<br/> | |
| ⋄ Long Drives | |
| </p> | |
| </div> | |
| <div style="width:49%;float:left;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:0;"> | |
| <span style="border-bottom:2px solid #465c43;padding: 0px 2px 3px;line-height:30px;">Dislikes</span><br /> | |
| ⋄ House Pets<br /> | |
| ⋄ Naggy Upstairs Neighbour<br /> | |
| ⋄ Summer<br/> | |
| ⋄ E-readers | |
| </p> | |
| </div> | |
| <div style="width:100%;float:left;margin:5px 0px 0px;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:5px 0px 0px;"><b style="color:#fcfcfc;font-family:Courier New;font-size:9px;">Appearance</b> — Velit dignissim sodales ut eu sem integer vitae. Urna neque viverra justo nec. Nunc congue nisi vitae suscipit. Augue ut lectus arcu bibendum at varius vel pharetra. Id diam maecenas ultricies mi eget mauris pharetra. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF EXTRA INFO --> | |
| <!-- RELATIONSHIPS --> | |
| <div style="width:100%;float:left;margin:5% 0px 0px;"> | |
| <p style="font-family:Arial;font-size:12px;color:#000;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:15px;margin:0;"> | |
| <span style="color:#465c43">✱</span> Connections | |
| </p> | |
| <!-- SIGNIFICANT OTHER --> | |
| <div style="width:100%;float:left;margin:5px 0px 0px;"> | |
| <div style="background:#e6e6e6;width:136px;height:136px;float:left;margin:0px 10px 10px 0px;"> | |
| <div style="width:116px;height:116px;float:left;overflow:hidden;margin:10px;"> | |
| <img class="HSOImg" src="https://i.imgur.com/empcv2U.png" style="width:116px;" /> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:left;letter-spacing:1px;line-height:12px;margin:0;"> | |
| <span class="HMainSOName" style="border-bottom:2px solid #465c43;padding: 0px 2px 3px;">♡ His Name</span> | |
| </p> | |
| <p class="HMainSOInfo" style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:justify;letter-spacing:1px;line-height:12px;margin:10px 0px 5px;">Maybe I do like you — Just maybe. Velit dignissim sodales ut eu sem integer vitae. Urna neque viverra justo nec. Nunc congue nisi vitae suscipit. Augue ut lectus arcu bibendum at varius vel pharetra. Id diam maecenas ultricies mi eget mauris pharetra. | |
| </p> | |
| </div> | |
| <!-- END OF SIGNIFICANT OTHER --> | |
| <!-- EXTRA R/S --> | |
| <div style="width:100%;float:left;"> | |
| <!-- SECTION 01 --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:left;border-right:1px solid #eee;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:right;letter-spacing:1px;line-height:13px;margin:0 5% 0 0;"><span style="border-bottom:2px solid #465c43;padding: 0px 2px 3px;line-height:25px;">☆ Cinammon</span><br /> | |
| First adopted Elephant. A goofball. The best LDR I've been in. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 01 --> | |
| <!-- SECTION 02 --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:right;border-left:1px solid #eee;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:left;letter-spacing:1px;line-height:13px;margin:0 0 0 5%;"><span style="border-bottom:2px solid #465c43;padding: 0px 2px 3px;line-height:25px;">☆ Farina</span><br /> | |
| Most recent elephant adoption. I can't wait to meet you; | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 02 --> | |
| <!-- SECTION 03 --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:left;border-right:1px solid #eee;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:right;letter-spacing:1px;line-height:13px;margin:0 5% 0 0;"><span style="border-bottom:2px solid #465c43;padding: 0px 2px 3px;line-height:25px;">Sample Name One</span><br /> | |
| Turpis egestas pretium aenean pharetra. Sit amet cursus sit amet dictum sit amet. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 03 --> | |
| <!-- SECTION 04 // TO ADD MORE SECTIONS COPY FROM HERE TO END OF *SECTION 05* --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:right;border-left:1px solid #eee;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:left;letter-spacing:1px;line-height:13px;margin:0 0 0 5%;"><span style="border-bottom:2px solid #465c43;padding: 0px 2px 3px;line-height:25px;">Sample Name Two</span><br /> | |
| Dignissim suspendisse in est ante in nibh mauris cursus. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 04 --> | |
| <!-- SECTION 05 --> | |
| <div style="width:100%;float:left;"> | |
| <div style="width:49.90%;float:left;border-right:1px solid #eee;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;text-align:right;letter-spacing:1px;line-height:13px;margin:0 5% 0 0;"><span style="border-bottom:2px solid #465c43;padding: 0px 2px 3px;line-height:25px;">Sample Name Three</span><br /> | |
| Sed tempus urna et pharetra pharetra. Vel turpis nunc eget lorem dolor sed viverra. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- END OF SECTION 05 // ONCE COPIED, PASTE DIRECTLY BELOW THIS LINE --> | |
| </div> | |
| <!-- END OF EXTRA R/S --> | |
| </div> | |
| <!-- END OF RELATIONSHIPS --> | |
| </div> | |
| <!-- /// END OF LEFT CONTENT /// --> | |
| <!-- /// RIGHT CONTENT /// --> | |
| <div style="width:49%;float:right;margin:5% 0;"> | |
| <!-- BIO INFO, STATS, AND TRIVIA --> | |
| <div style="background:#e6e6e6;width:100%;float:left;"> | |
| <!-- BIO INFO --> | |
| <div style="width:90%;float:left;margin:5%;"> | |
| <p style="font-family:Arial;font-size:12px;color:#787878;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:18px;margin:0;"> | |
| Information. | |
| </p> | |
| <p class="HInfo" style="font-family:Arial;font-size:7px;color:#000;text-transform:uppercase;text-align:left;letter-spacing:1px;line-height:16px;margin:0;"> | |
| <b style="background:#465c43;padding:2px 3px;">Name</b> Full Name<br /> | |
| <b style="background:#465c43;padding:2px 3px;">Birthday</b> 00 • 00 • 0000<br /> | |
| <b style="background:#465c43;padding:2px 3px;">Gender and Sexuality</b> Male, Homosexual<br /> | |
| <b style="background:#465c43;padding:2px 3px;">Relationship Status</b> It's Complicated<br /> | |
| <b style="background:#465c43;padding:2px 3px;">Nationality</b> Irish<br /> | |
| <b style="background:#465c43;padding:2px 3px;">Languages</b> English<br /> | |
| <b style="background:#465c43;padding:2px 3px;">Residency</b> London, England <br /> | |
| <b style="background:#465c43;padding:2px 3px;">Occupation</b> Grocery Clerk<br /> | |
| </p> | |
| </div> | |
| <!-- END OF BIO INFO --> | |
| <!-- STATS // TO CHANGE STATS CHANGE WIDTH OF DIV 'HBAR' TO YOUR DESIRED PERCENT --> | |
| <div style="width:90%;float:left;margin:0 5% 5%;"> | |
| <p style="font-family:Arial;font-size:12px;color:#787878;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:20px;margin:0;"> | |
| mood levels. | |
| </p> | |
| <!-- BAR 01 --> | |
| <div style="background:#eee;border-radius:3px;width:100%;height:10px;float:left;margin:0px 0px 5px;"> | |
| <div class="HBar" style="background:#465c43;border-radius:5px;width:80%;height:10px;float:leftt;"> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:7px;color:#000;text-transform:uppercase;text-align:justify;line-height:7px;letter-spacing:1px;margin:0;">Bored (80%) | |
| </p> | |
| <!-- END OF BAR 01 --> | |
| <!-- BAR 02 --> | |
| <div style="background:#eee;border-radius:3px;width:100%;height:10px;float:left;margin:5px 0px;"> | |
| <div class="HBar" style="background:#465c43;border-radius:5px;width:0%;height:10px;float:leftt;"> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:7px;color:#000;text-transform:uppercase;text-align:justify;line-height:7px;letter-spacing:1px;margin:0;">Inspiration (0%) | |
| </p> | |
| <!-- END OF BAR 02 --> | |
| <!-- BAR 03 --> | |
| <div style="background:#eee;border-radius:3px;width:100%;height:10px;float:left;margin:5px 0px;"> | |
| <div style="background:#465c43;border-radius:5px;width:25%;height:10px;float:leftt;"> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:7px;color:#000;text-transform:uppercase;text-align:justify;line-height:7px;letter-spacing:1px;margin:0;">Online Activity (25%) | |
| </p> | |
| <!-- END OF BAR 03 --> | |
| <!-- BAR 04 // TO ADD MORE COPY FROM HERE TO END OF *BAR 04* --> | |
| <div style="background:#eee;border-radius:3px;width:100%;height:10px;float:left;margin:5px 0px;"> | |
| <div style="background:#465c43;border-radius:5px;width:10%;height:10px;float:leftt;"> | |
| </div> | |
| </div> | |
| <p style="font-family:Arial;font-size:7px;color:#000;text-transform:uppercase;text-align:justify;line-height:7px;letter-spacing:1px;margin:0;">Lurking (10%) | |
| </p> | |
| <!-- END OF BAR 04 // ONCE COPIED, PASTE DIRECTLY BELOW THIS LINE --> | |
| </div> | |
| <!-- END OF STATS --> | |
| <!-- COLOUR PALETTE // TO CHANGE COLOURS REPLACE BACKGROUND COLOUR IN DIV 'HPalette' WITH YOUR DESIRED COLOUR --> | |
| <div style="width:90%;float:left;margin:0 5% 5%;"> | |
| <p style="font-family:Arial;font-size:12px;color:#787878;font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:20px;margin:0;"> | |
| colour palette. | |
| </p> | |
| <!-- COLOUR 01 --> | |
| <div class="HPalette" style="background:#b2a5a3;width:49%;height:50px;float:left;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;font-weight:700;text-align:center;letter-spacing:1px;line-height:8px;margin:23px 0px;"> | |
| #b2a5a3 | |
| </p> | |
| </div> | |
| <!-- END OF COLOUR 01 --> | |
| <!-- COLOUR 02 --> | |
| <div class="HPalette" style="background:#53472e;width:49%;height:50px;float:right;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;font-weight:700;text-align:center;letter-spacing:1px;line-height:8px;margin:23px 0px;"> | |
| #53472e | |
| </p> | |
| </div> | |
| <!-- END OF COLOUR 02 --> | |
| <!-- COLOUR 03 // TO ADD MORE COPY FROM HERE TO END OF *COLOUR 04* --> | |
| <div class="HPalette" style="background:#465c43;width:49%;height:50px;float:left;margin:2% 0 0;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;font-weight:700;text-align:center;letter-spacing:1px;line-height:8px;margin:23px 0px;"> | |
| #465c43 | |
| </p> | |
| </div> | |
| <!-- END OF COLOUR 03 --> | |
| <!-- COLOUR 04 --> | |
| <div class="HPalette" style="background:#99959d;width:49%;height:50px;float:right;margin:2% 0 0;"> | |
| <p style="font-family:Arial;font-size:8px;color:#000;text-transform:uppercase;font-weight:700;text-align:center;letter-spacing:1px;line-height:8px;margin:23px 0px;"> | |
| #99959d | |
| </p> | |
| </div> | |
| <!-- END OF COLOUR 04 // ONCE COPIED, PASTE DIRECTLY BELOW THIS LINE --> | |
| </div> | |
| <!-- END OF COLOUR PALETTE --> | |
| </div> | |
| <!-- END OF BIO INFO, STATS, AND TRIVIA --> | |
| <!-- DISCLAIMER --> | |
| <div style="width:100%;border-top:2px solid #e6e6e6;border-bottom:2px solid #e6e6e6;float:left;margin:5% 0 2%;"> | |
| <p class="HDisclaimer" style="font-family:Arial;font-size:8px;color:#fcfcfc;text-transform:uppercase;font-weight:700;text-align:justify;letter-spacing:1px;line-height:12px;margin:2%;"><b style="color:#465c43;font-family:Courier New;font-size:9px;">[!] Read Me</b><br /> | |
| Felis eget velit aliquet sagittis id. Vestibulum lorem sed risus ultricies tristique nulla aliquet. Nunc mi ipsum faucibus vitae. Ac placerat vestibulum lectus mauris. Scelerisque eleifend donec pretium vulputate sapien. Lacus viverra vitae congue eu consequat ac. At elementum eu facilisis sed odio morbi. Consectetur a erat nam at lectus urna.</p> | |
| <p style="font-family:Arial;font-size:8px;color:#fcfcfc;text-transform:uppercase;font-weight:700;text-align:left;letter-spacing:1px;line-height:12px;margin:2%;"> | |
| <span style="border-left:2px solid #465c43;padding-left:5px;">Writing Stye: Multi-Literacy</span><br /> | |
| <span style="border-left:2px solid #465c43;padding-left:5px;">Roleplay Preference: Detailed Interactions, No Premade Starters; Plotting preferred </span><br /> | |
| <span style="border-left:2px solid #465c43;padding-left:5px;">Timezone: GMT +/-00</span><br /> | |
| <span style="border-left:2px solid #465c43;padding-left:5px;">Age Restrictions: Certain roleplay interactions are limited if below 18</span><br /> | |
| </p> | |
| </div> | |
| <!-- END OF DISCLAIMER --> | |
| <p style="font-family:Arial;font-size:8px;color:#fcfcfc;text-transform:uppercase;text-align:right;letter-spacing:0.5px;line-height:11px;margin:0px;"> | |
| <a title="Theme Credit : NT" href="https://www.asianfanfics.com/story/view/528148/nt" style="color:#fcfcfc;text-decoration:none;">𝖓𝖙𝖍𝖊𝖒𝖊𝖘.</a> | |
| </p> | |
| </div> | |
| <!-- /// END OF RIGHT CONTENT /// --> | |
| </div> | |
| </div> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment