fix responsive table for network page

3 files changed, 10 insertions, 2 deletions

diff --git a/src/assets/styles/bmc/_sila/_tables.scss b/src/assets/styles/bmc/_sila/_tables.scss
index c9977905..bddb4d1d 100644
--- a/src/assets/styles/bmc/_sila/_tables.scss
+++ b/src/assets/styles/bmc/_sila/_tables.scss
@@ -165,6 +165,14 @@
     }
   }
 }
+// style for table contained in <b-card> components
+#page-network {
+  [class*='table-responsive-'] {
+      @include media-breakpoint-up(lg) {
+      width: calc(100vw - 390px);
+    }
+  }
+}
 
 // Table stacked style for small screen only
 @include media-breakpoint-down(xs) {
diff --git a/src/views/_sila/Overview/Network/Network.vue b/src/views/_sila/Overview/Network/Network.vue
index 2321b1bd..27e855cc 100644
--- a/src/views/_sila/Overview/Network/Network.vue
+++ b/src/views/_sila/Overview/Network/Network.vue
@@ -1,5 +1,5 @@
 <template>
-  <b-container fluid="xl">
+  <b-container id="page-network" fluid="xl">
     <page-title :description="$t('pageNetwork.pageDescription')" />
     <!-- Global settings for all interfaces -->
     <network-global-settings />
diff --git a/src/views/_sila/Overview/Network/TableDns.vue b/src/views/_sila/Overview/Network/TableDns.vue
index 3b3cc4b4..ee830ee4 100644
--- a/src/views/_sila/Overview/Network/TableDns.vue
+++ b/src/views/_sila/Overview/Network/TableDns.vue
@@ -1,7 +1,7 @@
 <template>
   <page-section :section-title="$t('pageNetwork.staticDns')">
     <b-row>
-      <b-col lg="6">
+      <b-col>
         <div class="text-right">
           <b-button variant="primary" @click="initDnsModal()">
             <icon-add />