Merge pull request #1387 from headlamp-k8s/fix-bottom-space

frontend: Fix lack of space at page bottom
headlamp-k8s · Sep 27, 2023 · 1951e07 · 1951e07
2 parents c3d4cfe + b7e00cb
commit 1951e07
Show file tree

Hide file tree

Showing 15 changed files with 40 additions and 33 deletions.
diff --git a/frontend/src/components/common/Resource/Resource.tsx b/frontend/src/components/common/Resource/Resource.tsx
@@ -73,6 +73,12 @@ export function ResourceLink(props: ResourceLinkProps) {
   );
 }
 
+const useDetailsGridStyles = makeStyles((theme: Theme) => ({
+  section: {
+    marginBottom: theme.spacing(2),
+  },
+}));
+
 export interface DetailsGridProps
   extends PropsWithChildren<Omit<MainInfoSectionProps, 'resource'>> {
   /** Resource type to fetch (from the ResourceClasses). */
@@ -108,6 +114,7 @@ export function DetailsGrid(props: DetailsGridProps) {
   } = props;
   const { t } = useTranslation('frequent');
   const location = useLocation<{ backLink: NavLinkProps['location'] }>();
+  const classes = useDetailsGridStyles();
   const hasPreviousRoute = useHasPreviousRoute();
   const detailViews = useTypedSelector(state => state.detailsViewSections.detailsViewSections);
   const detailViewsProcessors = useTypedSelector(
@@ -278,7 +285,7 @@ export function DetailsGrid(props: DetailsGridProps) {
   }
 
   return (
-    <PageGrid>
+    <PageGrid className={classes.section}>
       {React.Children.toArray(
         sectionsProcessed.map(section => {
           const Section = has(section, 'section')

diff --git a/frontend/src/components/endpoints/__snapshots__/EndpointDetails.stories.storyshot b/frontend/src/components/endpoints/__snapshots__/EndpointDetails.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots endpoints/EndpointsDetailsView Default 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -552,7 +552,7 @@ exports[`Storyshots endpoints/EndpointsDetailsView Default 1`] = `
 exports[`Storyshots endpoints/EndpointsDetailsView Error 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -662,7 +662,7 @@ exports[`Storyshots endpoints/EndpointsDetailsView Error 1`] = `
 exports[`Storyshots endpoints/EndpointsDetailsView No Item Yet 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/horizontalPodAutoscaler/__snapshots__/HPADetails.stories.storyshot b/frontend/src/components/horizontalPodAutoscaler/__snapshots__/HPADetails.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots hpa/HpaDetailsView Default 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -583,7 +583,7 @@ exports[`Storyshots hpa/HpaDetailsView Default 1`] = `
 exports[`Storyshots hpa/HpaDetailsView Error 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -680,7 +680,7 @@ exports[`Storyshots hpa/HpaDetailsView Error 1`] = `
 exports[`Storyshots hpa/HpaDetailsView No Item Yet 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/ingress/__snapshots__/Details.stories.storyshot b/frontend/src/components/ingress/__snapshots__/Details.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots Ingress/DetailsView With Resource 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -461,7 +461,7 @@ exports[`Storyshots Ingress/DetailsView With Resource 1`] = `
 exports[`Storyshots Ingress/DetailsView With TLS 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/lease/__snapshots__/Details.stories.storyshot b/frontend/src/components/lease/__snapshots__/Details.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots Lease/LeaseDetailsView Lease Detail 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/limitRange/__snapshots__/Details.stories.storyshot b/frontend/src/components/limitRange/__snapshots__/Details.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots LimitRange/DetailsView Limit Range Detail 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/namespace/__snapshots__/NamespaceDetails.stories.storyshot b/frontend/src/components/namespace/__snapshots__/NamespaceDetails.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots Namespace/DetailsView Active 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/pod/__snapshots__/PodDetails.stories.storyshot b/frontend/src/components/pod/__snapshots__/PodDetails.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots Pod/PodDetailsView Error 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -976,7 +976,7 @@ exports[`Storyshots Pod/PodDetailsView Error 1`] = `
 exports[`Storyshots Pod/PodDetailsView Initializing 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -2071,7 +2071,7 @@ exports[`Storyshots Pod/PodDetailsView Initializing 1`] = `
 exports[`Storyshots Pod/PodDetailsView Liveness Failed 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -3137,7 +3137,7 @@ exports[`Storyshots Pod/PodDetailsView Liveness Failed 1`] = `
 exports[`Storyshots Pod/PodDetailsView Pull Back Off 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -4084,7 +4084,7 @@ exports[`Storyshots Pod/PodDetailsView Pull Back Off 1`] = `
 exports[`Storyshots Pod/PodDetailsView Running 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -5061,7 +5061,7 @@ exports[`Storyshots Pod/PodDetailsView Running 1`] = `
 exports[`Storyshots Pod/PodDetailsView Successful 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/pod/__snapshots__/PodLogs.stories.storyshot b/frontend/src/components/pod/__snapshots__/PodLogs.stories.storyshot
@@ -5,7 +5,7 @@ exports[`Storyshots Pod/PodLogs Logs 1`] = `
   aria-hidden="true"
 >
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/podDisruptionBudget/__snapshots__/pdbDetails.stories.storyshot b/frontend/src/components/podDisruptionBudget/__snapshots__/pdbDetails.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots pdb/PDBDetailsView Default 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -344,7 +344,7 @@ exports[`Storyshots pdb/PDBDetailsView Default 1`] = `
 exports[`Storyshots pdb/PDBDetailsView Error 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -441,7 +441,7 @@ exports[`Storyshots pdb/PDBDetailsView Error 1`] = `
 exports[`Storyshots pdb/PDBDetailsView No Item Yet 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/priorityClass/__snapshots__/priorityClassDetails.stories.storyshot b/frontend/src/components/priorityClass/__snapshots__/priorityClassDetails.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots PriorityClass/PriorityClassDetailsView Default 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -276,7 +276,7 @@ exports[`Storyshots PriorityClass/PriorityClassDetailsView Default 1`] = `
 exports[`Storyshots PriorityClass/PriorityClassDetailsView Error 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -373,7 +373,7 @@ exports[`Storyshots PriorityClass/PriorityClassDetailsView Error 1`] = `
 exports[`Storyshots PriorityClass/PriorityClassDetailsView No Item Yet 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/resourceQuota/__snapshots__/resourceQuotaDetails.stories.storyshot b/frontend/src/components/resourceQuota/__snapshots__/resourceQuotaDetails.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots ResourceQuota/ResourceQuotaDetailsView Default 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -420,7 +420,7 @@ exports[`Storyshots ResourceQuota/ResourceQuotaDetailsView Default 1`] = `
 exports[`Storyshots ResourceQuota/ResourceQuotaDetailsView Error 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -517,7 +517,7 @@ exports[`Storyshots ResourceQuota/ResourceQuotaDetailsView Error 1`] = `
 exports[`Storyshots ResourceQuota/ResourceQuotaDetailsView No Item Yet 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/frontend/src/components/runtimeClass/__snapshots__/Details.stories.storyshot b/frontend/src/components/runtimeClass/__snapshots__/Details.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots RuntimeClass/DetailsView Runtime Class Detail 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/...ponents/webhookconfiguration/__snapshots__/MutatingWebhookConfigDetails.stories.storyshot b/...ponents/webhookconfiguration/__snapshots__/MutatingWebhookConfigDetails.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots WebhookConfiguration/MutatingWebhookConfig/Details With Service 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -664,7 +664,7 @@ exports[`Storyshots WebhookConfiguration/MutatingWebhookConfig/Details With Serv
 exports[`Storyshots WebhookConfiguration/MutatingWebhookConfig/Details With URL 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"

diff --git a/...nents/webhookconfiguration/__snapshots__/ValidatingWebhookConfigDetails.stories.storyshot b/...nents/webhookconfiguration/__snapshots__/ValidatingWebhookConfigDetails.stories.storyshot
@@ -3,7 +3,7 @@
 exports[`Storyshots WebhookConfiguration/ValidatingWebhookConfig/Details With Service 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
@@ -650,7 +650,7 @@ exports[`Storyshots WebhookConfiguration/ValidatingWebhookConfig/Details With Se
 exports[`Storyshots WebhookConfiguration/ValidatingWebhookConfig/Details With URL 1`] = `
 <div>
   <div
-    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
+    class="MuiGrid-root makeStyles-section MuiGrid-container MuiGrid-spacing-xs-1"
   >
     <div
       class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"