diff options
author | Ludmila Schlegelova <Ludmila.Schlegelova@telekom.com> | 2023-06-28 14:38:10 +0200 |
---|---|---|
committer | Ludmila Schlegelova <Ludmila.Schlegelova@telekom.com> | 2023-06-28 16:49:11 +0200 |
commit | 0376eae1742c1a39f19f6e9b5cb06071b90d4649 (patch) | |
tree | 1090fcf08cfa27cd93a7147471b101ea8a29d729 /src/app | |
parent | 4fbefba274ae89c76b12ac0b1c52063b668fc99f (diff) |
History dashboard not correctly layouted - code correction
Issue-ID: PORTALNG-5
Signed-off-by: Ludmila Schlegelova <Ludmila.Schlegelova@telekom.com>
Change-Id: Ie578726acefa92df5a06d92dac144e1b7f9118a9
Diffstat (limited to 'src/app')
5 files changed, 58 insertions, 11 deletions
diff --git a/src/app/modules/dashboard/apps/user-last-action-tile/action-row/action-row.component.html b/src/app/modules/dashboard/apps/user-last-action-tile/action-row/action-row.component.html index 62cf722..201666c 100644 --- a/src/app/modules/dashboard/apps/user-last-action-tile/action-row/action-row.component.html +++ b/src/app/modules/dashboard/apps/user-last-action-tile/action-row/action-row.component.html @@ -18,11 +18,11 @@ <ng-container *ngIf="action"> - <div class="row py-2 border-bottom"> - <div class="col-3"> + <div class="row py-2 border-bottom d-flex flex-wrap"> + <div class="col-lg-3 col-md-2"> <div class="d-flex justify-content-between"> <span - class="qa_action_created_at" + class="qa_action_created_at mr-2" container="body" [ngbTooltip]="action.actionCreatedAt | date: FULL_DATE_FORMAT" >{{ @@ -98,7 +98,7 @@ </ng-container> </div> </div> - <div class="col-9"> + <div class="col-lg-9 col-md-7"> <ng-content></ng-content> </div> </div> diff --git a/src/app/modules/dashboard/apps/user-last-action-tile/user-last-action-tile.component.css b/src/app/modules/dashboard/apps/user-last-action-tile/user-last-action-tile.component.css index 60842fa..2960d84 100644 --- a/src/app/modules/dashboard/apps/user-last-action-tile/user-last-action-tile.component.css +++ b/src/app/modules/dashboard/apps/user-last-action-tile/user-last-action-tile.component.css @@ -16,7 +16,6 @@ * SPDX-License-Identifier: Apache-2.0 */ - img { height: 20px; width: 20px; @@ -25,3 +24,25 @@ img { .bg-color-inherit { background-color: inherit; } + +.m-l-24px { + margin-left: 24px; +} + +@media (max-width: 570px) { + select { + font-size: 11px !important; + } +} + +@media (max-width: 1225px) { + .no-flex-wrap { + flex-wrap: nowrap !important; + } +} + +@media (max-width: 1200px) { + .flex-wrap { + flex-wrap: wrap !important; + } +} diff --git a/src/app/modules/dashboard/apps/user-last-action-tile/user-last-action-tile.component.html b/src/app/modules/dashboard/apps/user-last-action-tile/user-last-action-tile.component.html index d696728..166b150 100644 --- a/src/app/modules/dashboard/apps/user-last-action-tile/user-last-action-tile.component.html +++ b/src/app/modules/dashboard/apps/user-last-action-tile/user-last-action-tile.component.html @@ -18,10 +18,10 @@ <ng-template #template> <ng-container *ngIf="actions$ | async as actions"> - <div class="col-xl-4 col-lg-6 col-sm-12 my-2 qa_USER_LAST_ACTION_TILE" cdkDrag> - <div class="shadow card" style="height: 334.867px"> + <div class="col-xl-5 col-lg-7 col-sm-12 my-2 qa_user_last_action_tile" cdkDrag> + <div class="shadow card tile-height"> <div class="card-header pl-3"> - <div class="d-flex" *ngIf="actionFilterType$ | async as selectedFilter"> + <div class="d-flex flex-wrap" *ngIf="actionFilterType$ | async as selectedFilter"> <div class="d-flex align-items-center"> <i class="bi bi-arrows-move text-primary draggable text-primary pr-2" @@ -43,7 +43,7 @@ </option> </select> </div> - <div class="d-flex" *ngIf="actionIntervalType$ | async as selectedInterval"> + <div class="d-flex m-l-24px" *ngIf="actionIntervalType$ | async as selectedInterval"> <label class="d-none" for="intervalSelect" >{{ 'dashboard.apps.userLastAction.filter.label' | translate }}{{ 'dashboard.apps.userLastAction.filter.interval.' + selectedInterval | translate }}</label diff --git a/src/app/modules/dashboard/dashboard.component.css b/src/app/modules/dashboard/dashboard.component.css index bdf57d6..88535a5 100644 --- a/src/app/modules/dashboard/dashboard.component.css +++ b/src/app/modules/dashboard/dashboard.component.css @@ -32,3 +32,29 @@ li { padding-left: initial; margin-top: initial; } + + +@media (max-width: 605px) { + h2 { + font-size: 31px !important; + } +} + +@media (max-width: 600px) { + h2 { + font-size: 28px !important; + } +} + +@media (max-width: 586px) { + h2 { + font-size: 25px !important; + } +} + +@media (max-width: 570px) { + .p-l-2px { + padding-left: 2px !important; + } +} + diff --git a/src/app/modules/dashboard/dashboard.component.html b/src/app/modules/dashboard/dashboard.component.html index 76a8e96..c0e62cc 100644 --- a/src/app/modules/dashboard/dashboard.component.html +++ b/src/app/modules/dashboard/dashboard.component.html @@ -23,9 +23,9 @@ </app-breadcrumb-item> </app-breadcrumb> <ng-container *ngIf="tiles$ | async as apps"> - <div class="w-100 d-flex justify-content-between"> + <div class="w-100 d-flex flex-wrap justify-content-between"> <h2 class="qa_title">{{ 'layout.menu.items.dashboard' | translate }}</h2> - <ul> + <ul class="p-l-2px"> <li #settingsDrop="ngbDropdown" [ngbTooltip]="'dashboard.tooltips.settings' | translate" |