new header

frontend/src/resources/css/inbox-dashboard.css

@@ -29,14 +29,13 @@
     --indent-xlarge: min(2vw, 2.5rem); /*40*/
     --indent-large: min(1.6vw, 2rem); /*32*/
     --indent-medium: min(1.2vw, 1.5rem); /*24*/
-    --indent-xbase: min(1vw, 1.25rem); /*20*/
+    --indent-xbase: 20px;
     --indent-base: 16px;
     --indent-small: 12px;
     --indent-mini: 8px;
     --indent-xmini: min(0.2vw, 0.25rem); /*4px*/
 
-    --h-header: min(3.9vw, 4.875rem); /*78*/
+    --h-header: 68px;
-    --w-screen: min(1vw, 1.25rem); /*20*/
 }
 
 .webbpm.ervu_dashboard {
@@ -49,13 +48,14 @@
 .webbpm.ervu_dashboard .container {
     padding: var(--h-header) 0 0;
     bottom: 0;
+    background-color: var(--page-bg);
 }
 .webbpm.ervu_dashboard .container-inside {
     position: relative;
     font-family: 'Gilroy';
     font-size: var(--size-text-primary);
-    height: 100%;           
+    height: 100%;
-    padding: 0 var(--w-screen) var(--indent-mini) var(--w-screen);
+    padding: 0 var(--indent-xbase) var(--indent-mini) var(--indent-xbase);
     overflow: auto;
 }
 
@@ -63,112 +63,21 @@
     display: flex;
     flex-direction: row;
     align-items: center;
-    margin-left: var(--w-screen);
+    margin-left: var(--indent-xbase);
-}
-.webbpm.ervu_dashboard .header-logo .logo a {
-    width: 100px;
-    height: var(--h-header);
-    background: url('../../../src/resources/img/logo-full.svg') no-repeat 0 50%;
-    background-size: auto 100%;
 }
 .webbpm.ervu_dashboard .header-logo .logo-title {
     font-family: 'GilroySB';
-    margin-left: min(6vw, 7.5rem); /*120*/
-}
-
-.webbpm.ervu_dashboard .header-menu {
-    display: flex;
-    flex-direction: row;
-    margin-left: auto;
-    margin-right: var(--w-screen);
-}
-.webbpm.ervu_dashboard .header-menu process, 
-.webbpm.ervu_dashboard .header-menu process + div, 
-.webbpm.ervu_dashboard .header-menu admin-menu {
-}
-
-.webbpm.ervu_dashboard .header-menu .update-data {
-    color: var(--color-text-primary);
-    opacity: 0.4;
-    margin-right: 16px;
-}
-
-.webbpm.ervu_dashboard .header-menu .user-data .user-data-name,
-.webbpm.ervu_dashboard .header-menu .user-data .user-data-name:is(:focus, :active) {
-    color: var(--color-text-primary);
-    font-size: var(--size-text-primary);
-    padding: var(--indent-mini) var(--indent-huge) var(--indent-mini) var(--indent-xbase);
-    margin: 0;
-    border-radius: 100px;
-    border: 1px solid var(--color-success);
-    background: var(--color-dark-20);
-    box-shadow: none;
-    outline: transparent;
-}
-.webbpm.ervu_dashboard .header-menu .user-data.show .user-data-name {
-    background-color: var(--color-success);
-}
-.webbpm.ervu_dashboard .header-menu .user-data .user-data-name::after {
-    position: absolute;
-    content: "\f282";
-    color: var(--color-text-primary);
-    font-family: bootstrap-icons;
-    font-weight: 800;
-    font-size: var(--size-text-secondary);
-    top: calc(50% - var(--size-text-secondary) / 2);
-    right: var(--indent-base);
-    margin: 0;
-    border: 0;
-}
-.webbpm.ervu_dashboard .header-menu .user-data.show .user-data-name::after {
-    top: calc(50% - (var(--size-text-secondary) + var(--indent-xmini)) / 2);
-    transform: rotate(180deg);
-}
-.webbpm.ervu_dashboard .header-menu .user-data .dropdown-menu {
-    width: max-content;
-    max-width: 600px;
-    padding: var(--indent-mini) 0;
-    border-radius: 24px;
-    border: 1px solid var(--color-text-secondary);
-    background: var(--color-dark-20);
-    backdrop-filter: var(--bg-blur-40);
-    box-shadow: var(--bg-shadow);
-}
-.webbpm.ervu_dashboard .header-menu .user-data .dropdown-item {
-    color: var(--color-text-primary);
-    white-space: normal;
-    background-color: transparent;
-}
-
-.webbpm.ervu_dashboard .header-menu .logout {
-    max-width: max-content;
-}
-.webbpm.ervu_dashboard .header-menu .logout > button {
-    color: var(--color-text-primary);
-    line-height: 1.3;
-    padding: var(--indent-mini) var(--indent-xbase);
-    border: 1px solid var(--color-success);
-    background-color: var(--color-dark-20);
-    outline: none;
-} 
-.webbpm.ervu_dashboard .header-menu .logout .nav-link {
-    padding-right: 0;
-    border-radius: var(--indent-medium) 0 0 var(--indent-medium);
-    border-right: 0;
-}
-.webbpm.ervu_dashboard .header-menu .logout .exit {
-    border-radius: 0 var(--indent-medium) var(--indent-medium) 0;
-    border-left: 0;
 }
 
 .webbpm.ervu_dashboard .header {
     display: flex;
     font-family: 'Gilroy';
     font-size: var(--size-text-primary);
+    color: var(--color-text-primary);
     width: 100%;
     height: auto;
     min-height: var(--h-header);
-    background: transparent;
+    background-color: var(--header-bg);
 }
 .webbpm.ervu_dashboard .header > div > * {
     position: relative;
@@ -176,51 +85,6 @@
     align-items: center;
 }
 
-/*----------------- Login ---------------- */
-.webbpm.ervu_dashboard :is(.form-signin, .form-signup, .confirm) {
-    color: var(--color-text-primary);
-    width: 560px;
-    padding: 60px 80px;
-    margin: 30px auto;
-    border: 0;
-    border-radius: 20px;
-    border: 1px solid var(--color-text-secondary);
-    background-color: var(--color-dark-20);
-    box-shadow: var(--bg-shadow);
-    backdrop-filter: var(--bg-blur-40);    
-}
-
-.webbpm.ervu_dashboard :is(.form-signin, .form-signup) .row.title {
-    position: relative;
-    padding: 0;
-}
-
-.webbpm.ervu_dashboard .form-signin h1,
-.webbpm.ervu_dashboard .form-signin h2,
-.webbpm.ervu_dashboard .form-signup h2,
-.webbpm.ervu_dashboard .confirm h2 {
-    font-family: 'GilroySB';
-    font-size: 32px;
-    text-align: left;
-    margin-bottom: 20px;
-}
-
-.webbpm.ervu_dashboard :is(.form-signin, .form-signup, .confirm) .logo {
-    position: absolute;
-    top: -10px; 
-    right: 0;
-    width: 145px;
-    height: 40px;
-    background: none;
-}
-
-.webbpm.ervu_dashboard .form-signin .row.registration > * + *,
-.webbpm.ervu_dashboard .form-signin .login-btn-box .password,
-.webbpm.ervu_dashboard .form-signin .login-btn-box .btn + .btn {
-    margin-left: 20px;
-}
-/*--------------- end Login -------------- */
-
 @supports not selector(::-webkit-scrollbar) {
     * {
         scrollbar-width: thin;
@@ -241,51 +105,6 @@
     background-color: transparent;
 }
 
-@media ((max-width: 780px) or (orientation: portrait)) {
-    .webbpm.ervu_dashboard {
-        --size-text-title: 2rem; /*32px*/
-        --size-text-subtitle: 1.5rem; /*24px*/
-        --size-text-addprimary: 1.25rem; /*20px*/
-        --size-text-primary: 1.125rem; /*18px*/
-        --size-text-secondary: 0.875rem; /*14px*/
-
-        --size-num-title: 3.75rem; /*60px*/
-        --size-num-subtitle: 3rem; /*48px*/
-        --size-num-addtitle: 2.5rem; /*40px*/
-        --size-num-primary: 2rem; /*32px*/ 
-        --size-num-secondary: 1.5rem; /*24px*/
-
-        --indent-huge: 3rem; /*48*/
-        --indent-xlarge: 2.5rem; /*40*/
-        --indent-large: 2rem; /*32*/
-        --indent-medium: 1.5rem; /*24*/
-        --indent-xbase: 1.25rem; /*20*/
-        --indent-base: 1rem; /*16*/
-        --indent-small: 0.75rem; /*12px*/
-        --indent-mini: 0.5rem; /*8px*/
-        --indent-xmini: 0.25rem; /*4px*/    
-
-        --h-header: 4.875rem; /*78*/ 
-        --w-screen: 1rem; /*40*/
-    }
-}
-
-@media (max-width: 480px) {
-    .webbpm.ervu_dashboard {
-        --size-text-title: 1.75rem; /*28px*/
-        --size-text-primary: 1rem; /*16px*/
-
-        --size-num-title: 3rem; /*48*/
-        --size-num-subtitle: 2.5rem; /*40*/
-        --size-num-addtitle: 2rem; /*32px*/
-        --size-num-primary: 1.75rem; /*28px*/
-    }
-
-    .webbpm.ervu_dashboard .header-menu .user-data .dropdown-menu {
-        max-width: calc(100vw - var(--w-screen) * 2);
-    }
-}
-
 .webbpm.ervu_dashboard .progress {
     width: 64px;
     height: 64px;

frontend/src/resources/template/app/component/app_header.html

@@ -1,15 +1,5 @@
 <nav class="header" id="webbpm-header">
     <div class="header-logo">
-        <div class="logo"><a routerLink="/"></a></div>
+        <div class="logo-title">Аналитическая подсистема</div>
-        <div class="logo-title">ЕДИНЫЙ РЕЕСТР<br />ВОИНСКОГО УЧЕТА</div>
+    </div>   
-    </div>
-    <div class="header-menu">
-        <!--<div class="update-data">Данные на 14 августа 2024 г.</div>-->
-        <div ngbDropdown class="user-data" *ngIf="name && realm">
-            <button ngbDropdownToggle class="user-data-name">{{name | emptyIfNull}}</button>
-            <div ngbDropdownMenu>
-                <div ngbDropdownItem class="user-data-realm">{{realm | emptyIfNull}}</div>
-            </div>
-        </div>
-    </div>    
 </nav>