From 4929c3c1961a97d0f3b11e91935e8ddbbf0b1a7b Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Thu, 30 May 2024 02:36:11 +0300
Subject: [PATCH] No need for binding

---
 doc/speeddial/LinearDoc.vue        | 6 +++---
 doc/speeddial/QuarterCircleDoc.vue | 6 +++---
 doc/speeddial/SemiCircleDoc.vue    | 4 ++--
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/doc/speeddial/LinearDoc.vue b/doc/speeddial/LinearDoc.vue
index b9f1a9969..7e5cf945b 100644
--- a/doc/speeddial/LinearDoc.vue
+++ b/doc/speeddial/LinearDoc.vue
@@ -3,7 +3,7 @@
         <p>SpeedDial items are defined with the <i>model</i> property based on MenuModel API. Default orientation of the items is linear and <i>direction</i> property is used to define the position of the items related to the button.</p>
     </DocSectionText>
     <div class="card">
-        <div :style="{ position: 'relative', height: '500px' }">
+        <div style="position: relative; height: 500px">
             <SpeedDial :model="items" direction="up" :style="{ position: 'absolute', left: 'calc(50% - 2rem)', bottom: 0 }" />
             <SpeedDial :model="items" direction="down" :style="{ position: 'absolute', left: 'calc(50% - 2rem)', top: 0 }" />
             <SpeedDial :model="items" direction="left" :style="{ position: 'absolute', top: 'calc(50% - 2rem)', right: 0 }" />
@@ -64,7 +64,7 @@ export default {
                 options: `
 <template>
     <div class="card">
-        <div :style="{ position: 'relative', height: '500px' }">
+        <div style="position: relative; height: 500px">
             <SpeedDial :model="items" direction="up" :style="{ position: 'absolute', left: 'calc(50% - 2rem)', bottom: 0 }" />
             <SpeedDial :model="items" direction="down" :style="{ position: 'absolute', left: 'calc(50% - 2rem)', top: 0 }" />
             <SpeedDial :model="items" direction="left" :style="{ position: 'absolute', top: 'calc(50% - 2rem)', right: 0 }" />
@@ -123,7 +123,7 @@ export default {
                 composition: `
 <template>
     <div class="card">
-        <div :style="{ position: 'relative', height: '500px' }">
+        <div style="position: relative; height: 500px">
             <SpeedDial :model="items" direction="up" :style="{ position: 'absolute', left: 'calc(50% - 2rem)', bottom: 0 }" />
             <SpeedDial :model="items" direction="down" :style="{ position: 'absolute', left: 'calc(50% - 2rem)', top: 0 }" />
             <SpeedDial :model="items" direction="left" :style="{ position: 'absolute', top: 'calc(50% - 2rem)', right: 0 }" />
diff --git a/doc/speeddial/QuarterCircleDoc.vue b/doc/speeddial/QuarterCircleDoc.vue
index f6b4f4da5..ba455cfe3 100644
--- a/doc/speeddial/QuarterCircleDoc.vue
+++ b/doc/speeddial/QuarterCircleDoc.vue
@@ -3,7 +3,7 @@
         <p>Setting <i>type</i> as <i>quarter-circle</i> displays the items at one of four corners of a button based on the <i>direction</i>.</p>
     </DocSectionText>
     <div class="card">
-        <div :style="{ position: 'relative', height: '500px' }">
+        <div style="position: relative; height: 500px">
             <SpeedDial :model="items" :radius="120" type="quarter-circle" direction="up-left" :style="{ position: 'absolute', right: 0, bottom: 0 }" />
             <SpeedDial :model="items" :radius="120" type="quarter-circle" direction="up-right" :style="{ position: 'absolute', left: 0, bottom: 0 }" />
             <SpeedDial :model="items" :radius="120" type="quarter-circle" direction="down-left" :style="{ position: 'absolute', right: 0, top: 0 }" />
@@ -64,7 +64,7 @@ export default {
                 options: `
 <template>
     <div class="card">
-        <div :style="{ position: 'relative', height: '500px' }">
+        <div style="position: relative; height: 500px">
             <SpeedDial :model="items" :radius="120" type="quarter-circle" direction="up-left" :style="{ position: 'absolute', right: 0, bottom: 0 }" />
             <SpeedDial :model="items" :radius="120" type="quarter-circle" direction="up-right" :style="{ position: 'absolute', left: 0, bottom: 0 }" />
             <SpeedDial :model="items" :radius="120" type="quarter-circle" direction="down-left" :style="{ position: 'absolute', right: 0, top: 0 }" />
@@ -123,7 +123,7 @@ data() {
                 composition: `
 <template>
     <div class="card">
-        <div :style="{ position: 'relative', height: '500px' }">
+        <div style="position: relative; height: 500px">
             <SpeedDial :model="items" :radius="120" type="quarter-circle" direction="up-left" :style="{ position: 'absolute', right: 0, bottom: 0 }" />
             <SpeedDial :model="items" :radius="120" type="quarter-circle" direction="up-right" :style="{ position: 'absolute', left: 0, bottom: 0 }" />
             <SpeedDial :model="items" :radius="120" type="quarter-circle" direction="down-left" :style="{ position: 'absolute', right: 0, top: 0 }" />
diff --git a/doc/speeddial/SemiCircleDoc.vue b/doc/speeddial/SemiCircleDoc.vue
index ae8667095..c38beb524 100644
--- a/doc/speeddial/SemiCircleDoc.vue
+++ b/doc/speeddial/SemiCircleDoc.vue
@@ -3,7 +3,7 @@
         <p>When <i>type</i> is defined as <i>semi-circle</i>, items are displayed in a half-circle around the button.</p>
     </DocSectionText>
     <div class="card">
-        <div :style="{ position: 'relative', height: '500px' }">
+        <div style="position: relative; height: 500px">
             <SpeedDial :model="items" :radius="80" type="semi-circle" direction="down" :style="{ position: 'absolute', left: 'calc(50% - 2rem)', top: 0 }" />
             <SpeedDial :model="items" :radius="80" type="semi-circle" direction="right" :style="{ position: 'absolute', top: 'calc(50% - 2rem)', left: 0 }" />
             <SpeedDial :model="items" :radius="80" type="semi-circle" direction="left" :style="{ position: 'absolute', top: 'calc(50% - 2rem)', right: 0 }" />
@@ -64,7 +64,7 @@ export default {
                 options: `
 <template>
     <div class="card">
-        <div :style="{ position: 'relative', height: '500px' }">
+        <div style="position: relative; height: 500px">
             <SpeedDial :model="items" :radius="80" type="semi-circle" direction="down" :style="{ position: 'absolute', left: 'calc(50% - 2rem)', top: 0 }" />
             <SpeedDial :model="items" :radius="80" type="semi-circle" direction="right" :style="{ position: 'absolute', top: 'calc(50% - 2rem)', left: 0 }" />
             <SpeedDial :model="items" :radius="80" type="semi-circle" direction="left" :style="{ position: 'absolute', top: 'calc(50% - 2rem)', right: 0 }" />