[Monitor Dashboard | Trunk]: Css changes on pills

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor_dashboard@60212 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
Konstantinos Triantafyllou 2021-01-11 18:34:31 +00:00
parent 549763c5df
commit ecbe7acaa8
2 changed files with 12 additions and 6 deletions

View File

@ -103,7 +103,7 @@
<nav>
<div *ngIf="stakeholder.topics.length > 0 && stakeholder.topics[topicIndex]">
<ul *ngIf="stakeholder.topics[topicIndex]"
class="customTabs uk-tab ignore admin uk-flex uk-flex-middle" visibility="true">
class="customTabs uk-tab admin uk-flex uk-flex-middle" visibility="true">
<ng-template ngFor [ngForOf]="stakeholder.topics[topicIndex].categories" let-category let-i="index">
<li class="uk-visible-toggle uk-flex uk-flex-middle"
[class.uk-active]="category.alias === stakeholder.topics[topicIndex].categories[categoryIndex].alias">
@ -148,7 +148,7 @@
</div>
</nav>
<ul *ngIf="stakeholder.topics.length > 0 && stakeholder.topics[topicIndex].categories.length > 0 && stakeholder.topics[topicIndex].categories[categoryIndex]"
visibility="true" class="uk-subnav uk-subnav-pill subCategoriesTabs ignore admin uk-flex uk-flex-middle">
visibility="true" class="uk-subnav uk-subnav-pill subCategoriesTabs admin uk-flex uk-flex-middle">
<ng-template ngFor [ngForOf]="stakeholder.topics[topicIndex].categories[categoryIndex].subCategories"
let-subCategory let-i="index">
<li [class.uk-active]="(subCategory.alias ===
@ -189,7 +189,7 @@
</span>
</li>
</ng-template>
<li class="uk-visible-toggle ignore">
<li class="uk-visible-toggle">
<span (click)="editSubCategoryOpen(); $event.preventDefault()" class="clickable">
<span class="uk-icon-button small portal-icon-button">
<icon name="add"></icon>

View File

@ -1,6 +1,8 @@
.uk-subnav-pill:not(.ignore), .uk-tab:not(.ignore) {
flex-wrap: nowrap;
overflow-x: auto;
@media only screen and (max-width: 959px) {
.uk-subnav-pill, .uk-tab {
flex-wrap: nowrap;
overflow-x: auto;
}
}
.uk-subnav-pill > * > a, .uk-subnav-pill > * > span > a {
@ -18,6 +20,10 @@
color: var(--text-color);
}
.uk-subnav-pill > li {
margin-bottom: 10px;
}
.uk-subnav-pill > li > a:hover, .uk-subnav-pill > li > span > a:hover {
border-color: var(--secondary-color);
color: var(--secondary-color) !important;