diff --git a/app/client/src/ce/pages/Applications/CreateNewAppsOption.tsx b/app/client/src/ce/pages/Applications/CreateNewAppsOption.tsx index 6c4f49ef499..f0e99e5f25a 100644 --- a/app/client/src/ce/pages/Applications/CreateNewAppsOption.tsx +++ b/app/client/src/ce/pages/Applications/CreateNewAppsOption.tsx @@ -59,13 +59,16 @@ import StartWithTemplatesWrapper from "./StartWithTemplatesWrapper"; import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; import { FEATURE_FLAG } from "@appsmith/entities/FeatureFlag"; import type { Template } from "api/TemplatesApi"; +import { shouldShowLicenseBanner } from "@appsmith/selectors/tenantSelectors"; -const SectionWrapper = styled.div` +const SectionWrapper = styled.div<{ isBannerVisible: boolean }>` display: flex; flex-direction: column; padding: 0 var(--ads-v2-spaces-7) var(--ads-v2-spaces-7); ${(props) => ` - margin-top: ${props.theme.homePage.header}px; + margin-top: ${ + props.theme.homePage.header + (props.isBannerVisible ? 40 : 0) + }px; `} background: var(--ads-v2-color-gray-50); ${(props) => ` @@ -73,12 +76,12 @@ const SectionWrapper = styled.div` `} `; -const BackWrapper = styled.div<{ hidden?: boolean }>` +const BackWrapper = styled.div<{ hidden?: boolean; isBannerVisible: boolean }>` position: sticky; display: flex; justify-content: space-between; ${(props) => ` - top: ${props.theme.homePage.header}px; + top: ${props.theme.homePage.header + (props.isBannerVisible ? 40 : 0)}px; `} background: inherit; padding: var(--ads-v2-spaces-3); @@ -202,6 +205,8 @@ const CreateNewAppsOption = ({ FEATURE_FLAG.ab_start_with_data_default_enabled, ); + const isBannerVisible = useSelector(shouldShowLicenseBanner); + const dispatch = useDispatch(); const onClickStartFromTemplate = () => { AnalyticsUtil.logEvent("CREATE_APP_FROM_TEMPLATE"); @@ -496,8 +501,8 @@ const CreateNewAppsOption = ({ }; return ( - -