Use SVG image for comment deletion icon

This also puts the icon to the right and the timestamp in the byline
and wipes out a repeated instance of the byline.

Signed-off-by: Marcel Korpel <marcel.korpel@gmail.com>
Signed-off-by: Lukas Fleischer <lfleischer@archlinux.org>

5 files changed, 54 insertions, 0 deletions

diff --git a/web/html/css/aurweb.css b/web/html/css/aurweb.css
index d67877a..adc02bb 100644
--- a/web/html/css/aurweb.css
+++ b/web/html/css/aurweb.css
@@ -96,6 +96,22 @@
 	color: #999;
 }
 
+.delete-comment-form {
+	float: right;
+}
+
+.delete-comment {
+	-webkit-filter: grayscale(100%);
+	filter: grayscale(100%);
+	opacity: 0.6;
+}
+
+.delete-comment:hover {
+	-webkit-filter: none;
+	filter: none;
+	opacity: 1;
+}
+
 legend {
 	padding: 1em 0;
 }
diff --git a/web/html/images/x.min.svg b/web/html/images/x.min.svg
new file mode 100644
index 0000000..833d4f2
--- /dev/null
+++ b/web/html/images/x.min.svg
@@ -0,0 +1,3 @@
+<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8" height="8" width="8" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
+<path fill="#36a" d="m1.41 0l-1.41 1.41 0.72 0.72 1.78 1.81-1.78 1.78-0.72 0.69 1.41 1.44 0.72-0.72 1.81-1.81 1.78 1.81 0.69 0.72 1.44-1.44-0.72-0.69-1.81-1.78 1.81-1.81 0.72-0.72-1.44-1.41-0.69 0.72-1.78 1.78-1.81-1.78-0.72-0.72z"/>
+</svg>
diff --git a/web/html/images/x.png b/web/html/images/x.png
deleted file mode 100644
index a85e169..0000000
--- a/web/html/images/x.png
+++ /dev/null
diff --git a/web/html/images/x.svg b/web/html/images/x.svg
new file mode 100644
index 0000000..e323fe1
--- /dev/null
+++ b/web/html/images/x.svg
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   version="1.1"
+   id="svg2"
+   viewBox="0 0 8 8"
+   height="8"
+   width="8">
+  <metadata
+     id="metadata10">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs8" />
+  <path
+     style="fill:#3366aa;fill-opacity:1"
+     id="path4"
+     d="M1.41 0l-1.41 1.41.72.72 1.78 1.81-1.78 1.78-.72.69 1.41 1.44.72-.72 1.81-1.81 1.78 1.81.69.72 1.44-1.44-.72-.69-1.81-1.78 1.81-1.81.72-.72-1.44-1.41-.69.72-1.78 1.78-1.81-1.78-.72-.72z" />
+</svg>
diff --git a/web/html/index.php b/web/html/index.php
index 27d897c..2d5f2a9 100644
--- a/web/html/index.php
+++ b/web/html/index.php
@@ -173,6 +173,10 @@ if (!empty($tokens[1]) && '/' . $tokens[1] == get_pkg_route()) {
 		header("Content-Type: image/png");
 		readfile("./$path");
 		break;
+	case "/images/x.min.svg":
+		header("Content-Type: image/svg+xml");
+		readfile("./$path");
+		break;
 	case "/js/bootstrap-typeahead.min.js":
 		header("Content-Type: application/javascript");
 		readfile("./$path");