mirror/php-web-maker
1
0
Fork 0
mirror of https://github.com/chinchang/web-maker.git synced 2025-03-22 03:29:42 +01:00
Code Issues Releases Wiki Activity

add Icon component and remove btn

Browse Source
This commit is contained in:
Kushagra Gour 2024-03-13 19:00:21 +05:30
parent cf5d507b85
commit 93b6773361
2 changed files with 25 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/Assets.jsx
View File

@ -7,6 +7,7 @@ import { Trans } from '@lingui/macro';
import { ProBadge } from './ProBadge';
import { LoaderWithText } from './Loader';
import { Text } from './Text';
import { Icon } from './Icons';
const Assets = () => {
const [files, setFiles] = useState([]);
@ -227,10 +228,7 @@ const Assets = () => {
onClick={() => setListType('list')}
aria-label="List view"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<title>view-list</title>
<path d="M9,5V9H21V5M9,19H21V15H9M9,14H21V10H9M4,9H8V5H4M4,19H8V15H4M4,14H8V10H4V14Z" />
</svg>
<Icon name="view-list" />
</button>
<button
class={`btn btn--dark ${
@ -239,9 +237,7 @@ const Assets = () => {
onClick={() => setListType('grid')}
aria-label="Grid view"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M3 11h8V3H3m0 18h8v-8H3m10 8h8v-8h-8m0-10v8h8V3" />
</svg>
<Icon name="view-grid" />
</button>
</Stack>
) : null}
@ -269,12 +265,7 @@ const Assets = () => {
onClick={() => copyFileUrl(file.url)}
aria-label="Copy URL"
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
>
<path d="M19 21H8V7h11m0-2H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2m-3-4H4a2 2 0 0 0-2 2v14h2V3h12V1Z" />
</svg>
<Icon name="copy" />
</button>
<button
class={`btn btn--dark ${
@ -283,13 +274,7 @@ const Assets = () => {
onClick={() => removeFileHandler(index)}
aria-label="Delete"
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
>
<path d="M9 3v1H4v2h1v13a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6h1V4h-5V3H9M7 6h10v13H7V6m2 2v9h2V8H9m4 0v9h2V8h-2Z" />
</svg>
<Icon name="trash" />
</button>
</Stack>
</div>

22
src/components/Icons.jsx
View File

@ -1,5 +1,3 @@
import { h } from 'preact';
export function Icons() {
return (
<svg
@ -109,6 +107,18 @@ export function Icons() {
<symbol id="search" viewBox="0 0 24 24">
<path d="M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z" />
</symbol>
<symbol id="copy" viewBox="0 0 24 24">
<path d="M19 21H8V7h11m0-2H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2m-3-4H4a2 2 0 0 0-2 2v14h2V3h12V1Z" />
</symbol>
<symbol id="trash" viewBox="0 0 24 24">
<path d="M9 3v1H4v2h1v13a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6h1V4h-5V3H9M7 6h10v13H7V6m2 2v9h2V8H9m4 0v9h2V8h-2Z" />
</symbol>
<symbol id="view-grid" viewBox="0 0 24 24">
<path d="M3 11h8V3H3m0 18h8v-8H3m10 8h8v-8h-8m0-10v8h8V3" />
</symbol>
<symbol id="view-list" viewBox="0 0 24 24">
<path d="M9,5V9H21V5M9,19H21V15H9M9,14H21V10H9M4,9H8V5H4M4,19H8V15H4M4,14H8V10H4V14Z" />
</symbol>
<symbol id="loader-icon" viewBox="0 0 44 44">
{/* By Sam Herbert (@sherb), for everyone. More http://goo.gl/7AJzbL */}
<g fill="none" fillRule="evenodd" strokeWidth={10}>
@ -162,3 +172,11 @@ export function Icons() {
</svg>
);
}
export const Icon = ({ name, ...rest }) => {
return (
<svg xmlns="http://www.w3.org/2000/svg" {...rest}>
<use xlinkHref={`#${name}`} />
</svg>
);
};