| <html> |
|
|
| <head> |
| <meta charset="UTF-8"> |
| <style> |
| * { |
| margin: 0; |
| padding: 0; |
| } |
| |
| .rate { |
| float: left; |
| height: 46px; |
| padding: 0 10px; |
| } |
| |
| .rate:not(:checked)>input { |
| position: absolute; |
| top: -9999px; |
| } |
| |
| .rate:not(:checked)>label { |
| float: right; |
| width: 1em; |
| overflow: hidden; |
| white-space: nowrap; |
| cursor: pointer; |
| font-size: 30px; |
| color: #ccc; |
| } |
| |
| .rate:not(:checked)>label:before { |
| content: '★ '; |
| } |
| |
| .rate>input:checked~label { |
| color: #ffc700; |
| } |
| |
| .rate:not(:checked)>label:hover, |
| .rate:not(:checked)>label:hover~label { |
| color: #deb217; |
| } |
| |
| .rate>input:checked+label:hover, |
| .rate>input:checked+label:hover~label, |
| .rate>input:checked~label:hover, |
| .rate>input:checked~label:hover~label, |
| .rate>label:hover~input:checked~label { |
| color: #c59b08; |
| } |
| |
| |
| </style> |
| </head> |
|
|
| <body> |
| <form method="POST" |
| action="https://script.google.com/macros/s/AKfycbz_3RbhDT53-rXK6LMk1CoABUtvkRc5e5QVvrVmG0inKmTdR1I0G6QZ6hoONvh3eYM9/exec"> |
| <div class="rate"> |
| <input type="radio" id="star5" name="Rating" value="5" /> |
| <label for="star5" title="text">5 stars</label> |
| <input type="radio" id="star4" name="Rating" value="4" /> |
| <label for="star4" title="text">4 stars</label> |
| <input type="radio" id="star3" name="Rating" value="3" /> |
| <label for="star3" title="text">3 stars</label> |
| <input type="radio" id="star2" name="Rating" value="2" /> |
| <label for="star2" title="text">2 stars</label> |
| <input type="radio" id="star1" name="Rating" value="1" /> |
| <label for="star1" title="text">1 star</label> |
| </div> |
| <textarea name="Feedback" cols="30" rows="5" placeholder="Where could we improve?..."></textarea> |
| <div class="btn-group"> |
| <button type="submit" class="btn submit" onClick={this.onClickButton}>Submit</button> |
| </div> |
| <input type="hidden" id="firstname" name="Name" value="" /> |
| <input type="hidden" name="Asset" value="Temp" /> |
| </form> |
| <script>document.getElementById("firstname").setAttribute('value', window.circleUser.firstName); |
| </script> |
| </body> |
|
|
| </html> |