133 lines
9.4 KiB
Vue
133 lines
9.4 KiB
Vue
<script setup lang="ts">
|
|
defineProps<{
|
|
size?: string | number;
|
|
color?: boolean;
|
|
avatar?: boolean;
|
|
}>();
|
|
|
|
const TITLE = 'Gemma';
|
|
|
|
const BACKGROUND_COLOR = "linear-gradient(45deg, #007FF8, #0668E1, #007FF8)";
|
|
const AVATAR_SCALE = 0.75;
|
|
|
|
const [a, b, c, d, e, f, g, h, i, j, k, l, m] = useFillIds(TITLE, 13);
|
|
</script>
|
|
|
|
<template>
|
|
<div class="inline-flex items-center justify-center"
|
|
:style="[`width: ${size}px; height: ${size}px;`, avatar ? `background: ${BACKGROUND_COLOR}; border-radius: 0.375rem;` : '']">
|
|
<svg v-if="color && !avatar"
|
|
:style="[`width: ${size}px; height: ${size}px; flex: none; line-height: 1;`, avatar ? `transform: scale(${AVATAR_SCALE});` : '']"
|
|
viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
<title>{{ TITLE }}</title>
|
|
<path
|
|
d="M6.897 4h-.024l-.031 2.615h.022c1.715 0 3.046 1.357 5.94 6.246l.175.297.012.02 1.62-2.438-.012-.019a48.763 48.763 0 00-1.098-1.716 28.01 28.01 0 00-1.175-1.629C10.413 4.932 8.812 4 6.896 4z"
|
|
:fill="a!.fill" />
|
|
<path
|
|
d="M6.873 4C4.95 4.01 3.247 5.258 2.02 7.17a4.352 4.352 0 00-.01.017l2.254 1.231.011-.017c.718-1.083 1.61-1.774 2.568-1.785h.021L6.896 4h-.023z"
|
|
:fill="b!.fill" />
|
|
<path
|
|
d="M2.019 7.17l-.011.017C1.2 8.447.598 9.995.274 11.664l-.005.022 2.534.6.004-.022c.27-1.467.786-2.828 1.456-3.845l.011-.017L2.02 7.17z"
|
|
:fill="c!.fill" />
|
|
<path
|
|
d="M2.807 12.264l-2.533-.6-.005.022c-.177.918-.267 1.851-.269 2.786v.023l2.598.233v-.023a12.591 12.591 0 01.21-2.44z"
|
|
:fill="d!.fill" />
|
|
<path
|
|
d="M2.677 15.537a5.462 5.462 0 01-.079-.813v-.022L0 14.468v.024a8.89 8.89 0 00.146 1.652l2.535-.585a4.106 4.106 0 01-.004-.022z"
|
|
:fill="e!.fill" />
|
|
<path
|
|
d="M3.27 16.89c-.284-.31-.484-.756-.589-1.328l-.004-.021-2.535.585.004.021c.192 1.01.568 1.85 1.106 2.487l.014.017 2.018-1.745a2.106 2.106 0 01-.015-.016z"
|
|
:fill="f!.fill" />
|
|
<path
|
|
d="M10.78 9.654c-1.528 2.35-2.454 3.825-2.454 3.825-2.035 3.2-2.739 3.917-3.871 3.917a1.545 1.545 0 01-1.186-.508l-2.017 1.744.014.017C2.01 19.518 3.058 20 4.356 20c1.963 0 3.374-.928 5.884-5.33l1.766-3.13a41.283 41.283 0 00-1.227-1.886z"
|
|
fill="#0082FB" />
|
|
<path
|
|
d="M13.502 5.946l-.016.016c-.4.43-.786.908-1.16 1.416.378.483.768 1.024 1.175 1.63.48-.743.928-1.345 1.367-1.807l.016-.016-1.382-1.24z"
|
|
:fill="g!.fill" />
|
|
<path
|
|
d="M20.918 5.713C19.853 4.633 18.583 4 17.225 4c-1.432 0-2.637.787-3.723 1.944l-.016.016 1.382 1.24.016-.017c.715-.747 1.408-1.12 2.176-1.12.826 0 1.6.39 2.27 1.075l.015.016 1.589-1.425-.016-.016z"
|
|
fill="#0082FB" />
|
|
<path
|
|
d="M23.998 14.125c-.06-3.467-1.27-6.566-3.064-8.396l-.016-.016-1.588 1.424.015.016c1.35 1.392 2.277 3.98 2.361 6.971v.023h2.292v-.022z"
|
|
:fill="h!.fill" />
|
|
<path
|
|
d="M23.998 14.15v-.023h-2.292v.022c.004.14.006.282.006.424 0 .815-.121 1.474-.368 1.95l-.011.022 1.708 1.782.013-.02c.62-.96.946-2.293.946-3.91 0-.083 0-.165-.002-.247z"
|
|
:fill="i!.fill" />
|
|
<path
|
|
d="M21.344 16.52l-.011.02c-.214.402-.519.67-.917.787l.778 2.462a3.493 3.493 0 00.438-.182 3.558 3.558 0 001.366-1.218l.044-.065.012-.02-1.71-1.784z"
|
|
:fill="j!.fill" />
|
|
<path
|
|
d="M19.92 17.393c-.262 0-.492-.039-.718-.14l-.798 2.522c.449.153.927.222 1.46.222.492 0 .943-.073 1.352-.215l-.78-2.462c-.167.05-.341.075-.517.073z"
|
|
:fill="k!.fill" />
|
|
<path
|
|
d="M18.323 16.534l-.014-.017-1.836 1.914.016.017c.637.682 1.246 1.105 1.937 1.337l.797-2.52c-.291-.125-.573-.353-.9-.731z"
|
|
:fill="l!.fill" />
|
|
<path
|
|
d="M18.309 16.515c-.55-.642-1.232-1.712-2.303-3.44l-1.396-2.336-.011-.02-1.62 2.438.012.02.989 1.668c.959 1.61 1.74 2.774 2.493 3.585l.016.016 1.834-1.914a2.353 2.353 0 01-.014-.017z"
|
|
:fill="m!.fill" />
|
|
<defs>
|
|
<linearGradient id={a.id} x1="75.897%" x2="26.312%" y1="89.199%" y2="12.194%">
|
|
<stop offset=".06%" stopColor="#0867DF" />
|
|
<stop offset="45.39%" stopColor="#0668E1" />
|
|
<stop offset="85.91%" stopColor="#0064E0" />
|
|
</linearGradient>
|
|
<linearGradient :id="b!.id" x1="21.67%" x2="97.068%" y1="75.874%" y2="23.985%">
|
|
<stop offset="13.23%" stopColor="#0064DF" />
|
|
<stop offset="99.88%" stopColor="#0064E0" />
|
|
</linearGradient>
|
|
<linearGradient :id="c!.id" x1="38.263%" x2="60.895%" y1="89.127%" y2="16.131%">
|
|
<stop offset="1.47%" stopColor="#0072EC" />
|
|
<stop offset="68.81%" stopColor="#0064DF" />
|
|
</linearGradient>
|
|
<linearGradient :id="d!.id" x1="47.032%" x2="52.15%" y1="90.19%" y2="15.745%">
|
|
<stop offset="7.31%" stopColor="#007CF6" />
|
|
<stop offset="99.43%" stopColor="#0072EC" />
|
|
</linearGradient>
|
|
<linearGradient :id="e!.id" x1="52.155%" x2="47.591%" y1="58.301%" y2="37.004%">
|
|
<stop offset="7.31%" stopColor="#007FF9" />
|
|
<stop offset="100%" stopColor="#007CF6" />
|
|
</linearGradient>
|
|
<linearGradient :id="f!.id" x1="37.689%" x2="61.961%" y1="12.502%" y2="63.624%">
|
|
<stop offset="7.31%" stopColor="#007FF9" />
|
|
<stop offset="100%" stopColor="#0082FB" />
|
|
</linearGradient>
|
|
<linearGradient :id="g!.id" x1="34.808%" x2="62.313%" y1="68.859%" y2="23.174%">
|
|
<stop offset="27.99%" stopColor="#007FF8" />
|
|
<stop offset="91.41%" stopColor="#0082FB" />
|
|
</linearGradient>
|
|
<linearGradient :id="h!.id" x1="43.762%" x2="57.602%" y1="6.235%" y2="98.514%">
|
|
<stop offset="0%" stopColor="#0082FB" />
|
|
<stop offset="99.95%" stopColor="#0081FA" />
|
|
</linearGradient>
|
|
<linearGradient :id="i!.id" x1="60.055%" x2="39.88%" y1="4.661%" y2="69.077%">
|
|
<stop offset="6.19%" stopColor="#0081FA" />
|
|
<stop offset="100%" stopColor="#0080F9" />
|
|
</linearGradient>
|
|
<linearGradient :id="j!.id" x1="30.282%" x2="61.081%" y1="59.32%" y2="33.244%">
|
|
<stop offset="0%" stopColor="#027AF3" />
|
|
<stop offset="100%" stopColor="#0080F9" />
|
|
</linearGradient>
|
|
<linearGradient :id="k!.id" x1="20.433%" x2="82.112%" y1="50.001%" y2="50.001%">
|
|
<stop offset="0%" stopColor="#0377EF" />
|
|
<stop offset="99.94%" stopColor="#0279F1" />
|
|
</linearGradient>
|
|
<linearGradient :id="l!.id" x1="40.303%" x2="72.394%" y1="35.298%" y2="57.811%">
|
|
<stop offset=".19%" stopColor="#0471E9" />
|
|
<stop offset="100%" stopColor="#0377EF" />
|
|
</linearGradient>
|
|
<linearGradient :id="m!.id" x1="32.254%" x2="68.003%" y1="19.719%" y2="84.908%">
|
|
<stop offset="27.65%" stopColor="#0867DF" />
|
|
<stop offset="100%" stopColor="#0471E9" />
|
|
</linearGradient>
|
|
</defs>
|
|
</svg>
|
|
<svg v-else fill="currentColor" fill-rule="evenodd" :height="size" style="flex: none; line-height: 1;"
|
|
:style="[`width: ${size}px; height: ${size}px; flex: none; line-height: 1;`, avatar ? `transform: scale(${AVATAR_SCALE});` : '']"
|
|
viewBox="0 0 24 24" :width="size" xmlns="http://www.w3.org/2000/svg">
|
|
<title>{{ TITLE }}</title>
|
|
<path
|
|
d="M6.897 4c1.915 0 3.516.932 5.43 3.376l.282-.373c.19-.246.383-.484.58-.71l.313-.35C14.588 4.788 15.792 4 17.225 4c1.273 0 2.469.557 3.491 1.516l.218.213c1.73 1.765 2.917 4.71 3.053 8.026l.011.392.002.25c0 1.501-.28 2.759-.818 3.7l-.14.23-.108.153c-.301.42-.664.758-1.086 1.009l-.265.142-.087.04a3.493 3.493 0 01-.302.118 4.117 4.117 0 01-1.33.208c-.524 0-.996-.067-1.438-.215-.614-.204-1.163-.56-1.726-1.116l-.227-.235c-.753-.812-1.534-1.976-2.493-3.586l-1.43-2.41-.544-.895-1.766 3.13-.343.592C7.597 19.156 6.227 20 4.356 20c-1.21 0-2.205-.42-2.936-1.182l-.168-.184c-.484-.573-.837-1.311-1.043-2.189l-.067-.32a8.69 8.69 0 01-.136-1.288L0 14.468c.002-.745.06-1.49.174-2.23l.1-.573c.298-1.53.828-2.958 1.536-4.157l.209-.34c1.177-1.83 2.789-3.053 4.615-3.16L6.897 4zm-.033 2.615l-.201.01c-.83.083-1.606.673-2.252 1.577l-.138.199-.01.018c-.67 1.017-1.185 2.378-1.456 3.845l-.004.022a12.591 12.591 0 00-.207 2.254l.002.188c.004.18.017.36.04.54l.043.291c.092.503.257.908.486 1.208l.117.137c.303.323.698.492 1.17.492 1.1 0 1.796-.676 3.696-3.641l2.175-3.4.454-.701-.139-.198C9.11 7.3 8.084 6.616 6.864 6.616zm10.196-.552l-.176.007c-.635.048-1.223.359-1.82.933l-.196.198c-.439.462-.887 1.064-1.367 1.807l.266.398c.18.274.362.56.55.858l.293.475 1.396 2.335.695 1.114c.583.926 1.03 1.6 1.408 2.082l.213.262c.282.326.529.54.777.673l.102.05c.227.1.457.138.718.138.176.002.35-.023.518-.073.338-.104.61-.32.813-.637l.095-.163.077-.162c.194-.459.29-1.06.29-1.785l-.006-.449c-.08-2.871-.938-5.372-2.2-6.798l-.176-.189c-.67-.683-1.444-1.074-2.27-1.074z" />
|
|
</svg>
|
|
</div>
|
|
</template>
|