feat: edit widgets color

locales/ja-NY.yml

@@ -1252,7 +1252,6 @@ _widgets:
   serverMetric: "サーバーメトリクス"
   aiscript: "AiScriptコンソール"
   aichan: "藍"
-  nyancat: "Nyan Cat"
 
 _cw:
   hide: "隠す"

packages/client/src/widgets/index.ts

@@ -20,7 +20,6 @@ export default function(app: App) {
 	app.component('MkwButton', defineAsyncComponent(() => import('./button.vue')));
 	app.component('MkwAiscript', defineAsyncComponent(() => import('./aiscript.vue')));
 	app.component('MkwAichan', defineAsyncComponent(() => import('./aichan.vue')));
-	app.component('MkwNyancat', defineAsyncComponent(() => import('./nyancat.vue')));
 }
 
 export const widgets = [
@@ -43,5 +42,4 @@ export const widgets = [
 	'button',
 	'aiscript',
 	'aichan',
-	'nyancat',
 ];

packages/client/src/widgets/nyancat.vue

@@ -1,50 +0,0 @@
-<template>
-<MkContainer :naked="widgetProps.transparent" :show-header="false">
-	<img class="kjhasfa" src="https://raw.githubusercontent.com/Gowee/nyancat-svg/main/nyancat.svg">
-</MkContainer>
-</template>
-
-<script lang="ts" setup>
-import { onMounted, onUnmounted, reactive, ref } from 'vue';
-import { GetFormResultType } from '@/scripts/form';
-import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
-
-const name = 'nyancat';
-
-const widgetPropsDef = {
-	transparent: {
-		type: 'boolean' as const,
-		default: false,
-	},
-};
-
-type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
-
-// 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
-const props = defineProps<{ widget?: Widget<WidgetProps>; }>();
-const emit = defineEmits<{ (e: 'updateProps', props: WidgetProps); }>();
-
-const { widgetProps, configure } = useWidgetPropsManager(name,
-	widgetPropsDef,
-	props,
-	emit,
-);
-
-
-defineExpose<WidgetComponentExpose>({
-	name,
-	configure,
-	id: props.widget ? props.widget.id : null,
-});
-</script>
-
-<style lang="scss" scoped>
-.kjhasfa {
-	width: 100%;
-	height: auto;
-	border: none;
-	pointer-events: none;
-}
-</style>

packages/client/src/widgets/server-metric/pie.vue

@@ -29,7 +29,7 @@ const props = defineProps<{
 
 const r = 0.45;
 
-const color = $computed(() => `hsl(${180 - (props.value * 180)}, 80%, 70%)`);
+const color = `hsl(248%, 80%, 70%)`;
 const strokeDashoffset = $computed(() => (1 - props.value) * (Math.PI * (r * 2)));
 </script>