Modèle

Mar 10 Nov - 18:33

instagram

(( networks ))

INSTAGRAM, application indispensable dans la vie quotidienne de ceux qui ne peuvent plus décrocher de leurs téléphone. Modernité à toute épreuve sous l'affluence des photographies qui feront briller autant les célébrités que les plus modestes. Le nom du sujet doit être composé de votre pseudonyme sous la forme @Pseudo.
On remercie Heresy pour les codes suivants

post principal (feed) —

Code:

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600" /> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"> <link rel="stylesheet" href="https://www.aht.li/3282401/insta.css" /> <link rel="stylesheet" href="https://www.aht.li/3282530/insta_onglets.css" /> <div class="insta"> <div class="profil"><img class="profil-image" src="https://via.placeholder.com/200x200" /> <div class="perso more"> <div class="pseudo">username</div> <div class="profil-btn">Following</div> <div class="profil-btn">▾</div></div> <div class="stat"><span class="posts">349</span><span class="followers">834</span><span class="following">238</span></div> <div class="bio"><strong>Nom Prénom</strong>
Long nights, daydreams, sugar and smoke rings [img]http://twemoji.maxcdn.com/16x16/1f48e.png[/img] [img]http://twemoji.maxcdn.com/16x16/1f48b.png[/img]
<a href="https://www.youtube.com/watch?v=PYI0E_Wr1gM" target="_blank">youtu.be/PYI0E_Wr1gM</a>

<span class="followed">Followed by <strong>username</strong>, <strong>username</strong>, <strong>username</strong> + 1 more</span></div></div>

<div class="tabs"><input class="input" name="tabs" type="radio" id="tab-1" checked="checked" /> <label class="label published" for="tab-1">Posts</label> <div class="panel"><div class="galerie"><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <img src="https://via.placeholder.com/200x150" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <div class="feed-type"><i class="fas fa-clone" aria-hidden="true"></i></div> <img src="https://via.placeholder.com/350x200" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <img src="https://via.placeholder.com/160x160" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <div class="feed-type"><i class="fas fa-video" aria-hidden="true"></i></div> <img src="https://via.placeholder.com/230x180" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <img src="https://via.placeholder.com/300x150" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <div class="feed-type"><i class="fas fa-clone" aria-hidden="true"></i></div> <img src="https://via.placeholder.com/350x150" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <div class="feed-type"><i class="fas fa-clone" aria-hidden="true"></i></div> <img src="https://via.placeholder.com/300x150" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <div class="feed-type"><i class="fas fa-video" aria-hidden="true"></i></div> <img src="https://via.placeholder.com/400x200" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <img src="https://via.placeholder.com/300x150" /></div></div></div><input class="input" name="tabs" type="radio" id="tab-2" /> <label class="label tagged" for="tab-2">Tagged</label> <div class="panel"> <div class="galerie"><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <img src="https://via.placeholder.com/200x150" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <img src="https://via.placeholder.com/200x150" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <img src="https://via.placeholder.com/200x150" /></div><div class="feed"><div class="feed-info"><span><i class="fas fa-heart" aria-hidden="true"></i> 89</span> <span><i class="fas fa-comment" aria-hidden="true"></i> 5</span></div> <img src="https://via.placeholder.com/200x150" /></div></div></div> </div>

<div class="loader"></div></div> <credit>cr: HERESY.</credit>

nouvelle publication (post) —

Code:

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" /> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"> <link rel="stylesheet" href="https://www.aht.li/3282993/insta-comm.css" /> <div class="insta-post"><div class="insta-id"><a href="http://www.bazzart.org/u7256" target="_blank"><img class="insta-id-pic" src="https://via.placeholder.com/200x200" /></a> <div class="id-pseudo">username • following</div></div><img class="post-pic" src="https://via.placeholder.com/400x450" /><div class="post-like"><strong>439 Likes</strong>
<strong>username</strong> message ici
<hr />
<strong>username</strong> commentaire
<strong>username</strong> commentaire
<strong>username</strong> commentaire
<hr />
<div class="date">June 15</div></div></div>