Update snapshots and use css modules

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

src/features/cluster/__snapshots__/cluster-modal-items.test.tsx.snap

@@ -3,8 +3,7 @@
 exports[`cluster modal elements given custom cluster modal available renders 1`] = `
 <div>
   <div
-    class="clusterFrameModals"
+    class="clusterModals"
-    style="height: 0px;"
   >
     <div
       data-testid="test-modal"
@@ -521,8 +520,7 @@ exports[`cluster modal elements given custom cluster modal available renders 1`]
 exports[`cluster modal elements given custom cluster modal not available renders 1`] = `
 <div>
   <div
-    class="clusterFrameModals"
+    class="clusterModals"
-    style="height: 0px;"
   />
   <div
     class="Notifications flex column align-flex-end"

src/renderer/cluster-modals/cluster-modals.module.css

@@ -0,0 +1,4 @@
+.clusterModals {
+  height: 0;
+  overflow: visible;
+}

src/renderer/cluster-modals/cluster-modals.tsx

@@ -1,3 +1,5 @@
+import styles from "./cluster-modals.module.css";
+
 import { withInjectables } from "@ogre-tools/injectable-react";
 import React from "react";
 import type { ClusterModalRegistration } from "../../extensions/registries";
@@ -9,7 +11,7 @@ interface Dependencies {
 
 export const NonInjectedClusterModals = ({ clusterModals }: Dependencies) => {
   return (
-    <div className="clusterFrameModals" style={{ height: 0 }}>
+    <div className={styles.clusterModals}>
       {clusterModals.map((modal) => {
         return modal.visible ? <modal.Component key={modal.id} /> : null;
       })}