feat. 다운로드 버튼 컴포넌트 추가
This commit is contained in:
clkim
@@ -16,15 +16,13 @@ withDefaults(defineProps<Props>(), {
|
||||
:width="size"
|
||||
:height="size"
|
||||
viewBox="0 0 20 20"
|
||||
fill="none"
|
||||
:fill="color"
|
||||
>
|
||||
<path
|
||||
d="M8.9585 2.70829L8.9585 10.1935L5.73673 6.97172C5.32993 6.56493 4.67039 6.56493 4.26359 6.97172C3.85679 7.37852 3.85679 8.03807 4.26359 8.44486L9.26359 13.4449C9.45894 13.6402 9.72389 13.75 10.0002 13.75C10.2764 13.75 10.5414 13.6402 10.7367 13.4449L15.7367 8.44486C16.1435 8.03806 16.1435 7.37852 15.7367 6.97172C15.3299 6.56493 14.6704 6.56493 14.2636 6.97172L11.0418 10.1935L11.0418 2.70829C11.0418 2.133 10.5755 1.66663 10.0002 1.66663C9.42487 1.66663 8.9585 2.133 8.9585 2.70829Z"
|
||||
:fill="color"
|
||||
/>
|
||||
<path
|
||||
d="M16.6668 17.5C17.2421 17.5 17.7085 17.0336 17.7085 16.4583L17.7085 14.7916C17.7085 14.2163 17.2421 13.75 16.6668 13.75C16.0915 13.75 15.6252 14.2163 15.6252 14.7916L15.6252 15.4166L4.37516 15.4166L4.37516 14.7916C4.37516 14.2163 3.90879 13.75 3.33349 13.75C2.7582 13.75 2.29183 14.2163 2.29183 14.7916L2.29183 16.4583C2.29183 17.0336 2.7582 17.5 3.33349 17.5L16.6668 17.5Z"
|
||||
:fill="color"
|
||||
/>
|
||||
</svg>
|
||||
</template>
|
||||
|
||||
28
layers/components/atoms/icons/LogoApple.vue
Normal file
28
layers/components/atoms/icons/LogoApple.vue
Normal file
@@ -0,0 +1,28 @@
|
||||
<script setup lang="ts">
|
||||
interface Props {
|
||||
size?: number | string
|
||||
color?: string
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
size: 20,
|
||||
color: '#ffffff',
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
:width="size"
|
||||
:height="size"
|
||||
viewBox="0 0 36 36"
|
||||
:fill="color"
|
||||
>
|
||||
<path
|
||||
d="M22.0265 6.77515C22.9737 5.57867 23.6003 3.90666 23.4254 2.25C22.0702 2.31136 20.4381 3.20105 19.4618 4.39753C18.5874 5.45595 17.8297 7.15864 18.0337 8.78462C19.5346 8.90734 21.0793 7.97163 22.0265 6.77515Z"
|
||||
/>
|
||||
<path
|
||||
d="M24.1784 9.38534L23.8464 9.35745C22.5604 9.25719 21.3837 9.62957 20.3897 10.0069L19.3814 10.3981C18.917 10.5722 18.5149 10.6972 18.1869 10.6972C17.8232 10.6972 17.3973 10.5679 16.9256 10.3916L15.7142 9.92036C14.9662 9.64193 14.1546 9.40031 13.3246 9.42125C10.8217 9.45315 8.526 10.8727 7.23469 13.1216C4.63612 17.6354 6.56512 24.3024 9.09991 27.9708L9.53965 28.5946L9.84388 29.0098L10.1578 29.4174C11.1678 30.689 12.3337 31.7497 13.755 31.703C14.523 31.6702 15.0938 31.4589 15.6575 31.2216L16.1434 31.0155C16.8008 30.7416 17.5202 30.4909 18.5855 30.4909C19.511 30.4909 20.1636 30.6964 20.7491 30.9348L21.4811 31.246C22.0469 31.481 22.6338 31.6749 23.4478 31.6552C25.1351 31.6284 26.305 30.3637 27.3637 28.8914L27.6635 28.466L28.1083 27.8128C28.254 27.5914 28.3903 27.3714 28.5175 27.1552L28.76 26.7285C28.7984 26.6584 28.8359 26.5889 28.8723 26.5201L29.0796 26.1159C29.1123 26.0501 29.144 25.9851 29.1747 25.921L29.3482 25.5483L29.4998 25.2015L29.6302 24.8848L29.7873 24.4749L29.9 24.155L30 23.8398L29.8843 23.7918L29.5934 23.6516L29.2859 23.4809L29.0483 23.3338L28.7907 23.1589C27.6392 22.3393 26.0767 20.7067 26.0464 17.8746C26.0241 15.2734 27.512 13.6173 28.4644 12.8256L28.6993 12.6386C28.736 12.6106 28.7714 12.5843 28.8052 12.5597L29.0641 12.3809L29.2348 12.2763C28.0657 10.5643 26.4786 9.86607 25.2717 9.57188L24.9218 9.49514L24.5996 9.43898L24.3097 9.39975C24.2644 9.39442 24.2206 9.38964 24.1784 9.38534Z"
|
||||
/>
|
||||
</svg>
|
||||
</template>
|
||||
44
layers/components/atoms/icons/LogoGoogle.vue
Normal file
44
layers/components/atoms/icons/LogoGoogle.vue
Normal file
@@ -0,0 +1,44 @@
|
||||
<script setup lang="ts">
|
||||
interface Props {
|
||||
size?: number | string
|
||||
color?: string
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
size: 20,
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
:width="size"
|
||||
:height="size"
|
||||
viewBox="0 0 33 33"
|
||||
fill="none"
|
||||
>
|
||||
<g clip-path="url(#clip0_6093_172)">
|
||||
<path
|
||||
d="M16.2529 15.8401L3.54785 29.1226C3.96035 30.5251 5.28035 31.5976 6.84785 31.5976C7.50785 31.5976 8.08535 31.4326 8.58035 31.1026L22.9354 22.9351L16.2529 15.8401Z"
|
||||
fill="#EA4335"
|
||||
/>
|
||||
<path
|
||||
d="M29.1224 13.53L22.9349 9.98254L16.0049 16.0875L23.0174 22.935L29.2049 19.47C30.2774 18.8925 31.0199 17.7375 31.0199 16.5C30.9374 15.2625 30.1949 14.1075 29.1224 13.53Z"
|
||||
fill="#FBBC04"
|
||||
/>
|
||||
<path
|
||||
d="M3.54734 3.87769C3.46484 4.12519 3.46484 4.45519 3.46484 4.78519V28.2977C3.46484 28.6277 3.46484 28.8752 3.54734 29.2052L16.7473 16.2527L3.54734 3.87769Z"
|
||||
fill="#4285F4"
|
||||
/>
|
||||
<path
|
||||
d="M16.3354 16.5001L22.9354 9.98259L8.66285 1.89759C8.16785 1.56759 7.50785 1.40259 6.84785 1.40259C5.28035 1.40259 3.87785 2.47509 3.54785 3.87759L16.3354 16.5001Z"
|
||||
fill="#34A853"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_6093_172">
|
||||
<rect width="33" height="33" fill="white" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
</template>
|
||||
27
layers/components/atoms/icons/LogoStove.vue
Normal file
27
layers/components/atoms/icons/LogoStove.vue
Normal file
@@ -0,0 +1,27 @@
|
||||
<script setup lang="ts">
|
||||
interface Props {
|
||||
size?: number | string
|
||||
color?: string
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
size: 20,
|
||||
color: '#ffffff',
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
:width="size"
|
||||
:height="size"
|
||||
viewBox="0 0 17 17"
|
||||
:fill="color"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M16.6667 8.33333C16.6667 12.9357 12.9357 16.6667 8.33333 16.6667C3.73096 16.6667 0 12.9357 0 8.33333C0 3.73096 3.73096 0 8.33333 0C12.9357 0 16.6667 3.73096 16.6667 8.33333ZM7.55393 6.8783L7.55605 6.88009C7.76948 7.06425 8.19603 7.17448 8.69379 7.30311C9.90868 7.61706 11.5478 8.04063 11.5478 9.91641C11.5478 11.6738 10.068 12.5 8.23015 12.5C6.95157 12.5 5.1192 11.9879 5.1192 10.8707C5.1192 10.3587 5.44311 9.91705 5.96823 9.91705C6.16268 9.91705 6.3884 10.01 6.66494 10.1239C7.10217 10.3041 7.66644 10.5365 8.43495 10.5365C9.1248 10.5365 9.45091 10.3844 9.45091 10.0677C9.45091 9.91641 9.39384 9.8302 9.30252 9.73706C9.07688 9.51765 8.61746 9.3754 8.0873 9.21125C6.87409 8.8356 5.29047 8.34525 5.29047 6.55315C5.29047 5.07512 6.56347 4.16667 8.37854 4.16667C9.00636 4.16667 10.2852 4.30266 10.7875 4.81477C10.9816 5.0126 11.0772 5.25698 11.0772 5.57122C11.0772 6.06002 10.7504 6.42442 10.2252 6.42442C10.0821 6.42442 9.89365 6.37285 9.66454 6.31013C9.30915 6.21285 8.85583 6.08877 8.32147 6.08877C7.77352 6.08877 7.36154 6.1735 7.36154 6.52575C7.36154 6.59753 7.38041 6.6668 7.43516 6.75034C7.46374 6.794 7.50331 6.83711 7.55393 6.8783Z"
|
||||
/>
|
||||
</svg>
|
||||
</template>
|
||||
26
layers/components/atoms/icons/LogoWindow.vue
Normal file
26
layers/components/atoms/icons/LogoWindow.vue
Normal file
@@ -0,0 +1,26 @@
|
||||
<script setup lang="ts">
|
||||
interface Props {
|
||||
size?: number | string
|
||||
color?: string
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
size: 20,
|
||||
color: '#ffffff',
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
:width="size"
|
||||
:height="size"
|
||||
viewBox="0 0 20 20"
|
||||
:fill="color"
|
||||
>
|
||||
<path d="M9.375 3.6375L17.5 2.5V9.6875H9.375V3.6375Z" />
|
||||
<path d="M8.75 3.725L2.5 4.6V9.6875H8.75V3.725Z" />
|
||||
<path d="M8.75 10.3125H2.5V15.4L8.75 16.275V10.3125Z" />
|
||||
<path d="M9.375 16.3625L17.5 17.5V10.3125H9.375V16.3625Z" />
|
||||
</svg>
|
||||
</template>
|
||||
Reference in New Issue
Block a user