Code de Téléphone // i prefer to text
 :: Ministère de la Magie :: Gestion du personnage :: Téléphone

Messages : 69
Type de magie : Monomaestria
Âge / Classe / Job : 42 ans / Chercheur
Voir le profil de l'utilisateur
avatar
Admin
Mer 27 Déc - 14:34
AT&T
10:42 AM
100%
Groups
Contacts
+

A

Prénom P. Nom

Prénom P. Nom

B

Prénom P. Nom

C

Prénom P. Nom

Prénom P. Nom

D

Prénom P. Nom

Prénom P. Nom

E

Prénom P. Nom

Prénom P. Nom

F

Prénom P. Nom

Prénom P. Nom

G

Prénom P. Nom

Prénom P. Nom



Code:
<link href="https://fonts.googleapis.com/css?family=Lato|Roboto" rel="stylesheet"><link rel="stylesheet" href="https://use.fontawesome.com/7208ae47c3.css"><div class="phone_wrapper"> <div class="phone"> <div class="screen"> <div class="bar"><span style="font-size: 3pt"><span class="fa fa-circle"></span><span class="fa fa-circle"></span><span class="fa fa-circle"></span><span class="fa fa-circle"></span><span class="fa fa-circle"></span></span><span style="padding-left: 2px; font-size: 9px; line-height: 12px;">AT&T</span> <span class="fa fa-wifi"></span><div class="clock">10:42 AM</div><span class="rightside-bar"><span class="fa fa-bluetooth-b"></span> <span>100%</span><span class="fa fa-battery-full"></span></span></div><div class="header"><div class="back">Groups</div><div class="contacts">Contacts</div><div class="add">+</div></div><div class="contacts-wrapper"> <div class="contacts-list"> <h1>A</h1> <p>Prénom P. Nom</p><p>Prénom P. Nom</p><h1>B</h1> <p>Prénom P. Nom</p><h1>C</h1> <p>Prénom P. Nom</p><p>Prénom P. Nom</p><h1>D</h1> <p>Prénom P. Nom</p><p>Prénom P. Nom</p><h1>E</h1> <p>Prénom P. Nom</p><p>Prénom P. Nom</p><h1>F</h1> <p>Prénom P. Nom</p><p>Prénom P. Nom</p><h1>G</h1> <p>Prénom P. Nom</p><p>Prénom P. Nom</p></div></div></div></div></div><style>.phone_wrapper{overflow: hidden;}.phone_wrapper .phone{height: 600px; width: 300px; background-image: url(https://i.imgur.com/mMm8IFI.png); background-size: cover; overflow: hidden;}.phone_wrapper .screen{position: relative; top: 67px; left: 18px; display: block; width: 263.5px; height: 465px; background: #F8F8F8; border: 1px solid #DADADA, border-radius: 2px; overflow: hidden; font-weight: normal;}.phone_wrapper .bar{display: block; height: 15px; width: 250px; padding: 4px 10px; background: #F8F8F8; color: #AAAAAA; font: 12px 'Lato';}.phone_wrapper .rightside-bar{float: right; margin-top: -15px; padding-left: 2px}.phone_wrapper .rightside-bar span{font-size: 10pt;}.phone_wrapper .header{height: 45px; width: 265px; background: #F8F8F8; border-bottom: 1px solid #DADADA;}.phone_wrapper .clock{color: #454545; text-align: center; margin-top: -12px; letter-spacing: 0px; word-spacing: 0px;}.phone_wrapper .back{display: inline-block; color: #1da1f2; font-family: Roboto; font-size: 10pt; margin-right: 10px; border-radius: 5px; position: relative; top: 20px; left: 10px; letter-spacing: -1px;}.phone_wrapper .contacts{text-align: center; color: #454545; font: 12pt 'Lato';}.phone_wrapper .add{display: block; width: 25px; position: relative; top: -15px; left: 247px; color: #1da1f2; font: 14px 'Lato'; font-family: Roboto; font-size: 10pt; letter-spacing: -1px;}.phone_wrapper .contacts-wrapper{display: block; height: 395px; width: 260px; border-bottom: 1px solid #DADADA; overflow: hidden;}.phone_wrapper .contacts-list{display: block; height: 395px; overflow-x: hidden; overflow-y: auto;}.phone_wrapper .contacts-list h1{display: block; width: 258px; background-color: #EDEDED; color: black; font-size: 12px; font-family: 'Lato'; padding: 0px 2px;}.phone_wrapper .contacts-list p{display: block; width: 250px; background-color: #F8F8F8; float: left; margin-top: 0px; padding: 7px; font-size: 10px; font-family: 'Lato'; color: black; border-bottom : 1px solid #DADADA;}</style>
Messages : 69
Type de magie : Monomaestria
Âge / Classe / Job : 42 ans / Chercheur
Voir le profil de l'utilisateur
avatar
Admin
Mer 27 Déc - 15:07
AT&T
10:42 AM
100%
Messages
Prénom P. Nom
Details

Ceci est un message.

Ceci est un message plus long que le précédent, requérant un retour à la ligne.

ceci est un MMS

Ceci est encore un message!

On dirait que cette personne est un stalker

Mais au moins on voit que ça scroll :')

Type your message...


Code:
<link href="https://fonts.googleapis.com/css?family=Lato|Roboto" rel="stylesheet"><link rel="stylesheet" href="https://use.fontawesome.com/7208ae47c3.css"><div class="phone_wrapper"> <div class="phone"> <div class="screen"> <div class="bar"><span style="font-size: 3pt"><span class="fa fa-circle"></span><span class="fa fa-circle"></span><span class="fa fa-circle"></span><span class="fa fa-circle"></span><span class="fa fa-circle"></span></span><span style="padding-left: 2px; font-size: 9px; line-height: 12px;">AT&T</span> <span class="fa fa-wifi"></span><div class="clock">10:42 AM</div><span class="rightside-bar"><span class="fa fa-bluetooth-b"></span> <span>100%</span><span class="fa fa-battery-full"></span></span></div><div class="header"><div class="back">Messages</div><div class="icon"><img src="https://78.media.tumblr.com/c7ec04ac2688e97a7738fb6f00a2a619/tumblr_p16h7fPLcF1qb4dh8o9_250.gif"></div><div class="name">Prénom P. Nom</div><div class="contact">Details</div></div><div class="message-wrapper"> <div class="message-list"> <p>Ceci est un message.</p><p>Ceci est un message plus long que le précédent, requérant un retour à la ligne.</p><p><img src="https://media.discordapp.net/attachments/293064849548640256/396711327126781955/cadeau_athe.png?width=1007&height=672">ceci est un MMS</p><p>Ceci est encore un message!</p><p>On dirait que cette personne est un stalker</p><p>Mais au moins on voit que ça scroll :') </p></div></div><div class="reply-bar"> <div class="reply-pic"> <span class="fa fa-camera"></span> <div class="reply-bottom">Type your message...</div></div></div></div></div></div><style>.phone_wrapper{overflow: hidden;}.phone_wrapper .phone{height: 600px; width: 300px; background-image: url(https://i.imgur.com/mMm8IFI.png); background-size: cover; overflow: hidden;}.phone_wrapper .screen{position: relative; top: 67px; left: 18px; display: block; width: 263.5px; height: 465px; background: #F8F8F8; border: 1px solid #DADADA, border-radius: 2px; overflow: hidden; font-weight: normal;}.phone_wrapper .bar{display: block; height: 15px; width: 250px; padding: 4px 10px; background: #F8F8F8; color: #AAAAAA; font: 12px 'Lato';}.phone_wrapper .rightside-bar{float: right; margin-top: -15px; padding-left: 2px}.phone_wrapper .rightside-bar span{font-size: 10pt;}.phone_wrapper .header{height: 75px; width: 265px; background: #F8F8F8; border-bottom: 1px solid #DADADA;}.phone_wrapper .clock{color: #454545; text-align: center; margin-top: -12px; letter-spacing: 0px; word-spacing: 0px;}.phone_wrapper .back::before{display: inline-block; color: #1da1f2; content: "<"; font-family: Lato; font-size: 15pt; font-weight: bold; margin-right: 10px; border-radius: 5px;}.phone_wrapper .back{display: inline-block; color: #1da1f2; font-family: Roboto; font-size: 10pt; margin-right: 10px; border-radius: 5px; position: relative; top: 20px; left: 10px; letter-spacing: -1px;}.phone_wrapper .icon{display: block; position: relative; top: -20px; left: 115px; width: 50px; height: 50px; border-radius: 100%;}.phone_wrapper .icon img{width: 50px; height: 50px; border-radius: 100%;}.phone_wrapper .name{text-align: center; color: #454545; font: 10px 'Lato'; margin-top: -20px;}.phone_wrapper .contact{display: block; width: 25px; position: relative; top: -40px; left: 227px; color: #1da1f2; font: 14px 'Lato'; font-family: Roboto; font-size: 10pt; letter-spacing: -1px;}.phone_wrapper .message-wrapper{display: block; height: 340px; width: 265px; border-bottom: 1px solid #DADADA; overflow: hidden;}.phone_wrapper .message-list{display: block; height: 325px; padding: 0px 10px; margin: 10px 0px; overflow: auto;}.phone_wrapper .message-list p{display: block; width: 140px; float: right; margin-top: 0px; background: #1da1f2; padding: 7px; border-radius: 10px 10px 0px 10px; font-size: 10px; font-family: 'Lato'; color: white; text-align: justify;}.phone_wrapper .message-list p img{display: block; width: 100%;}.phone_wrapper .reply-bar{display: block; height: 25px; padding: 0px 10px;}.phone_wrapper .reply-pic{display: inline-block; width: 15px; color: #AAAAAA; font-size: 12px; font-family: 'Lato'; height: 15px; padding: 6px 0px;}.phone_wrapper .reply-bottom{display: block; height: 18px; width: 200px; position: relative; left: 25px; top: -16px; border: 1px solid #DADADA; border-radius: 5px; font-size: 10px; font-family:'Lato'; padding: 0px 10px;}</style>
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum

 :: Ministère de la Magie :: Gestion du personnage :: Téléphone
Code de Téléphone // i prefer to text

Sauter vers: