American Codes: Profil

Twitter Name

19,9 tys. Tweety

Twitter Name

@twitternick

Przykładowy opis postaci czy inny tekst autorski. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Miasto twitterpage.com Data urodzenia: xx miesiąc Dołączył/a: miesiąc 0000

86 obserwowanych 25 obserwujących

Tweety Tweety i odpowiedzi Multimedia Polubienia

Twitter Name @twitternick 6 kwi

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Twitter Name @twitternick 7 kwi

Twitter Name @twitternick 8 kwi

Twitter Name @twitternick 9 kwi

Twitter Name @twitternick 10 kwi

KOD DO EFEKTU:

<div class="belka">
<span style="color: #1da1f2; font-size: 25px;"><i class="fas fa-long-arrow-alt-left"></i></span>
<div id="user1">
Twitter Name
<span style="color: #1da1f2"><i class="fas fa-check-circle"></i></span></div>
<div id="tweety1">
19,9 tys. Tweety
</div>
</div>
<div style="margin-left: -41px; margin-top: -1px;">
<img src="ZDJĘCIE W TLE" style="padding: 0px; width: 680px; height: 195px;" />
</div>
<div style="margin-top: -80px;">
<img src="ZDJĘCIE PROFILOWEGO AWATARU" style="padding: 0px; border: 5px solid #fff; border-radius: 100px; width: 130px;" />
</div>
<div id="kropki">
<a href="LINK DO KROPECZEK"><i class="fas fa-ellipsis-h"></i></a>
</div>
<div id="dzwonek" style="">
<a href="LINK DO DZWONKA"><i class="far fa-bell"></i></a>
</div>
<div id="obserwuj">
<a href="LINK DO OBSERWUJ">Obserwuj</a>
</div>
<div id="user2">
Twitter Name
<span style="color: #1da1f2"><i class="fas fa-check-circle"></i></span>
</div>
<div id="tweetnick" style="">
@twitternick
</div>
<div style="font-family: arial; margin: 10px -25px 0px -25px;">
Przykładowy opis postaci czy inny tekst autorski.
</div>
<div class="dane">
<i class="fas fa-map-marker-alt"></i>
Miasto
<i class="fas fa-link"></i>
twitterpage.com
<i class="far fa-circle"></i>
Data urodzenia: xx miesiąc
<i class="far fa-calendar-alt"></i>
Dołączył/a: miesiąc 0000
</div>
<div id="watching">
<b>86</b> obserwowanych
<b>25</b> obserwujących
</div>
<div style="margin: 10px -40px 0px -40px; border-bottom: 1px solid #e6ecf0;">
<a class="tweety" id="link1">Tweety</a>
<a class="tweety" href="TWÓJ LINK">Tweety i odpowiedzi</a>
<a class="tweety" href="TWÓJ LINK">Multimedia</a>
<a class="tweety" href="TWÓJ LINK">Polubienia</a>
</div>
<div style="margin: 10px -40px 0px -40px; border-bottom: 1px solid #e6ecf0; padding: 5px 12px;">
<img src="LINK DO MAŁEGO AWATARU" style="padding: 0px; border-radius: 100px; width: 50px;" />
<span id="user3">Twitter Name</span>
<span id="twitternick2">@twitternick</span>
<span id="godz">6 kwi</span>
<div style="font-family: arial; margin-left: 63px; margin-top: -30px; margin-right:5px;">
TREŚĆ TWEETA
</div>
<div style="margin-left: 63px; font-size: 22px; letter-spacing: 62px;">
<i class="far fa-comment"></i>
<i class="fas fa-retweet"></i>
<i class="far fa-heart"></i>
<i class="fas fa-upload"></i>
</div>
</div>
<div style="margin: 10px -40px 0px -40px; border-bottom: 1px solid #e6ecf0; padding: 5px 12px;">
<img src="LINK DO MAŁEGO AWATARU" style="padding: 0px; border-radius: 100px; width: 50px;" />
<span id="user3">Twitter Name</span>
<span id="twitternick2">@twitternick</span>
<span id="godz">7 kwi</span>
<div style="font-family: arial; margin-left: 63px; margin-top: -30px; margin-right:5px;">
TREŚĆ TWEETA
</div>
<div style="margin-left: 63px; font-size: 22px; letter-spacing: 62px;">
<i class="far fa-comment"></i>
<i class="fas fa-retweet"></i>
<i class="far fa-heart"></i>
<i class="fas fa-upload"></i>
</div>
</div>
<div style="margin: 10px -40px 0px -40px; border-bottom: 1px solid #e6ecf0; padding: 5px 12px;">
<img src="LINK DO MAŁEGO AWATARA" style="padding: 0px; border-radius: 100px; width: 50px;" />
<span id="user3">Twitter Name</span>
<span id="twitternick2">@twitternick</span>
<span id="godz">8 kwi</span>
<div style="font-family: arial; margin-left: 63px; margin-top: -30px; margin-right:5px;">
TREŚĆ TWEETA
</div>
<div style="margin-left: 63px; font-size: 22px; letter-spacing: 62px;">
<i class="far fa-comment"></i>
<i class="fas fa-retweet"></i>
<i class="far fa-heart"></i>
<i class="fas fa-upload"></i>
</div>
</div>
<div style="margin: 10px -40px 0px -40px; border-bottom: 1px solid #e6ecf0; padding: 5px 12px;">
<img src="LINK DO MAŁEGO AWATARA" style="padding: 0px; border-radius: 100px; width: 50px;" />
<span id="user3">Twitter Name</span>
<span id="twitternick2">@twitternick</span>
<span id="godz">9 kwi</span>
<div style="font-family: arial; margin-left: 63px; margin-top: -30px; margin-right:5px;">
TREŚĆ TWEETA
</div>
<div style="margin-left: 63px; font-size: 22px; letter-spacing: 62px;">
<i class="far fa-comment"></i>
<i class="fas fa-retweet"></i>
<i class="far fa-heart"></i>
<i class="fas fa-upload"></i>
</div>
</div>
<div style="margin: 10px -40px 0px -40px; border-bottom: 1px solid #e6ecf0; padding: 5px 12px;">
<img src="LINK DO MAŁEGO AWATARA" style="padding: 0px; border-radius: 100px; width: 50px;" />
<span id="user3">Twitter Name</span>
<span id="twitternick2">@twitternick</span>
<span id="godz">10 kwi</span>
<div style="font-family: arial; margin-left: 63px; margin-top: -30px; margin-right:5px;">
TREŚĆ TWEETA
</div>
<div style="margin-left: 63px; margin-top: 15px; font-size: 22px; letter-spacing: 62px;">
<i class="far fa-comment"></i>
<i class="fas fa-retweet"></i>
<i class="far fa-heart"></i>
<i class="fas fa-upload"></i>
</div>
</div>

<style>
#godz {
font-family: 'Ubuntu', sans-serif;
color: #8996a2;
font-size: 16px;
letter-spacing: -1px;
top: -33px;
left: 18px;
position: relative;
}

#twitternick2 {
font-family: 'Ubuntu', sans-serif;
color: #8996a2;
font-size: 16px;
letter-spacing: -1px;
top: -33px;
left: 8px;
position: relative;
}

#user3 {
font-family: 'Ubuntu', sans-serif;
color: #14171a;
font-weight: bold;
font-size: 16px;
letter-spacing: -1px;
top: -33px;
left: 6px;
position: relative;
}

#link1 {
color: #47b2f4;
border-bottom: 3px solid #47b2f4;
}

.tweety {
width:155.5px;
display:inline-block;
background:#fff;
color:#657786;
padding:5px;
font-family: 'Ubuntu', sans-serif;
font-size: 14px;
font-weight: bold;
padding: 7px 5px;
text-align:center;
margin-top:1px;
margin-bottom:0px;}

.tweety a {
color: #8996a2!important;
}

.tweety:hover {
background: #f5f6f7;}

#watching {
font-family: 'Ubuntu', sans-serif;
margin: 10px -25px 0px -25px;
font-size: 14px;
color: #657786;
}

#watching b {
color: #14171a;
}

.dane {
font-family: 'Ubuntu', sans-serif;
margin: 10px -25px 0px -25px;
font-size: 14px;
color: #657786;
}

#tweetnick {
font-family: 'Ubuntu', sans-serif;
color: #657786;
font-size: 15px;
margin-left: -25px;
margin-top: -4px;
}

#user2 {
font-family: 'Ubuntu', sans-serif;
color: #14171a;
font-weight: bold;
font-size: 21px;
letter-spacing: -1px;
margin-left: -25px;
}

#obserwuj {
font-family: 'Ubuntu', sans-serif;
font-weight: bold;
font-size: 15px;
color: #1da1f2;
border: 1px solid #1da1f2;
padding: 7px 22px;
position: absolute;
border-radius: 50px;
margin-top: -64px;
margin-left: 500px;
}

#obserwuj a {color: #1da1f2;}

#obserwuj:hover {
background: #e8f5fe;}

#dzwonek {
color: #1da1f2;
border: 1px solid #1da1f2;
padding: 7px 11px;
border-radius: 20px;
position: absolute;
font-size: 15px;
margin-top: -64px;
margin-left: 455px;
}

#dzwonek a {color: #1da1f2;}

#dzwonek:hover {
background: #e8f5fe;}

#kropki {
color: #1da1f2;
border: 1px solid #1da1f2;
padding: 7px 10px;
border-radius: 20px;
position: absolute;
font-size: 15px;
margin-top: -64px;
margin-left: 410px;}

#kropki a {color: #1da1f2;}

#kropki:hover {
background: #e8f5fe;}

#tweety1 {
font-family: arial;
font-size: 13.5px;
color: #657786;
position: absolute;
margin-left: 50px;
margin-top: -14px;}

#user1 {
font-family: 'Ubuntu', sans-serif;
color: #14171a;
font-weight: bold;
font-size: 21px;
letter-spacing: -1px;
position: absolute;
margin-left: 50px;
margin-top: -44px;
}

.belka {
width: 660px;
margin-left: -40px;
padding: 15px 10px 12px 10px;
margin-top: -40px;
border-bottom: 1px solid #e6ecf0;}

.post-body {
background: #fff;
margin-top: -16px;
margin-bottom: -20px;}
</style>

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@300&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Ubuntu&display=swap" rel="stylesheet">

▪ Wartości, które możesz edytować zaznaczone są kolorem.
▪ Zdjęcie w tle musi mieć wymiary 680x150px.
▪ Zdjęcie awataru musi być kwadratowe (dowolnego rozmiaru).
▪ Szablon karty dostosowany do szablonu American Gods.

American Codes

AG

Strony

środa, 25 sierpnia 2021

Profil - Twitter

Brak komentarzy:

Prześlij komentarz