a transformer en components
continuous-integration/drone/push Build encountered an error Details

pull/1/head
Bastien OLLIER 2 years ago
parent a5ce114cc5
commit 4c27ccae22

@ -0,0 +1,165 @@
<!DOCTYPE html>
<html>
<head>
<title>Titre du document</title>
<style>
#likeCommentaire{
background-color: white;
position:fixed;
margin-left:33%;
margin-right: 33%;
border: 2px solid #666;
border-radius:10px;
width: 33%;
}
#divButton{
display:flex;
justify-content: space-between;
}
#divButton > div{
width:50%;
}
#buttonLike,#buttonCommentaire {
margin-top:10px;
background-color: white;
border:none;
width:100%;
height:25px;
}
#buttonLike{
border-bottom:solid 5px black;
}
#like{
display: block;
}
#buttonCommentaire{
border-bottom: none;
}
#commentaire{
display: none;
}
/*like et commentaire*/
#like, #commentaire{
font-size: 8px;
text-align: center;
}
#listeCompteASuivre{
border-top: 2px solid;
}
.infoPersonne{
display: flex;
}
.name{
font-size: 12px;
}
.arobase{
color:gray;
}
.PhotoProfile{
margin: 10px 15px 0px 20px;
width: 40px;
height:40px;
border-radius: 20px;
border: 2px solid #555;
}
</style>
</head>
<body>
<div id="likeCommentaire">
<div id="divButton">
<div><button type="button" id="buttonLike" onclick="openLike()">like</button></div>
<div><button type="button" id="buttonCommentaire" onclick="openCommentaire()">commentaire</button></div>
</div>
<div id="like">
<div class="infoPersonne">
<img class="PhotoProfile" src="https://i.pinimg.com/originals/5c/a0/cf/5ca0cf624647dced23ec5329ed0cde6f.png"/>
<div class="cadreName">
<h2 class="name">personne 1</h2>
<h3 class="arobase">@personne1</h3>
</div>
</div>
<div class="infoPersonne">
<img class="PhotoProfile" src="https://i.pinimg.com/originals/5c/a0/cf/5ca0cf624647dced23ec5329ed0cde6f.png"/>
<div class="cadreName">
<h2 class="name">personne 1</h2>
<h3 class="arobase">@personne1</h3>
</div>
</div>
<div class="infoPersonne">
<img class="PhotoProfile" src="https://i.pinimg.com/originals/5c/a0/cf/5ca0cf624647dced23ec5329ed0cde6f.png"/>
<div class="cadreName">
<h2 class="name">personne 1</h2>
<h3 class="arobase">@personne1</h3>
</div>
</div>
</div>
<div id="commentaire">
<div class="infoPersonne">
<img class="PhotoProfile" src="https://i.pinimg.com/originals/5c/a0/cf/5ca0cf624647dced23ec5329ed0cde6f.png"/>
<div class="cadreName">
<h2 class="name">personne 1</h2>
<h3 class="arobase">@personne1</h3>
<h4>texte du commantaire</h4>
</div>
</div>
<div class="infoPersonne">
<img class="PhotoProfile" src="https://i.pinimg.com/originals/5c/a0/cf/5ca0cf624647dced23ec5329ed0cde6f.png"/>
<div class="cadreName">
<h2 class="name">personne 1</h2>
<h3 class="arobase">@personne1</h3>
<h4>texte du commantaire</h4>
</div>
</div>
<div class="infoPersonne">
<img class="PhotoProfile" src="https://i.pinimg.com/originals/5c/a0/cf/5ca0cf624647dced23ec5329ed0cde6f.png"/>
<div class="cadreName">
<h2 class="name">personne 1</h2>
<h3 class="arobase">@personne1</h3>
<h4>texte du commantaire</h4>
</div>
</div>
</div>
</div>
</body>
<script>
function openLike() {
document.getElementById("like").style.display = "block";
document.getElementById("buttonLike").style.borderBottom = "solid 5px black";
document.getElementById("commentaire").style.display = "none";
document.getElementById("buttonCommentaire").style.borderBottom = "none";
}
function openCommentaire() {
document.getElementById("like").style.display = "none";
document.getElementById("buttonLike").style.borderBottom = "none";
document.getElementById("commentaire").style.display = "block";
document.getElementById("buttonCommentaire").style.borderBottom = "solid 5px black";
}
</script>
</html>
Loading…
Cancel
Save