Skip to content

Instantly share code, notes, and snippets.

@GurusoftTommy
Last active June 3, 2020 19:21
Show Gist options
  • Save GurusoftTommy/39022038a9358112938ff3354c1d7643 to your computer and use it in GitHub Desktop.
Save GurusoftTommy/39022038a9358112938ff3354c1d7643 to your computer and use it in GitHub Desktop.
Kundefeedback
.feedbackIcon{
font-size: 50px;
margin: 5px;
}
.myFeedbackWrapper{
width: 400px;
}
.myOpinionWrapper{
width: 200px;
}
.myOpinionIcon{
font-size: 20px;
margin: 5px;
}
.centerWrapper{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
<!-- Start myFeedback--->
<h2 class='text-center'>Hvordan var din kjøpsopplevelse?</h2>
<div class='row centerWrapper'>
<div class='myFeedbackWrapper'>
<div class='col-xs-4'><button type='button' class='btn btn-success myFeedback' value='Great'><i class='fas fa-smile feedbackIcon myFeedback' value='Great'></i></button></div>
<div class='col-xs-4'> <button type='button' class='btn btn-warning myFeedback' value='Medium'><i class='fas fa-meh feedbackIcon myFeedback' value='Medium'></i></button></div>
<div class='col-xs-4'><button type='button' class='btn btn-danger myFeedback' value='Bad'><i class='fas fa-frown feedbackIcon myFeedback' value='Bad'></i></button></div>
</div>
</div>
<!-- End myFeedback--->
<!-- Start myOpinion--->
<h3 class='text-center'>Hva synes du om denne artikkelen?</h2>
<div class='row centerWrapper'>
<div class='myOpinionWrapper'>
<div class='col-xs-6'><button type='button' class='btn btn-primary myOpinion' value='thumbsUp'><i class='far fa-thumbs-up myOpinionIcon myOpinion' value='thumbsUp'></i></button></div>
<div class='col-xs-6'><button type='button' class='btn btn-primary myOpinion' value='thumbsDown'><i class='far fa-thumbs-down myOpinionIcon myOpinion' value='thumbsDown'></i></button></div>
</div>
</div>
<!-- End myOpinion--->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment