heartles/egirlskey
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

chore: add static option to MkLoading

Browse source
This commit is contained in:
Acid Chicken (硫酸鶏) 2023-04-01 16:31:55 +09:00
parent 1521bb088c
commit 0960d61ce2
No known key found for this signature in database
GPG key ID: 3E87B98A3F6BAB99
2 changed files with 8 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
packages/frontend/src/components/global/MkLoading.stories.impl.ts
View file

@ -23,6 +23,7 @@ export const Default = {
}; };
}, },
args: { args: {
static: true,
}, },
parameters: { parameters: {
layout: 'centered', layout: 'centered',

8
packages/frontend/src/components/global/MkLoading.vue
View file

@ -6,7 +6,7 @@
<circle cx="64" cy="64" r="64" style="fill:none;stroke:currentColor;stroke-width:21.33px;"/> <circle cx="64" cy="64" r="64" style="fill:none;stroke:currentColor;stroke-width:21.33px;"/>
</g> </g>
</svg> </svg>
<svg :class="[$style.spinner, $style.fg]" viewBox="0 0 168 168" xmlns="http://www.w3.org/2000/svg"> <svg :class="[$style.spinner, $style.fg, { [$style.static]: static }]" viewBox="0 0 168 168" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1.125,0,0,1.125,12,12)"> <g transform="matrix(1.125,0,0,1.125,12,12)">
<path d="M128,64C128,28.654 99.346,0 64,0C99.346,0 128,28.654 128,64Z" style="fill:none;stroke:currentColor;stroke-width:21.33px;"/> <path d="M128,64C128,28.654 99.346,0 64,0C99.346,0 128,28.654 128,64Z" style="fill:none;stroke:currentColor;stroke-width:21.33px;"/>
</g> </g>
@ -19,11 +19,13 @@
import { } from 'vue'; import { } from 'vue';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
static?: boolean;
inline?: boolean; inline?: boolean;
colored?: boolean; colored?: boolean;
mini?: boolean; mini?: boolean;
em?: boolean; em?: boolean;
}>(), { }>(), {
static: false,
inline: false, inline: false,
colored: true, colored: true,
mini: false, mini: false,
@ -97,5 +99,9 @@ const props = withDefaults(defineProps<{
.fg { .fg {
animation: spinner 0.5s linear infinite; animation: spinner 0.5s linear infinite;
&.static {
animation-play-state: paused;
}
} }
</style> </style>