[pdm-devel] [PATCH datacenter-manager 3/5] ui: add cdrom icon

[Dietmar Maurer <dietmar@proxmox.com>]

Signed-off-by: Dietmar Maurer <dietmar@proxmox.com>
---
 ui/css/pdm.scss             | 12 ++++++++++++
 ui/images/icon-cd-drive.svg | 26 ++++++++++++++++++++++++++
 2 files changed, 38 insertions(+)
 create mode 100644 ui/images/icon-cd-drive.svg

diff --git a/ui/css/pdm.scss b/ui/css/pdm.scss
index 71cd4b0..a15b4e8 100644
--- a/ui/css/pdm.scss
+++ b/ui/css/pdm.scss
@@ -57,6 +57,17 @@
     display: inline-block;
 }
 
+.fa-cdrom::before {
+    content: " ";
+    background-image: url(./images/icon-cd-drive.svg);
+    background-size: 16px 16px;
+    background-repeat: no-repeat;
+    width: 16px;
+    height: 16px;
+    vertical-align: bottom;
+    display: inline-block;
+}
+
 .fa-sdn-vnet::before {
     content: " ";
     mask-image: url(./images/icon-sdn-vnet.svg);
@@ -96,6 +107,7 @@
 }
 
 :root.pwt-dark-mode {
+    .fa-cdrom,
     .fa-memory,
     .fa-cpu {
         filter: invert(90%);
diff --git a/ui/images/icon-cd-drive.svg b/ui/images/icon-cd-drive.svg
new file mode 100644
index 0000000..6ee7184
--- /dev/null
+++ b/ui/images/icon-cd-drive.svg
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+    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"
+    width="100"
+    height="100"
+    version="1.1"
+>
+    <style type="text/css">
+        path, .outline { fill: none; stroke: #000; }
+        .filled { fill: #000; stroke: #000; }
+    /* handled over an outer CSS filter as WebKit / Safari do not inherit the context over SVG
+     * image boundary even though that's accepted by the w3c CSSWG...
+     *  @media (prefers-color-scheme: dark) {
+     *      path, .outline { fill: none; stroke: #fff; }
+     *      .filled { fill: #fff; stroke: #fff; }
+     *  }
+     **/
+    </style>
+
+    <g class="outline" stroke-width="8">
+        <circle cx="50" cy="50" r="45"/>
+        <circle cx="50" cy="50" r="15"/>
+    </g>
+</svg>
-- 
2.47.3


_______________________________________________
pdm-devel mailing list
pdm-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pdm-devel