diff --git a/client/css/section-editor.css b/client/css/section-editor.css index be6c490..d3d93db 100644 --- a/client/css/section-editor.css +++ b/client/css/section-editor.css @@ -12,10 +12,10 @@ div.section-editor { .cs-tabs div.section-editor { position: absolute; - top: 134px; - bottom: 20px; - left: 20px; - right: 20px; + top: 0; + bottom: 0; + left: 0; + right: 0; display: grid; grid-template-columns: 340px 1fr; grid-template-rows: minmax(55px, max-content); diff --git a/client/css/tabs.css b/client/css/tabs.css index 717ff0d..435cdee 100644 --- a/client/css/tabs.css +++ b/client/css/tabs.css @@ -86,3 +86,8 @@ padding: 20px; background: #fff; } + +.create-drawer .cs-tabs .react-tabs__tab-panel--selected { + position: relative; + flex-grow: 1; +} diff --git a/client/lib/layout/create/create-content.jsx b/client/lib/layout/create/create-content.jsx index b1841dc..59b159f 100644 --- a/client/lib/layout/create/create-content.jsx +++ b/client/lib/layout/create/create-content.jsx @@ -41,14 +41,18 @@ class CreateContent extends React.Component { style={{ border: 0, padding: "20px", - height: "100%", - marginBottom: "60px" + flexGrow: "1", + marginBottom: "0", + display: "flex", + flexDirection: "column" }} > this.handleTabClick(tab)} diff --git a/client/lib/layout/create/create-drawer.jsx b/client/lib/layout/create/create-drawer.jsx index 5a922ed..607e5a8 100644 --- a/client/lib/layout/create/create-drawer.jsx +++ b/client/lib/layout/create/create-drawer.jsx @@ -7,16 +7,15 @@ import CreateContent from "./create-content"; const useStyles = makeStyles(() => ({ root: { - display: "flex", - position: "fixed", - bottom: "10px", - right: "20px", - zIndex: 1000 + // position: "fixed", + // bottom: "10px", + // right: "20px", + // zIndex: 1000 }, drawer: { - width: "100%", - height: "100%", - flexShrink: 0, + // width: "100%", + // height: "100%", + // flexShrink: 0, }, drawerPaper: { width: "100%", @@ -28,18 +27,13 @@ const useStyles = makeStyles(() => ({ display: "flex", alignItems: "center", justifyContent: "space-between", - paddingRight: "20px", - paddingBottom: "20px", + padding: "10px 7px 10px 20px", backgroundColor: "#31383d" }, drawerHeaderTitle: { - float: "left", - marginLeft: "19px", display: "flex", - justifyContent: "center", alignItems: "center", fontSize: "40px", - marginBottom: "-10px", color: "#fff" }, drawerHeaderDefault: { diff --git a/client/lib/layout/create/wizards.jsx b/client/lib/layout/create/wizards.jsx index a3e24ba..495aeff 100644 --- a/client/lib/layout/create/wizards.jsx +++ b/client/lib/layout/create/wizards.jsx @@ -7,10 +7,10 @@ import resourceMetadata from "../../../shared/manifests/resource-metadata"; const useStyles = makeStyles(() => ({ root: { position: "absolute", - top: "134px", - bottom: "20px", - left: "20px", - right: "20px" + top: "0", + bottom: "0", + left: "0", + right: "0" }, content: { padding: "40px",