mpana/sc-portal
Archived
1
0
Fork 0
Code Issues 15 Pull Requests Projects Releases Wiki Activity

Auto stash before merge of "master" and "origin/master"

Browse Source
This commit is contained in:
Dragos 2021-04-28 18:59:19 +03:00
parent 017c90ab02
commit ead7c9188b
14 changed files with 230 additions and 163 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/src/app/instances/instance-info/instance-info.component.html
View File

@ -31,7 +31,7 @@
</ng-container> </ng-container>
<li class="dropdown-header">Deletion protection</li> <li class="dropdown-header">Deletion protection</li>
<li class="list-group-item ps-0 pb-0"> <li class="list-group-item ps-0 pb-0 mt-2 ms-2">
<div class="form-check form-switch"> <div class="form-check form-switch">
<input class="form-check-input mt-0" type="checkbox" id="dp{{ instance.id }}" [(ngModel)]="instance.deletion_protection" <input class="form-check-input mt-0" type="checkbox" id="dp{{ instance.id }}" [(ngModel)]="instance.deletion_protection"
(change)="toggleDeletionProtection($event, instance)"> (change)="toggleDeletionProtection($event, instance)">

2
app/src/app/instances/instance-networks/instance-networks.component.html
View File

@ -21,7 +21,7 @@
</ul> </ul>
</div> </div>
<div class="form-check form-switch"> <div class="form-check form-switch mb-0">
<input class="form-check-input mt-0" type="checkbox" id="fw{{ instance.id }}" [(ngModel)]="instance.firewall_enabled" <input class="form-check-input mt-0" type="checkbox" id="fw{{ instance.id }}" [(ngModel)]="instance.firewall_enabled"
(change)="toggleCloudFirewall($event, instance)"> (change)="toggleCloudFirewall($event, instance)">
<label class="form-check-label" for="fw{{ instance.id }}">Toggle cloud firewall</label> <label class="form-check-label" for="fw{{ instance.id }}">Toggle cloud firewall</label>

5
app/src/app/instances/instance-networks/instance-networks.component.scss
View File

@ -43,3 +43,8 @@
{ {
font-size: 1rem; font-size: 1rem;
} }
.dropdown-menu b
{
font-weight: 400;
}

2
app/src/app/instances/instance-snapshots/instance-snapshots.component.html
View File

@ -33,7 +33,7 @@
*ngIf="snapshot.state === 'created' && !snapshot.working"> *ngIf="snapshot.state === 'created' && !snapshot.working">
<button class="btn btn-link text-success" tooltip="Start machine from this snapshot" container="body" placement="top" [adaptivePosition]="false" <button class="btn btn-link text-success" tooltip="Start machine from this snapshot" container="body" placement="top" [adaptivePosition]="false"
(click)="restoreSnapshot(snapshot)"> (click)="restoreSnapshot(snapshot)">
<fa-icon icon="history" [fixedWidth]="true" size="sm"></fa-icon> <fa-icon icon="undo" [fixedWidth]="true" size="sm"></fa-icon>
</button> </button>
<button class="btn btn-link text-info" dropdownToggle <button class="btn btn-link text-info" dropdownToggle

2
app/src/app/instances/instance-snapshots/instance-snapshots.component.scss
View File

@ -49,7 +49,7 @@
{ {
position: absolute; position: absolute;
left: .5rem; left: .5rem;
top: 50%; top: 51%;
transform: translateY(-50%); transform: translateY(-50%);
z-index: 1; z-index: 1;
pointer-events: none; pointer-events: none;

1
app/src/app/instances/instance-wizard/instance-wizard.component.scss
View File

@ -180,6 +180,7 @@ p
padding: .75rem .25rem; padding: .75rem .25rem;
color: #5a8cd8; color: #5a8cd8;
font-family: "Mukta", sans-serif; font-family: "Mukta", sans-serif;
font-size: 1.1rem;
text-transform: none; text-transform: none;
} }
} }

46
app/src/app/instances/instances.component.html
View File

@ -93,7 +93,7 @@
[parentScroll]="scroller.window.document.getElementById('scrollingBlock')" [scrollThrottlingTime]="250"> [parentScroll]="scroller.window.document.getElementById('scrollingBlock')" [scrollThrottlingTime]="250">
<div *ngFor="let instance of scroller.viewPortItems; trackBy: trackByFunction; let index = index" <div *ngFor="let instance of scroller.viewPortItems; trackBy: trackByFunction; let index = index"
[ngClass]="showMachineDetails ? 'col-12 full-details' : 'col-xl-2 col-lg-3 col-md-4 col-sm-6 col-12'" [ngClass]="showMachineDetails ? 'col-12 full-details' : 'col-xl-2 col-lg-3 col-md-4 col-sm-6 col-12'"
[class.col-lg-6]="editorForm.get('fullDetailsTwoColumns').value" lazyLoad [lazyLoadDelay]="lazyLoadDelay" [class.col-lg-6]="showMachineDetails && editorForm.get('fullDetailsTwoColumns').value" lazyLoad [lazyLoadDelay]="lazyLoadDelay"
[container]="scroller.element.nativeElement.getElementsByClassName('scrollable-content')[0]" [container]="scroller.element.nativeElement.getElementsByClassName('scrollable-content')[0]"
(canLoad)="instance.loading = false" (unload)="instance.loading = true" (canLoad)="instance.loading = false" (unload)="instance.loading = true"
(load)="loadInstanceDetails(instance)"> (load)="loadInstanceDetails(instance)">
@ -154,6 +154,7 @@
[class.bg-danger]="instance.state === 'stopped'" [class.bg-success]="instance.state === 'running'" [class.bg-danger]="instance.state === 'stopped'" [class.bg-success]="instance.state === 'running'"
(click)="showMachineHistory(instance)" tooltip="{{ 'dashboard.listItem.history' | translate }}" (click)="showMachineHistory(instance)" tooltip="{{ 'dashboard.listItem.history' | translate }}"
container="body" placement="top" [adaptivePosition]="false"> container="body" placement="top" [adaptivePosition]="false">
<fa-icon icon="history" [fixedWidth]="true"></fa-icon>
{{ instance.state }} {{ instance.state }}
</a> </a>
@ -243,8 +244,7 @@
</ng-template> </ng-template>
<div class="card-body p-2 h-100"> <div class="card-body p-2 h-100">
<ul class="list-group list-group-flush list-info"> <ul class="list-group list-group-flush list-info">
<li <li class="list-group-item text-uppercase px-0 dns d-flex justify-content-between align-items-center"
class="list-group-item text-uppercase px-0 dns d-flex justify-content-between align-items-center"
*ngFor="let volume of instance.volumes"> *ngFor="let volume of instance.volumes">
<div class="text-truncate"> <div class="text-truncate">
<fa-icon icon="database" [fixedWidth]="true" size="sm"></fa-icon> <fa-icon icon="database" [fixedWidth]="true" size="sm"></fa-icon>
@ -276,12 +276,15 @@
<div class="btn-group w-100 mb-3" dropdown> <div class="btn-group w-100 mb-3" dropdown>
<button class="btn btn-state-filter dropdown-toggle d-flex justify-content-between align-items-center" <button class="btn btn-state-filter dropdown-toggle d-flex justify-content-between align-items-center"
dropdownToggle> dropdownToggle>
<span *ngIf="!editorForm.get(['filters', 'stateFilter']).value">{{ 'dashboard.list.anyState' | translate <span *ngIf="!editorForm.get(['filters', 'stateFilter']).value">
}}</span> {{ 'dashboard.list.anyState' | translate }}
<span *ngIf="editorForm.get(['filters', 'stateFilter']).value === 'running'">{{ </span>
'dashboard.listItem.stateRunning' | translate }}</span> <span *ngIf="editorForm.get(['filters', 'stateFilter']).value === 'running'">
<span *ngIf="editorForm.get(['filters', 'stateFilter']).value === 'stopped'">{{ {{ 'dashboard.listItem.stateRunning' | translate }}
'dashboard.listItem.stateStopped' | translate }}</span> </span>
<span *ngIf="editorForm.get(['filters', 'stateFilter']).value === 'stopped'">
{{ 'dashboard.listItem.stateStopped' | translate }}
</span>
</button> </button>
<ul *dropdownMenu class="dropdown-menu dropdown-menu-state-filter" role="menu"> <ul *dropdownMenu class="dropdown-menu dropdown-menu-state-filter" role="menu">
<li role="menuitem"> <li role="menuitem">
@ -313,8 +316,9 @@
<div class="dropdown-header">{{ 'dashboard.list.filterByDisk' | translate }}</div> <div class="dropdown-header">{{ 'dashboard.list.filterByDisk' | translate }}</div>
<ngx-slider class="mb-3" formControlName="diskFilter" [options]="diskFilterOptions"></ngx-slider> <ngx-slider class="mb-3" formControlName="diskFilter" [options]="diskFilterOptions"></ngx-slider>
<button class="btn btn-outline-dark w-100 mt-3" (click)="clearFilters()">{{ 'dashboard.list.resetFilters' | <button class="btn btn-outline-dark w-100 mt-3" (click)="clearFilters()">
translate }}</button> {{ 'dashboard.list.resetFilters' | translate }}
</button>
</ng-container> </ng-container>
<div class="dropdown-divider"></div> <div class="dropdown-divider"></div>
@ -343,40 +347,46 @@
<ul class="list-group list-group-flush" role="menu"> <ul class="list-group list-group-flush" role="menu">
<li role="menuitem"> <li role="menuitem">
<button class="dropdown-item" (click)="renameMachine(instance)"> <button class="dropdown-item" (click)="renameMachine(instance)">
<fa-icon icon="pen" [fixedWidth]="true"></fa-icon> <fa-icon icon="pen" [fixedWidth]="true" size="sm"></fa-icon>
{{ 'dashboard.listItem.rename' | translate }} {{ 'dashboard.listItem.rename' | translate }}
</button> </button>
</li> </li>
<li role="menuitem"> <li role="menuitem">
<button class="dropdown-item" (click)="showTagEditor(instance)"> <button class="dropdown-item" (click)="showTagEditor(instance)">
<fa-icon icon="tags" [fixedWidth]="true"></fa-icon> <fa-icon icon="tags" [fixedWidth]="true" size="sm"></fa-icon>
{{ 'dashboard.listItem.editTags' | translate }} {{ 'dashboard.listItem.editTags' | translate }}
</button> </button>
</li> </li>
<li role="menuitem"> <li role="menuitem">
<button class="dropdown-item" (click)="showTagEditor(instance, true)"> <button class="dropdown-item" (click)="showTagEditor(instance, true)">
<fa-icon icon="tags" [fixedWidth]="true"></fa-icon> <fa-icon icon="tags" [fixedWidth]="true" size="sm"></fa-icon>
{{ 'dashboard.listItem.editMetadata' | translate }} {{ 'dashboard.listItem.editMetadata' | translate }}
</button> </button>
</li> </li>
<li class="dropdown-divider"></li> <li class="dropdown-divider"></li>
<li role="menuitem"> <li role="menuitem">
<button class="dropdown-item" (click)="createMachine(instance)"> <button class="dropdown-item" (click)="createMachine(instance)">
<fa-icon icon="clone" [fixedWidth]="true"></fa-icon> <fa-icon icon="clone" [fixedWidth]="true" size="sm"></fa-icon>
{{ 'dashboard.listItem.clone' | translate }} {{ 'dashboard.listItem.clone' | translate }}
</button> </button>
</li> </li>
<li role="menuitem"> <li role="menuitem">
<button class="dropdown-item" (click)="createImageFromMachine(instance)"> <button class="dropdown-item" (click)="createImageFromMachine(instance)">
<fa-icon icon="layer-group" [fixedWidth]="true"></fa-icon> <fa-icon icon="layer-group" [fixedWidth]="true" size="sm"></fa-icon>
{{ 'dashboard.listItem.createImage' | translate }} {{ 'dashboard.listItem.createImage' | translate }}
</button> </button>
</li> </li>
<li class="dropdown-divider"></li> <li class="dropdown-divider"></li>
<ng-container *ngIf="instance.state === 'running'"> <ng-container *ngIf="instance.state === 'running'">
<li role="menuitem">
<button class="dropdown-item" (click)="restartMachine(instance)">
<fa-icon icon="undo" [fixedWidth]="true" size="sm"></fa-icon>
{{ 'dashboard.listItem.restart' | translate }}
</button>
</li>
<li role="menuitem"> <li role="menuitem">
<button class="dropdown-item" (click)="stopMachine(instance)"> <button class="dropdown-item" (click)="stopMachine(instance)">
<fa-icon icon="stop" [fixedWidth]="true"></fa-icon> <fa-icon icon="stop" [fixedWidth]="true" size="sm"></fa-icon>
{{ 'dashboard.listItem.stop' | translate }} {{ 'dashboard.listItem.stop' | translate }}
</button> </button>
</li> </li>
@ -384,7 +394,7 @@
</ng-container> </ng-container>
<li role="menuitem"> <li role="menuitem">
<button class="dropdown-item" (click)="deleteMachine(instance)"> <button class="dropdown-item" (click)="deleteMachine(instance)">
<fa-icon icon="trash" [fixedWidth]="true"></fa-icon> <fa-icon icon="trash" [fixedWidth]="true" size="sm"></fa-icon>
{{ 'dashboard.listItem.delete' | translate }} {{ 'dashboard.listItem.delete' | translate }}
</button> </button>
</li> </li>

186
app/src/app/instances/instances.component.scss
View File

@ -1,162 +1,197 @@
:host { :host
{
flex-direction: column; flex-direction: column;
overflow : hidden; overflow: hidden;
} }
.ips { .ips
+.ips { {
margin-left : .5rem; + .ips
{
margin-left: .5rem;
padding-left: .5rem; padding-left: .5rem;
border-left : 2px solid #2b3540; border-left: 2px solid #2b3540;
} }
} }
.card { .card
border : 1px solid rgba(0, 0, 0, .5); {
border: 1px solid rgba(0, 0, 0, .5);
background-color: rgba(16, 21, 39, .5); background-color: rgba(16, 21, 39, .5);
box-shadow : 0 0 0 2px #0b2b51, 0 0 2px 4px #0b284b, 0 0 10px 3px #0e162a; box-shadow: 0 0 0 2px #0b2b51, 0 0 2px 4px #0b284b, 0 0 10px 3px #0e162a;
transition : box-shadow .15s ease-out; transition: box-shadow .15s ease-out;
&:hover { &:hover
{
box-shadow: 0 0 0 2px #0b2b51, 0 0 2px 4px rgba(18, 203, 240, .4), 0 0 10px 3px #0e162a; box-shadow: 0 0 0 2px #0b2b51, 0 0 2px 4px rgba(18, 203, 240, .4), 0 0 10px 3px #0e162a;
} }
.card-title { .card-title
color : #ff9c07; {
color: #ff9c07;
margin-bottom: 0; margin-bottom: 0;
font-weight : bold; font-weight: bold;
} }
.card-body { .card-body
{
background-color: rgba(16, 21, 39, .5); background-color: rgba(16, 21, 39, .5);
max-height : 205px; max-height: 205px;
overflow : auto; overflow: auto;
padding-top : .7rem !important; padding-top: .7rem !important;
} }
.list-group-item { .list-group-item
{
background: none; background: none;
span { span
{
color: #8881ff; color: #8881ff;
} }
b, b,
.strong { .strong
color : #ff9c07; {
color: #ff9c07;
font-weight: bold; font-weight: bold;
} }
} }
.btn-info, .btn-info,
.btn-outline-info { .btn-outline-info
font-size : 1rem; {
font-size: 1rem;
line-height: 1; line-height: 1;
} }
} }
.card-info { .card-info
{
background-color: rgba(16, 21, 39, .75); background-color: rgba(16, 21, 39, .75);
display : flex; display: flex;
flex-direction : column; flex-direction: column;
justify-content : space-between; justify-content: space-between;
padding : .25rem .5rem .5rem; padding: .25rem .5rem .5rem;
height : 170px; height: 170px;
} }
.full-details .card-info { .full-details .card-info
{
height: 240px; height: 240px;
} }
@media (max-width: 576px) { @media (max-width: 576px)
.card-info { {
.card-info
{
height: auto; height: auto;
} }
} }
.no-overflow-sm { .no-overflow-sm
{
overflow: hidden; overflow: hidden;
} }
@media (max-width: 992px) { @media (max-width: 992px)
.no-overflow-sm { {
.no-overflow-sm
{
overflow: visible; overflow: visible;
} }
} }
.open .dropdown-toggle {} .open .dropdown-toggle
{
}
.filters { .filters
{
width: 240px; width: 240px;
} }
.form-check-label { .form-check-label
{
color: inherit; color: inherit;
} }
.btn-toolbar .btn { .btn-toolbar .btn
.badge { {
padding : 0.1rem 0.35rem 0; .badge
border : 1px solid transparent; {
text-shadow: 0 0 3px rgb(255 255 255 / 25%); padding: .1rem .35rem 0;
border: 1px solid transparent;
font-weight: 400;
font-size: 1.25rem;
&:first-letter { &:first-letter
{
font-size: 1.2rem; font-size: 1.2rem;
} }
} }
&:hover { &:hover
.badge { {
border-color: #000; .badge
{
border-color: rgba(0,0,0,.25);
} }
} }
} }
@keyframes flash { @keyframes flash
{
from, from, 50%, to
50%, {
to {
opacity: 1; opacity: 1;
} }
25%, 25%, 75%
75% { {
opacity: 0; opacity: 0;
} }
} }
.flash { .flash
animation-name : flash; {
animation-duration : calc(.9s * 1.3); animation-name: flash;
animation-duration: calc(.9s * 1.3);
animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;
} }
.btn-state-filter:not(.btn-lg):not(.btn-sm) { .btn-state-filter:not(.btn-lg):not(.btn-sm)
{
background-color: #11182b; background-color: #11182b;
color : #ff9c07; color: #ff9c07;
padding : .5rem 1rem; padding: .5rem 1rem;
} }
.open.show .btn-state-filter { .open.show .btn-state-filter
{
border-radius: 1.25rem 1.25rem 0 0; border-radius: 1.25rem 1.25rem 0 0;
} }
.dropdown-menu.dropdown-menu-state-filter { .dropdown-menu.dropdown-menu-state-filter
background : #11182b; {
color : #ff9c07; background: #11182b;
width : 100%; color: #ff9c07;
padding : 0; width: 100%;
padding: 0;
border-radius: 0 0 .25rem .25rem; border-radius: 0 0 .25rem .25rem;
.dropdown-item { .dropdown-item
{
color: inherit; color: inherit;
&.active { &.active
{
color: #0dcaf0; color: #0dcaf0;
} }
&:hover { &:hover
{
background-color: rgba(11, 172, 204, .2); background-color: rgba(11, 172, 204, .2);
} }
} }
@ -164,6 +199,17 @@
.form-switch, .form-switch,
.form-switch input, .form-switch input,
.form-switch label { .form-switch label
{
cursor: pointer; cursor: pointer;
} }
.dropdown-toggle b
{
font-weight: 400;
}
a.badge
{
text-decoration: none;
}

2
app/src/app/instances/instances.component.ts
View File

@ -774,7 +774,7 @@ export class InstancesComponent implements OnInit, OnDestroy
instance.working = false; instance.working = false;
}); });
instance.shouldLoadInfo = this.editorForm.get('showMachineDetails').value; instance.shouldLoadInfo = true;
} }
// ---------------------------------------------------------------------------------------------------------------- // ----------------------------------------------------------------------------------------------------------------

6
app/src/app/shared.module.ts
View File

@ -32,7 +32,8 @@ import
faTimes, faTrash, faUser, faUserTag, faTag, faUserLock, faLock, faPen, faCheckCircle, faPenNib, faPlus, faMinus, faAngleRight, faHandPointer, faTimes, faTrash, faUser, faUserTag, faTag, faUserLock, faLock, faPen, faCheckCircle, faPenNib, faPlus, faMinus, faAngleRight, faHandPointer,
faArrowsAlt, faTags, faEllipsisV, faHatWizard, faUserCog, faCircle, faAngleLeft, faExternalLinkAlt, faCheck, faPowerOff, faBars, faSpinner, faArrowsAlt, faTags, faEllipsisV, faHatWizard, faUserCog, faCircle, faAngleLeft, faExternalLinkAlt, faCheck, faPowerOff, faBars, faSpinner,
faStop, faPlay, faRedo, faMicrochip, faDesktop, faCopy, faSquare, faCheckSquare, faSave, faDatabase, faClone, faSearch, faHistory, faMask, faStop, faPlay, faRedo, faMicrochip, faDesktop, faCopy, faSquare, faCheckSquare, faSave, faDatabase, faClone, faSearch, faHistory, faMask,
faCloud, faCloudUploadAlt, faEye, faFingerprint, faLink, faClipboard, faCoins, faArrowRight, faEllipsisH, faStar, faCommentAlt, faOutdent faCloud, faCloudUploadAlt, faEye, faFingerprint, faLink, faClipboard, faCoins, faArrowRight, faEllipsisH, faStar, faCommentAlt, faOutdent,
faUndo
} from '@fortawesome/free-solid-svg-icons'; } from '@fortawesome/free-solid-svg-icons';
import { faDocker } from '@fortawesome/free-brands-svg-icons'; import { faDocker } from '@fortawesome/free-brands-svg-icons';
@ -147,7 +148,8 @@ export class SharedModule
faTimes, faTrash, faUser, faUserTag, faTag, faUserLock, faLock, faPen, faCheckCircle, faPenNib, faPlus, faMinus, faAngleRight, faHandPointer, faTimes, faTrash, faUser, faUserTag, faTag, faUserLock, faLock, faPen, faCheckCircle, faPenNib, faPlus, faMinus, faAngleRight, faHandPointer,
faArrowsAlt, faTags, faEllipsisV, faHatWizard, faUserCog, faCircle, faAngleLeft, faExternalLinkAlt, faCheck, faPowerOff, faBars, faSpinner, faArrowsAlt, faTags, faEllipsisV, faHatWizard, faUserCog, faCircle, faAngleLeft, faExternalLinkAlt, faCheck, faPowerOff, faBars, faSpinner,
faStop, faPlay, faRedo, faMicrochip, faDesktop, faCopy, faSquare, faCheckSquare, faSave, faDatabase, faClone, faSearch, faHistory, faMask, faStop, faPlay, faRedo, faMicrochip, faDesktop, faCopy, faSquare, faCheckSquare, faSave, faDatabase, faClone, faSearch, faHistory, faMask,
faCloud, faCloudUploadAlt, faEye, faFingerprint, faLink, faClipboard, faCoins, faArrowRight, faEllipsisH, faStar, faCommentAlt, faOutdent faCloud, faCloudUploadAlt, faEye, faFingerprint, faLink, faClipboard, faCoins, faArrowRight, faEllipsisH, faStar, faCommentAlt, faOutdent,
faUndo
); );
} }
} }

8
app/src/styles/_buttons.scss
View File

@ -2,7 +2,7 @@
{ {
border-radius: 2rem; border-radius: 2rem;
line-height: 1.2; line-height: 1.2;
font-family: "Mukta", sans-serif; font-family: "Bebas Neue", sans-serif;
text-transform: uppercase; text-transform: uppercase;
font-weight: 400; font-weight: 400;
@ -18,7 +18,7 @@
.btn:not(.btn-lg):not(.btn-sm) .btn:not(.btn-lg):not(.btn-sm)
{ {
font-size: 1.15rem; font-size: 1.25rem;
padding: .375rem .5rem .3rem; padding: .375rem .5rem .3rem;
} }
@ -34,10 +34,10 @@
.btn.btn-lg .btn.btn-lg
{ {
font-size: 1.15rem; font-size: 1.5rem;
padding-bottom: .35rem; padding-bottom: .35rem;
line-height: 1; line-height: 1;
font-weight: 600; font-weight: 400;
} }
.btn-primary .btn-primary

4
app/src/styles/_forms.scss
View File

@ -2,8 +2,8 @@
{ {
text-transform: uppercase; text-transform: uppercase;
color: #0dcaf0; color: #0dcaf0;
font-family: "Varta", sans-serif; font-family: "Bebas Neue", sans-serif;
font-size: 1.2rem; font-size: 1.25rem;
vertical-align: middle; vertical-align: middle;
} }

2
app/src/styles/_modal.scss
View File

@ -29,7 +29,7 @@
h4 h4
{ {
color: #3d5e8e; color: #3d5e8e;
font-family: "Varta", sans-serif; font-family: "Bebas Neue", sans-serif;
} }
} }
} }

13
app/src/styles/styles.scss
View File

@ -116,7 +116,8 @@ body, div, virtual-scroller
background: none; background: none;
border-radius: 0; border-radius: 0;
border: none; border: none;
font-family: "Varta", sans-serif; font-family: "Bebas Neue", sans-serif;
text-transform: uppercase;
text-align: center; text-align: center;
color: #0dcaf0; color: #0dcaf0;
width: 100%; width: 100%;
@ -138,6 +139,7 @@ body, div, virtual-scroller
.nav-tabs .nav-tabs
{ {
border: none; border: none;
flex-wrap: nowrap;
} }
.tab-content .tab-content
@ -266,10 +268,11 @@ accordion
.dropdown-menu, .menu-popover, .menu-dropdown .dropdown-menu, .menu-popover, .menu-dropdown
{ {
background: linear-gradient(135deg, #1fd1f5 0%, #00c3ea 100%); background: linear-gradient(135deg, #1fd1f5 0%, #00c3ea 100%);
font-family: "Varta", sans-serif; font-family: "Bebas Neue", sans-serif;
font-size: 1.2rem; font-size: 1.25rem;
z-index: 1020; z-index: 1020;
max-height: 60vh; max-height: 80vh;
max-width: 600px;
overflow: auto; overflow: auto;
} }
@ -472,7 +475,7 @@ accordion
{ {
thead thead
{ {
font-family: "Varta", sans-serif; font-family: "Bebas Neue", sans-serif;
font-size: 1.2rem; font-size: 1.2rem;
color: #A3A4B8; color: #A3A4B8;
} }