Profile
<!--- My first ever profile code ;0; I'm still a beginner though, so there' bound to be mistakes haha- but feel free to ask me questions :D - Put links URLs on parts where it says "LINK" - This version of the code uses bootstrap colors ---> <!--- background [you can just remove this part if you want to] ---> <div style="background-image:url(https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png); background-size: cover; background-repeat: no-repeat; background-position: top; border-radius:15px; background-attachment:fixed;"> <div class="container col-lg-8 pt-5 pb-3"> <div class="row no-gutters my-4"> <!--- COLUMN 1 --> <div class="col-lg-6 p-1"> <div class="bg-faded p-3 text-center" style="min-height: 362px; border-radius: 8px; box-shadow: 0 0 5px #000000;"> <!--- avatar ---> <img class="mx-auto mt-1 mb-2" src="https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png" style="height:130px; width:130px; border-radius:8px;"> <p class="mb-0" style="font-size: 20px;"> <b>Name</b></p> <i class="text-secondary">"Quote Here"</i> <hr style="margin: 10px 0px"> <p class="mb-3">Prn/Prn • Age • Other Info</p> <!-- I suggest using two <br< [twice] instead pf <p> because the code will break --> <p class="mb-0 text-secondary" style="max-height:78px;overflow-y:auto">Short Info Here. It will scroll though. <br><br> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.Some Short Info Here</p> </div> </div> <!--- COLUMN 1 end ---> <!--- COLUMN 2 --> <div class="col-lg-6 no-gutters p-1"> <!--- STATUS --> <div class="bg-faded py-2 px-2" style="height:180px; overflow:hidden; border-radius: 8px; box-shadow: 0 0 5px #000000;"> <p class="mt-2 mb-1 text-center" style="font-size: 18px;"> <b>Status</b></p> <div class="col-12 row no-gutters"> <div class="col-auto pt-1 text-secondary"><i> Requests </i></div> <div class="col mt-2 p-1"><hr class="m-1"></div> <div class="col-auto py-1"> status </div></div> <div class="col-12 row no-gutters"> <div class="col-auto pt-1 text-secondary"><i> Art trades </i></div> <div class="col mt-2 p-1"><hr class="m-1"></div> <div class="col-auto py-1"> status </div></div> <div class="col-12 row no-gutters"> <div class="col-auto pt-1 text-secondary"><i> Design trades </i></div> <div class="col mt-2 p-1"><hr class="m-1"></div> <div class="col-auto py-1"> status </div></div> <div class="col-12 row no-gutters"> <div class="col-auto pt-1 text-secondary"><i> Commissions </i></div> <div class="col mt-2 p-1"><hr class="m-1"></div> <div class="col-auto py-1"> status </div></div> </div> <!--- STATUS end ---> <!--- FOLDERS --> <div class="bg-faded mt-2 px-1 pt-1" style="min-height:105px; overflow-y: auto; border-radius: 8px; box-shadow: 0 0 5px #000000;"> <!--- folder buttons...you can add up yp four buttons until it starts scrolling! ---> <div class="nav nav-fill row no-gutters"> <span class="nav-item m-2 bg-primary" style="border-radius: 8px; height:34px;"> <a href="LINK" class="nav-link btn btn-outline-secondary border-0" style="font-weight:500; color:white; letter-spacing:0.5px; border-radius: 6px; height:34px;">Folder Name</a> </span> <span class="nav-item m-2 bg-primary" style="border-radius: 8px; height:34px;"> <a href="LINK" class="nav-link btn btn-outline-secondary border-0" style="font-weight:500; color:white; letter-spacing:0.5px; border-radius: 6px; height:34px;">Folder Name</a> </span> <span class="nav-item m-2 bg-primary" style="border-radius: 8px; height:34px;"> <a href="LINK" class="nav-link btn btn-outline-secondary border-0" style="font-weight:500; color:white; letter-spacing:0.5px; border-radius: 6px; height:34px;">Folder Name</a> </span> <span class="nav-item m-2 bg-primary" style="border-radius: 8px; height:34px;"> <a href="LINK" class="nav-link btn btn-outline-secondary border-0" style="font-weight:500; color:white; letter-spacing:0.5px; border-radius: 6px; height:34px;">Folder Name</a> </span> </div> <!--- folders buttons end ---> </div> <!--- FOLDERS end ---> <!--- LINKS ---> <div class="bg-faded p-2 mt-2 justify-content-center" style="max-height:60px; overflow-y: auto; border-radius: 8px; box-shadow: 0 0 5px #000000; overflow:hidden;"> <div class="row no-gutters justify-content-center"> <!--- social media icons, you can delete the ones you don't have. You can add more or change social media icons, just go and search for them in https://fontawesome.com/icons. This can hold up to 6 icons and the rest won't fit ---> <span class="btn px-0 border-0 tooltipster" title="Twitch" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="fab fa-2x fa-twitch"></i></a></span> <span class="btn px-0 border-0 tooltipster" title="Artfight" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="fa-solid fa-2x fa-paintbrush-pencil"></i></a></span> <span class="btn px-0 border-0 tooltipster" title="Twitter" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="fab fa-2x fa-twitter"></i></a></span> <span class="btn px-0 border-0 tooltipster" title="Instagram" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="fab fa-2x fa-instagram"></i></a></span> <span class="btn px-0 border-0 tooltipster" title="Discord Tag Here" style="border-radius:8px; height:45px; width:45px;"><a class="text-primary"><i class="fab fa-2x fa-discord"></i></a></span> </div> </div> <!--- LINKS end ---> <!--- don't remove this! It's my credit ---> <span class="btn border-0 pull-right mr-n3"><a class="tooltipster" title="Code by Vsuvi" href="https://toyhou.se/Vsuvi" target="_blank"><i class="far fa-1x fa-code"></i></a></span> </div> <!--- COLUMN 2 end ---> </div> </div> <!--- background end ---> </div> <!--- end --->
Recent Images
No images.