diff --git a/app/assets/stylesheets/zammad.scss b/app/assets/stylesheets/zammad.scss
index b5c8c3875..1b6d6a48c 100644
--- a/app/assets/stylesheets/zammad.scss
+++ b/app/assets/stylesheets/zammad.scss
@@ -950,6 +950,7 @@ th.align-right {
display: flex;
align-items: center;
justify-content: center;
+ position: relative;
}
.checkbox-replacement.checkbox-replacement--fullscreen,
@@ -969,14 +970,42 @@ th.align-right {
}
.checkbox-replacement input,
+.radio-replacement input {
+ pointer-events: none;
+ position: absolute;
+ opacity: 0;
+}
+
+.checkbox-replacement .icon-checked,
+.radio-replacement .icon-checked {
+ color: black;
+}
+
+.checkbox-replacement .icon-unchecked,
+.radio-replacement .icon-unchecked {
+ color: #9C9C9B;
+}
+
.checkbox-replacement input:not(:checked) ~ .icon-checked,
.checkbox-replacement input:checked ~ .icon-unchecked,
-.radio-replacement input,
.radio-replacement input:not(:checked) ~ .icon-checked,
.radio-replacement input:checked ~ .icon-unchecked {
display: none;
}
+.checkbox-replacement input:focus ~ .icon-checked,
+.checkbox-replacement input:focus ~ .icon-unchecked,
+.radio-replacement input:focus ~ .icon-checked,
+.radio-replacement input:focus ~ .icon-unchecked, {
+ box-shadow: 0 0 0 2px hsl(201,62%,90%);
+ color: hsl(200,71%,59%);
+}
+
+.radio-replacement input:focus ~ .icon-checked,
+.radio-replacement input:focus ~ .icon-unchecked {
+ border-radius: 100%;
+}
+
.checkbox-replacement + .label-text,
.radio-replacement + .label-text {
margin-left: 0;
diff --git a/contrib/icon-sprite.sketch b/contrib/icon-sprite.sketch
index ab9da5357..3858de59e 100644
Binary files a/contrib/icon-sprite.sketch and b/contrib/icon-sprite.sketch differ
diff --git a/gulpfile.js b/gulpfile.js
index 5d9edac2c..cb4b41cab 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -17,6 +17,7 @@ gulp.task('svgstore', function () {
run: function ($) {
// remove green-screen color
$('[fill="#50E3C2"]').removeAttr('fill').parents('[fill="none"]').removeAttr('fill');
+ $('[fill="#BD0FE1"]').attr('fill', 'currentColor').parents('[fill="none"]').removeAttr('fill');
},
parserOptions: { xmlMode: true }
}))
diff --git a/public/assets/images/icons.svg b/public/assets/images/icons.svg
index 5ca1f6cf6..7c560e71d 100644
--- a/public/assets/images/icons.svg
+++ b/public/assets/images/icons.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/public/assets/images/icons/checkbox-checked.svg b/public/assets/images/icons/checkbox-checked.svg
index 10dce42e3..ca179fe4c 100644
--- a/public/assets/images/icons/checkbox-checked.svg
+++ b/public/assets/images/icons/checkbox-checked.svg
@@ -1,14 +1,14 @@
-