feat: changed initial page layout

src/webparts/requestPortal/components/SideNav/SideNav.module.scss

@@ -1,28 +1,77 @@
 @import '../../../../styles/design-tokens';
 
-// Тёмное боковое меню портала (фирменный navy-градиент, золотой маркер
-// активного пункта — как в остальном дизайне).
+// Тёмный боковой рейл портала на всю высоту (фирменный navy-градиент, золотой
+// маркер активного пункта). Не «плавает»: примыкает к контенту, тянется по высоте.
 .nav {
   display: flex;
   flex-direction: column;
-  gap: 2px;
-  width: 240px;
-  padding: $sp-3 0;
+  width: 248px;
+  padding: $sp-4 0 $sp-3;
   background: $grad-header;
-  border-radius: $r-lg;
-  box-shadow: $sh-2;
-  overflow: hidden;
+  box-shadow: inset -1px 0 0 rgba(255, 255, 255, .06);
   transition: width .2s;
 }
 
+.navCollapsed {
+  width: 64px;
+}
+
+// ---- Шапка рейла: бренд + сворачивание ----
+.head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: $sp-2;
+  padding: 0 $sp-4 $sp-4;
+  border-bottom: 1px solid rgba(255, 255, 255, .08);
+}
+
+.navCollapsed .head {
+  flex-direction: column;
+  gap: $sp-3;
+  padding: 0 0 $sp-3;
+}
+
+.brand {
+  display: flex;
+  align-items: center;
+  gap: $sp-2;
+  min-width: 0;
+}
+
+.logo {
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 30px;
+  height: 30px;
+  border-radius: $r-sm;
+  background: $gold-500;
+  color: $navy-950;
+  font-family: $font-serif;
+  font-weight: 700;
+  font-size: 12px;
+  letter-spacing: .5px;
+}
+
+.brandText {
+  font-family: $font-serif;
+  font-size: 15px;
+  font-weight: 600;
+  color: $white;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 .toggle {
-  align-self: flex-end;
+  flex-shrink: 0;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px;
-  margin: 0 $sp-3 $sp-2;
   padding: 0;
   border: 1px solid rgba(255, 255, 255, .18);
   border-radius: $r-sm;
@@ -37,18 +86,16 @@
   }
 }
 
-.navCollapsed {
-  width: 56px;
+// ---- Пункты разделов ----
+.items {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  margin-top: $sp-4;
+}
 
-  .toggle {
-    align-self: center;
-    margin: 0 0 $sp-2;
-  }
-
-  .item {
-    justify-content: center;
-    padding: 12px 0;
-  }
+.navCollapsed .items {
+  margin-top: $sp-3;
 }
 
 .item {
@@ -76,6 +123,11 @@
   }
 }
 
+.navCollapsed .item {
+  justify-content: center;
+  padding: 12px 0;
+}
+
 .itemActive {
   color: $white;
   background: rgba(255, 255, 255, .07);
@@ -111,9 +163,46 @@
   text-align: center;
 }
 
-// В свёрнутом меню бейдж «прилипает» к иконке, т.к. подписи нет.
 .navCollapsed .badge {
   position: absolute;
   top: 6px;
   right: 8px;
 }
+
+// ---- Подвал рейла: пользователь ----
+.footer {
+  margin: auto $sp-4 0; // margin-top:auto прижимает к низу; по бокам — инсет для border-top
+  display: flex;
+  align-items: center;
+  gap: $sp-2;
+  padding-top: $sp-3;
+  border-top: 1px solid rgba(255, 255, 255, .08);
+}
+
+.navCollapsed .footer {
+  justify-content: center;
+  margin: auto 0 0;
+}
+
+.avatar {
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, .1);
+  color: $white;
+  font-size: 12px;
+  font-weight: 600;
+}
+
+.userName {
+  min-width: 0;
+  color: rgba(255, 255, 255, .8);
+  font-size: 13px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}