From d6bf5b807bbf97ef6cf65d4a6379598d579f6a49 Mon Sep 17 00:00:00 2001
From: cagataycivici <cagatay.civici@gmail.com>
Date: Fri, 26 Jun 2020 22:29:11 +0300
Subject: [PATCH] Reimplemented radio icon

---
 src/components/datatable/RowRadioButton.vue |  2 +-
 src/components/radiobutton/RadioButton.css  | 13 +++++++++++++
 src/components/radiobutton/RadioButton.vue  |  2 +-
 3 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/components/datatable/RowRadioButton.vue b/src/components/datatable/RowRadioButton.vue
index 69b13d2cf..6a5c7cb0c 100755
--- a/src/components/datatable/RowRadioButton.vue
+++ b/src/components/datatable/RowRadioButton.vue
@@ -4,7 +4,7 @@
            <input ref="input" type="radio" :checked="checked" @focus="onFocus($event)" @blur="onBlur($event)" :disabled="disabled">
         </div>
         <div ref="box" :class="['p-radiobutton-box p-component', {'p-highlight': checked, 'p-disabled': disabled, 'p-focus': focused}]" role="radio" :aria-checked="checked">
-            <span :class="['p-radiobutton-icon', {'pi pi-circle-on': checked}]"></span>
+            <div class="p-radiobutton-icon"></div>
         </div>
     </div>
 </template>
diff --git a/src/components/radiobutton/RadioButton.css b/src/components/radiobutton/RadioButton.css
index 99b88684a..224316841 100755
--- a/src/components/radiobutton/RadioButton.css
+++ b/src/components/radiobutton/RadioButton.css
@@ -9,4 +9,17 @@
     display: flex;
     justify-content: center;
     align-items: center;
+}
+
+.p-radiobutton-icon {
+    -webkit-backface-visibility: hidden;
+    backface-visibility: hidden;
+    transform: translateZ(0) scale(.1);
+    border-radius: 50%;
+    visibility: hidden;
+}
+
+.p-radiobutton-box.p-highlight .p-radiobutton-icon {
+    transform: translateZ(0) scale(1.0, 1.0);
+    visibility: visible;
 }
\ No newline at end of file
diff --git a/src/components/radiobutton/RadioButton.vue b/src/components/radiobutton/RadioButton.vue
index c3f3759de..cc304ed93 100755
--- a/src/components/radiobutton/RadioButton.vue
+++ b/src/components/radiobutton/RadioButton.vue
@@ -4,7 +4,7 @@
            <input ref="input" type="radio" :checked="checked" :value="value" v-bind="$attrs" @focus="onFocus($event)" @blur="onBlur($event)">
         </div>
         <div ref="box" :class="['p-radiobutton-box', {'p-highlight': checked, 'p-disabled': $attrs.disabled, 'p-focus': focused}]" role="radio" :aria-checked="checked">
-            <span :class="['p-radiobutton-icon', {'pi pi-circle-on': checked}]"></span>
+            <div class="p-radiobutton-icon"></div>
         </div>
     </div>
 </template>