10%

Testing Forum

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

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

Вы здесь » Testing Forum » Акции » instawhatever

instawhatever

Страница: 1
Тема закрыта

Сообщений 1 страница 4 из 4

1

  • Автор: Maxine Skywalker
  • не твоя киска 🐾
  • Maxine Skywalker
  • плашка:
    хёна, 28 she's tired because it hurts every time
  • Уважение: +1
  • Сообщений: 64
  • звездочки: 555

[html]
<div class="instapack"><div class="instalogo">Instawhatever</div>
    <div class ="instaprofile">
        <div class="picback"><img src="https://i.imgur.com/ELcB0v9.jpg"></div>
        <div class="instainfo"><span>@Nickname</span><p>Come get your funky love story I love it when the skies can't sleep I left a message encased in me So, bye-bye <br> <b>#A flawless ending</b></p></div>
    </div>
<div class="instanumbrs">
<div class="instabbl"><span>###</span><br>posts</div>
<div class="instabbl"><span>###</span><br>followers</div>
<div class="instabbl"><span>###</span><br>following</div>
</div>
<div class="instaprevall">
<div class="instaprev"><img src="https://i.imgur.com/5A48AwS.jpg" class="slumber"><div class="prevcover"><i class="far fa-heart"></i> ###<br> <i class="far fa-comment-alt"></i> ###</div></div>
<div class="instaprev"><img src="https://i.imgur.com/5A48AwS.jpg" class="_1977"><div class="prevcover"><i class="far fa-heart"></i> ###<br> <i class="far fa-comment-alt"></i> ###</div></div>
<div class="instaprev"><img src="https://i.imgur.com/5A48AwS.jpg" class="brooklyn"><div class="prevcover"><i class="far fa-heart"></i> ###<br> <i class="far fa-comment-alt"></i> ###</div></div>
<div class="instaprev"><img src="https://i.imgur.com/5A48AwS.jpg" class="toaster"><div class="prevcover"><i class="far fa-heart"></i> ###<br> <i class="far fa-comment-alt"></i> ###</div></div>
<div class="instaprev"><img src="https://i.imgur.com/5A48AwS.jpg" class="willow"><div class="prevcover"><i class="far fa-heart"></i> ###<br> <i class="far fa-comment-alt"></i> ###</div></div>
<div class="instaprev"><img src="https://i.imgur.com/5A48AwS.jpg" class="kelvin"><div class="prevcover"><i class="far fa-heart"></i> ###<br> <i class="far fa-comment-alt"></i> ###</div></div>
</div>
</div>

<style>
.instapack{
    width: 360px;
    height: 640px;
    margin: auto;
}
.instalogo {
  font-family: roboto;
    text-align: center;
    font-size: 30px;
    border-bottom: 1px #ccc solid;
    padding: 10px 0;
}
.picback {
margin-top: 10px;
    margin-left: 10px;
    border-radius: 110px;
    width: 86px;
    height: 86px;
    text-align: center;
    background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
}
.picback img{
    border-radius: 100px;
    width: 80px;
    height: 80px;
    margin-top: 3px;
    object-fit: cover;
    object-position: center;
}
.instainfo span {
    font-family: 'Playfair Display SC';
    text-transform: lowercase;
    font-size: 13px;
    font-weight: bold;
}

.instainfo {
margin: -76px 0 0 110px;
    height: 72px;
    width: 240px;
    overflow: hidden;
    text-transform: lowercase;
}
.instainfo span {
    font-family: 'Roboto';
    text-transform: lowercase;
    font-size: 15px;
    font-weight: bold;
}
.instaprofile {
    display: inline-table;
}
.instainfo p {
    font-family: 'Oswald';
    font-weight: 100;
}
   .instanumbrs {
    text-align: center;
    margin: 10px;
}
.instabbl {
    display: inline-block;
    text-align: center;
    padding: 5px 35px;
    font-family: 'Roboto';
    font-size: 12px;
    margin: 20px 0;
}
.instabbl span {
    font-family: 'Oswald';
    font-weight: bold;
}

.instaprevall {
    display: inline-block;
    text-align: center;
}
.instaprev {
    width: 100px;
    height: 100px;
    display: inline-flex;
    padding: 5px;
    text-align: center;
}
.instaprev img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    object-position: center;
}
.prevcover:hover {
    opacity: 1;
}

.prevcover {
    background: #3030308a;
    width: 60px;
    height: 32px;
    position: absolute;
    opacity: 0;
    transition: 1s;
    padding: 34px 20px;
    color: white;
    line-height: 20px;
}
</style>
[/html]

0

2

  • Автор: Maxine Skywalker
  • не твоя киска 🐾
  • Maxine Skywalker
  • плашка:
    хёна, 28 she's tired because it hurts every time
  • Уважение: +1
  • Сообщений: 64
  • звездочки: 555

[html]
<div class="instapack">
    <div class="iphead">
        <div class="ippic"><img src="https://i.imgur.com/ELcB0v9.jpg"></div>
        <div class="ipinf"><span>@nickname</span><p> <i class="fas fa-map-marker-alt"></i> location</p></div>
    </div>
    <div class="ipmain">
        <img src="https://i.imgur.com/IC3uLWM.jpg" class="brooklyn">
        <div class="ipcomm"><b><i class="far fa-heart"></i> ### <i class="far fa-comment-alt"></i> ###</b> I need <b>@you</b> to show me somethin' 'Cause I ain't tryna lose my way Show me your bad intentions I'd rather you lay it down I don't wanna be let down Something real I need to see you I've heard it all before, babe But I need you to show me somethin' Show me some Show me somethin' <b>#Baby</b>, I been tired of waiting</div>
    </div>
</div>

<style>

.instapack {
    width: 360px;
    height: 640px;
    margin: auto;
    text-transform: lowercase;
}
.ippic {
    border-radius: 100%;
    width: 56px;
    height: 56px;
    text-align: center;
    background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
    margin: 10px 0 5px 10px;
}
.iphead {
    display: inline-flex;
    border-bottom: 1px solid #ccc;
    width: 100%;
    margin-bottom: 10px;
}
.ippic img {
    width: 52px;
    height: 52px;
    border-radius: 100%;
    margin-top: 3px;
    object-fit: cover;
    object-position: center;
}
.ipinf {
    margin: 22px 0 0 10px;
    padding-left: 2px;
    height: 40px;
    overflow: hidden;
}
.ipinf span {
    font-family: 'Roboto';
    text-transform: lowercase;
    font-size: 12px;
    font-weight: bold;
}
.ipinf p {
    font-family: 'Oswald';
}
.ipmain {
    text-align: center;
}
.ipmain img {
    object-fit: cover;
    object-position: center;
    height: 340px;
    width: 340px;
}
.ipcomm {
    height: 100px;
    overflow: hidden;
    margin-top: 10px;
    padding: 5px 10px;
    font-family: arial;
    font-size: 10px;
    border-top: 1px solid #ccc;
    text-align: justify;
    line-height: 100%;
}
.ipcomm b {
    font-family: Oswald;
    font-size: 12px;
    background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
</style>
[/html]

0

3

  • Автор: Maxine Skywalker
  • не твоя киска 🐾
  • Maxine Skywalker
  • плашка:
    хёна, 28 she's tired because it hurts every time
  • Уважение: +1
  • Сообщений: 64
  • звездочки: 555

[html]
<div class="icomm">
    <div class="icommnot">уведомления (4)
    </div>
    <div class="icommrest">
        <div class="icommprof">
            <img src="https://i.imgur.com/ELcB0v9.jpg">
        </div>
    <div class="icommcont">
        <a href =" "><span title="открыть профиль">@nickname</span></a> <b><i class="far fa-comment-alt"></i></b> прокомментировал(а) ваш <a href=" " title="перейти к посту"><b>пост</b></a>:<br>
        <p>come get your funky love story i love it when the skies can't sleep i left a message encased in me so, bye-bye come get your funky love story i love it when the skies can't sleep i left a message encased in me so, bye-bye come get your funky love story i love it when the skies can't sleep i left a message encased in me so, bye-bye come get your funky love story i love it when the skies can't sleep i left a message encased in me so, bye-bye come get your funky love story i love it when the skies can't sleep i left a message encased in me so, bye-bye</p>
    </div>
</div>
  <div class="icommrest">
        <div class="icommprof">
            <img src="https://i.imgur.com/ELcB0v9.jpg">
        </div>
    <div class="icommcont">
        <a href =" "><span title="открыть профиль">@nickname</span></a> <b><i class="far fa-comment-alt"></i></b> прокомментировал(а) ваш <a href=" " title="перейти к посту"><b>пост</b></a>:<br>
        <p>come get your funky love story i love it when the skies can't sleep i left a message encased in me so, bye-bye</p>
    </div>
</div>

<div class="icommrest">
    <div class="icommprof">
        <img src="https://i.imgur.com/ELcB0v9.jpg">
    </div>
    <div class="icommcont ilike">
        <a href =" "><span title="открыть профиль">@nickname</span></a> <b><i class="far fa-heart"></i></b> лайкнул(а) ваш <a href=" " title="перейти к посту"><b>пост</b></a>
    </div>
</div>

  <div class="icommrest">
        <div class="icommprof">
            <img src="https://i.imgur.com/ELcB0v9.jpg">
        </div>
    <div class="icommcont">
        <a href =" "><span title="открыть профиль">@nickname</span></a> <b><i class="far fa-comment-alt"></i></b> ответил(а) на ваш <a href=" " title="перейти к посту"><b>комментарий</b></a>:<br>
        <p>come get your funky love story i love it when the skies can't sleep i left a message encased in me so, bye-bye</p>
    </div>
</div>

</div>
<style>
.icomm {
    width: 360px;
    margin: auto;
    text-transform: lowercase;
}
.icommnot {
    font-family: Oswald;
    text-align: center;
    font-size: 14px;
    border-bottom: 1px #ccc solid;
    padding: 5px 0;
    margin-bottom: 5px;
}
.icommrest {
    display: inline-flex;
    padding: 5px 0px;
    width: 100%;
}
.icommprof {
border-radius: 100%;
    width: 42px;
    height: 42px;
    text-align: center;
    background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
    margin: 0px 5px;
}
.icommcont {
    width: 285px;
    margin: 0 0 0 5px;
    font-family: oswald;
}
.icommprof img {
    width: 38px;
    height: 38px;
    border-radius: 100%;
    margin-top: 2px;
    margin-left: 0px;
    object-fit: cover;
    object-position: center;
}
.icommcont span {
    font-family: 'Roboto';
    font-size: 12px;
    font-weight: bold;
    color: black!important;
}
.icommcont b {
    font-family: 'Oswald';
    font-size: 12px;
    background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.icommcont p {
    font-family: arial;
    font-size: 10px;
    text-align: justify;
    line-height: 100%!important;
}
.ilike {
    padding-top: 9px;
}
</style>
[/html]

0

4

  • Автор: Maxine Skywalker
  • не твоя киска 🐾
  • Maxine Skywalker
  • плашка:
    хёна, 28 she's tired because it hurts every time
  • Уважение: +1
  • Сообщений: 64
  • звездочки: 555

[html]<div class="instapack">
    <div class="iphead">
        <div class="ippic"><img src="https://i.imgur.com/ELcB0v9.jpg"></div>
        <div class="ipinf"><span>@nickname</span><p>ONLINE</p></div>
    </div>

    <div class="iconv">
        <ol>
            <li class="othermsg"><div class="convbbl inmsg">text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text <img src="https://i.imgur.com/IC3uLWM.jpg"> text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text </div></li>
            <li class="selfmsg"><div class="convbbl outmsg">text text text text</div></li>
            <li class="othermsg"><div class="convbbl inmsg">text text text text</div></li>
            <li class="selfmsg"><div class="convbbl outmsg">text text text text</div></li>
        </ol>
    </div>

    <div class="iconvfooter">
    <div class="icftxt">say something, please... </div><div class="icftxtbg"><img src="https://i.imgur.com/ELcB0v9.jpg"></div>
   </div>

</div>

<style>

.instapack {
    width: 360px;
    height: 640px;
    margin: auto;
    text-transform: lowercase;
}
.ippic {
    border-radius: 100%;
    width: 56px;
    height: 56px;
    text-align: center;
    background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
    margin: 10px 0 5px 10px;
}
.iphead {
    display: inline-flex;
    border-bottom: 1px solid #ccc;
    width: 100%;
    margin-bottom: 10px;
}
.ippic img {
    width: 52px;
    height: 52px;
    border-radius: 100%;
    margin-top: 2px;
    object-fit: cover;
    object-position: center;
}
.ipinf {
    margin: 22px 0 0 10px;
    padding-left: 2px;
    height: 40px;
    overflow: hidden;
}
.ipinf span {
    font-family: 'Roboto';
    text-transform: lowercase;
    font-size: 12px;
    font-weight: bold;
}
.ipinf p {
    font-family: 'Oswald';
}
.ipmain {
    text-align: center;
}

.iconv ol {
    padding: 0!important;
}

.iconv li {
    display: flex;
}
li.selfmsg {
    justify-content: flex-end;
    align-items: flex-end;
}
.iconv {
     padding: 0 20px;
}
.inmsg {
    border-radius: 0px 10px 10px 10px;
}
.outmsg {
    border-radius: 10px 10px 0px 10px;
}

.convbbl {
    padding: 8px;
    border: 1px solid #ccc;
    width: fit-content;
    font-family: arial;
    font-size: 10px;
    text-align: justify;
    line-height: 100%;
    margin: 5px 0;
    max-width: 80%;
}
.iconvfooter {
    margin-top: 10px;
    padding: 5px 10px;
    border-top: 1px solid #ccc;
    display: flex;
}
.icftxt {
    padding: 7px 10px;
    font-family: 'Oswald';
    font-style: italic;
    border: 1px solid #ccc;
    border-radius: 15px;
    margin: 0 8px;
    align-content: center;
    width: 100%;
    letter-spacing: 4px;
}
.icftxtbg {
    width: 34px;
    height: 34px;
    border-radius: 100%;
    background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
}
.icftxtbg img {
    width: 30px;
    height: 30px;
    object-fit: cover;
    object-position: center;
    border-radius: 100%;
    margin: 2px;
}
.convbbl img {
    object-fit: cover;
    object-position: center;
    max-width: 242px;
    display: flex;
    margin: 10px 5px;
}
</style>[/html]

0

Тема закрыта
Страница: 1

Вы здесь » Testing Forum » Акции » instawhatever

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