Skip to content
Snippets Groups Projects
Commit 52f12349 authored by Kawtar Laariche's avatar Kawtar Laariche
Browse files

#24: :lipstick: fix alignment

parent ce6c0def
Branches Features/publish-to-marketplace-page
No related tags found
No related merge requests found
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 774 additions and 677 deletions
src/app/features/dashboard/dashboard.component.scss
+ 29
− 1
View file @ 52f12349
......@@ -10,7 +10,6 @@ mat-toolbar {
}
mat-sidenav-container {
height: calc(100% - 64px);
overflow: hidden !important;
}
......@@ -24,3 +23,32 @@ mat-sidenav {
overflow: hidden !important;
padding-top: 0 !important;
}
::ng-deep.mat-drawer-container {
position: relative;
z-index: -1;
box-sizing: border-box;
-webkit-overflow-scrolling: touch;
display: block;
overflow: hidden;
height: 100% !important;
}
.all-wrap {
min-height: 100vh;
}
.content {
flex: 1; // child will set to an equal size inside the container
}
main {
display: flex;
flex-direction: column;
// Select all direct descendants only of the <main> element
// that are not <router-outlet> elements:
> *:not(router-outlet) {
flex: 1; // child will set to an equal size inside the container
display: block;
}
}
src/app/features/dashboard/my-models/my-models.component.html
+ 161
− 157
View file @ 52f12349
<section class="pageheadsection mob-pageheadsection1">
<div class="mdl-grid mdl-grid.mdl-grid--no-spacing">
<div>
<gp-headline [headlineTitle]="'My Models'"></gp-headline>
</div>
<gp-breadcrumb-navigation
[firstNavigationLabel]="{ label: 'Home' }"
[secondNavigationLabel]="{ label: 'My models', disabled: true }"
(firstNavigationClicked)="onHomeClick()"
></gp-breadcrumb-navigation>
</div>
</section>
<mat-sidenav-container>
<mat-sidenav mode="side" opened>
<gp-filters
[tags]="tags"
[categories]="categories"
(selectedTagsChange)="handleSelectedTagsChange($event)"
(selectedCategoriesChange)="handleSelectedCategoriesChange($event)"
(searchValueChanged)="onSearchValueChanged($event)"
></gp-filters>
</mat-sidenav>
<mat-sidenav-content>
<div class="content-container">
<div class="sort-toggle-container">
<div class="gp-sort-by">
<gp-sort-by
[sortByOptions]="sortByOptions"
[selectedSortBy]="sortByFilter"
(sortBySelected)="updateFieldToDirectionMap($event)"
></gp-sort-by>
</div>
<div class="gp-card-list-view">
<gp-solutions-toggle-view
[viewTile]="viewTile"
(viewTileChange)="onViewTileChange($event)"
></gp-solutions-toggle-view>
</div>
<div class="flex-column">
<section class="pageheadsection mob-pageheadsection1">
<div class="mdl-grid mdl-grid.mdl-grid--no-spacing">
<div>
<gp-headline [headlineTitle]="'My Models'"></gp-headline>
</div>
<!--Unpublished models section-->
@if (modelType === "both") {
<div class="flex-column">
<gp-model-list
[solutions]="selectedUnpublishedSolutions"
[totalItems]="unpublishedTotalItems"
[isLoading]="isUnpublishedSolutionsLoading"
[headlineTitle]="'MY UNPUBLISHED MODELS'"
[showEntirePage]="false"
[viewTile]="viewTile"
[pageSize]="pageSize"
[pageIndex]="pageIndex"
[pageSizeOptions]="pageSizeOptions"
[modelType]="'unpublished'"
[favoriteSolutionsMap]="favoriteSolutionsMap"
[calculateStartIndex]="calculateStartIndex(pageIndex, pageSize)"
[calculateEndIndex]="
calculateEndIndex(unpublishedTotalItems, pageIndex, pageSize)
"
(pageChange)="onPageChange($event)"
(updateFavorite)="updateFavorite($event)"
(backEvent)="onClickBack('both')"
></gp-model-list>
<gp-breadcrumb-navigation
[firstNavigationLabel]="{ label: 'Home' }"
[secondNavigationLabel]="{ label: 'My models', disabled: true }"
(firstNavigationClicked)="onHomeClick()"
></gp-breadcrumb-navigation>
</div>
</section>
<mat-sidenav-container>
<mat-sidenav mode="side" opened>
<gp-filters
[tags]="tags"
[categories]="categories"
(selectedTagsChange)="handleSelectedTagsChange($event)"
(selectedCategoriesChange)="handleSelectedCategoriesChange($event)"
(searchValueChanged)="onSearchValueChanged($event)"
></gp-filters>
</mat-sidenav>
<mat-sidenav-content class="page-wrap">
<main class="content-router-outlet">
<div class="content-container">
<div class="sort-toggle-container">
<div class="gp-sort-by">
<gp-sort-by
[sortByOptions]="sortByOptions"
[selectedSortBy]="sortByFilter"
(sortBySelected)="updateFieldToDirectionMap($event)"
></gp-sort-by>
</div>
<div class="gp-card-list-view">
<gp-solutions-toggle-view
[viewTile]="viewTile"
(viewTileChange)="onViewTileChange($event)"
></gp-solutions-toggle-view>
</div>
</div>
<!--Unpublished models section-->
@if (modelType === "both") {
<div class="flex-column">
<gp-model-list
[solutions]="selectedUnpublishedSolutions"
[totalItems]="unpublishedTotalItems"
[isLoading]="isUnpublishedSolutionsLoading"
[headlineTitle]="'MY UNPUBLISHED MODELS'"
[showEntirePage]="false"
[viewTile]="viewTile"
[pageSize]="pageSize"
[pageIndex]="pageIndex"
[pageSizeOptions]="pageSizeOptions"
[modelType]="'unpublished'"
[favoriteSolutionsMap]="favoriteSolutionsMap"
[calculateStartIndex]="calculateStartIndex(pageIndex, pageSize)"
[calculateEndIndex]="
calculateEndIndex(unpublishedTotalItems, pageIndex, pageSize)
"
(pageChange)="onPageChange($event)"
(updateFavorite)="updateFavorite($event)"
(backEvent)="onClickBack('both')"
></gp-model-list>
<div class="see-all-container">
<button
class="see-all-button"
aria-label="icon button with a menu icon"
(click)="onClickSeeAll('unpublished')"
>
<div class="see-all-text-container">
<span>See all</span> <mat-icon>arrow_forward_ios</mat-icon>
<div class="see-all-container">
<button
class="see-all-button"
aria-label="icon button with a menu icon"
(click)="onClickSeeAll('unpublished')"
>
<div class="see-all-text-container">
<span>See all</span> <mat-icon>arrow_forward_ios</mat-icon>
</div>
</button>
</div>
</button>
</div>
</div>
}
</div>
}
@if (modelType === "unpublished") {
<div class="flex-column">
<gp-model-list
[solutions]="selectedUnpublishedSolutions"
[totalItems]="unpublishedTotalItems"
[isLoading]="isUnpublishedSolutionsLoading"
[headlineTitle]="'MY UNPUBLISHED MODELS'"
[showEntirePage]="true"
[viewTile]="viewTile"
[pageSize]="pageSize"
[pageIndex]="pageIndex"
[pageSizeOptions]="pageSizeOptions"
[modelType]="'unpublished'"
[favoriteSolutionsMap]="favoriteSolutionsMap"
[calculateStartIndex]="calculateStartIndex(pageIndex, pageSize)"
[calculateEndIndex]="
calculateEndIndex(unpublishedTotalItems, pageIndex, pageSize)
"
(pageChange)="onPageChange($event)"
(updateFavorite)="updateFavorite($event)"
(backEvent)="onClickBack('both')"
></gp-model-list>
</div>
}
@if (modelType === "unpublished") {
<div class="flex-column">
<gp-model-list
[solutions]="selectedUnpublishedSolutions"
[totalItems]="unpublishedTotalItems"
[isLoading]="isUnpublishedSolutionsLoading"
[headlineTitle]="'MY UNPUBLISHED MODELS'"
[showEntirePage]="true"
[viewTile]="viewTile"
[pageSize]="pageSize"
[pageIndex]="pageIndex"
[pageSizeOptions]="pageSizeOptions"
[modelType]="'unpublished'"
[favoriteSolutionsMap]="favoriteSolutionsMap"
[calculateStartIndex]="calculateStartIndex(pageIndex, pageSize)"
[calculateEndIndex]="
calculateEndIndex(unpublishedTotalItems, pageIndex, pageSize)
"
(pageChange)="onPageChange($event)"
(updateFavorite)="updateFavorite($event)"
(backEvent)="onClickBack('both')"
></gp-model-list>
</div>
}
<!--published solutions -->
<!--published solutions -->
@if (modelType === "both") {
<div class="flex-column">
<gp-model-list
[solutions]="selectedPublishedSolutions"
[totalItems]="publishedTotalItems"
[isLoading]="isPublishedSolutionsLoading"
[headlineTitle]="'MY PUBLISHED MODELS'"
[showEntirePage]="false"
[viewTile]="viewTile"
[pageSize]="pageSize"
[pageIndex]="pageIndex"
[pageSizeOptions]="pageSizeOptions"
[modelType]="'published'"
[favoriteSolutionsMap]="favoriteSolutionsMap"
[calculateStartIndex]="calculateStartIndex(pageIndex, pageSize)"
[calculateEndIndex]="
calculateEndIndex(publishedTotalItems, pageIndex, pageSize)
"
(pageChange)="onPageChange($event)"
(updateFavorite)="updateFavorite($event)"
(backEvent)="onClickBack('both')"
></gp-model-list>
@if (modelType === "both") {
<div class="flex-column">
<gp-model-list
[solutions]="selectedPublishedSolutions"
[totalItems]="publishedTotalItems"
[isLoading]="isPublishedSolutionsLoading"
[headlineTitle]="'MY PUBLISHED MODELS'"
[showEntirePage]="false"
[viewTile]="viewTile"
[pageSize]="pageSize"
[pageIndex]="pageIndex"
[pageSizeOptions]="pageSizeOptions"
[modelType]="'published'"
[favoriteSolutionsMap]="favoriteSolutionsMap"
[calculateStartIndex]="calculateStartIndex(pageIndex, pageSize)"
[calculateEndIndex]="
calculateEndIndex(publishedTotalItems, pageIndex, pageSize)
"
(pageChange)="onPageChange($event)"
(updateFavorite)="updateFavorite($event)"
(backEvent)="onClickBack('both')"
></gp-model-list>
<div class="see-all-container">
<button
class="see-all-button"
aria-label="Example icon button with a menu icon"
(click)="onClickSeeAll('published')"
>
<div class="see-all-text-container">
<span>See all</span> <mat-icon>arrow_forward_ios</mat-icon>
<div class="see-all-container">
<button
class="see-all-button"
aria-label="Example icon button with a menu icon"
(click)="onClickSeeAll('published')"
>
<div class="see-all-text-container">
<span>See all</span> <mat-icon>arrow_forward_ios</mat-icon>
</div>
</button>
</div>
</button>
</div>
</div>
}
@if (modelType === "published") {
<div class="flex-column">
<gp-model-list
[solutions]="selectedPublishedSolutions"
[totalItems]="publishedTotalItems"
[isLoading]="isPublishedSolutionsLoading"
[headlineTitle]="'MY PUBLISHED MODELS'"
[showEntirePage]="true"
[viewTile]="viewTile"
[pageSize]="pageSize"
[pageIndex]="pageIndex"
[pageSizeOptions]="pageSizeOptions"
[modelType]="'published'"
[favoriteSolutionsMap]="favoriteSolutionsMap"
[calculateStartIndex]="calculateStartIndex(pageIndex, pageSize)"
[calculateEndIndex]="
calculateEndIndex(publishedTotalItems, pageIndex, pageSize)
"
(pageChange)="onPageChange($event)"
(updateFavorite)="updateFavorite($event)"
(backEvent)="onClickBack('both')"
></gp-model-list>
</div>
}
@if (modelType === "published") {
<div class="flex-column">
<gp-model-list
[solutions]="selectedPublishedSolutions"
[totalItems]="publishedTotalItems"
[isLoading]="isPublishedSolutionsLoading"
[headlineTitle]="'MY PUBLISHED MODELS'"
[showEntirePage]="true"
[viewTile]="viewTile"
[pageSize]="pageSize"
[pageIndex]="pageIndex"
[pageSizeOptions]="pageSizeOptions"
[modelType]="'published'"
[favoriteSolutionsMap]="favoriteSolutionsMap"
[calculateStartIndex]="calculateStartIndex(pageIndex, pageSize)"
[calculateEndIndex]="
calculateEndIndex(publishedTotalItems, pageIndex, pageSize)
"
(pageChange)="onPageChange($event)"
(updateFavorite)="updateFavorite($event)"
(backEvent)="onClickBack('both')"
></gp-model-list>
</div>
}
</div>
}
</div> </mat-sidenav-content
></mat-sidenav-container>
</main> </mat-sidenav-content
></mat-sidenav-container>
</div>
src/app/features/dashboard/my-models/my-models.component.scss
+ 19
− 17
View file @ 52f12349
......@@ -2,9 +2,23 @@
padding: 24px;
}
.page-wrap {
display: flex !important;
flex-direction: column !important;
min-height: 100vh !important;
}
.content-router-outlet {
flex: 1;
}
// content height
::ng-deep.mat-drawer-content {
height: 89.1% !important;
}
mat-sidenav-container {
height: calc(100% - 64px);
overflow: auto;
overflow: hidden;
}
.cards-container {
......@@ -25,7 +39,7 @@ mat-sidenav {
width: 300px;
background: #f1f1f1;
height: 100%;
overflow-y: auto;
overflow: hidden;
}
.mat-grid-tile {
......@@ -34,23 +48,11 @@ mat-sidenav {
:host ::ng-deep .mat-drawer-inner-container {
overflow: hidden !important;
padding: 20px 0 20px 0;
}
mat-sidenav-content {
height: 77vh;
overflow: auto;
.loading-data {
height: 75vh;
width: 100%;
overflow: hidden !important;
display: flex;
align-items: center;
justify-content: center;
p {
margin: 0;
}
}
overflow: hidden !important;
}
.pageheadsection {
......
src/app/features/marketplace/marketplace.component.html
+ 123
− 118
View file @ 52f12349
<section class="pageheadsection mob-pageheadsection1">
<div class="mdl-grid mdl-grid.mdl-grid--no-spacing">
<div>
<gp-headline [headlineTitle]="'Marketplace |'"></gp-headline>
<div class="favorite-buttons-container" *ngIf="loginUserId">
<button
class="favorite-button"
mat-raised-button
[color]="!isOnMyFavoriteSelected ? 'primary' : ''"
(click)="onAllCatalogsClick()"
>
All catalogs
</button>
<button
class="favorite-button"
mat-raised-button
[color]="isOnMyFavoriteSelected ? 'primary' : ''"
(click)="onMyFavoriteCatalogsClick()"
>
My favorite catalogs
</button>
<div class="flex-column">
<section class="pageheadsection mob-pageheadsection1">
<div class="mdl-grid mdl-grid.mdl-grid--no-spacing">
<div>
<gp-headline [headlineTitle]="'Marketplace |'"></gp-headline>
<div class="favorite-buttons-container" *ngIf="loginUserId">
<button
class="favorite-button"
mat-raised-button
[color]="!isOnMyFavoriteSelected ? 'primary' : ''"
(click)="onAllCatalogsClick()"
>
All catalogs
</button>
<button
class="favorite-button"
mat-raised-button
[color]="isOnMyFavoriteSelected ? 'primary' : ''"
(click)="onMyFavoriteCatalogsClick()"
>
My favorite catalogs
</button>
</div>
</div>
<gp-breadcrumb-navigation
[firstNavigationLabel]="{ label: 'Home' }"
[secondNavigationLabel]="{ label: 'Marketplace', disabled: true }"
(firstNavigationClicked)="onHomeClick()"
></gp-breadcrumb-navigation>
</div>
<gp-breadcrumb-navigation
[firstNavigationLabel]="{ label: 'Home' }"
[secondNavigationLabel]="{ label: 'Marketplace', disabled: true }"
(firstNavigationClicked)="onHomeClick()"
></gp-breadcrumb-navigation>
</div>
</section>
<mat-sidenav-container>
<mat-sidenav mode="side" opened>
<gp-filters
[tags]="tags"
[categories]="categories"
(selectedTagsChange)="handleSelectedTagsChange($event)"
(selectedCategoriesChange)="handleSelectedCategoriesChange($event)"
(searchValueChanged)="onSearchValueChanged($event)"
></gp-filters>
</mat-sidenav>
<mat-sidenav-content>
<div class="filters-container">
<div class="total-items-container" *ngIf="!isLoading">
@if (totalItems > 0) {
<div class="total-items-text-container">
<span class="showing-text"
>Showing -
<span class="total-items-text">
{{ calculateStartIndex() }} to {{ calculateEndIndex() }} of
{{ totalItems }} Models</span
></span
>
</section>
<mat-sidenav-container>
<mat-sidenav mode="side" opened>
<gp-filters
[tags]="tags"
[categories]="categories"
(selectedTagsChange)="handleSelectedTagsChange($event)"
(selectedCategoriesChange)="handleSelectedCategoriesChange($event)"
(searchValueChanged)="onSearchValueChanged($event)"
></gp-filters>
</mat-sidenav>
<mat-sidenav-content class="page-wrap">
<main class="content-router-outlet">
<div class="filters-container">
<div class="total-items-container" *ngIf="!isLoading">
@if (totalItems > 0) {
<div class="total-items-text-container">
<span class="showing-text"
>Showing -
<span class="total-items-text">
{{ calculateStartIndex() }} to {{ calculateEndIndex() }} of
{{ totalItems }} Models</span
></span
>
</div>
}
</div>
}
</div>
<div class="gp-sort-by" *ngIf="!isLoading">
<gp-sort-by
[sortByOptions]="sortByOptions"
[selectedSortBy]="sortByFilter"
(sortBySelected)="updateFieldToDirectionMap($event)"
></gp-sort-by>
</div>
<div class="gp-card-list-view" *ngIf="!isLoading">
<gp-solutions-toggle-view
[viewTile]="viewTile"
(viewTileChange)="onViewTileChange($event)"
></gp-solutions-toggle-view>
</div>
</div>
<ng-container *ngIf="publicSolutions && !isLoading; else loadingState">
<ng-container *ngIf="publicSolutions.length > 0; else noCatalogs">
<div *ngIf="!viewTile; else gridView">
<!-- Horizontal list view content -->
<div class="grid-list">
<gp-list-item
[item]="item"
[items]="publicSolutions"
[isMarketPlacePage]="true"
[isPublishedSolution]="true"
*ngFor="let item of publicSolutions"
></gp-list-item>
<div class="gp-sort-by" *ngIf="!isLoading">
<gp-sort-by
[sortByOptions]="sortByOptions"
[selectedSortBy]="sortByFilter"
(sortBySelected)="updateFieldToDirectionMap($event)"
></gp-sort-by>
</div>
<div class="gp-card-list-view" *ngIf="!isLoading">
<gp-solutions-toggle-view
[viewTile]="viewTile"
(viewTileChange)="onViewTileChange($event)"
></gp-solutions-toggle-view>
</div>
</div>
<ng-template #gridView>
<div class="grid-list">
<mat-grid-list cols="5" rowHeight="3:4" gutterSize="20px">
<mat-grid-tile *ngFor="let item of publicSolutions">
<div class="cards-container">
<gp-card-item
[isPublishedSolution]="true"
[item]="item"
[items]="publicSolutions"
[isMarketPlacePage]="true"
[isFavoriteSolution]="favoriteSolutionsMap[item.solutionId]"
(favoriteClicked)="updateFavorite(item.solutionId)"
></gp-card-item>
</div>
</mat-grid-tile>
</mat-grid-list>
<ng-container *ngIf="publicSolutions && !isLoading; else loadingState">
<ng-container *ngIf="publicSolutions.length > 0; else noCatalogs">
<div *ngIf="!viewTile; else gridView">
<!-- Horizontal list view content -->
<div class="grid-list">
<gp-list-item
[item]="item"
[items]="publicSolutions"
[isMarketPlacePage]="true"
[isPublishedSolution]="true"
*ngFor="let item of publicSolutions"
></gp-list-item>
</div>
</div>
<ng-template #gridView>
<div class="grid-list">
<mat-grid-list cols="5" rowHeight="3:4" gutterSize="20px">
<mat-grid-tile *ngFor="let item of publicSolutions">
<div class="cards-container">
<gp-card-item
[isPublishedSolution]="true"
[item]="item"
[items]="publicSolutions"
[isMarketPlacePage]="true"
[isFavoriteSolution]="
favoriteSolutionsMap[item.solutionId]
"
(favoriteClicked)="updateFavorite(item.solutionId)"
></gp-card-item>
</div>
</mat-grid-tile>
</mat-grid-list>
</div>
</ng-template>
</ng-container>
<ng-template #noCatalogs>
<div class="loading-data">
<p>No result found...</p>
</div>
</ng-template>
</ng-container>
<ng-template #loadingState>
<div class="loading-data">
<p>Loading data ...</p>
</div>
</ng-template>
</ng-container>
<ng-template #noCatalogs>
<div class="loading-data">
<p>No result found...</p>
</div>
</ng-template>
</ng-container>
<ng-template #loadingState>
<div class="loading-data">
<p>Loading data ...</p>
</div>
</ng-template>
@if (totalItems > 0) {
<mat-paginator
[length]="totalItems"
[pageSize]="pageSize"
[pageSizeOptions]="pageSizeOptions"
(page)="onPageChange($event)"
aria-label="Select page"
aria-label="Select page"
>
</mat-paginator>
}</mat-sidenav-content
></mat-sidenav-container>
@if (totalItems > 0) {
<mat-paginator
[length]="totalItems"
[pageSize]="pageSize"
[pageSizeOptions]="pageSizeOptions"
(page)="onPageChange($event)"
aria-label="Select page"
aria-label="Select page"
>
</mat-paginator>
}</main></mat-sidenav-content
></mat-sidenav-container>
</div>
src/app/features/marketplace/marketplace.component.scss
+ 24
− 17
View file @ 52f12349
......@@ -2,9 +2,23 @@
padding: 24px;
}
.page-wrap {
display: flex !important;
flex-direction: column !important;
min-height: 100vh !important;
}
.content-router-outlet {
flex: 1;
}
// content height
::ng-deep.mat-drawer-content {
height: 89.1% !important;
}
mat-sidenav-container {
height: calc(100% - 64px);
overflow: auto;
overflow: hidden;
}
.cards-container {
......@@ -25,7 +39,8 @@ mat-sidenav {
width: 300px;
background: #f1f1f1;
height: 100%;
overflow-y: auto;
//overflow-y: auto;
overflow: hidden;
}
.mat-grid-tile {
......@@ -34,23 +49,11 @@ mat-sidenav {
:host ::ng-deep .mat-drawer-inner-container {
overflow: hidden !important;
padding: 20px 0 20px 0;
}
mat-sidenav-content {
height: 77vh;
overflow: auto;
.loading-data {
height: 75vh;
width: 100%;
overflow: hidden !important;
display: flex;
align-items: center;
justify-content: center;
p {
margin: 0;
}
}
overflow: hidden;
}
.pageheadsection {
......@@ -160,3 +163,7 @@ mat-sidenav-content {
.total-items-text {
color: #8f8f8f;
}
.full-height {
height: 100%;
}
src/app/features/model-details/model-details.component.html
+ 376
− 360
View file @ 52f12349
This diff is collapsed.
src/app/features/model-details/model-details.component.scss
+ 20
− 1
View file @ 52f12349
......@@ -5,6 +5,21 @@
background-color: white;
}
.page-wrap {
display: flex !important;
flex-direction: column !important;
min-height: 100vh !important;
}
.content-router-outlet {
flex: 1;
}
// content height
::ng-deep.mat-drawer-content {
height: 89.2% !important;
}
.pageheadsection {
background: #fff;
box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.1);
......@@ -430,7 +445,6 @@ ul {
}
mat-sidenav-container {
height: calc(100% - 64px);
overflow: hidden !important;
}
......@@ -438,6 +452,11 @@ mat-sidenav {
background: #f1f1f1;
width: 250px !important;
overflow: hidden !important;
height: 100% !important;
}
mat-sidenav-content {
overflow: hidden;
}
::ng-deep .mat-drawer-inner-container {
......
src/app/shared/components/model-management/model-management.component.html
+ 6
− 3
View file @ 52f12349
......@@ -60,7 +60,7 @@
</div>
<mat-sidenav-container>
<mat-sidenav mode="side" opened>
<mat-sidenav mode="side" opened #sidenav>
<div class="workflow-left-header workflow-header">MANAGEMENT OPTIONS</div>
<div
*ngIf="selectedRevision$ | async as selectedRevision"
......@@ -139,6 +139,9 @@
</nav>
<mat-tab-nav-panel #tabPanel></mat-tab-nav-panel>
</mat-sidenav>
<mat-sidenav-content> <router-outlet></router-outlet></mat-sidenav-content
></mat-sidenav-container>
<mat-sidenav-content class="page-wrap"
><main class="content-router-outlet">
<router-outlet></router-outlet></main
></mat-sidenav-content>
</mat-sidenav-container>
</div>
src/app/shared/components/model-management/model-management.component.scss
+ 14
− 2
View file @ 52f12349
......@@ -2,8 +2,20 @@
padding: 24px;
}
.page-wrap {
display: flex !important;
flex-direction: column !important;
min-height: 100vh !important;
}
.content-router-outlet {
flex: 1;
}
::ng-deep.mat-drawer-content {
height: 83.5% !important;
}
mat-sidenav-container {
height: calc(100% - 64px);
overflow: hidden !important;
}
......@@ -11,10 +23,10 @@ mat-sidenav {
background: #f1f1f1;
width: 250px !important;
overflow: hidden !important;
height: 100% !important;
}
mat-sidenav-content {
height: 87vh;
overflow: hidden;
}
::ng-deep .mat-drawer-inner-container {
......
src/environments/environment.ts
+ 1
− 1
View file @ 52f12349
......@@ -2,7 +2,7 @@ export const environment = {
// local with session
production: false,
skipAuth: false,
apiBackendURL: 'https://dev02.ki-lab.nrw',
apiBackendURL: 'https://aiexp-dev.ai4europe.eu',
isDebugMode: true,
logging: {
level: {
......
src/styles.scss
+ 1
− 0
View file @ 52f12349
......@@ -12,6 +12,7 @@
html,
body {
overflow: hidden;
width: 100%;
height: 100%;
margin: 0;
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Copyright © Eclipse Foundation, Inc. All Rights Reserved.     Privacy Policy | Terms of Use | Copyright Agent