HTML UI implementation for the Google Feedback client for Chrome/ChromeOS....

chrome/browser/resources/bug_report.css

Index: chrome/browser/resources/bug_report.css
===================================================================
--- chrome/browser/resources/bug_report.css	(revision 0)
+++ chrome/browser/resources/bug_report.css	(revision 0)
@@ -0,0 +1,99 @@
+.bug-report-label {
+  text-align: start;
+  vertical-align: text-top;
+}
+
+.bug-report-text {
+  width: 40em;
+  resize: none;
+}
+
+.bug-report-button {
+  width: 8em;
+}
+
+hr {
+  border: none;
+  height: 1px;
+  background: #cccccc;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  width: 33.5em;
+}
+
+.thumbnail-list {
+  -webkit-margin-start: 1em;
+  width: 33.5em;
+  display: block;
+  margin-top: 0.5em;
+  margin-bottom: 1em;
+}
+
+.image-thumbnail-container {
+  display: inline-block;
+  border: 2px solid white;
+  -webkit-border-radius: 3px;
+  z-index: 0;
+}
+
+.image-thumbnail-container-selected {
+  display: inline-block;
+  border: 2px solid green;
+  -webkit-border-radius: 3px;
+  z-index: 0;
+}
+
+.image-thumbnail-container:hover {
+  border: 2px solid #B8DAB0;
+  z-index: 0;
+}
+
+.image-popup {
+  width: 50%;
+}
+
+.image-thumbnail {
+  position: relative;
+  z-index: 1;
+  display: inline-block;
+  padding: 0px;
+  border: 2px solid white;
+}
+
+.image-thumbnail:hover {
+  z-index: 2;
+}
+
+.image-thumbnail div {
+  display: none;
+}
+
+.image-thumbnail img {
+  display: block;
+  width: 75px;
+}
+
+.image-thumbnail:hover div {
+    display: block;
+    position: absolute;
+    top: 130%;
+    left:0;
+    padding: 1px;
+    border: 1px dashed blue;
+    background-color: transparent;
+    text-align: center
+}
+
+.image-thumbnail:hover div img {
+  position: absolute;
+  width: 400px;
+}
+
+th {
+  padding-top: 10px;
+  color: #233478;
+}
+
+body {
+  -webkit-user-select: none;
+}