From e72ffb12464ef19c60f2f0987db3f8f5a46f5bc6 Mon Sep 17 00:00:00 2001
From: Samir Kamal <1954121+skamril@users.noreply.github.com>
Date: Tue, 18 Jun 2024 09:21:14 +0200
Subject: [PATCH] fix(ui-config): style issues

---
 .../Singlestudy/explore/Configuration/General/Fields.tsx | 2 +-
 .../App/Singlestudy/explore/Configuration/index.tsx      | 9 +++++----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/webapp/src/components/App/Singlestudy/explore/Configuration/General/Fields.tsx b/webapp/src/components/App/Singlestudy/explore/Configuration/General/Fields.tsx
index 0fe6af285b..3bd79f0c94 100644
--- a/webapp/src/components/App/Singlestudy/explore/Configuration/General/Fields.tsx
+++ b/webapp/src/components/App/Singlestudy/explore/Configuration/General/Fields.tsx
@@ -186,7 +186,7 @@ function Fields(props: Props) {
         />
         <SwitchFE
           name="leapYear"
-          sx={{ flex: 1, flexBasis: "100%" }}
+          sx={{ flexBasis: "100%" }}
           label={t("study.configuration.general.leapYear")}
           control={control}
           rules={{
diff --git a/webapp/src/components/App/Singlestudy/explore/Configuration/index.tsx b/webapp/src/components/App/Singlestudy/explore/Configuration/index.tsx
index cc4d673cdd..96bc285952 100644
--- a/webapp/src/components/App/Singlestudy/explore/Configuration/index.tsx
+++ b/webapp/src/components/App/Singlestudy/explore/Configuration/index.tsx
@@ -1,4 +1,3 @@
-import { Paper } from "@mui/material";
 import * as R from "ramda";
 import { useMemo, useState } from "react";
 import { useOutletContext } from "react-router";
@@ -13,6 +12,7 @@ import Optimization from "./Optimization";
 import TimeSeriesManagement from "./TimeSeriesManagement";
 import TableMode from "../../../../common/TableMode";
 import SplitView from "../../../../common/SplitView";
+import ViewWrapper from "../../../../common/page/ViewWrapper";
 
 function Configuration() {
   const { study } = useOutletContext<{ study: StudyMetadata }>();
@@ -40,6 +40,7 @@ function Configuration() {
 
   return (
     <SplitView id="configuration" sizes={[15, 85]}>
+      {/* Left */}
       <PropertiesView
         mainContent={
           <ListElement
@@ -51,8 +52,8 @@ function Configuration() {
           />
         }
       />
-
-      <Paper sx={{ width: 1, height: 1, padding: 2, overflow: "auto" }}>
+      {/* Right */}
+      <ViewWrapper>
         {R.cond([
           [R.equals(0), () => <General />],
           [R.equals(1), () => <TimeSeriesManagement />],
@@ -108,7 +109,7 @@ function Configuration() {
             ),
           ],
         ])(tabList[currentTabIndex].id)}
-      </Paper>
+      </ViewWrapper>
     </SplitView>
   );
 }