Merge branch 'misskey-dev:develop' into feat/client-dev-mode
This commit is contained in:
commit
30ff4592cc
53 changed files with 155 additions and 870 deletions
|
@ -9,7 +9,7 @@
|
|||
</I18n>
|
||||
</template>
|
||||
<MkSpacer :margin-min="20" :margin-max="28">
|
||||
<div class="dpvffvvy _gaps_m">
|
||||
<div class="_gaps_m" :class="$style.root">
|
||||
<div class="">
|
||||
<MkTextarea v-model="comment">
|
||||
<template #label>{{ i18n.ts.details }}</template>
|
||||
|
@ -60,8 +60,8 @@ function send() {
|
|||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.dpvffvvy {
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
--root-margin: 16px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<canvas ref="canvasEl" style="width: 100%; height: 100%;"></canvas>
|
||||
<canvas ref="canvasEl" style="width: 100%; height: 100%; pointer-events: none;"></canvas>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
@ -191,7 +191,6 @@ onMounted(() => {
|
|||
const u_focus = gl.getUniformLocation(shaderProgram, 'u_focus');
|
||||
const u_itensity = gl.getUniformLocation(shaderProgram, 'u_itensity');
|
||||
gl.uniform2fv(u_resolution, [canvas.width, canvas.height]);
|
||||
gl.uniform1f(u_time, 1.0);
|
||||
gl.uniform1f(u_spread, 1.0);
|
||||
gl.uniform1f(u_speed, 1.0);
|
||||
gl.uniform1f(u_warp, 1.0);
|
||||
|
|
|
@ -26,6 +26,3 @@ const props = withDefaults(defineProps<{
|
|||
extractor: (item) => item,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<div :class="$style.headerIcon"><slot name="icon"></slot></div>
|
||||
<div :class="$style.headerText">
|
||||
<div :class="$style.headerTextMain">
|
||||
<slot name="label"></slot>
|
||||
<MkCondensedLine :min-scale="2 / 3"><slot name="label"></slot></MkCondensedLine>
|
||||
</div>
|
||||
<div :class="$style.headerTextSub">
|
||||
<slot name="caption"></slot>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="zhyxdalp">
|
||||
<div>
|
||||
<XValue :value="value" :collapsed="false"/>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -12,9 +12,3 @@ const props = defineProps<{
|
|||
value: Record<string, unknown>;
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.zhyxdalp {
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -124,7 +124,3 @@ onMounted(async () => {
|
|||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="vswabwbm" :style="{ zIndex, top: `${y - 64}px`, left: `${x - 64}px` }">
|
||||
<div :class="$style.root" :style="{ zIndex, top: `${y - 64}px`, left: `${x - 64}px` }">
|
||||
<svg width="128" height="128" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle fill="none" cx="64" cy="64">
|
||||
<circle fill="none" cx="64" cy="64" style="stroke: var(--accent);">
|
||||
<animate
|
||||
attributeName="r"
|
||||
begin="0s" dur="0.5s"
|
||||
|
@ -22,7 +22,7 @@
|
|||
/>
|
||||
</circle>
|
||||
<g fill="none" fill-rule="evenodd">
|
||||
<circle v-for="(particle, i) in particles" :key="i" :fill="particle.color">
|
||||
<circle v-for="(particle, i) in particles" :key="i" :fill="particle.color" style="stroke: var(--accent);">
|
||||
<animate
|
||||
attributeName="r"
|
||||
begin="0s" dur="0.8s"
|
||||
|
@ -100,17 +100,11 @@ onMounted(() => {
|
|||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.vswabwbm {
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
pointer-events: none;
|
||||
position: fixed;
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
|
||||
> svg {
|
||||
> circle {
|
||||
stroke: var(--accent);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<form class="eppvobhk" :class="{ signing, totpLogin }" @submit.prevent="onSubmit">
|
||||
<div class="auth _gaps_m">
|
||||
<div v-show="withAvatar" class="avatar" :style="{ backgroundImage: user ? `url('${ user.avatarUrl }')` : null, marginBottom: message ? '1.5em' : null }"></div>
|
||||
<form :class="{ signing, totpLogin }" @submit.prevent="onSubmit">
|
||||
<div class="_gaps_m">
|
||||
<div v-show="withAvatar" :class="$style.avatar" :style="{ backgroundImage: user ? `url('${ user.avatarUrl }')` : null, marginBottom: message ? '1.5em' : null }"></div>
|
||||
<MkInfo v-if="message">
|
||||
{{ message }}
|
||||
</MkInfo>
|
||||
|
@ -236,10 +236,8 @@ function resetPassword() {
|
|||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.eppvobhk {
|
||||
> .auth {
|
||||
> .avatar {
|
||||
<style lang="scss" module>
|
||||
.avatar {
|
||||
margin: 0 auto 0 auto;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
|
@ -248,6 +246,4 @@ function resetPassword() {
|
|||
background-size: cover;
|
||||
border-radius: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="fgmtyycl" :style="{ zIndex, top: top + 'px', left: left + 'px' }">
|
||||
<div :class="$style.root" :style="{ zIndex, top: top + 'px', left: left + 'px' }">
|
||||
<Transition :name="defaultStore.state.animation ? '_transition_zoom' : ''" @after-leave="emit('closed')">
|
||||
<MkUrlPreview v-if="showing" class="_popup _shadow" :url="url"/>
|
||||
</Transition>
|
||||
|
@ -36,8 +36,8 @@ onMounted(() => {
|
|||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.fgmtyycl {
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
position: absolute;
|
||||
width: 500px;
|
||||
max-width: calc(90vw - 12px);
|
||||
|
|
|
@ -4,6 +4,7 @@
|
|||
|
||||
<MkFolder>
|
||||
<template #label>{{ i18n.ts.makeFollowManuallyApprove }}</template>
|
||||
<template #icon><i class="ti ti-lock"></i></template>
|
||||
<template #suffix>{{ isLocked ? i18n.ts.on : i18n.ts.off }}</template>
|
||||
|
||||
<MkSwitch v-model="isLocked">{{ i18n.ts.makeFollowManuallyApprove }}<template #caption>{{ i18n.ts.lockedAccountInfo }}</template></MkSwitch>
|
||||
|
@ -11,6 +12,7 @@
|
|||
|
||||
<MkFolder>
|
||||
<template #label>{{ i18n.ts.hideOnlineStatus }}</template>
|
||||
<template #icon><i class="ti ti-eye-off"></i></template>
|
||||
<template #suffix>{{ hideOnlineStatus ? i18n.ts.on : i18n.ts.off }}</template>
|
||||
|
||||
<MkSwitch v-model="hideOnlineStatus">{{ i18n.ts.hideOnlineStatus }}<template #caption>{{ i18n.ts.hideOnlineStatusDescription }}</template></MkSwitch>
|
||||
|
@ -18,6 +20,7 @@
|
|||
|
||||
<MkFolder>
|
||||
<template #label>{{ i18n.ts.noCrawle }}</template>
|
||||
<template #icon><i class="ti ti-world-x"></i></template>
|
||||
<template #suffix>{{ noCrawle ? i18n.ts.on : i18n.ts.off }}</template>
|
||||
|
||||
<MkSwitch v-model="noCrawle">{{ i18n.ts.noCrawle }}<template #caption>{{ i18n.ts.noCrawleDescription }}</template></MkSwitch>
|
||||
|
@ -25,6 +28,7 @@
|
|||
|
||||
<MkFolder>
|
||||
<template #label>{{ i18n.ts.preventAiLearning }}</template>
|
||||
<template #icon><i class="ti ti-photo-shield"></i></template>
|
||||
<template #suffix>{{ preventAiLearning ? i18n.ts.on : i18n.ts.off }}</template>
|
||||
|
||||
<MkSwitch v-model="preventAiLearning">{{ i18n.ts.preventAiLearning }}<template #caption>{{ i18n.ts.preventAiLearningDescription }}</template></MkSwitch>
|
||||
|
|
|
@ -37,8 +37,8 @@ import { chooseFileFromPc } from '@/scripts/select-file';
|
|||
import * as os from '@/os';
|
||||
import { $i } from '@/account';
|
||||
|
||||
const name = ref('');
|
||||
const description = ref('');
|
||||
const name = ref($i.name ?? '');
|
||||
const description = ref($i.description ?? '');
|
||||
|
||||
watch(name, () => {
|
||||
os.apiWithDialog('i/update', {
|
||||
|
|
|
@ -7,10 +7,10 @@
|
|||
@close="close(true)"
|
||||
@closed="emit('closed')"
|
||||
>
|
||||
<template v-if="page === 1" #header>{{ i18n.ts._initialAccountSetting.profileSetting }}</template>
|
||||
<template v-else-if="page === 2" #header>{{ i18n.ts._initialAccountSetting.privacySetting }}</template>
|
||||
<template v-else-if="page === 3" #header>{{ i18n.ts.follow }}</template>
|
||||
<template v-else-if="page === 4" #header>{{ i18n.ts.pushNotification }}</template>
|
||||
<template v-if="page === 1" #header><i class="ti ti-user-edit"></i> {{ i18n.ts._initialAccountSetting.profileSetting }}</template>
|
||||
<template v-else-if="page === 2" #header><i class="ti ti-lock"></i> {{ i18n.ts._initialAccountSetting.privacySetting }}</template>
|
||||
<template v-else-if="page === 3" #header><i class="ti ti-user-plus"></i> {{ i18n.ts.follow }}</template>
|
||||
<template v-else-if="page === 4" #header><i class="ti ti-bell-plus"></i> {{ i18n.ts.pushNotification }}</template>
|
||||
<template v-else-if="page === 5" #header>{{ i18n.ts.done }}</template>
|
||||
<template v-else #header>{{ i18n.ts.initialAccountSetting }}</template>
|
||||
|
||||
|
@ -42,7 +42,9 @@
|
|||
<div style="height: 100cqh; overflow: auto;">
|
||||
<MkSpacer :margin-min="20" :margin-max="28">
|
||||
<XProfile/>
|
||||
<MkButton primary rounded gradate style="margin: 16px auto 0 auto;" data-cy-user-setup-continue @click="page++">{{ i18n.ts.continue }} <i class="ti ti-arrow-right"></i></MkButton>
|
||||
<div class="_buttonsCenter" style="margin-top: 16px;">
|
||||
<MkButton primary rounded gradate data-cy-user-setup-continue @click="page++">{{ i18n.ts.continue }} <i class="ti ti-arrow-right"></i></MkButton>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -50,7 +52,9 @@
|
|||
<div style="height: 100cqh; overflow: auto;">
|
||||
<MkSpacer :margin-min="20" :margin-max="28">
|
||||
<XPrivacy/>
|
||||
<MkButton primary rounded gradate style="margin: 16px auto 0 auto;" data-cy-user-setup-continue @click="page++">{{ i18n.ts.continue }} <i class="ti ti-arrow-right"></i></MkButton>
|
||||
<div class="_buttonsCenter" style="margin-top: 16px;">
|
||||
<MkButton primary rounded gradate data-cy-user-setup-continue @click="page++">{{ i18n.ts.continue }} <i class="ti ti-arrow-right"></i></MkButton>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -7,24 +7,13 @@ import { defineComponent, PropType } from 'vue';
|
|||
import XText from './page.text.vue';
|
||||
import XSection from './page.section.vue';
|
||||
import XImage from './page.image.vue';
|
||||
import XButton from './page.button.vue';
|
||||
import XNumberInput from './page.number-input.vue';
|
||||
import XTextInput from './page.text-input.vue';
|
||||
import XTextareaInput from './page.textarea-input.vue';
|
||||
import XSwitch from './page.switch.vue';
|
||||
import XIf from './page.if.vue';
|
||||
import XTextarea from './page.textarea.vue';
|
||||
import XPost from './page.post.vue';
|
||||
import XCounter from './page.counter.vue';
|
||||
import XRadioButton from './page.radio-button.vue';
|
||||
import XCanvas from './page.canvas.vue';
|
||||
import XNote from './page.note.vue';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
import { Block } from '@/scripts/hpml/block';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
XText, XSection, XImage, XButton, XNumberInput, XTextInput, XTextareaInput, XTextarea, XPost, XSwitch, XIf, XCounter, XRadioButton, XCanvas, XNote,
|
||||
XText, XSection, XImage, XNote,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
|
|
|
@ -1,66 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<MkButton class="kudkigyw" :primary="block.primary" @click="click()">{{ hpml.interpolate(block.text) }}</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, PropType, unref } from 'vue';
|
||||
import MkButton from '../MkButton.vue';
|
||||
import * as os from '@/os';
|
||||
import { ButtonBlock } from '@/scripts/hpml/block';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkButton,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<ButtonBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
click() {
|
||||
if (this.block.action === 'dialog') {
|
||||
this.hpml.eval();
|
||||
os.alert({
|
||||
text: this.hpml.interpolate(this.block.content),
|
||||
});
|
||||
} else if (this.block.action === 'resetRandom') {
|
||||
this.hpml.updateRandomSeed(Math.random());
|
||||
this.hpml.eval();
|
||||
} else if (this.block.action === 'pushEvent') {
|
||||
os.api('page-push', {
|
||||
pageId: this.hpml.page.id,
|
||||
event: this.block.event,
|
||||
...(this.block.var ? {
|
||||
var: unref(this.hpml.vars)[this.block.var],
|
||||
} : {}),
|
||||
});
|
||||
|
||||
os.alert({
|
||||
type: 'success',
|
||||
text: this.hpml.interpolate(this.block.message),
|
||||
});
|
||||
} else if (this.block.action === 'callAiScript') {
|
||||
this.hpml.callAiScript(this.block.fn);
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.kudkigyw {
|
||||
display: inline-block;
|
||||
min-width: 200px;
|
||||
max-width: 450px;
|
||||
margin: 8px 0;
|
||||
}
|
||||
</style>
|
|
@ -1,48 +0,0 @@
|
|||
<template>
|
||||
<div class="ysrxegms">
|
||||
<canvas ref="canvas" :width="block.width" :height="block.height"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, PropType, Ref, ref } from 'vue';
|
||||
import { CanvasBlock } from '@/scripts/hpml/block';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<CanvasBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
setup(props, ctx) {
|
||||
const canvas: Ref<any> = ref(null);
|
||||
|
||||
onMounted(() => {
|
||||
props.hpml.registerCanvas(props.block.name, canvas.value);
|
||||
});
|
||||
|
||||
return {
|
||||
canvas,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.ysrxegms {
|
||||
display: inline-block;
|
||||
vertical-align: bottom;
|
||||
overflow: auto;
|
||||
max-width: 100%;
|
||||
|
||||
> canvas {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,51 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<MkButton class="llumlmnx" @click="click()">{{ hpml.interpolate(block.text) }}</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, PropType } from 'vue';
|
||||
import MkButton from '../MkButton.vue';
|
||||
import { CounterVarBlock } from '@/scripts/hpml/block';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkButton,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<CounterVarBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
setup(props, ctx) {
|
||||
const value = computed(() => {
|
||||
return props.hpml.vars.value[props.block.name];
|
||||
});
|
||||
|
||||
function click() {
|
||||
props.hpml.updatePageVar(props.block.name, value.value + (props.block.inc || 1));
|
||||
props.hpml.eval();
|
||||
}
|
||||
|
||||
return {
|
||||
click,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.llumlmnx {
|
||||
display: inline-block;
|
||||
min-width: 300px;
|
||||
max-width: 450px;
|
||||
margin: 8px 0;
|
||||
}
|
||||
</style>
|
|
@ -1,31 +0,0 @@
|
|||
<template>
|
||||
<div v-show="hpml.vars.value[block.var]">
|
||||
<XBlock v-for="child in block.children" :key="child.id" :block="child" :hpml="hpml" :h="h"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { IfBlock } from '@/scripts/hpml/block';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
import { defineComponent, defineAsyncComponent, PropType } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
XBlock: defineAsyncComponent(() => import('./page.block.vue')),
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<IfBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
h: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="voxdxuby">
|
||||
<div style="margin: 1em 0;">
|
||||
<MkNote v-if="note && !block.detailed" :key="note.id + ':normal'" v-model:note="note"/>
|
||||
<MkNoteDetailed v-if="note && block.detailed" :key="note.id + ':detail'" v-model:note="note"/>
|
||||
</div>
|
||||
|
@ -39,9 +39,3 @@ export default defineComponent({
|
|||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.voxdxuby {
|
||||
margin: 1em 0;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,54 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<MkInput class="kudkigyw" :model-value="value" type="number" @update:model-value="updateValue($event)">
|
||||
<template #label>{{ hpml.interpolate(block.text) }}</template>
|
||||
</MkInput>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, PropType } from 'vue';
|
||||
import MkInput from '../MkInput.vue';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
import { NumberInputVarBlock } from '@/scripts/hpml/block';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkInput,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<NumberInputVarBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
setup(props, ctx) {
|
||||
const value = computed(() => {
|
||||
return props.hpml.vars.value[props.block.name];
|
||||
});
|
||||
|
||||
function updateValue(newValue) {
|
||||
props.hpml.updatePageVar(props.block.name, newValue);
|
||||
props.hpml.eval();
|
||||
}
|
||||
|
||||
return {
|
||||
value,
|
||||
updateValue,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.kudkigyw {
|
||||
display: inline-block;
|
||||
min-width: 300px;
|
||||
max-width: 450px;
|
||||
margin: 8px 0;
|
||||
}
|
||||
</style>
|
|
@ -1,111 +0,0 @@
|
|||
<template>
|
||||
<div class="ngbfujlo">
|
||||
<MkTextarea :model-value="text" readonly style="margin: 0;"></MkTextarea>
|
||||
<MkButton class="button" primary :disabled="posting || posted" @click="post()">
|
||||
<i v-if="posted" class="ti ti-check"></i>
|
||||
<i v-else class="ti ti-send"></i>
|
||||
</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, PropType } from 'vue';
|
||||
import MkTextarea from '../MkTextarea.vue';
|
||||
import MkButton from '../MkButton.vue';
|
||||
import { apiUrl } from '@/config';
|
||||
import * as os from '@/os';
|
||||
import { PostBlock } from '@/scripts/hpml/block';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
import { defaultStore } from '@/store';
|
||||
import { $i } from '@/account';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkTextarea,
|
||||
MkButton,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<PostBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
text: this.hpml.interpolate(this.block.text),
|
||||
posted: false,
|
||||
posting: false,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'hpml.vars': {
|
||||
handler() {
|
||||
this.text = this.hpml.interpolate(this.block.text);
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
upload() {
|
||||
const promise = new Promise((ok) => {
|
||||
const canvas = this.hpml.canvases[this.block.canvasId];
|
||||
canvas.toBlob(blob => {
|
||||
const formData = new FormData();
|
||||
formData.append('file', blob);
|
||||
formData.append('i', $i.token);
|
||||
if (defaultStore.state.uploadFolder) {
|
||||
formData.append('folderId', defaultStore.state.uploadFolder);
|
||||
}
|
||||
|
||||
window.fetch(apiUrl + '/drive/files/create', {
|
||||
method: 'POST',
|
||||
body: formData,
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(f => {
|
||||
ok(f);
|
||||
});
|
||||
});
|
||||
});
|
||||
os.promiseDialog(promise);
|
||||
return promise;
|
||||
},
|
||||
async post() {
|
||||
this.posting = true;
|
||||
const file = this.block.attachCanvasImage ? await this.upload() : null;
|
||||
os.apiWithDialog('notes/create', {
|
||||
text: this.text === '' ? null : this.text,
|
||||
fileIds: file ? [file.id] : undefined,
|
||||
}).then(() => {
|
||||
this.posted = true;
|
||||
});
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.ngbfujlo {
|
||||
position: relative;
|
||||
padding: 32px;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 2px 8px var(--shadow);
|
||||
z-index: 1;
|
||||
|
||||
> .button {
|
||||
margin-top: 32px;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
padding: 16px;
|
||||
|
||||
> .button {
|
||||
margin-top: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,44 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<div>{{ hpml.interpolate(block.title) }}</div>
|
||||
<MkRadio v-for="item in block.values" :key="item" :modelValue="value" :value="item" @update:model-value="updateValue($event)">{{ item }}</MkRadio>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, PropType } from 'vue';
|
||||
import MkRadio from '../MkRadio.vue';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
import { RadioButtonVarBlock } from '@/scripts/hpml/block';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkRadio,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<RadioButtonVarBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
setup(props, ctx) {
|
||||
const value = computed(() => {
|
||||
return props.hpml.vars.value[props.block.name];
|
||||
});
|
||||
|
||||
function updateValue(newValue: string) {
|
||||
props.hpml.updatePageVar(props.block.name, newValue);
|
||||
props.hpml.eval();
|
||||
}
|
||||
|
||||
return {
|
||||
value,
|
||||
updateValue,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
|
@ -1,54 +0,0 @@
|
|||
<template>
|
||||
<div class="hkcxmtwj">
|
||||
<MkSwitch :model-value="value" @update:model-value="updateValue($event)">{{ hpml.interpolate(block.text) }}</MkSwitch>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, PropType } from 'vue';
|
||||
import MkSwitch from '../MkSwitch.vue';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
import { SwitchVarBlock } from '@/scripts/hpml/block';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkSwitch,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<SwitchVarBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
setup(props, ctx) {
|
||||
const value = computed(() => {
|
||||
return props.hpml.vars.value[props.block.name];
|
||||
});
|
||||
|
||||
function updateValue(newValue: boolean) {
|
||||
props.hpml.updatePageVar(props.block.name, newValue);
|
||||
props.hpml.eval();
|
||||
}
|
||||
|
||||
return {
|
||||
value,
|
||||
updateValue,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.hkcxmtwj {
|
||||
display: inline-block;
|
||||
margin: 16px auto;
|
||||
|
||||
& + .hkcxmtwj {
|
||||
margin-left: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,54 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<MkInput class="kudkigyw" :model-value="value" type="text" @update:model-value="updateValue($event)">
|
||||
<template #label>{{ hpml.interpolate(block.text) }}</template>
|
||||
</MkInput>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, PropType } from 'vue';
|
||||
import MkInput from '../MkInput.vue';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
import { TextInputVarBlock } from '@/scripts/hpml/block';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkInput,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<TextInputVarBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
setup(props, ctx) {
|
||||
const value = computed(() => {
|
||||
return props.hpml.vars.value[props.block.name];
|
||||
});
|
||||
|
||||
function updateValue(newValue) {
|
||||
props.hpml.updatePageVar(props.block.name, newValue);
|
||||
props.hpml.eval();
|
||||
}
|
||||
|
||||
return {
|
||||
value,
|
||||
updateValue,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.kudkigyw {
|
||||
display: inline-block;
|
||||
min-width: 300px;
|
||||
max-width: 450px;
|
||||
margin: 8px 0;
|
||||
}
|
||||
</style>
|
|
@ -1,45 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
<MkTextarea :model-value="value" @update:model-value="updateValue($event)">
|
||||
<template #label>{{ hpml.interpolate(block.text) }}</template>
|
||||
</MkTextarea>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, PropType } from 'vue';
|
||||
import MkTextarea from '../MkTextarea.vue';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
import { TextInputVarBlock } from '@/scripts/hpml/block';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkTextarea,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<TextInputVarBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
setup(props, ctx) {
|
||||
const value = computed(() => {
|
||||
return props.hpml.vars.value[props.block.name];
|
||||
});
|
||||
|
||||
function updateValue(newValue) {
|
||||
props.hpml.updatePageVar(props.block.name, newValue);
|
||||
props.hpml.eval();
|
||||
}
|
||||
|
||||
return {
|
||||
value,
|
||||
updateValue,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
|
@ -1,39 +0,0 @@
|
|||
<template>
|
||||
<MkTextarea :model-value="text" readonly></MkTextarea>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { TextBlock } from '@/scripts/hpml/block';
|
||||
import { Hpml } from '@/scripts/hpml/evaluator';
|
||||
import { defineComponent, PropType } from 'vue';
|
||||
import MkTextarea from '../MkTextarea.vue';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkTextarea,
|
||||
},
|
||||
props: {
|
||||
block: {
|
||||
type: Object as PropType<TextBlock>,
|
||||
required: true,
|
||||
},
|
||||
hpml: {
|
||||
type: Object as PropType<Hpml>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
text: this.hpml.interpolate(this.block.text),
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'hpml.vars': {
|
||||
handler() {
|
||||
this.text = this.hpml.interpolate(this.block.text);
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
|
@ -2,7 +2,7 @@
|
|||
<MkStickyContainer>
|
||||
<template #header><XHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<MkSpacer :content-max="900">
|
||||
<div class="lcixvhis">
|
||||
<div>
|
||||
<div class="reports">
|
||||
<div class="">
|
||||
<div class="inputs" style="display: flex;">
|
||||
|
@ -87,9 +87,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-exclamation-circle',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.lcixvhis {
|
||||
margin: var(--margin);
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<MkStickyContainer>
|
||||
<template #header><XHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<MkSpacer :content-max="900">
|
||||
<div class="ztgjmzrw _gaps_m">
|
||||
<div class="_gaps_m">
|
||||
<section v-for="announcement in announcements" class="">
|
||||
<div class="_panel _gaps_m" style="padding: 24px;">
|
||||
<MkInput v-model="announcement.title">
|
||||
|
@ -113,9 +113,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-speakerphone',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.ztgjmzrw {
|
||||
margin: var(--margin);
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<MkStickyContainer>
|
||||
<template #header><XHeader :actions="headerActions"/></template>
|
||||
<MkSpacer :content-max="900">
|
||||
<div class="xrmjdkdw">
|
||||
<div>
|
||||
<div>
|
||||
<div class="inputs" style="display: flex; gap: var(--margin); flex-wrap: wrap;">
|
||||
<MkSelect v-model="origin" style="margin: 0; flex: 1;">
|
||||
|
@ -109,9 +109,3 @@ definePageMetadata(computed(() => ({
|
|||
icon: 'ti ti-cloud',
|
||||
})));
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.xrmjdkdw {
|
||||
margin: var(--margin);
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -67,7 +67,3 @@ onMounted(() => {
|
|||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -132,7 +132,3 @@ defineExpose({
|
|||
pushData,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<MkSpacer :content-max="1000">
|
||||
<div ref="rootEl" class="edbbcaef">
|
||||
<div ref="rootEl" :class="$style.root">
|
||||
<MkFoldableSection class="item">
|
||||
<template #header>Stats</template>
|
||||
<XStats/>
|
||||
|
@ -176,8 +176,8 @@ definePageMetadata({
|
|||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.edbbcaef {
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
|
||||
grid-gap: 16px;
|
||||
|
|
|
@ -132,7 +132,3 @@ defineExpose({
|
|||
pushData,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -10,8 +10,8 @@
|
|||
<template #header>:{{ emoji.name }}:</template>
|
||||
|
||||
<MkSpacer :margin-min="20" :margin-max="28">
|
||||
<div class="yigymqpb _gaps_m">
|
||||
<img :src="`/emoji/${emoji.name}.webp`" class="img"/>
|
||||
<div class="_gaps_m">
|
||||
<img :src="`/emoji/${emoji.name}.webp`" :class="$style.img"/>
|
||||
<MkInput v-model="name">
|
||||
<template #label>{{ i18n.ts.name }}</template>
|
||||
</MkInput>
|
||||
|
@ -99,12 +99,10 @@ async function del() {
|
|||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.yigymqpb {
|
||||
> .img {
|
||||
<style lang="scss" module>
|
||||
.img {
|
||||
display: block;
|
||||
height: 64px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -442,7 +442,3 @@ definePageMetadata(computed(() => flash ? {
|
|||
title: i18n.ts._play.new,
|
||||
}));
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
<MkFoldableSection class="_margin">
|
||||
<template #header><i class="ti ti-clock"></i>{{ i18n.ts.recentPosts }}</template>
|
||||
<MkPagination v-slot="{items}" :pagination="recentPostsPagination" :disable-auto-load="true">
|
||||
<div class="vfpdbgtk">
|
||||
<div :class="$style.items">
|
||||
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
|
||||
</div>
|
||||
</MkPagination>
|
||||
|
@ -15,7 +15,7 @@
|
|||
<MkFoldableSection class="_margin">
|
||||
<template #header><i class="ti ti-comet"></i>{{ i18n.ts.popularPosts }}</template>
|
||||
<MkPagination v-slot="{items}" :pagination="popularPostsPagination" :disable-auto-load="true">
|
||||
<div class="vfpdbgtk">
|
||||
<div :class="$style.items">
|
||||
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
|
||||
</div>
|
||||
</MkPagination>
|
||||
|
@ -23,7 +23,7 @@
|
|||
</div>
|
||||
<div v-else-if="tab === 'liked'">
|
||||
<MkPagination v-slot="{items}" :pagination="likedPostsPagination">
|
||||
<div class="vfpdbgtk">
|
||||
<div :class="$style.items">
|
||||
<MkGalleryPostPreview v-for="like in items" :key="like.id" :post="like.post" class="post"/>
|
||||
</div>
|
||||
</MkPagination>
|
||||
|
@ -31,7 +31,7 @@
|
|||
<div v-else-if="tab === 'my'">
|
||||
<MkA to="/gallery/new" class="_link" style="margin: 16px;"><i class="ti ti-plus"></i> {{ i18n.ts.postToGallery }}</MkA>
|
||||
<MkPagination v-slot="{items}" :pagination="myPostsPagination">
|
||||
<div class="vfpdbgtk">
|
||||
<div :class="$style.items">
|
||||
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
|
||||
</div>
|
||||
</MkPagination>
|
||||
|
@ -119,15 +119,11 @@ definePageMetadata({
|
|||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.vfpdbgtk {
|
||||
<style lang="scss" module>
|
||||
.items {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
|
||||
grid-gap: 12px;
|
||||
margin: 0 var(--margin);
|
||||
|
||||
> .post {
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -38,7 +38,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-antenna',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -36,7 +36,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-antenna',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<MkSpacer :content-max="700">
|
||||
<div class="shaynizk">
|
||||
<div>
|
||||
<div class="_gaps_m">
|
||||
<MkInput v-model="name">
|
||||
<template #label>{{ i18n.ts.name }}</template>
|
||||
|
@ -33,7 +33,7 @@
|
|||
<MkSwitch v-model="withFile">{{ i18n.ts.withFileAntenna }}</MkSwitch>
|
||||
<MkSwitch v-model="notify">{{ i18n.ts.notifyAntenna }}</MkSwitch>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<div :class="$style.actions">
|
||||
<MkButton inline primary @click="saveAntenna()"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
|
||||
<MkButton v-if="antenna.id != null" inline danger @click="deleteAntenna()"><i class="ti ti-trash"></i> {{ i18n.ts.delete }}</MkButton>
|
||||
</div>
|
||||
|
@ -128,12 +128,10 @@ function addUser() {
|
|||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.shaynizk {
|
||||
> .actions {
|
||||
<style lang="scss" module>
|
||||
.actions {
|
||||
margin-top: 16px;
|
||||
padding: 24px 0;
|
||||
border-top: solid 0.5px var(--divider);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -8,8 +8,8 @@
|
|||
</button>
|
||||
</template>
|
||||
|
||||
<section class="oyyftmcf">
|
||||
<MkDriveFileThumbnail v-if="file" class="preview" :file="file" fit="contain" @click="choose()"/>
|
||||
<section>
|
||||
<MkDriveFileThumbnail v-if="file" style="height: 150px;" :file="file" fit="contain" @click="choose()"/>
|
||||
</section>
|
||||
</XContainer>
|
||||
</template>
|
||||
|
@ -54,11 +54,3 @@ onMounted(async () => {
|
|||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.oyyftmcf {
|
||||
> .preview {
|
||||
height: 150px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -3,8 +3,8 @@
|
|||
<XContainer :draggable="true" @remove="() => $emit('remove')">
|
||||
<template #header><i class="ti ti-align-left"></i> {{ i18n.ts._pages.blocks.text }}</template>
|
||||
|
||||
<section class="vckmsadr">
|
||||
<textarea v-model="text"></textarea>
|
||||
<section>
|
||||
<textarea v-model="text" :class="$style.textarea"></textarea>
|
||||
</section>
|
||||
</XContainer>
|
||||
</template>
|
||||
|
@ -33,9 +33,8 @@ watch($$(text), () => {
|
|||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.vckmsadr {
|
||||
> textarea {
|
||||
<style lang="scss" module>
|
||||
.textarea {
|
||||
display: block;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
|
@ -51,5 +50,4 @@ watch($$(text), () => {
|
|||
font-size: 14px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="graojtoi">
|
||||
<div>
|
||||
<MkSample/>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -19,9 +19,3 @@ definePageMetadata(computed(() => ({
|
|||
icon: 'ti ti-eye',
|
||||
})));
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.graojtoi {
|
||||
padding: var(--margin);
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -93,6 +93,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-adjustments',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
|
|
|
@ -118,6 +118,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-adjustments',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
|
|
|
@ -68,6 +68,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-adjustments',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
|
|
|
@ -53,7 +53,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-lock',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -94,7 +94,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-plug',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
<template>
|
||||
<div class="_gaps_m">
|
||||
<div class="llvierxe" :style="{ backgroundImage: $i.bannerUrl ? `url(${ $i.bannerUrl })` : null }">
|
||||
<div class="avatar">
|
||||
<MkAvatar class="avatar" :user="$i" @click="changeAvatar"/>
|
||||
<MkButton primary rounded class="avatarEdit" @click="changeAvatar">{{ i18n.ts._profile.changeAvatar }}</MkButton>
|
||||
<div :class="$style.avatarAndBanner" :style="{ backgroundImage: $i.bannerUrl ? `url(${ $i.bannerUrl })` : null }">
|
||||
<div :class="$style.avatarContainer">
|
||||
<MkAvatar :class="$style.avatar" :user="$i" @click="changeAvatar"/>
|
||||
<MkButton primary rounded :class="$style.avatarEdit" @click="changeAvatar">{{ i18n.ts._profile.changeAvatar }}</MkButton>
|
||||
</div>
|
||||
<MkButton primary rounded class="bannerEdit" @click="changeBanner">{{ i18n.ts._profile.changeBanner }}</MkButton>
|
||||
<MkButton primary rounded :class="$style.bannerEdit" @click="changeBanner">{{ i18n.ts._profile.changeBanner }}</MkButton>
|
||||
</div>
|
||||
|
||||
<MkInput v-model="profile.name" :max="30" manual-save>
|
||||
|
@ -248,36 +248,39 @@ definePageMetadata({
|
|||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.llvierxe {
|
||||
<style lang="scss" module>
|
||||
.avatarAndBanner {
|
||||
position: relative;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border: solid 1px var(--divider);
|
||||
border-radius: 10px;
|
||||
overflow: clip;
|
||||
}
|
||||
|
||||
> .avatar {
|
||||
.avatarContainer {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
> .avatar {
|
||||
.avatar {
|
||||
display: inline-block;
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
margin: 0 auto 16px auto;
|
||||
}
|
||||
|
||||
.avatarEdit {
|
||||
|
||||
}
|
||||
|
||||
> .bannerEdit {
|
||||
.bannerEdit {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
right: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" module>
|
||||
|
||||
.metadataRoot {
|
||||
container-type: inline-size;
|
||||
}
|
||||
|
|
|
@ -3,15 +3,15 @@
|
|||
<FromSlot>
|
||||
<template #label>{{ i18n.ts.reactionSettingDescription }}</template>
|
||||
<div v-panel style="border-radius: 6px;">
|
||||
<Sortable v-model="reactions" class="zoaiodol" :item-key="item => item" :animation="150" :delay="100" :delay-on-touch-only="true">
|
||||
<Sortable v-model="reactions" :class="$style.reactions" :item-key="item => item" :animation="150" :delay="100" :delay-on-touch-only="true">
|
||||
<template #item="{element}">
|
||||
<button class="_button item" @click="remove(element, $event)">
|
||||
<button class="_button" :class="$style.reactionsItem" @click="remove(element, $event)">
|
||||
<MkCustomEmoji v-if="element[0] === ':'" :name="element" :normal="true"/>
|
||||
<MkEmoji v-else :emoji="element" :normal="true"/>
|
||||
</button>
|
||||
</template>
|
||||
<template #footer>
|
||||
<button class="_button add" @click="chooseEmoji"><i class="ti ti-plus"></i></button>
|
||||
<button class="_button" :class="$style.reactionsAdd" @click="chooseEmoji"><i class="ti ti-plus"></i></button>
|
||||
</template>
|
||||
</Sortable>
|
||||
</div>
|
||||
|
@ -135,20 +135,20 @@ definePageMetadata({
|
|||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.zoaiodol {
|
||||
<style lang="scss" module>
|
||||
.reactions {
|
||||
padding: 12px;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
> .item {
|
||||
.reactionsItem {
|
||||
display: inline-block;
|
||||
padding: 8px;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
> .add {
|
||||
.reactionsAdd {
|
||||
display: inline-block;
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
class="_panel"
|
||||
@posted="state = 'posted'"
|
||||
/>
|
||||
<MkButton v-else-if="state === 'posted'" primary class="close" @click="close()">{{ i18n.ts.close }}</MkButton>
|
||||
<MkButton v-else-if="state === 'posted'" primary :class="$style.close" @click="close()">{{ i18n.ts.close }}</MkButton>
|
||||
</MkSpacer>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
@ -162,7 +162,7 @@ definePageMetadata({
|
|||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
<style lang="scss" module>
|
||||
.close {
|
||||
margin: 16px auto;
|
||||
}
|
||||
|
|
|
@ -35,7 +35,3 @@ definePageMetadata({
|
|||
icon: 'ti ti-user',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
|
|
@ -1,26 +1,30 @@
|
|||
<template>
|
||||
<svg :viewBox="`0 0 ${ viewBoxX } ${ viewBoxY }`" @mousedown.prevent="onMousedown">
|
||||
<svg :viewBox="`0 0 ${ viewBoxX } ${ viewBoxY }`" :class="$style.root" @mousedown.prevent="onMousedown">
|
||||
<polyline
|
||||
:points="pointsNote"
|
||||
fill="none"
|
||||
stroke-width="1"
|
||||
stroke="#41ddde"/>
|
||||
stroke="#41ddde"
|
||||
/>
|
||||
<polyline
|
||||
:points="pointsReply"
|
||||
fill="none"
|
||||
stroke-width="1"
|
||||
stroke="#f7796c"/>
|
||||
stroke="#f7796c"
|
||||
/>
|
||||
<polyline
|
||||
:points="pointsRenote"
|
||||
fill="none"
|
||||
stroke-width="1"
|
||||
stroke="#a1de41"/>
|
||||
stroke="#a1de41"
|
||||
/>
|
||||
<polyline
|
||||
:points="pointsTotal"
|
||||
fill="none"
|
||||
stroke-width="1"
|
||||
stroke="#555"
|
||||
stroke-dasharray="2 2"/>
|
||||
stroke-dasharray="2 2"
|
||||
/>
|
||||
</svg>
|
||||
</template>
|
||||
|
||||
|
@ -81,8 +85,8 @@ function render() {
|
|||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
svg {
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
display: block;
|
||||
padding: 16px;
|
||||
width: 100%;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<MkContainer :naked="widgetProps.transparent" :show-header="false" data-cy-mkw-aichan class="mkw-aichan">
|
||||
<iframe ref="live2d" class="dedjhjmo" src="https://misskey-dev.github.io/mascot-web/?scale=1.5&y=1.1&eyeY=100" @click="touched"></iframe>
|
||||
<iframe ref="live2d" :class="$style.root" src="https://misskey-dev.github.io/mascot-web/?scale=1.5&y=1.1&eyeY=100" @click="touched"></iframe>
|
||||
</MkContainer>
|
||||
</template>
|
||||
|
||||
|
@ -64,8 +64,8 @@ defineExpose<WidgetComponentExpose>({
|
|||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.dedjhjmo {
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
border: none;
|
||||
|
|
|
@ -101,8 +101,3 @@ defineExpose<WidgetComponentExpose>({
|
|||
id: props.widget ? props.widget.id : null,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.mkw-button {
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in a new issue