From 959704f16d9df26dcd5239bbb999f99bab8f1dc6 Mon Sep 17 00:00:00 2001
From: Dmitriymush <powder322@gmail.com>
Date: Thu, 1 Feb 2024 12:12:02 +0200
Subject: [PATCH] UI: added improvements and refactoring for snmp

---
 ...ce-profile-communication-config.component.scss | 15 ++++++++-------
 .../snmp-device-profile-mapping.component.html    |  4 ++--
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/profile/device/snmp/snmp-device-profile-communication-config.component.scss b/ui-ngx/src/app/modules/home/components/profile/device/snmp/snmp-device-profile-communication-config.component.scss
index 870b627378..e7877699b5 100644
--- a/ui-ngx/src/app/modules/home/components/profile/device/snmp/snmp-device-profile-communication-config.component.scss
+++ b/ui-ngx/src/app/modules/home/components/profile/device/snmp/snmp-device-profile-communication-config.component.scss
@@ -13,19 +13,20 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+@import '../scss/constants';
+
 :host {
   .communication-config {
     border: 2px groove rgba(0, 0, 0, 0.25);
     border-radius: 4px;
     padding: 8px;
     min-width: 0;
-    flex-direction: row;
-    box-sizing: border-box;
+    flex-direction: column;
     display: flex;
     place-content: stretch flex-start;
     align-items: stretch;
-    flex: 1 1 0;
-    gap: 8px;
+    flex: 1;
+    gap: 0;
   }
 
   .scope-row {
@@ -36,10 +37,10 @@
     margin: 16px 0
   }
 
-  @media (max-width: 1650px) {
+  @media #{$mat-gt-xmd} {
     .communication-config {
-      flex-direction: column;
-      gap: 0;
+      flex-direction: row;
+      gap: 8px;
     }
   }
 }
diff --git a/ui-ngx/src/app/modules/home/components/profile/device/snmp/snmp-device-profile-mapping.component.html b/ui-ngx/src/app/modules/home/components/profile/device/snmp/snmp-device-profile-mapping.component.html
index 94330f7c23..8b4b656c02 100644
--- a/ui-ngx/src/app/modules/home/components/profile/device/snmp/snmp-device-profile-mapping.component.html
+++ b/ui-ngx/src/app/modules/home/components/profile/device/snmp/snmp-device-profile-mapping.component.html
@@ -19,8 +19,8 @@
   <div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px" fxFlex="100">
     <div fxFlex fxLayout="row" fxLayoutGap="8px">
       <label fxFlex="26" class="tb-title no-padding" translate>device-profile.snmp.data-type</label>
-      <label fxFlex="37" class="tb-title no-padding" translate>device-profile.snmp.data-key</label>
-      <label fxFlex="37" class="tb-title no-padding" translate>device-profile.snmp.oid</label>
+      <label fxFlex="37" class="tb-title tb-required no-padding" translate>device-profile.snmp.data-key</label>
+      <label fxFlex="37" class="tb-title tb-required no-padding" translate>device-profile.snmp.oid</label>
       <span style="min-width: 40px" [fxShow]="!disabled"></span>
     </div>
   </div>