OSN-556. Fix height for Safari

hystax · Jan 16, 2025 · b5c7c8e · b5c7c8e
1 parent 32b9d52
commit b5c7c8e
Showing 1 changed file with 31 additions and 26 deletions.
diff --git a/ngui/ui/src/components/CapabilityCard/CapabilityCard.tsx b/ngui/ui/src/components/CapabilityCard/CapabilityCard.tsx
@@ -63,45 +63,50 @@ const CapabilityCard = ({
   typographyVariant = "body2"
 }: CapabilityCardProps) => (
   <ContentBackdropLoader isLoading={isLoading} size="medium">
-    <label
-      style={{
-        cursor: "pointer",
+    <Box
+      sx={{
         height: "100%",
-        width: "100%",
-        display: "flex"
+        width: "100%"
       }}
     >
-      <Paper
-        elevation={0}
-        sx={{
-          border: (theme) => `1px solid ${lighten(theme.palette.info.main, 0.8)}`,
-          width: "100%",
-          height: "100%"
+      <label
+        style={{
+          cursor: "pointer",
+          display: "flex"
         }}
       >
-        <Box
+        <Paper
+          elevation={0}
           sx={{
-            padding: "1rem"
+            border: (theme) => `1px solid ${lighten(theme.palette.info.main, 0.8)}`,
+            width: "100%",
+            height: "100%"
           }}
         >
           <Box
             sx={{
-              ml: "-11px",
-              display: "flex",
-              alignItems: "center"
+              padding: "1rem"
             }}
           >
-            <Checkbox checked={checked} onChange={onChange} disabled={disabled} />
-            <Typography variant={typographyVariant}>
-              <FormattedMessage id={capabilityName[capability]} />
-            </Typography>
+            <Box
+              sx={{
+                ml: "-11px",
+                display: "flex",
+                alignItems: "center"
+              }}
+            >
+              <Checkbox checked={checked} onChange={onChange} disabled={disabled} />
+              <Typography variant={typographyVariant}>
+                <FormattedMessage id={capabilityName[capability]} />
+              </Typography>
+            </Box>
+            <Box>
+              <FeatureList messageIds={capabilityMessages[capability]} variant={typographyVariant} />
+            </Box>
           </Box>
-          <Box>
-            <FeatureList messageIds={capabilityMessages[capability]} variant={typographyVariant} />
-          </Box>
-        </Box>
-      </Paper>
-    </label>
+        </Paper>
+      </label>
+    </Box>
   </ContentBackdropLoader>
 );