Dwinzo-Beta/Dwinzo_Demo
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: Enhance Asset Management component with drop icon and improved styling

Browse Source
This commit is contained in:
Nalvazhuthi
2025-08-22 18:03:50 +05:30
parent 755177e493
commit 53ade99930
2 changed files with 16 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
app/src/components/layout/sidebarRight/resourceManagement/hrm/assetManagement/AssetManagement.tsx
View File

@@ -61,7 +61,10 @@ const AssetManagement = () => {
<div className="header-wrapper"> <div className="header-wrapper">
{expandedAssetId === asset.id ? {expandedAssetId === asset.id ?
<img className='asset-image' src={asset.image} alt="" /> <>
<div className="drop-icon" onClick={() => setExpandedAssetId(null)}>▾</div>
<img className='asset-image' src={asset.image} alt="" />
</>
: :
<div className="icon"><ForkLiftIcon /></div> <div className="icon"><ForkLiftIcon /></div>
} }
@@ -98,7 +101,7 @@ const AssetManagement = () => {
</div> </div>
</div> </div>
<div className="asset-estimate__view-button" onClick={() => setExpandedAssetId(null)}> <div className="asset-estimate__view-button">
<EyeIcon isClosed={false} /> <EyeIcon isClosed={false} />
<div className="asset-estimate__view-text">View in Scene</div> <div className="asset-estimate__view-text">View in Scene</div>
</div> </div>

12
app/src/styles/layout/resourceManagement.scss
View File

@@ -274,13 +274,14 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 6px; gap: 6px;
position: relative;
.assetManagement-card-wrapper { .assetManagement-card-wrapper {
padding: 16px; padding: 16px;
border: 1px solid #564B69; border: 1px solid #564B69;
border-radius: 20px; border-radius: 20px;
gap: 10px; gap: 10px;
position: relative;
header { header {
@@ -298,6 +299,14 @@
border-radius: 7px; border-radius: 7px;
@include flex-center; @include flex-center;
background: var(--background-color-button); background: var(--background-color-button);
}
.drop-icon {
position: absolute;
top: 15px;
right: 17px;
cursor: pointer;
} }
.asset-image { .asset-image {
@@ -402,6 +411,7 @@
} }
.asset-estimate { .asset-estimate {
margin-top: 5px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 10px; gap: 10px;