diff --git a/client/src/global-styles/components.css b/client/src/global-styles/components.css
index d038152..1ba83ee 100644
--- a/client/src/global-styles/components.css
+++ b/client/src/global-styles/components.css
@@ -71,8 +71,9 @@ button, .button {
   background-color: var(--cl-bg-hl);
 }
 
-.button:disabled, button:disabled {
+.button:disabled, button:disabled, .disabled {
   background-color: var(--cl-bg-hl);
+  pointer-events: none;
 }
 
 input, textarea {
diff --git a/client/src/pages/firewall/DestinationNATRules.vue b/client/src/pages/firewall/DestinationNATRules.vue
index 41f6121..a5eeb0f 100644
--- a/client/src/pages/firewall/DestinationNATRules.vue
+++ b/client/src/pages/firewall/DestinationNATRules.vue
@@ -56,7 +56,7 @@ onMounted(async() => {
       <TableView title="DNAT Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
       <button @click="load">Refresh</button>
       <router-link class="button" to="/edit/firewall/destinationnatrules">Create</router-link>
-      <router-link class="button" :disabled="selection.length != 1" :to="'/edit/firewall/destinationnatrules/' + selection[0]">Edit</router-link>
+      <router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/firewall/destinationnatrules/' + selection[0]">Edit</router-link>
       <button @click="deleteRule" :disabled="selection.length != 1">Delete</button>
     </TableView>
   </div>
diff --git a/client/src/pages/firewall/ForwardRules.vue b/client/src/pages/firewall/ForwardRules.vue
index d526b8d..4fa8ced 100644
--- a/client/src/pages/firewall/ForwardRules.vue
+++ b/client/src/pages/firewall/ForwardRules.vue
@@ -57,7 +57,7 @@ onMounted(async() => {
       <TableView title="Forward Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
       <button @click="load">Refresh</button>
       <router-link class="button" to="/edit/firewall/forwardrules">Create</router-link>
-      <router-link class="button" :disabled="selection.length != 1" :to="'/edit/firewall/forwardrules/' + selection[0]">Edit</router-link>
+      <router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/firewall/forwardrules/' + selection[0]">Edit</router-link>
       <button @click="deleteRule" :disabled="selection.length != 1">Delete</button>
     </TableView>
   </div>
diff --git a/client/src/pages/firewall/SourceNATRules.vue b/client/src/pages/firewall/SourceNATRules.vue
index f03f50b..3907c32 100644
--- a/client/src/pages/firewall/SourceNATRules.vue
+++ b/client/src/pages/firewall/SourceNATRules.vue
@@ -56,7 +56,7 @@ onMounted(async() => {
       <TableView title="SNAT Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
       <button @click="load">Refresh</button>
       <router-link class="button" to="/edit/firewall/sourcenatrules">Create</router-link>
-      <router-link class="button" :disabled="selection.length != 1" :to="'/edit/firewall/sourcenatrules/' + selection[0]">Edit</router-link>
+      <router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/firewall/sourcenatrules/' + selection[0]">Edit</router-link>
       <button @click="deleteRule" :disabled="selection.length != 1">Delete</button>
     </TableView>
   </div>
diff --git a/client/src/pages/network/Interfaces.vue b/client/src/pages/network/Interfaces.vue
index d4dd302..d4753a8 100644
--- a/client/src/pages/network/Interfaces.vue
+++ b/client/src/pages/network/Interfaces.vue
@@ -60,7 +60,7 @@ onMounted(async() => {
   <TableView title="Interfaces" :columns="columns" :loading="loading" v-model:selection="selection" v-model:data="displayData" :table-props="{sort:true, sortSelf: true}">
     <button @click="load">Refresh</button>
     <router-link class="button" to="/edit/network/interfaces">Create</router-link>
-    <router-link class="button" :disabled="selection.length != 1" :to="'/edit/network/interfaces/' + selection[0]">Edit</router-link>
+    <router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/network/interfaces/' + selection[0]">Edit</router-link>
     <button @click="deleteInterface" :disabled="selection.length != 1">Delete</button>
   </TableView>
 </template>
\ No newline at end of file
diff --git a/client/src/pages/object/Addresses.vue b/client/src/pages/object/Addresses.vue
index 9a265ba..2ebaed1 100644
--- a/client/src/pages/object/Addresses.vue
+++ b/client/src/pages/object/Addresses.vue
@@ -79,7 +79,7 @@ onMounted(async() => {
     <TableView title="Addresses" :columns="columns" :loading="loading" v-model:selection="selection" v-model:data="displayData" :table-props="{sort:true, sortSelf: true}">
     <button @click="load">Refresh</button>
     <router-link class="button" to="/edit/object/addresses">Create</router-link>
-    <router-link class="button" :disabled="selection.length != 1" :to="'/edit/object/addresses/' + selection[0]">Edit</router-link>
+    <router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/object/addresses/' + selection[0]">Edit</router-link>
     <button @click="deleteAddress" :disabled="selection.length != 1">Delete</button>
   </TableView>
 </template>
\ No newline at end of file
diff --git a/client/src/pages/object/Services.vue b/client/src/pages/object/Services.vue
index 5a4a0ef..dc7aa74 100644
--- a/client/src/pages/object/Services.vue
+++ b/client/src/pages/object/Services.vue
@@ -84,7 +84,7 @@ onMounted(async() => {
   <TableView title="Services" :columns="columns" :loading="loading" v-model:selection="selection" v-model:data="displayData" :table-props="{sort:true, sortSelf: true}">
     <button @click="load">Refresh</button>
     <router-link class="button" to="/edit/object/services">Create</router-link>
-    <router-link class="button" :disabled="selection.length != 1" :to="'/edit/object/services/' + selection[0]">Edit</router-link>
+    <router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/object/services/' + selection[0]">Edit</router-link>
     <button @click="deleteService" :disabled="selection.length != 1">Delete</button>
   </TableView>
 </template>
\ No newline at end of file