chore: Layout fixes after upgrade

springwolf · Jun 2, 2023 · c665a04 · c665a04
1 parent 8db6e42
commit c665a04
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 9 deletions.
diff --git a/springwolf-ui/src/app/app.component.html b/springwolf-ui/src/app/app.component.html
@@ -1,5 +1,5 @@
 <app-header></app-header>
-<main class="flex-column gap-24">
+<main class="flex-column">
     <app-info></app-info>
     <app-servers></app-servers>
     <app-channels></app-channels>

diff --git a/springwolf-ui/src/app/channels/channel-main/channel-main.component.css b/springwolf-ui/src/app/channels/channel-main/channel-main.component.css
@@ -35,6 +35,10 @@ button {
   font-weight: normal;
 }
 
+.button-container {
+  height: 50px;
+}
+
 [hidden] {
   display: none !important;
 }
diff --git a/springwolf-ui/src/app/channels/channel-main/channel-main.component.html b/springwolf-ui/src/app/channels/channel-main/channel-main.component.html
@@ -7,7 +7,7 @@ <h4>{{ operation.message.description }}</h4>
     <mat-tab-group animationDuration="0ms">
       <mat-tab label="Example">
         <div class="flex-column">
-          <div [hidden]="isEmptyObject(operation.message.bindings.get(protocolName))" class="flex-column gap-5">
+          <div [hidden]="isEmptyObject(operation.message.bindings.get(protocolName))" class="flex-column">
             <h4>Message Binding</h4>
             <textarea spellcheck="false"
                       #bindingTextArea
@@ -16,7 +16,7 @@ <h4>Message Binding</h4>
                       (keyup)="recalculateLineCount('massageBindingExample', bindingTextArea.value)"
             ></textarea>
           </div>
-          <div [hidden]="!(headersExample?.lineCount > 1)" class="flex-column gap-5">
+          <div [hidden]="!(headersExample?.lineCount > 1)" class="flex-column">
 
               <h4>Header</h4>
               <textarea spellcheck="false"
@@ -27,7 +27,7 @@ <h4>Header</h4>
               ></textarea>
 
           </div>
-          <div class="flex-column gap-5">
+          <div class="flex-column">
             <h4>Message</h4>
             <textarea spellcheck="false"
                       #messageTextArea
@@ -36,7 +36,7 @@ <h4>Message</h4>
                       (keyup)="recalculateLineCount('example', messageTextArea.value)"
             ></textarea>
           </div>
-          <div class="flex gap-8">
+          <div class="button-container flex gap-8">
             <button mat-raised-button color="primary"
                     (click)="publish(messageTextArea.value, headersTextArea?.value, bindingTextArea?.value)">
               Publish

diff --git a/springwolf-ui/src/app/servers/servers.component.html b/springwolf-ui/src/app/servers/servers.component.html
@@ -1,6 +1,8 @@
 <h1>Servers</h1>
 <mat-card appearance="outlined" *ngFor="let server of servers | keyvalue">
-    <mat-card-title>{{ server.key }}</mat-card-title>
+    <mat-card-header>
+      <mat-card-title>{{ server.key }}</mat-card-title>
+    </mat-card-header>
     <mat-card-content>
         {{ server.value.url }}
     </mat-card-content>

diff --git a/springwolf-ui/src/styles.css b/springwolf-ui/src/styles.css
@@ -16,11 +16,8 @@ body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
 .flex { display: flex; }
 .flex-row { display: flex; flex-direction: row; }
 .flex-col { display: flex; flex-direction: column; }
-.gap-0 { gap: 0px; }
-.gap-5 { gap: 5px; }
 .gap-8 { gap: 8px; }
 .gap-16 { gap: 16px; }
-.gap-24 { gap: 24px; }
 .space-between { justify-content: space-between; }
 .justify-center { justify-content: center; }
 .items-center { align-items: center; }