Merge branch 'sila-ui' of git.sila.ru:pub/openbmc/webui-vue into sila-ui

5 files changed, 45 insertions, 14 deletions

diff --git a/src/assets/styles/bmc/_sila/_section-divider.scss b/src/assets/styles/bmc/_sila/_section-divider.scss
index e30942cc..91300393 100644
--- a/src/assets/styles/bmc/_sila/_section-divider.scss
+++ b/src/assets/styles/bmc/_sila/_section-divider.scss
@@ -4,7 +4,6 @@
 
 .collapse-divider {
   margin: 0 -1.95rem 0 -2rem;
-  padding-left: 2rem;
   @include media-breakpoint-down(md) {
     margin-left: -0.95rem;
   }
@@ -12,7 +11,16 @@
     margin-left: 2rem;
     margin-right: 2rem;
     @include media-breakpoint-down(md) {
-      margin-left: 2rem;
+      margin-left: 1rem;
+      margin-right: 1rem;
+  }
+  }
+  .btn-collapse {
+    padding-left: 2rem;
+    padding-right: 2rem;
+    @include media-breakpoint-down(md) {
+      padding-left: 1rem;
+      padding-right: 0.5rem;
     }
   }
   .form-group {
diff --git a/src/components/_sila/AppHeader/AppHeader.vue b/src/components/_sila/AppHeader/AppHeader.vue
index b890331b..22be55c7 100644
--- a/src/components/_sila/AppHeader/AppHeader.vue
+++ b/src/components/_sila/AppHeader/AppHeader.vue
@@ -43,13 +43,13 @@
           </b-navbar-brand>
           <div v-if="isNavTagPresent" :key="routerKey" class="pl-2 nav-tags">
             <span>|</span>
-            <span class="pl-3">{{ assetTag }}</span>
-            <span class="pl-3">{{ modelType }}</span>
-            <span class="pl-3">{{ serialNumber }}</span>
+            <span class="pl-2">{{ assetTag }}</span>
+            <span class="pl-2">{{ modelType }}</span>
+            <span class="pl-2">{{ serialNumber }}</span>
           </div>
         </b-navbar-nav>
         <!-- Right aligned nav items -->
-        <b-navbar-nav class="ml-auto">
+        <b-navbar-nav class="ml-auto helper-menu">
           <b-nav-item
             to="/logs/event-logs"
             data-test-id="appHeader-container-health"
@@ -258,6 +258,9 @@ export default {
     color: color('white') !important;
     fill: currentColor;
     padding: 0.68rem 1rem !important;
+    @include media-breakpoint-down(md) {
+      padding: 0.68rem 0.5rem !important;
+    }
 
     &:hover {
       background-color: theme-color-level(light, 10);
@@ -281,6 +284,23 @@ export default {
     @include media-breakpoint-up($responsive-layout-bp) {
       height: $header-height;
     }
+
+    .helper-menu {
+      @include media-breakpoint-down(sm) {
+        width: 100%;
+        justify-content: flex-end;
+      }
+
+      .nav-link,
+      .btn {
+        padding: $spacer / 1.125 $spacer / 2;
+      }
+      .responsive-text {
+        @include media-breakpoint-down(xs) {
+          @include sr-only;
+        }
+      }
+    }
   }
 
   .navbar-nav {
diff --git a/src/components/_sila/Global/ButtonBackToTop.vue b/src/components/_sila/Global/ButtonBackToTop.vue
index 9160c7b7..6d891e56 100644
--- a/src/components/_sila/Global/ButtonBackToTop.vue
+++ b/src/components/_sila/Global/ButtonBackToTop.vue
@@ -47,8 +47,8 @@ export default {
 <style lang="scss" scoped>
 .btn-top {
   position: fixed;
-  bottom: 24px;
-  right: 24px;
+  bottom: $spacer;
+  right: $spacer * 2;
 
   box-shadow: $box-shadow;
   visibility: hidden;
@@ -56,9 +56,9 @@ export default {
   transition: $transition-base;
   z-index: $zindex-fixed;
 
-  @media (min-width: 1600px) {
-    left: 1485px;
-    right: auto;
+  @include media-breakpoint-up($responsive-layout-bp) {
+    left: auto;
+    right: $spacer * 2;
   }
 }
 .show-btn {
diff --git a/src/layouts/_sila/LoginLayout.vue b/src/layouts/_sila/LoginLayout.vue
index f353a4bc..5e064a48 100644
--- a/src/layouts/_sila/LoginLayout.vue
+++ b/src/layouts/_sila/LoginLayout.vue
@@ -48,6 +48,9 @@ export default {
   width: 30vw;
   margin: auto;
   padding: 0;
+  @include media-breakpoint-down(sm) {
+    width: 45vw;
+  }
 }
 @media (max-width: 750px) {
   .login-aside {
diff --git a/src/views/_sila/Fans/Dynamic/FanSpeed.vue b/src/views/_sila/Fans/Dynamic/FanSpeed.vue
index bac1c964..cf556053 100644
--- a/src/views/_sila/Fans/Dynamic/FanSpeed.vue
+++ b/src/views/_sila/Fans/Dynamic/FanSpeed.vue
@@ -5,13 +5,13 @@
       {{ $t('pageFans.speed') }}
     </b-col>
     <b-row class="align-items-end limit-container">
-      <b-col xs="12" md="4" class="pt-2">
+      <b-col xs="12" sm="6" md="4" class="pt-2">
         <b-form-group :label="$t('pageFans.labels.warning')">
           <b-form-input v-model="warning" type="number" :min="0" :max="3150">
           </b-form-input>
         </b-form-group>
       </b-col>
-      <b-col xs="12" md="4" class="pt-2">
+      <b-col xs="12" sm="6" md="4" class="pt-2">
         <b-form-group :label="$t('pageFans.labels.shutdown')">
           <b-form-input
             v-model="shutdown"
@@ -21,7 +21,7 @@
           ></b-form-input>
         </b-form-group>
       </b-col>
-      <b-col xs="12" md="4" class="pt-2">
+      <b-col xs="12" sm="6" md="4" class="pt-2">
         <b-button variant="primary" style="height: 35px">
           {{ 'Сохранить' }}
         </b-button>