mirror of
https://github.com/chinchang/web-maker.git
synced 2025-07-10 16:46:28 +02:00
fix action btns in list
This commit is contained in:
@ -254,30 +254,28 @@ const Assets = () => {
|
|||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
{/* <a href={file.url} target="_blank" rel="noopener noreferrer"> */}
|
{/* <a href={file.url} target="_blank" rel="noopener noreferrer"> */}
|
||||||
<div class="d-f relative">
|
<img src={file.url} />{' '}
|
||||||
<img src={file.url} />{' '}
|
<div class="asset-manager__file-actions">
|
||||||
<div class="asset-manager__file-actions">
|
<Stack gap={1} fullWidth justify="center">
|
||||||
<Stack gap={1} fullWidth justify="center">
|
<button
|
||||||
<button
|
class={`btn btn--dark ${
|
||||||
class={`btn btn--dark ${
|
listType === 'list' ? 'btn--active' : ''
|
||||||
listType === 'list' ? 'btn--active' : ''
|
} hint--rounded hint--top-left`}
|
||||||
} hint--rounded hint--top-left`}
|
onClick={() => copyFileUrl(file.url)}
|
||||||
onClick={() => copyFileUrl(file.url)}
|
aria-label="Copy URL"
|
||||||
aria-label="Copy URL"
|
>
|
||||||
>
|
<Icon name="copy" />
|
||||||
<Icon name="copy" />
|
</button>
|
||||||
</button>
|
<button
|
||||||
<button
|
class={`btn btn--dark ${
|
||||||
class={`btn btn--dark ${
|
listType === 'list' ? 'btn--active' : ''
|
||||||
listType === 'list' ? 'btn--active' : ''
|
} hint--rounded hint--top-left`}
|
||||||
} hint--rounded hint--top-left`}
|
onClick={() => removeFileHandler(index)}
|
||||||
onClick={() => removeFileHandler(index)}
|
aria-label="Delete"
|
||||||
aria-label="Delete"
|
>
|
||||||
>
|
<Icon name="trash" />
|
||||||
<Icon name="trash" />
|
</button>
|
||||||
</button>
|
</Stack>
|
||||||
</Stack>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<span class="asset-manager__file-name">{file.name}</span>
|
<span class="asset-manager__file-name">{file.name}</span>
|
||||||
{/* </a> */}
|
{/* </a> */}
|
||||||
|
@ -2125,6 +2125,7 @@ while the theme CSS file is loading */
|
|||||||
.asset-manager__file {
|
.asset-manager__file {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 0.5rem;
|
gap: 0.5rem;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
.asset-manager__file-name {
|
.asset-manager__file-name {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
@ -2145,7 +2146,6 @@ while the theme CSS file is loading */
|
|||||||
.asset-manager__file-actions {
|
.asset-manager__file-actions {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
|
||||||
right: 0;
|
right: 0;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
padding: 0.5rem 0;
|
padding: 0.5rem 0;
|
||||||
@ -2155,6 +2155,10 @@ while the theme CSS file is loading */
|
|||||||
background-color: rgb(255 255 255 / 15%);
|
background-color: rgb(255 255 255 / 15%);
|
||||||
backdrop-filter: blur(5px);
|
backdrop-filter: blur(5px);
|
||||||
}
|
}
|
||||||
|
.asset-manager__file--grid .asset-manager__file-actions {
|
||||||
|
left: 0;
|
||||||
|
bottom: 1.5em;
|
||||||
|
}
|
||||||
.asset-manager__file:hover .asset-manager__file-actions {
|
.asset-manager__file:hover .asset-manager__file-actions {
|
||||||
transform: translateY(0rem);
|
transform: translateY(0rem);
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
|
Reference in New Issue
Block a user