diff --git a/htdocs/css/openwebrx.css b/htdocs/css/openwebrx.css
index da93283..bd8e828 100644
--- a/htdocs/css/openwebrx.css
+++ b/htdocs/css/openwebrx.css
@@ -667,16 +667,6 @@ img.openwebrx-mirror-img
text-align: center;
}
-#openwebrx-mute-on
-{
- color: lime;
-}
-
-#openwebrx-mute-off
-{
- color: white;
-}
-
.openwebrx-panel-slider
{
position: relative;
@@ -993,6 +983,7 @@ img.openwebrx-mirror-img
display: flex;
flex-direction: column;
position: relative;
+ overflow: hidden;
}
.openwebrx-meta-slot > * {
@@ -1001,18 +992,14 @@ img.openwebrx-mirror-img
line-height: 1.2em;
}
-.openwebrx-meta-slot, .openwebrx-meta-slot.muted:before {
+.openwebrx-meta-slot, .openwebrx-meta-slot .mute {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
-.openwebrx-meta-slot.muted:before {
- display: block;
- content: "";
- background-image: url("../gfx/openwebrx-mute.png");
- background-position: center;
- background-repeat: no-repeat;
+.openwebrx-meta-slot .mute {
+ display: none;
cursor: pointer;
position: absolute;
@@ -1023,6 +1010,17 @@ img.openwebrx-mirror-img
background-color: rgba(0,0,0,.3);
}
+.openwebrx-meta-slot .mute svg {
+ position: absolute;
+ top: 50%;
+ left: 0;
+ transform: translate(0, -50%);
+}
+
+.openwebrx-meta-slot.muted .mute {
+ display: block;
+}
+
.openwebrx-meta-slot.active {
background-color: #95bbdf;
}
@@ -1042,15 +1040,21 @@ img.openwebrx-mirror-img
flex: 1;
background-position: center;
background-repeat: no-repeat;
+ line-height: 0;
}
-.openwebrx-meta-slot.active.direct .openwebrx-meta-user-image,
-#openwebrx-panel-metadata-ysf .openwebrx-meta-slot.active .openwebrx-meta-user-image {
- background-image: url("../gfx/openwebrx-directcall.png");
+.openwebrx-meta-slot .openwebrx-meta-user-image img {
+ height: 133px;
+ display: none;
}
-.openwebrx-meta-slot.active.group .openwebrx-meta-user-image {
- background-image: url("../gfx/openwebrx-groupcall.png");
+.openwebrx-meta-slot.active.direct .openwebrx-meta-user-image .directcall,
+#openwebrx-panel-metadata-ysf .openwebrx-meta-slot.active .openwebrx-meta-user-image .directcall {
+ display: initial;
+}
+
+.openwebrx-meta-slot.active.group .openwebrx-meta-user-image .groupcall {
+ display: initial;
}
.openwebrx-meta-slot.group .openwebrx-dmr-target:not(:empty):before {
diff --git a/htdocs/gfx/openwebrx-directcall.png b/htdocs/gfx/openwebrx-directcall.png
deleted file mode 100644
index 2d74713..0000000
Binary files a/htdocs/gfx/openwebrx-directcall.png and /dev/null differ
diff --git a/htdocs/gfx/openwebrx-directcall.svg b/htdocs/gfx/openwebrx-directcall.svg
new file mode 100644
index 0000000..3440112
--- /dev/null
+++ b/htdocs/gfx/openwebrx-directcall.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/htdocs/gfx/openwebrx-groupcall.png b/htdocs/gfx/openwebrx-groupcall.png
deleted file mode 100644
index 5d61a4c..0000000
Binary files a/htdocs/gfx/openwebrx-groupcall.png and /dev/null differ
diff --git a/htdocs/gfx/openwebrx-groupcall.svg b/htdocs/gfx/openwebrx-groupcall.svg
new file mode 100644
index 0000000..5083a57
--- /dev/null
+++ b/htdocs/gfx/openwebrx-groupcall.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/htdocs/gfx/svg-defs.svg b/htdocs/gfx/svg-defs.svg
index 5b5c6d7..1ee9a8b 100644
--- a/htdocs/gfx/svg-defs.svg
+++ b/htdocs/gfx/svg-defs.svg
@@ -22,5 +22,6 @@