Added light & dark theme. Basic theme applied on dialogs/modals. Attempt to apply uniformity to the website.

src/app/actions/action-list/action-list.component.scss

@@ -1,3 +1,5 @@
+@use '@angular/material' as mat;
+
 main {
   display: grid;
   grid-template-columns: repeat(1, 1fr);
@@ -15,7 +17,7 @@ main {
     border: 1px solid grey;
     padding: 1em;
     cursor: pointer;
-    background-color: white;
+    background-color: transparent;
 
     & span {
       display: block;
@@ -27,7 +29,6 @@ main {
 
     & .subtitle {
       font-size: smaller;
-      color: lightgrey;
     }
   }
 }

src/app/actions/action-list/action-list.component.ts

@@ -7,19 +7,28 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatDialog } from '@angular/material/dialog';
 import { ActionItemEditComponent } from '../action-item-edit/action-item-edit.component';
 import { HermesClientService } from '../../hermes-client.service';
+import { MatSelectModule } from '@angular/material/select';
 
 @Component({
   selector: 'action-list',
   standalone: true,
-  imports: [MatButtonModule, MatFormFieldModule, MatIconModule, MatListModule],
+  imports: [
+    MatButtonModule,
+    MatFormFieldModule,
+    MatIconModule,
+    MatListModule,
+    MatSelectModule,
+  ],
   templateUrl: './action-list.component.html',
   styleUrl: './action-list.component.scss'
 })
 export class ActionListComponent {
   @Input() actions: RedeemableAction[] = []
   @Output() actionsChange = new EventEmitter<RedeemableAction>();
+
   readonly dialog = inject(MatDialog);
   readonly client = inject(HermesClientService);
+
   opened = false;
 
   create(): void {