mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-20 12:23:02 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix: update thumbnails

Browse source
This commit is contained in:
Andrea N. Cardona 2022-05-03 09:43:07 -05:00
commit e3d9d2a54e
4 changed files with 82 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

6
carbon.yml
View file

@ -248,8 +248,7 @@ assets:
type: component
platform: web
framework: svelte
#TODO: add thumbnail
thumbnailPath: ''
thumbnailPath: './thumbnails/image-loader.svg'
demoLinks:
- type: storybook
name: Storybook
@ -443,8 +442,7 @@ assets:
type: component
platform: web
framework: svelte
#TODO: add thumbnail
thumbnailPath: ''
thumbnailPath: './thumbnails/radio-tile.svg'
demoLinks:
- type: storybook
name: Storybook

16
thumbnails/image-loader.svg Normal file
View file

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="320px" height="180px" viewBox="0 0 320 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>image-loader</title>
<defs>
<path d="M14.25,10.5 C13.0073593,10.5 12,9.49264069 12,8.25 C12,7.00735931 13.0073593,6 14.25,6 C15.4926407,6 16.5,7.00735931 16.5,8.25 C16.5,8.8467371 16.2629471,9.41903341 15.8409903,9.84099026 C15.4190334,10.2629471 14.8467371,10.5 14.25,10.5 L14.25,10.5 Z M14.25,7.5 C13.8357864,7.5 13.5,7.83578644 13.5,8.25 C13.5,8.66421356 13.8357864,9 14.25,9 C14.6642136,9 15,8.66421356 15,8.25 C15,7.83578644 14.6642136,7.5 14.25,7.5 Z M19.6125,3 L4.3875,3 C3.62120491,3 3,3.62120491 3,4.3875 L3,19.6125 C3,19.9804879 3.14618262,20.3334039 3.40638934,20.5936107 C3.66659607,20.8538174 4.01951212,21 4.3875,21 L19.6125,21 C19.9804879,21 20.3334039,20.8538174 20.5936107,20.5936107 C20.8538174,20.3334039 21,19.9804879 21,19.6125 L21,4.3875 C21,3.62120491 20.3787951,3 19.6125,3 Z M19.5,4.5 L19.5,15.9975 L16.695,13.1925 C16.4136476,12.9108344 16.0318639,12.75257 15.63375,12.75257 C15.2356361,12.75257 14.8538524,12.9108344 14.5725,13.1925 L13.5,14.2875 L9.375,10.1925 C9.09364761,9.91083444 8.71186387,9.75257002 8.31375,9.75257002 C7.91563613,9.75257002 7.53385239,9.91083444 7.2525,10.1925 L4.5,12.945 L4.5,4.5 L19.5,4.5 Z M4.5,19.5 L4.5,15.06 L8.31,11.25 L8.31,11.25 L12.4125,15.3525 C12.6938524,15.6341656 13.0756361,15.79243 13.47375,15.79243 C13.8718639,15.79243 14.2536476,15.6341656 14.535,15.3525 L15.63,14.25 L15.63,14.25 L19.5,18.12 L19.5,19.5 L4.5,19.5 Z" id="path-1"></path>
</defs>
<g id="image-loader" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<rect id="Rectangle-Copy-29" fill="#BEBEBE" x="60" y="36" width="200" height="109"></rect>
<g id="icon/formatting/image/16-copy" transform="translate(148.000000, 79.000000)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<use id="icon-color" fill="#8E8E93" xlink:href="#path-1"></use>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

35
thumbnails/radio-tile.svg Normal file
View file

@ -0,0 +1,35 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="320px" height="180px" viewBox="0 0 320 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>radio-tile</title>
<defs>
<circle id="path-1" cx="6.5" cy="6.5" r="5.6875"></circle>
<polygon id="path-3" points="5.6875 8.734375 3.65625 6.703125 4.3021875 6.09375 5.6875 7.4546875 8.6978125 4.46875 9.34375 5.110625"></polygon>
</defs>
<g id="radio-tile" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Group-Copy-2" transform="translate(56.000000, 109.000000)" fill="#F3F3F3">
<rect id="Rectangle" x="0" y="0" width="141" height="38"></rect>
<rect id="Rectangle" x="0" y="0" width="208" height="38"></rect>
</g>
<g id="Group" transform="translate(56.000000, 33.000000)" fill="#F3F3F3">
<rect id="Rectangle" x="0" y="0" width="141" height="38"></rect>
<rect id="Rectangle" x="0" y="0" width="208" height="38"></rect>
</g>
<g id="Group-Copy" transform="translate(56.000000, 71.000000)" fill="#F3F3F3">
<rect id="Rectangle" x="0" y="0" width="141" height="38"></rect>
<rect id="Rectangle" stroke="#161616" stroke-width="0.8" x="0" y="0" width="208" height="38"></rect>
</g>
<rect id="Rectangle-Copy-4" fill="#C6C6C6" x="67" y="44" width="72" height="6"></rect>
<rect id="Rectangle-Copy-5" fill="#C6C6C6" x="67" y="82" width="72" height="6"></rect>
<g id="icon/status/checkmark-filled/16" transform="translate(243.000000, 79.000000)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<use id="icon-color" fill="#000000" xlink:href="#path-1"></use>
<mask id="mask-4" fill="white">
<use xlink:href="#path-3"></use>
</mask>
<use id="icon-color" fill="#FFFFFF" xlink:href="#path-3"></use>
</g>
<rect id="Rectangle-Copy-6" fill="#C6C6C6" x="67" y="120" width="72" height="6"></rect>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

36
thumbnails/selectable-tile.svg
View file

@ -2,16 +2,27 @@
<svg width="320px" height="180px" viewBox="0 0 320 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>selectable-tile</title>
<defs>
<circle id="path-1" cx="8" cy="8" r="7"></circle>
<polygon id="path-3" points="7 10.75 4.5 8.25 5.295 7.5 7 9.175 10.705 5.5 11.5 6.29"></polygon>
<circle id="path-1" cx="6.5" cy="6.5" r="5.6875"></circle>
<polygon id="path-3" points="5.6875 8.734375 3.65625 6.703125 4.3021875 6.09375 5.6875 7.4546875 8.6978125 4.46875 9.34375 5.110625"></polygon>
<circle id="path-5" cx="6.5" cy="6.5" r="5.6875"></circle>
<polygon id="path-7" points="5.6875 8.734375 3.65625 6.703125 4.3021875 6.09375 5.6875 7.4546875 8.6978125 4.46875 9.34375 5.110625"></polygon>
</defs>
<g id="selectable-tile" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Group" transform="translate(72.000000, 41.000000)" fill="#F3F3F3">
<rect id="Rectangle" x="0" y="0" width="176" height="98"></rect>
<rect id="Rectangle" stroke="#161616" x="0" y="0" width="176" height="98"></rect>
<g id="Group-Copy-2" transform="translate(56.000000, 109.000000)" fill="#F3F3F3">
<rect id="Rectangle" x="0" y="0" width="141" height="38"></rect>
<rect id="Rectangle" x="0" y="0" width="208" height="38"></rect>
</g>
<rect id="Rectangle-Copy-4" fill="#C6C6C6" x="86" y="55" width="90" height="8"></rect>
<g id="Group" transform="translate(222.000000, 51.000000)">
<g id="Group" transform="translate(56.000000, 33.000000)" fill="#F3F3F3">
<rect id="Rectangle" x="0" y="0" width="141" height="38"></rect>
<rect id="Rectangle" stroke="#161616" stroke-width="0.8" x="0" y="0" width="208" height="38"></rect>
</g>
<g id="Group-Copy" transform="translate(56.000000, 71.000000)" fill="#F3F3F3">
<rect id="Rectangle" x="0" y="0" width="141" height="38"></rect>
<rect id="Rectangle" stroke="#161616" stroke-width="0.8" x="0" y="0" width="208" height="38"></rect>
</g>
<rect id="Rectangle-Copy-4" fill="#C6C6C6" x="67" y="44" width="72" height="6"></rect>
<rect id="Rectangle-Copy-5" fill="#C6C6C6" x="67" y="82" width="72" height="6"></rect>
<g id="icon/status/checkmark-filled/16" transform="translate(243.000000, 41.000000)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
@ -21,5 +32,16 @@
</mask>
<use id="icon-color" fill="#FFFFFF" xlink:href="#path-3"></use>
</g>
<g id="icon/status/checkmark-filled/16" transform="translate(243.000000, 79.000000)">
<mask id="mask-6" fill="white">
<use xlink:href="#path-5"></use>
</mask>
<use id="icon-color" fill="#000000" xlink:href="#path-5"></use>
<mask id="mask-8" fill="white">
<use xlink:href="#path-7"></use>
</mask>
<use id="icon-color" fill="#FFFFFF" xlink:href="#path-7"></use>
</g>
<rect id="Rectangle-Copy-6" fill="#C6C6C6" x="67" y="120" width="72" height="6"></rect>
</g>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

Before After
Before After