Здесь делается вжух 🪄

Test by devls

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Test by devls » страниу » соц сети


соц сети

Сообщений 11 страница 20 из 30

11

[html]<center><div id="YOURCHAR'S-IG"><div class="comvers">
<a href="http://cttw.jcink.net/index.php?showuser=100" target="_blank"><img src="http://files.jcink.net/uploads/berryskellington//liked_comment_JPG.jpg" width="310" style="border-radius: 5px;"></a>
<div class="commsect">
<img src="https://upforme.ru/uploads/000c/73/14/2/742371.jpg" width="80"></-any square image would do. it will resize-/>
<div class="actcomm">

<b>yourchar'susername</b> it's gonna scroll so you can comment that awesome post for as long as you like. <b>@username</b> for tagging and   <i>#hashbrowns</i>
!!!!  better if you quote the post, remove the

parts and add this comment;)  !!!!

</div>
</div>
</div></center><style type="text/css">.comvers { width: 315px; background-color: #fff; border-radius: 10px; border: 1px solid #ccc;} .commsect { width: 294px; height: 90px; padding: 8px; background-color: #fff; position: relative; text-align: left; border-radius: 5px;} .commsect img { border-radius: 100px; }
.actcomm { width: 200px; font-family: 'Noto Sans', sans-serif; font-size: 11px; color: #222; line-height: 10.5px; text-align: justify; position: relative; top: -75px; left: 45px; height: 80px; overflow: auto; } .actcomm i { color: #093351; font-family: 'Calibri'; font-size: 12px;}  .actcomm b { color: #222; font-family: 'Calibri'; font-size: 12px; font-weight: 800; } .actcomm::-webkit-scrollbar { background:transparent; width: 2px; padding-right: 3px; }  .actcomm::-webkit-scrollbar-thumb { background: #ccc; border-radius: 20px; } .actcomm::-webkit-scrollbar-button:start:decrement;
.actcomm::-webkit-scrollbar-button:end:increment { height: 3px; display: block; background:transparent; }</style><link href='https://fonts.googleapis.com/css?family=Noto+Sans:400,700' rel='stylesheet' type='text/css'>
[/html]

12

Код:
<!--HTML--><div class="bt-instagram bt-instacolores"><div class="btinsta-barra"><div><span class="sf sf-chevron-left"></span><b>volver al inicio.</b></div><div class="btinsta-seguir">seguir +</div></div><div class="btinsta-portada"><div class="btinsta-imagen"><img src="https://upforme.ru/uploads/000c/73/14/2/742371.jpg"/></div><div class="btinsta-datos"><instauser>bettyleg</instauser><instadescr>Um, I'm happy you're home. Yeah, I want a date with Bo Derek. We all want things. Mistakes have been made. Don’t take it so personally, okay? I don’t like most people.</instadescr>
<instalink><span class="sf sf-link-1-o"></span><a href="">https://www.bettyleg.tumblr.com</a></instalink></div></div><div class="btinsta-galeria"><img src="https://upforme.ru/uploads/000c/73/14/2/463572.jpg"/><img src="https://upforme.ru/uploads/000c/73/14/2/948014.jpg"/><img src="https://upforme.ru/uploads/000c/73/14/2/315764.jpg"/><img src="https://upforme.ru/uploads/000c/73/14/2/91416.jpg"/><img src="https://upforme.ru/uploads/000c/73/14/2/34062.jpg"/><img src="https://upforme.ru/uploads/000c/73/14/2/119982.jpg"/></div></div>
 
<link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&family=Hind&display=swap" rel="stylesheet"><style>.bt-instacolores{--bti-acento1:#a42e6e; --bti-acento2:#42429a;}.bt-instagram > div:not(.instadescr) br{display:none} .bt-instagram{width:540px; border:1px solid #ccc; background:#fff; margin:10px auto; border-radius:20px; font-family:'Hind'; overflow:hidden; background:#fff;} .btinsta-portada{padding:40px; display:flex; align-items:center;} .btinsta-imagen > img{width:120px; height:120px; border-radius:180px; display:block; padding:5px; background:#fff} .btinsta-imagen{width:130px; height:130px;background: linear-gradient(var(--bti-acento1),var(--bti-acento2)); border-radius:180px; padding:6px;} .btinsta-datos{width:380px; max-height:140px;overflow:hidden; margin-left:30px;} .btinsta-datos > instauser{font-weight:700; font-size:20px; font-family:'Hammersmith One'; color:#777; display:block; } .btinsta-datos > instadescr{line-height:16px; display:block; font-size:13.5px; padding:10px 0px 5px; color:#555;} .btinsta-datos > instalink{ font-size:12px; align-items:center;} .btinsta-datos > instalink span{color:var(--bti-acento1); padding-right:10px; font-size:12px;} .btinsta-datos > instalink a{color:var(--bti-acento2); text-decoration:none;} .btinsta-barra{height:40px; border-bottom:1px solid #ddd; display:flex; align-items:center; padding:0px 20px; color:#777; font-size:12px; justify-content:space-between;}.btinsta-barra div > span{padding-right:10px; font-size:10px;} .btinsta-galeria {border-top:1px solid #ccc; display:flex; flex-wrap:wrap; padding:15px 20px 40px; background:#fcfcfc} .btinsta-galeria img{width:145px; height:145px; margin:20px 10px 0px 10px; border-radius:10px;} .btinsta-seguir{width:130px; height:20px; display:flex; align-items:center; justify-content:center; border:1px solid #ccc; border-radius:10px; background:#fafafa; text-transform:uppercase; font-weight:800; color:var(--bti-acento1); letter-spacing:2px; font-size:11px;}.bettycred{display:block; margin:-20px auto 0px; border:1px solid #ddd; width:100px; padding:5px 0px; font-size:8px;text-transform:uppercase; text-align:center; letter-spacing:2px;background:#fff; color:#999; text-decoration:none;}</style>

13

Код:
<!--HTML--><div class="bt-instagramp bt-instacolores"><div class="btinstap-header1"><div><img src="https://upforme.ru/uploads/000c/73/14/2/742371.jpg"><span><b style="color:#a42e6e">bettyleg</b>Roma, Italia</span></div><span class="sf sf-more-o"></span></div><div class="btinstap-img"><img src="https://upforme.ru/uploads/000c/73/14/2/523017.jpg"></div><div class="btinstap-icons"><div><span class="sf sf-heart-o"></span><span class="sf sf-chat-o"></span><span class="sf sf-paper-plane-o"></span></div><span class="sf sf-bookmark-o"></span></div><div class="btinstap-descrip">Don’t take it so personally, okay? I don’t like most people.</div></div>
 
<link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&family=Hind&display=swap" rel="stylesheet">
<style>.bt-instagramp{width:400px; border:1px solid #ccc; border-radius:15px; margin:10px auto; font-family:'Hind'; background:#fff;}
.bt-instagramp > div:not(.btinstap-descrip) br{display:none;} 
.btinstap-header1 {height:90px; border-bottom:1px solid #ccc; display:flex; align-items:center; padding:0px 20px; justify-content:space-between;} 
.btinstap-header1 div > img{width:60px; height:60px; border-radius:180px; border:1px solid #ccc; display:block; padding:3px;}
.btinstap-header1 > div{display:flex; align-items:center; line-height:17px;     margin-left: 22px;} 
.btinstap-header1 > div span{padding-left:20px; font-size:13px; color:#888;} 
.btinstap-header1 > div span b{font-family:'Hammersmith One'; display:block; font-size:18px; color:var(--bti-acento1);} 
.btinstap-header1 >.sf{color:#555; font-size:18px;} 
.btinstap-img{height:400px; width:400px; border-bottom:1px solid #ccc;} 
.btinstap-icons{display:flex; align-items:center; justify-content:space-between; /*padding:0px 20px;*/ height:50px; width: 476px;    margin-left: -58px;} 
.btinstap-icons span{font-size:20px; padding-left:23px; color:#777; font-weight:500;} 
.btinstap-descrip{width:360px; margin:0px auto; line-height:16px; font-size:13px; padding:0px 0px 30px; color:#555;} 
.btinstap-img,.btinstap-img img{width:400px; height:400px;}.bettycred{display:block; margin:-20px auto 0px; border:1px solid #ddd; width:100px; padding:5px 0px; font-size:8px;text-transform:uppercase; text-align:center; letter-spacing:2px;background:#fff; color:#999; text-decoration:none;}</style>

14

Код:
<!--HTML--><div class="bt-instagramp bt-instacolores"><div class="btinstap-header2" style="border-bottom:0;"><div><img src="https://upforme.ru/uploads/000c/73/14/2/742371.jpg"><span><b style="color:#a42e6e">bettyleg</b>4h</span></div></div><div class="btinstap-descrip" style="margin-left:110px; width:260px; margin-top:-20px;">Don’t take it so personally, okay? I don’t like most people.</div></div>
 
<link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&family=Hind&display=swap" rel="stylesheet"><style>
.bt-instagramp{width:400px; border:1px solid #ccc; border-radius:15px; margin:10px auto; font-family:'Hind';background:#fff;} 
.bt-instagramp > div:not(.btinstap-descrip) br{display:none;} 
.btinstap-header2{height:90px; border-bottom:1px solid #ccc; display:flex; align-items:center; padding:0px 20px; justify-content:space-between;} 
.btinstap-header2 div > img{width:60px; height:60px; border-radius:180px; border:1px solid #ccc; display:block; padding:3px;}
.btinstap-header2 > div{display:flex; align-items:center; line-height:17px;margin-left: -4px;} 
.btinstap-header2 > div span{padding-left:20px; font-size:13px; color:#888; margin-left: -4px;} 
.btinstap-header2 > div span b{font-family:'Hammersmith One'; display:block; font-size:18px; color:var(--bti-acento1);} 
.btinstap-header2 >.sf{color:#555; font-size:18px;}.btinstap-descrip{width:360px; margin:0px auto; line-height:16px; font-size:13px; padding:0px 0px 30px; color:#555;} 
.btinstap-img{width:400px; height:400px;}.</style>

15

[html]<div class="bt-tiktokb-acc" style="--accent: #a987a8;--background: #222;--color: #fff;">
<div class="bt-tiktokacc1-header"><img src="https://via.placeholder.com/90x90"><a href="#" id="tiktokbt-i1"><i class="fa-brands fa-instagram"></i></a><a href="#" id="tiktokbt-i2"><i class="fa-brands fa-twitter"></i></a></div>

<div class="bt-tiktokacc1-user"><a style="color:var(--accent)">@bettyleg</a><span>this girl is on fire</span></div>

<div class="bt-tiktokacc1-info"><div><b>30k</b><span>following</span></div><div><b>32K</b><span>followers</span></div><div><b>10K</b><span>likes</span></div></div>

<div class="bt-tiktokacc1-videos">

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div><div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>
</div>

</div>

<link href="https://fonts.googleapis.com/css2?family=Fira+Sans:ital@1&family=Poppins:wght@500;600&display=swap" rel="stylesheet"/><script src="https://kit.fontawesome.com/1427d036f5.js" crossorigin="anonymous"></script>
<style>.bt-tiktokb-acc > br, .bt-tiktokacc1-videos > br{display:none;}
.bt-tiktokb-acc {    width: 313px;    border: 1px solid #ccc;    margin: 10px auto;    border-radius: 20px;    background: var(--background);    overflow: hidden;    box-sizing: border-box;    height: 500px;    box-shadow: 2px 2px 10px #0007;}
.bt-tiktokacc1-header{height: 95px; width: 100%; background: linear-gradient(0deg, transparent 10%, var(--accent) 100%); display: flex; position: relative; align-items: center; justify-content: center; margin-bottom: 40px;}
.bt-tiktokacc1-header > img{width: 90px; height: 90px; border-radius: 100%; border: 5px solid var(--background); margin: auto; background: var(--background); padding: 1px; margin-top: 30px;}
.bt-tiktokacc1-user{padding: 5px 20px; text-align: center; font-family: 'Poppins'; line-height: 10px; display: flex; align-items: center; justify-content: center; flex-direction: column; color: var(--color); height: 60px; overflow: hidden;}
.bt-tiktokacc1-user > a{color: var(--accent); font-weight: 600; font-size: 16px;}
.bt-tiktokacc1-user > span{font-size: 10px; margin-top: 8px; line-height: 100%; font-family: 'Poppins';}
.bt-tiktokacc1-info{display: flex; align-items: center; justify-content: center; padding: 5px 10px 10px; gap: 25px;}
.bt-tiktokacc1-info > div{display: flex; align-items: center; justify-content: center; flex-direction: column; line-height: 14px; color: var(--color);}
.bt-tiktokacc1-info b{font-size: 14px; font-family: 'Poppins'; letter-spacing: 2px; font-weight: 700;}
.bt-tiktokacc1-info span{text-transform: uppercase; font-size: 9px; font-weight: 700; letter-spacing: 1px;}
.bt-tiktokacc1-videos{padding:10px 15px; display: grid; grid-template-columns: repeat(3,85px); gap: 11px;}
.bt-tiktokacc1-video {    height: 105px;    border: 1px solid transparent;    display: flex;    align-items: flex-end;    justify-content: flex-start;    font-size: 10px;    border-radius: 5px;    background-size: cover!important;    overflow: hidden;    width: 85px;}
.bt-tiktokacc1-video > span{padding-left: 5px; color: #fff; font-family: 'Poppins'; font-size: 8px;}
.bt-tiktokacc1-video span > i{font-size: 6px; padding-right: 5px;}
.bt-tiktokacc1-video > span b{font-weight: 400;} a#tiktokbt-i2{margin-left: -76px; margin-top: 116px;}
.bt-tiktokacc1-header > a{position: absolute; width: 20px; height: 20px; background: var(--accent); border-radius: 100%; border: 3px solid var(--background); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 9px;}
a#tiktokbt-i1{margin-left: -92px; margin-top: 60px;}</style>
[/html]

16

[html]<div class="bt-tiktok-coment" style="--accent: #a987a8;--background: #222;--color: #fff;"><img src="https://via.placeholder.com/40x40"/><div class="bt-tiktok-text"><a href="#" style="color: var(--accent)">bettyleg</a><span>omg, u look amazing!</span></div></div>

<link href="https://fonts.googleapis.com/css2?family=Fira+Sans:ital@1&family=Poppins:wght@500;600&display=swap" rel="stylesheet"/><script src="https://kit.fontawesome.com/1427d036f5.js" crossorigin="anonymous"></script>
<style>.bt-tiktok-coment{width: 320px; border: 1px solid #ccc; box-shadow: 2px 2px 10px #0007; margin: 10px auto; padding: 20px; background: var(--background); border-radius: 20px; display: flex; align-items: flex-start; justify-content: flex-start;}
.bt-tiktok-coment > img{width: 40px; height: 40px; border-radius: 100%; outline: 2px solid #fff; margin-right: 20px; padding: 2px; background: #fff; border: 2px solid var(--accent);}
.bt-tiktok-text{display: flex; align-items: flex-start; justify-content: center; flex-direction: column; width: 225px; font-family: 'Poppins'; line-height: 15px; color: var(--color); padding-top: 5px;}
.bt-tiktok-text > a{color: var(--accent); font-weight: 600; font-size: 15px;}
.bt-tiktok-text > span{font-size: 12px; line-height: 18px;}</style>
[/html]

17

[html]<div class="bt-tiktokb" style="background:url('https://via.placeholder.com/290x490'); background-size: cover;"><div class="bt-tiktok-header"><span>Following</span> <span>For You</span></div><div class="bt-tiktokimg"><div class="bt-tiktok-dts"><div class="bt-tiktok-lateral"><div class="bt-tiktok-profile"><img src="https://via.placeholder.com/35x35"><i class="fa-solid fa-plus"></i></div><i id="bt-tiktok-heart" class="fa-solid fa-heart"></i><i class="fa-solid fa-comment-dots"></i><i class="fa-solid fa-share"></i></div><div class="bt-tiktok-info"><a href="#">@bettyleg</a><span>#fyp i'm bored</span><div class="bt-tiktok-music"><i class="fa-solid fa-music"></i><span>Supalonely - No sé de quién es</span></div></div></div><div class="bt-tiktok-menu"><i class="fa-solid fa-home"></i><i class="fa-solid fa-search"></i><i class="fa-solid fa-circle-plus"></i><i class="fa-solid fa-message"></i><i class="fa-solid fa-user"></i></div></div></div>

<link href="https://fonts.googleapis.com/css2?family=Fira+Sans:ital@1&family=Poppins:wght@500;600&display=swap" rel="stylesheet"/><script src="https://kit.fontawesome.com/1427d036f5.js" crossorigin="anonymous"></script>
<style>.bt-tiktokb{width: 290px; border: 1px solid #ccc; margin: 10px auto; border-radius: 20px; background: #444; overflow: hidden; box-sizing: border-box; display: flex; height: 490px; align-items: center; justify-content: space-between; flex-direction: column; box-shadow: 2px 2px 10px #0007;}
.bt-tiktok-header{text-align: center; padding: 20px; font-family: 'Poppins'; font-weight: 600; color: #fff; display: flex; align-items: center; justify-content: center; gap: 20px; font-size: 12px; width:100%; background:linear-gradient(180deg, #222a 0%, transparent 85%)}
.bt-tiktokimg{height: 250px; display: flex; position: relative; flex-direction: column; justify-content: space-between; align-items: center; width: 100%; background: linear-gradient(0deg, #222a 0%, transparent 95%);}
.bt-tiktok-lateral{position: absolute; display: flex; align-items: center; justify-content: flex-start; flex-direction: column; right: 0; width: 60px; height: 75%; gap: 15px;}
.bt-tiktok-profile{width: 35px; height: 35px; border: 2px solid #fff; border-radius: 100%; display: flex; align-items: center; justify-content: center; position: relative;}
.bt-tiktok-lateral > i{color: #fff; font-size: 20px;cursor:pointer;}
.bt-tiktok-profile > img{width: 35px; height: 35px; border-radius: 100%;}
.bt-tiktok-profile > i{position: absolute; bottom: -8px; background: #cb5151; border-radius: 100%; color: #fff; font-size: 10px; border: 2px solid #fff; padding: 3px; display: flex; align-items: center; justify-content: center; width: 8px; height: 8px; line-height: 13px;}
.bt-tiktok-menu{display: flex; align-items: center; height: 50px; justify-content: center; gap: 20px; color:#fff; font-size:14px; }
.bt-tiktok-menu > .fa-circle-plus{font-size: 24px; margin: 0px 6px;}
.bt-tiktok-info{width: 80%; height: 90px; display: flex; align-items: flex-start; justify-content: center; box-sizing: border-box; flex-direction: column; padding-left: 10px; position: absolute; bottom: 0; font-family: 'Poppins'; color: #fff;}
.bt-tiktok-dts{height: 215px; width: 100%; padding: 10px; box-sizing: border-box; position: relative;}
.bt-tiktok-lateral > i:after{content: "22k"; display: block; font-size: 7px; font-weight: 300; letter-spacing: 2px; text-align: center; padding-top: 5px;}
.bt-tiktok-lateral > i.fa-share:after{content: "8k";}
.bt-tiktok-lateral > i.fa-comment-dots:after{content: "19k";}
.bt-tiktok-lateral > i.fa-heart:after{content: "22k";}
.bt-tiktok-info{width: 80%; height: 90px; display: flex; align-items: flex-start; justify-content: center; box-sizing: border-box; flex-direction: column; padding-left: 10px; position: absolute; bottom: 0; font-family: 'Poppins'; color: #fff;}
.bt-tiktok-info > a{font-family: 'Poppins'; font-size: 11px; font-weight: 500; color: #fff;}
.bt-tiktok-info > span{font-size: 10px; padding: 1px 0px;}
.bt-tiktok-music{ height: 14px; font-size: 10px; overflow:hidden; width:96%}
.bt-tiktok-music > i{padding-right: 10px; float:left;}
.bt-tiktok-music > span{line-height:11px; width.190%; display:block;}
#bt-tiktok-heart:hover:before{color: #df5353; position: relative; text-shadow: 1px 1px #fff, 1px -1px #fff, -1px 1px #fff, -1px -1px #fff;}
.bt-tiktok-header > span:first-child:before{width: 6px; height: 6px; border-radius: 100%; background: #cb5151; display: block; content: ""; position: absolute; right: -9px; border: 1px solid #fff;}
.bt-tiktok-header > span{position: relative;} a.btcred-t{margin: 0px auto; text-align: center; display: block; font-size: 10px; text-transform: uppercase; font-family: 'Poppins'; font-weight: 500; letter-spacing: 1px; color: #aaa; width: fit-content;}</style>
[/html]

18

[html]<div class="bt-tiktokb-acc" style="--accent: #a987a8;--background: #fafafa;--color: #888;">
<div class="bt-tiktokacc1-header"><img src="https://via.placeholder.com/90x90"><a href="#" id="tiktokbt-i1"><i class="fa-brands fa-instagram"></i></a><a href="#" id="tiktokbt-i2"><i class="fa-brands fa-twitter"></i></a></div>

<div class="bt-tiktokacc1-user"><a>@bettyleg</a><span>this girl is on fire</span></div>

<div class="bt-tiktokacc1-info"><div><b>30k</b><span>following</span></div><div><b>32K</b><span>followers</span></div><div><b>10K</b><span>likes</span></div></div>

<div class="bt-tiktokacc1-videos">

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>

<div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div><div class="bt-tiktokacc1-video" style="background:url('https://via.placeholder.com/85x105')"><span><i class="fa-solid fa-play"></i><b>20K views</b></span></div>
</div>

</div><a class="btcred-t" href="https://bettyleg.tumblr.com/">bettyleg</a>

<link href="https://fonts.googleapis.com/css2?family=Fira+Sans:ital@1&family=Poppins:wght@500;600&display=swap" rel="stylesheet"/><script src="https://kit.fontawesome.com/1427d036f5.js" crossorigin="anonymous"></script>
<style>.bt-tiktokb-acc > br, .bt-tiktokacc1-videos > br{display:none;}
.bt-tiktokb-acc {    width: 313px;    border: 1px solid #ccc;    margin: 10px auto;    border-radius: 20px;    background: var(--background);    overflow: hidden;    box-sizing: border-box;    height: 500px;    box-shadow: 2px 2px 10px #0007;}
.bt-tiktokacc1-header{height: 95px; width: 100%; background: linear-gradient(0deg, transparent 10%, var(--accent) 100%); display: flex; position: relative; align-items: center; justify-content: center; margin-bottom: 40px;}
.bt-tiktokacc1-header > img{width: 90px; height: 90px; border-radius: 100%; border: 5px solid var(--background); margin: auto; background: var(--background); padding: 1px; margin-top: 30px;}
.bt-tiktokacc1-user{padding: 5px 20px; text-align: center; font-family: 'Poppins'; line-height: 10px; display: flex; align-items: center; justify-content: center; flex-direction: column; color: var(--color); height: 60px; overflow: hidden;}
.bt-tiktokacc1-user > a{color: var(--accent); font-weight: 600; font-size: 16px;}
.bt-tiktokacc1-user > span{font-size: 10px; margin-top: 8px; line-height: 100%; font-family: 'Poppins';}
.bt-tiktokacc1-info{display: flex; align-items: center; justify-content: center; padding: 5px 10px 10px; gap: 25px;}
.bt-tiktokacc1-info > div{display: flex; align-items: center; justify-content: center; flex-direction: column; line-height: 14px; color: var(--color);}
.bt-tiktokacc1-info b{font-size: 14px; font-family: 'Poppins'; letter-spacing: 2px; font-weight: 700;}
.bt-tiktokacc1-info span{text-transform: uppercase; font-size: 9px; font-weight: 700; letter-spacing: 1px;}
.bt-tiktokacc1-videos{padding:10px 15px; display: grid; grid-template-columns: repeat(3,85px); gap: 11px;}
.bt-tiktokacc1-video {    height: 105px;    border: 1px solid transparent;    display: flex;    align-items: flex-end;    justify-content: flex-start;    font-size: 10px;    border-radius: 5px;    background-size: cover!important;    overflow: hidden;    width: 85px;}
.bt-tiktokacc1-video > span{padding-left: 5px; color: #fff; font-family: 'Poppins'; font-size: 8px;}
.bt-tiktokacc1-video span > i{font-size: 6px; padding-right: 5px;}
.bt-tiktokacc1-video > span b{font-weight: 400;} a#tiktokbt-i2{margin-left: -76px; margin-top: 116px;}
.bt-tiktokacc1-header > a{position: absolute; width: 20px; height: 20px; background: var(--accent); border-radius: 100%; border: 3px solid var(--background); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 9px;}
a#tiktokbt-i1{margin-left: -92px; margin-top: 60px;}
a.btcred-t{margin: 0px auto; text-align: center; display: block; font-size: 10px; text-transform: uppercase; font-family: 'Poppins'; font-weight: 500; letter-spacing: 1px; color: #aaa; width: fit-content;}</style>
[/html]

19

[html]<div class="bt-tiktok-coment" style="--accent: #a987a8;--background: #fafafa;--color: #888;"><img src="https://via.placeholder.com/40x40"/><div class="bt-tiktok-text"><a href="#" style="color:var(--accent)">bettyleg</a><span>omg, u look amazing!</span></div></div>

<link href="https://fonts.googleapis.com/css2?family=Fira+Sans:ital@1&family=Poppins:wght@500;600&display=swap" rel="stylesheet"/><script src="https://kit.fontawesome.com/1427d036f5.js" crossorigin="anonymous"></script>
<style>.bt-tiktok-coment{width: 320px; border: 1px solid #ccc; box-shadow: 2px 2px 10px #0007; margin: 10px auto; padding: 20px; background: var(--background); border-radius: 20px; display: flex; align-items: flex-start; justify-content: flex-start;}
.bt-tiktok-coment > img{width: 40px; height: 40px; border-radius: 100%; outline: 2px solid #fff; margin-right: 20px; padding: 2px; background: #fff; border: 2px solid var(--accent);}
.bt-tiktok-text{display: flex; align-items: flex-start; justify-content: center; flex-direction: column; width: 225px; font-family: 'Poppins'; line-height: 15px; color: var(--color); padding-top: 5px;}
.bt-tiktok-text > a{color: var(--accent); font-weight: 600; font-size: 15px;}
.bt-tiktok-text > span{font-size: 12px; line-height: 18px;}</style>
[/html]

20

[html]/*-------------------------------------- PROFILE DE INSTAGRAM ---------------------*/

<center><div style="background:#fefefe; width:400px; height:auto; min-height:65px; outline: 1px solid #aaa;"><br><div style="width: 360px; height: 20px; border-bottom: #aaa 1px solid; padding: 10px; font-size: 14px;"><div style="float: left;"><i class="fas fa-long-arrow-alt-left"></i> username</div><div style="float: right;"><i class="fas fa-ellipsis-v"></i></div></div><br><table><tr><td><div class="imgprof"><img src="FOTO DE PERFIL 100X100"></div></td><td><div style="margin-left: 10px; margin-top: 5px; width: 80px; text-align: center">00<br>posts</div></td><td><div style="margin-left: 0px; margin-top: 5px; width: 80px; text-align: center">00<br>seguidores</div></td><td><div style="margin-left: 0px; margin-top: 5px; width: 80px; text-align: center">00<br>seguidos</div></td></tr></table><br><div style="width: 360px; text-align: left;">Nombre Apellido
descripcion o frase.</div>
<table><tr><td><a href="LINK A TU INSTAGRAM"><div style="width: 152px; height: 23px; border-radius: 5px; background-color: #2f78ed; color: #fefefe; text-align: center; font-size: 12px; margin-left: 0px; padding-top: 4px;">Seguir</div></a></td><td><a href="LINK A TU TELEFONO O MPS"><div style="width: 170px; height: 21px; border-radius: 5px; background-color: #fff; color: #333; text-align: center; font-size: 12px; margin-left: 2px; padding-top: 4px; border: 1px #aaa solid;">Mensaje</div></a></td><td><div style="width: 30px; height: 21px; border-radius: 5px; background-color: #fff; color: #333; text-align: center; font-size: 12px; margin-left: 2px; padding-top: 4px; border: 1px #aaa solid;"><i class="fas fa-sort-down"></i></div></td></tr></table><br><div class="histdest-ig"><div class="imghistig"><img src="IMAGEN HISTORIA 50X50"><br/>dest1</div><div class="imghistig"><img src="IMAGEN HISTORIA 50X50"><br/>dest2</div><div class="imghistig"><img src="IMAGEN HISTORIA 50X50"><br/>dest3</div></div>
<div style="font-size: 16px; text-align: center; margin-left: 5px;"><table><tr><td><div style="width: 125px; padding-bottom: 10px; border-bottom: 2px #aaa solid;"><i class="fas fa-th"></i></div></td><td><div style="width: 130px; padding-bottom: 12px;"><i class="fas fa-tv"></i></div></td><td><div style="width: 130px; padding-bottom: 12px;"><i class="fas fa-user-tag"></i></div></td></tr></table></div><img src="FOTO 128X128"><img src="FOTO 128X128" style="margin-left: 2px;"><img src="FOTO 128X128" style="margin-left: 2px;"><img src="FOTO 128X128" style="margin-top: 2px;"><img src="FOTO 128X128" style="margin-left: 2px;"><img src="FOTO 128X128" style="margin-left: 2px;">
<br></div><div style="width: 438px; font-family: 'Arial', sans-serif; color: #777; font-size: 5px; letter-spacing: 4px; margin-top: 3px;"><a href="https://harmoncodes.tumblr.com/">HC</a></div>
<style>.histdest-ig{height:85px; background:#fefefe; margin-top:10px; margin-left: 20px;} .imghistig{ float:left; margin-right:15px; background:#fff; width:50px; height:50px; border-radius:180px; padding:2px; border:1px solid #aaa; text-align:center; font-family:arial; font-size:10px;} .imghistig img{width:50px; height:50px; border-radius:180px; margin-bottom:4px;} .imgprof{ float:left; margin-right:0px; background:#fff; width:100px; height:100px; border-radius:180px; padding:2px; border:1px solid #aaa;} .imgprof img{width:100px; height:100px; border-radius:180px; margin-bottom:4px;}</style></center>

/*-------------------------------------- NUEVO PUBLICACIÓN ---------------------*/

<center><div style="background:#fefefe; width:250px; height:auto; outline: 1px solid #aaa; padding: 10px;"><table><tr><td><div class="imgfeed"><img src="IMAGEN DE PERFIL 35X35"></div></td><td><div style="margin-left: 10px; margin-top: 5px; width: 180px; font-size: 9px;">@username <br>ciudad, país.</div></td><td><div style="margin-top: 5px;"><i class="fas fa-ellipsis-v"></i></div></td></tr></table><img src="IMAGEN QUE SUBES 250PX" style="margin-top: 5px; width: 250px;">
<div style="margin-top: 5px; width:240px;"><div style="float: left;"><i class="far fa-heart"></i><i class="far fa-comment" style="margin-left: 10px;"></i><i class="far fa-paper-plane" style="margin-left: 10px;"></i></div> <div style="float: right;"><i class="far fa-bookmark"></i></div></div>
<div style="width: 245px; font-size: 9px; text-align: left; margin-top: 5px;">Le gusta a usuario y 000 personas más.
<strong>username</strong> pie de foto<hash>#hashtag</hash></div></div><div style="width: 438px; font-family: 'Arial', sans-serif; color: #777; font-size: 5px; letter-spacing: 4px; margin-top: 3px;"><a href="https://harmoncodes.tumblr.com/">HC</a></div>
<style>.imgfeed{ float:left; margin-top:5px; background:#fff; width:35px; height:35px; border-radius:180px; padding:2px; border:1px solid #aaa; text-align:center;} .imgfeed img{width:35px; height:35px; border-radius:180px;}</style></center>

/*-------------------------------------- FOLLOW ---------------------*/

<center><div style="background:#fefefe; width:400px; height:auto; min-height:65px; outline: 1px solid #aaa; padding-top: 5px;"><table><tr><td><div class="imglike"><img src="FOTO DE PERFIL 50X50"></div></td><td><div style="margin-left: 10px; margin-top: 5px; width: 210px;">@USUARIO ha comenzado a seguirte. 1h</div></td><td><a href="LINK A TU INSTAGRAM"><div style="width: 60px; height: 21px; border-radius: 5px; background-color: #2f78ed; color: #fefefe; text-align: center; font-size: 12px; margin-left: 30px; padding-top: 4px;">Seguir</div></a></td></tr></table></div><div style="width: 438px; font-family: 'Arial', sans-serif; color: #777; font-size: 5px; letter-spacing: 4px; margin-top: 3px;"><a href="https://harmoncodes.tumblr.com/">HC</a></div>
<style>.imglike{ background:#fff; width:50px; height:50px; border-radius:180px; padding:2px; border:1px solid #aaa;} .imglike img{width:50px; height:50px; border-radius:180px; margin-bottom:4px;}</style></center>

/*-------------------------------------- LIKE ---------------------*/

<center><div style="background:#fefefe; width:400px; height:auto; min-height:65px; outline: 1px solid #aaa; padding-top: 5px;"><table><tr><td><a href="LINK A TU INSTAGRAM"><div class="imglike"><img src="FOTO DE PERFIL 50X50"></div></a></td><td><div style="margin-left: 10px; margin-top: 5px; width: 240px;">A @USUARIO le ha gustado tu publicación. 1h</div></td><td><img src="LINK DE FOTO A LA QUE SE DA LIKE" style="width: 50px; height: 50px;"></td></tr></table></div><div style="width: 438px; font-family: 'Arial', sans-serif; color: #777; font-size: 5px; letter-spacing: 4px; margin-top: 3px;"><a href="https://harmoncodes.tumblr.com/">HC</a></div>
<style>.imglike{ background:#fff; width:50px; height:50px; border-radius:180px; padding:2px; border:1px solid #aaa;} .imglike img{width:50px; height:50px; border-radius:180px; margin-bottom:4px;}</style></center>

/*-------------------------------------- COMENTARIO ---------------------*/

<center><div style="background:#fefefe; width:400px; height:auto; min-height:65px; outline: 1px solid #aaa; padding-top: 5px;"><table><tr><td><a href="LINK A TU INSTAGRAM"><div class="imglike"><img src="FOTO DE PERFIL 50X50"></div></a></td><td><div style="margin-left: 10px; margin-top: 5px; width: 240px;">@USUARIO comentó: TU COMENTARIO AQUÍ 1h</div></td><td><img src="LINK DE FOTO QUE COMENTAS" style="width: 50px; height: 50px;"></td></tr></table></div><div style="width: 438px; font-family: 'Arial', sans-serif; color: #777; font-size: 5px; letter-spacing: 4px; margin-top: 3px;"><a href="https://harmoncodes.tumblr.com/">HC</a></div>
<style>.imglike{ background:#fff; width:50px; height:50px; border-radius:180px; padding:2px; border:1px solid #aaa;} .imglike img{width:50px; height:50px; border-radius:180px; margin-bottom:4px;}</style></center>[/html]


Вы здесь » Test by devls » страниу » соц сети


Рейтинг форумов | Создать форум бесплатно