cerc-io/snowballtools-base-mirror
16
0
Fork 0
mirror of https://github.com/snowball-tools/snowballtools-base.git synced 2024-12-22 20:47:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

♻️ refactor: remove duplicate component and use absolute for the mobile version

Browse Source
This commit is contained in:
Wahyu Kurniawan 2024-03-08 12:42:42 +07:00
parent de197759de
commit 519618b456
No known key found for this signature in database
GPG Key ID: 040A1549143A8E33
1 changed files with 10 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
packages/frontend/src/components/projects/project/deployments/DeploymentDetailsCard.tsx
View File

@ -60,22 +60,6 @@ const DeploymentDetailsCard = ({
} }
}; };
const renderDeploymentMenu = useCallback(
(className?: string) => {
return (
<DeploymentMenu
className={className}
deployment={deployment}
currentDeployment={currentDeployment}
onUpdate={onUpdate}
project={project}
prodBranchDomains={prodBranchDomains}
/>
);
},
[deployment, currentDeployment, onUpdate, project, prodBranchDomains],
);
const renderDeploymentStatus = useCallback( const renderDeploymentStatus = useCallback(
(className?: string) => { (className?: string) => {
return ( return (
@ -94,9 +78,9 @@ const DeploymentDetailsCard = ({
); );
return ( return (
<div className="flex md:flex-row flex-col gap-6 py-4 px-3 pb-6 mb-2 last:mb-0 last:pb-4 border-b border-border-separator last:border-b-transparent"> <div className="flex md:flex-row flex-col gap-6 py-4 px-3 pb-6 mb-2 last:mb-0 last:pb-4 border-b border-border-separator last:border-b-transparent relative">
<div className="flex-1 flex justify-between w-full md:max-w-[25%] lg:max-w-[28%]"> <div className="flex-1 flex justify-between w-full md:max-w-[25%] lg:max-w-[28%]">
<div className="flex-1 w-full space-y-2 max-w-[80%] sm:max-w-full"> <div className="flex-1 w-full space-y-2 max-w-[90%] sm:max-w-full">
{/* DEPLOYMENT URL */} {/* DEPLOYMENT URL */}
{deployment.url && ( {deployment.url && (
<Heading <Heading
@ -114,8 +98,6 @@ const DeploymentDetailsCard = ({
: 'Preview'} : 'Preview'}
</span> </span>
</div> </div>
{/* MENU ON MOBILE */}
{renderDeploymentMenu('flex md:hidden ml-auto')}
</div> </div>
{/* DEPLOYMENT STATUS */} {/* DEPLOYMENT STATUS */}
@ -167,7 +149,14 @@ const DeploymentDetailsCard = ({
</OverflownText> </OverflownText>
</div> </div>
</div> </div>
{renderDeploymentMenu('ml-auto hidden md:flex')} <DeploymentMenu
className="ml-auto md:static absolute top-4 right-0"
deployment={deployment}
currentDeployment={currentDeployment}
onUpdate={onUpdate}
project={project}
prodBranchDomains={prodBranchDomains}
/>
</div> </div>
</div> </div>
); );