Task/extract page tabs to dedicated component (part 3) (#6908)

Improve styling

apps/client/src/styles.scss

@@ -479,6 +479,7 @@ ngx-skeleton-loader {
 
 .page {
   display: flex;
+  height: calc(100svh - var(--mat-toolbar-standard-height));
   overflow-y: auto;
   padding-bottom: env(safe-area-inset-bottom);
   padding-bottom: constant(safe-area-inset-bottom);

libs/ui/src/lib/page-tabs/page-tabs.component.scss

@@ -3,7 +3,7 @@
 :host {
   display: flex;
   flex-direction: column;
-  height: calc(100svh - var(--mat-toolbar-standard-height));
+  height: 100%;
   width: 100%;
 
   @include mat.tabs-overrides(
@@ -23,6 +23,10 @@
 
     .mat-mdc-tab-nav-panel {
       padding: 2rem 0;
+
+      @media (max-width: 575.98px) {
+        padding: 1rem 0;
+      }
     }
   }