qyg2297248353/svgl
1
0
Fork 0
mirror of https://github.com/pheralb/svgl.git synced 2025-12-29 08:01:36 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

⚙️ Update all svgs properties + update `size` type

Browse Source
This commit is contained in:
pheralb
2025-02-26 18:10:28 +00:00
parent 7ca846aade
commit 08b029abee
10 changed files with 73 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/icons/angularIcon.svelte
+13 -16
View File
@@ -1,13 +1,13 @@
<script lang="ts">
import type { IconProps } from '@/types/icon';
export let iconProps: IconProps;
export let iconSize: IconProps['size'];
</script>
<svg
xmlns="http://www.w3.org/2000/svg"
width={iconProps.size || 16}
height={iconProps.size || 16}
width={iconSize || 16}
height={iconSize || 16}
viewBox="0 0 242 256"
><g clip-path="url(#a)"
><mask
@@ -27,25 +27,22 @@
d="m241 43-9 136L149 0l92 43Zm-58 176-62 36-63-36 12-31h101l12 31ZM121 68l32 80H88l33-80ZM9 179 0 43 92 0 9 179Z"
/></g
></g
><defs>
<linearGradient id="c" x1="53.2" x2="245" y1="231.9" y2="140.7" gradientUnits="userSpaceOnUse"
><stop stop-color={iconProps.color || '#E40035'} /><stop
offset=".2"
stop-color={iconProps.color || '#F60A48'}
/><stop offset=".4" stop-color={iconProps.color || '#F20755'} /><stop
offset=".5"
stop-color={iconProps.color || '#DC087D'}
/><stop offset=".7" stop-color={iconProps.color || '#9717E7'} /><stop
><defs
><linearGradient id="c" x1="53.2" x2="245" y1="231.9" y2="140.7" gradientUnits="userSpaceOnUse"
><stop stop-color="#E40035" /><stop offset=".2" stop-color="#F60A48" /><stop
offset=".4"
stop-color="#F20755"
/><stop offset=".5" stop-color="#DC087D" /><stop offset=".7" stop-color="#9717E7" /><stop
offset="1"
stop-color={iconProps.color || '#6C00F5'}
stop-color="#6C00F5"
/></linearGradient
>
<linearGradient id="d" x1="44.5" x2="170" y1="30.7" y2="174" gradientUnits="userSpaceOnUse">
<stop stop-color={iconProps.color || '#FF31D9'} /><stop
<stop stop-color="#FF31D9" /><stop
offset="1"
stop-color={iconProps.color || '#FF5BE1'}
stop-color="#FF5BE1"
stop-opacity="0"
/></linearGradient
><clipPath id="a"><path fill={iconProps.color || '#fff'} d="M0 0h242v256H0z" /></clipPath></defs
><clipPath id="a"><path fill="#fff" d="M0 0h242v256H0z" /></clipPath></defs
></svg
>
src/components/icons/githubIcon.svelte
+4 -4
View File
@@ -1,18 +1,18 @@
<script lang="ts">
import type { IconProps } from '@/types/icon';
export let iconProps: IconProps;
export let iconSize: IconProps['size'];
</script>
<svg
width={iconProps.size || 16}
height={iconProps.size || 16}
width={iconSize || 16}
height={iconSize || 16}
fill="none"
xmlns="http://www.w3.org/2000/svg"
preserveAspectRatio="xMidYMid"
viewBox="0 0 256 256"
><path
d="M128.001 0C57.317 0 0 57.307 0 128.001c0 56.554 36.676 104.535 87.535 121.46 6.397 1.185 8.746-2.777 8.746-6.158 0-3.052-.12-13.135-.174-23.83-35.61 7.742-43.124-15.103-43.124-15.103-5.823-14.795-14.213-18.73-14.213-18.73-11.613-7.944.876-7.78.876-7.78 12.853.902 19.621 13.19 19.621 13.19 11.417 19.568 29.945 13.911 37.249 10.64 1.149-8.272 4.466-13.92 8.127-17.116-28.431-3.236-58.318-14.212-58.318-63.258 0-13.975 5-25.394 13.188-34.358-1.329-3.224-5.71-16.242 1.24-33.874 0 0 10.749-3.44 35.21 13.121 10.21-2.836 21.16-4.258 32.038-4.307 10.878.049 21.837 1.47 32.066 4.307 24.431-16.56 35.165-13.12 35.165-13.12 6.967 17.63 2.584 30.65 1.255 33.873 8.207 8.964 13.173 20.383 13.173 34.358 0 49.163-29.944 59.988-58.447 63.157 4.591 3.972 8.682 11.762 8.682 23.704 0 17.126-.148 30.91-.148 35.126 0 3.407 2.304 7.398 8.792 6.14C219.37 232.5 256 184.537 256 128.002 256 57.307 198.691 0 128.001 0Zm-80.06 182.34c-.282.636-1.283.827-2.194.39-.929-.417-1.45-1.284-1.15-1.922.276-.655 1.279-.838 2.205-.399.93.418 1.46 1.293 1.139 1.931Zm6.296 5.618c-.61.566-1.804.303-2.614-.591-.837-.892-.994-2.086-.375-2.66.63-.566 1.787-.301 2.626.591.838.903 1 2.088.363 2.66Zm4.32 7.188c-.785.545-2.067.034-2.86-1.104-.784-1.138-.784-2.503.017-3.05.795-.547 2.058-.055 2.861 1.075.782 1.157.782 2.522-.019 3.08Zm7.304 8.325c-.701.774-2.196.566-3.29-.49-1.119-1.032-1.43-2.496-.726-3.27.71-.776 2.213-.558 3.315.49 1.11 1.03 1.45 2.505.701 3.27Zm9.442 2.81c-.31 1.003-1.75 1.459-3.199 1.033-1.448-.439-2.395-1.613-2.103-2.626.301-1.01 1.747-1.484 3.207-1.028 1.446.436 2.396 1.602 2.095 2.622Zm10.744 1.193c.036 1.055-1.193 1.93-2.715 1.95-1.53.034-2.769-.82-2.786-1.86 0-1.065 1.202-1.932 2.733-1.958 1.522-.03 2.768.818 2.768 1.868Zm10.555-.405c.182 1.03-.875 2.088-2.387 2.37-1.485.271-2.861-.365-3.05-1.386-.184-1.056.893-2.114 2.376-2.387 1.514-.263 2.868.356 3.061 1.403Z"
fill={iconProps.color || 'currentColor'}
fill="currentColor"
/>
</svg>
src/components/icons/logo.svelte
+1 -7
View File
@@ -1,11 +1,5 @@
<script lang="ts">
import type { IconProps } from '@/types/icon';
export let iconProps: IconProps;
</script>
<svg
width={iconProps.size}
width="30"
name="SVGL Logo"
viewBox="0 0 512 512"
fill="none"
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

src/components/icons/raycastIcon.svelte
+6 -5
View File
@@ -1,13 +1,14 @@
<script lang="ts">
import type { IconProps } from '@/types/icon';
export let iconProps: IconProps;
export let iconSize: IconProps['size'];
export let className: IconProps['className'];
</script>
<svg
width={iconProps.size || 28}
height={iconProps.size || 28}
class={iconProps.className}
width={iconSize || 28}
height={iconSize || 28}
class={className}
viewBox="0 0 28 28"
fill="none"
xmlns="http://www.w3.org/2000/svg"
@@ -16,6 +17,6 @@
fill-rule="evenodd"
clip-rule="evenodd"
d="M7 18.079V21L0 14L1.46 12.54L7 18.081V18.079ZM9.921 21H7L14 28L15.46 26.54L9.921 21ZM26.535 15.462L27.996 14L13.996 0L12.538 1.466L18.077 7.004H14.73L10.864 3.146L9.404 4.606L11.809 7.01H10.129V17.876H20.994V16.196L23.399 18.6L24.859 17.14L20.994 13.274V9.927L26.535 15.462ZM7.73 6.276L6.265 7.738L7.833 9.304L9.294 7.844L7.73 6.276ZM20.162 18.708L18.702 20.17L20.268 21.738L21.73 20.276L20.162 18.708ZM4.596 9.41L3.134 10.872L7 14.738V11.815L4.596 9.41ZM16.192 21.006H13.268L17.134 24.872L18.596 23.41L16.192 21.006Z"
fill={iconProps.color || '#FF6363'}
fill="#FF6363"
/>
</svg>
src/components/icons/reactIcon.svelte
+19 -9
View File
File diff suppressed because one or more lines are too long
src/components/icons/svelteIcon.svelte
+5 -5
View File
@@ -1,19 +1,19 @@
<script lang="ts">
import type { IconProps } from '@/types/icon';
export let iconProps: IconProps;
export let iconSize: IconProps['size'];
</script>
<svg
xmlns="http://www.w3.org/2000/svg"
width={iconProps.size || 16}
height={iconProps.size || 16}
width={iconSize || 16}
height={iconSize || 16}
viewBox="0 0 256 308"
><path
fill={iconProps.color || '#FF3E00'}
fill="#FF3E00"
d="M239.682 40.707C211.113-.182 154.69-12.301 113.895 13.69L42.247 59.356a82.2 82.2 0 0 0-37.135 55.056a86.57 86.57 0 0 0 8.536 55.576a82.4 82.4 0 0 0-12.296 30.719a87.6 87.6 0 0 0 14.964 66.244c28.574 40.893 84.997 53.007 125.787 27.016l71.648-45.664a82.18 82.18 0 0 0 37.135-55.057a86.6 86.6 0 0 0-8.53-55.577a82.4 82.4 0 0 0 12.29-30.718a87.57 87.57 0 0 0-14.963-66.244"
/><path
fill={iconProps.color || '#FFF'}
fill="#FFF"
d="M106.889 270.841c-23.102 6.007-47.497-3.036-61.103-22.648a52.7 52.7 0 0 1-9.003-39.85a50 50 0 0 1 1.713-6.693l1.35-4.115l3.671 2.697a92.5 92.5 0 0 0 28.036 14.007l2.663.808l-.245 2.659a16.07 16.07 0 0 0 2.89 10.656a17.14 17.14 0 0 0 18.397 6.828a15.8 15.8 0 0 0 4.403-1.935l71.67-45.672a14.92 14.92 0 0 0 6.734-9.977a15.92 15.92 0 0 0-2.713-12.011a17.16 17.16 0 0 0-18.404-6.832a15.8 15.8 0 0 0-4.396 1.933l-27.35 17.434a52.3 52.3 0 0 1-14.553 6.391c-23.101 6.007-47.497-3.036-61.101-22.649a52.68 52.68 0 0 1-9.004-39.849a49.43 49.43 0 0 1 22.34-33.114l71.664-45.677a52.2 52.2 0 0 1 14.563-6.398c23.101-6.007 47.497 3.036 61.101 22.648a52.7 52.7 0 0 1 9.004 39.85a51 51 0 0 1-1.713 6.692l-1.35 4.116l-3.67-2.693a92.4 92.4 0 0 0-28.037-14.013l-2.664-.809l.246-2.658a16.1 16.1 0 0 0-2.89-10.656a17.14 17.14 0 0 0-18.398-6.828a15.8 15.8 0 0 0-4.402 1.935l-71.67 45.674a14.9 14.9 0 0 0-6.73 9.975a15.9 15.9 0 0 0 2.709 12.012a17.16 17.16 0 0 0 18.404 6.832a15.8 15.8 0 0 0 4.402-1.935l27.345-17.427a52.2 52.2 0 0 1 14.552-6.397c23.101-6.006 47.497 3.037 61.102 22.65a52.68 52.68 0 0 1 9.003 39.848a49.45 49.45 0 0 1-22.34 33.12l-71.664 45.673a52.2 52.2 0 0 1-14.563 6.398"
/></svg
>
src/components/icons/vueIcon.svelte
+7 -13
View File
@@ -1,22 +1,16 @@
<script lang="ts">
import type { IconProps } from '@/types/icon';
export let iconProps: IconProps;
export let iconSize: IconProps['size'];
</script>
<svg
xmlns="http://www.w3.org/2000/svg"
width={iconProps.size || 16}
height={iconProps.size || 16}
width={iconSize || 16}
height={iconSize || 16}
viewBox="0 0 256 221"
><path
fill={iconProps.color || '#41B883'}
d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0z"
/><path
fill={iconProps.color || '#41B883'}
><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0z" /><path
fill="#41B883"
d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0z"
/><path
fill={iconProps.color || '#35495E'}
d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0z"
/>
</svg>
/><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0z" /></svg
>
src/components/icons/webComponentIcon.svelte
+12 -52
View File
@@ -1,58 +1,18 @@
<script lang="ts">
import type { IconProps } from '@/types/icon';
export let iconProps: IconProps;
export let iconSize: IconProps['size'];
</script>
<svg
xmlns="http://www.w3.org/2000/svg"
width={iconProps.size}
height={iconProps.size}
viewBox="0 0 200 161"
>
<defs
><linearGradient
id="a"
x1="48.9"
x2="127.1"
y1="40"
y2="40"
gradientTransform="scale(1.25056 .79964)"
gradientUnits="userSpaceOnUse"
><stop offset="0" stop-color={iconProps.color || '#2a3b8f'} /><stop
offset="1"
stop-color={iconProps.color || '#29abe2'}
/></linearGradient
><linearGradient
id="b"
x1="126.9"
x2="48.7"
y1="124.8"
y2="124.8"
gradientTransform="scale(1.2532 .79796)"
gradientUnits="userSpaceOnUse"
><stop offset="0" stop-color={iconProps.color || '#b4d44e'} /><stop
offset="1"
stop-color={iconProps.color || '#e7f716'}
/></linearGradient
></defs
><g fill="none" fill-rule="evenodd" stroke-width=".3"
><path fill={iconProps.color || '#166da5'} d="m197 80.2-21.4 36-30-36.5 30-35.6z" /><path
fill={iconProps.color || '#8fdb69'}
d="m173.3 122.4-32.6-39L121 116l30.4 44.4z"
/><path fill={iconProps.color || '#166da5'} d="m172.9 37.8-32.2 39L121 44.2l30.5-44z" /><path
fill="url(#a)"
d="M61.1 31.4H141L123.4.7H78.7zm53.7 31.9H159l-15.9-26.8H98.8"
opacity=".9"
transform="translate(-.5 -.9) scale(1.22972)"
/><path
fill="url(#b)"
d="M141.3 100.3H61l17.6 30.5h45zm-26.5-31.9H159l-15.9 26.8H98.8"
opacity=".9"
transform="translate(-.5 -.9) scale(1.22972)"
/><path
fill={iconProps.color || '#010101'}
d="M96.2 160 49.9 80 96.8.2H46L0 80.1 46.1 160z"
/></g
>
<svg viewBox="0 0 128 128" width={iconSize || 16} height={iconSize || 16}>
<path
fill="var(--bgcolor, #fff)"
d="m31 12-1 1L2 63l29 51h67l15-26v-2l14-23-15-24v-2L98 12H31zm21 30h21l13 21-13 21H52L40 63z"
/>
<path fill="#166da5" d="m122 63-12 21-18-21 18-21z" />
<path fill="#8fdb69" d="M108 88 89 65 78 84l17 26z" />
<path fill="#166da5" d="M108 38 89 61 78 42l17-26z" />
<path d="M63 110 35 63l28-47H33L6 63l27 47z" />
<path fill="#287bbe" d="m50 38 13-22h32l13 22zm28 4h32l11 19H89z" />
<path fill="#ddf021" d="m50 88 13 22h32l13-22zm28-4h32l11-19H89z" />
</svg>
src/components/icons/xIcon.svelte
+5 -4
View File
@@ -1,18 +1,19 @@
<script lang="ts">
import type { IconProps } from '@/types/icon';
export let iconProps: IconProps;
export let size: IconProps['size'];
export let color: IconProps['color'];
</script>
<svg
xmlns="http://www.w3.org/2000/svg"
width={iconProps.size || 16}
height={iconProps.size || 16}
width={size || 16}
height={size || 16}
name="Twitter"
fill="none"
viewBox="0 0 1200 1227"
><path
fill={iconProps.color || 'currentColor'}
fill={color || 'currentColor'}
d="M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z"
/>
</svg>