mirror of
https://github.com/jwetzell/showbridge-webui.git
synced 2026-08-12 18:03:40 +00:00
config layout tweaks
This commit is contained in:
@@ -1,24 +1,11 @@
|
||||
@if (config()) {
|
||||
<div class="flex h-full flex-row m-2 gap-1.5">
|
||||
<div class="flex flex-col">
|
||||
<div class="text-2xl text-white text-center">Modules</div>
|
||||
<div class="flex-grow h-full overflow-scroll gap-1.5 border-2 border-gray-500">
|
||||
@for (module of modules(); track module; let i = $index) {
|
||||
<div>
|
||||
<app-module
|
||||
[path]="`modules/${i}`"
|
||||
(moduleChange)="moduleUpdated(i, $event)"
|
||||
[module]="module"
|
||||
(delete)="deleteModule(i)"
|
||||
></app-module>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="flex mb-2">
|
||||
<div class="flex h-full flex-row p-2 gap-1.5">
|
||||
<div class="flex flex-col min-w-1/6 border-2 rounded-lg border-gray-500">
|
||||
<div class="flex items-center">
|
||||
@if (schemaService.moduleTypes.length > 0) {
|
||||
<div
|
||||
matTooltip="Add Module"
|
||||
class="flex items-center justify-center w-full h-10 rounded-lg bg-gray-200 hover:cursor-pointer hover:bg-gray-300 m-2"
|
||||
class="flex items-center justify-center w-10 h-10 rounded-full bg-transparent hover:bg-gray-700 hover:cursor-pointer text-blue-400 border-blue-400 border-2 m-2"
|
||||
[matMenuTriggerFor]="addModuleMenu"
|
||||
>
|
||||
<mat-icon>add</mat-icon>
|
||||
@@ -31,12 +18,36 @@
|
||||
}
|
||||
</mat-menu>
|
||||
}
|
||||
<div class="text-2xl text-white flex-grow text-center">Modules</div>
|
||||
<div class="w-10 h-10 m-2"></div>
|
||||
</div>
|
||||
<div class="flex-grow h-full overflow-x-hidden overflow-y-auto gap-1.5">
|
||||
@for (module of modules(); track module; let i = $index) {
|
||||
<div>
|
||||
<app-module
|
||||
[path]="`modules/${i}`"
|
||||
(moduleChange)="moduleUpdated(i, $event)"
|
||||
[module]="module"
|
||||
(delete)="deleteModule(i)"
|
||||
></app-module>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col flex-grow">
|
||||
<div class="text-2xl text-white text-center w-full">Routes</div>
|
||||
<div class="flex flex-col flex-grow border-2 border-gray-500 rounded-lg">
|
||||
<div class="flex items-center">
|
||||
<div
|
||||
matTooltip="Add Route"
|
||||
class="flex items-center justify-center w-10 h-10 rounded-full bg-transparent hover:bg-gray-700 hover:cursor-pointer text-blue-400 border-blue-400 border-2 m-2"
|
||||
(click)="addRoute()"
|
||||
>
|
||||
<mat-icon>add</mat-icon>
|
||||
</div>
|
||||
<div class="text-2xl text-white text-center flex-grow">Routes</div>
|
||||
<div class="w-10 h-10 m-2"></div>
|
||||
</div>
|
||||
<div
|
||||
class="flex-grow h-full overflow-scroll flex flex-row flex-wrap gap-1.5 content-baseline border-2 border-gray-500"
|
||||
class="flex-grow h-full overflow-x-hidden overflow-y-auto flex flex-row flex-wrap gap-1.5 content-baselinerounded-sm"
|
||||
>
|
||||
@for (route of routes(); track route; let i = $index) {
|
||||
<div>
|
||||
@@ -50,15 +61,6 @@
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="flex mb-2">
|
||||
<div
|
||||
matTooltip="Add Route"
|
||||
class="flex items-center justify-center w-full h-10 rounded-lg m-2 bg-gray-200 hover:cursor-pointer hover:bg-gray-300"
|
||||
(click)="addRoute()"
|
||||
>
|
||||
<mat-icon>add</mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user