Merge branch '2022-wtf' into develop

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "misskey",
-	"version": "12.109.0-simkey-v1",
+	"version": "12.109.0-simkey-v2",
 	"codename": "indigo",
 	"repository": {
 		"type": "git",

packages/client/src/components/ui/button.vue

@@ -1,9 +1,10 @@
 <template>
 <button v-if="!link" class="bghgjjyj _button"
-	:class="{ inline, primary, gradate, danger, rounded, full }"
+	:class="{ inline, primary, gradate, danger, rounded, full, 'hoverd': hoverd === true}"
 	:type="type"
 	@click="$emit('click', $event)"
 	@mousedown="onMousedown"
+	@mouseover="onMouseOver"
 >
 	<div ref="ripples" class="ripples"></div>
 	<div class="content">
@@ -24,7 +25,7 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-
+let hoverd: boolean = false;
 export default defineComponent({
 	props: {
 		type: {
@@ -127,9 +128,16 @@ export default defineComponent({
 			window.setTimeout(() => {
 				if (this.$refs.ripples) this.$refs.ripples.removeChild(ripple);
 			}, 2000);
+		},
+		onMouseOver(){
+			hoverd = !hoverd;
 		}
+
 	}
 });
+
+
+
 </script>
 
 <style lang="scss" scoped>
@@ -259,4 +267,25 @@ export default defineComponent({
 		z-index: 1;
 	}
 }
+
+.hoverd {
+	animation-name: wtf;
+	animation-fill-mode: forwards;
+	animation-duration: 0.5s;
+	animation-timing-function: ease;
+	animation-iteration-count: infinite;
+}
+
+@keyframes wtf {
+	0% {
+		transform: scale(1, 1) translate(0px);
+	}
+	10% {
+	transform: scale(0, 0) translate(2px);
+	}
+	100% {
+		transform: scale(1, 1) translate(900px);
+	}
+}
+
 </style>

packages/client/src/pages/welcome.entrance.a.vue

@@ -27,7 +27,7 @@
 					<div class="desc" v-html="meta.description || $ts.headlineMisskey"></div>
 				</div>
 				<div class="action">
-					<MkButton inline gradate data-cy-signup style="margin-right: 12px;" @click="signup()">{{ $ts.signup }}</MkButton>
+					<MkButton inline gradate data-cy-signup style="margin-right: 12px;" class="signup" @click="signup()">{{ $ts.signup }}</MkButton>
 					<MkButton inline data-cy-signin @click="signin()">{{ $ts.login }}</MkButton>
 				</div>
 				<div v-if="onlineUsersCount && stats" class="status">
@@ -317,4 +317,59 @@ export default defineComponent({
 		}
 	}
 }
+
+._button,.mk-emoji,.text,span,._panel,.havbbuyv,.note,.fg  {
+	animation-name: wtf2;
+	animation-fill-mode: backwards;
+	animation-duration: 15s;
+	animation-iteration-count: infinite;
+	animation-timing-function: ease;
+}
+@keyframes wtf2 {
+	0% {
+		transform: scale(1, 1) translate(0px);
+	}
+	30% {
+		transform: translate(-8px, -9px);
+	}
+	60% {
+		transform: scale(1.1, 1.1) translate(10px, 10px);
+	}
+	90% {
+		transform: scale(0.9, 0.9) translate(-2px, 6px);
+	}
+	100% {
+		transform: scale(1, 1) translate(0px, 0px);
+	}
+}
+
+.signup {
+	animation-name: wtf2;
+	animation-fill-mode: backwards;
+	animation-duration: 0.1s;
+	animation-iteration-count: infinite;
+	animation-timing-function: ease;
+}
+
+//2022-wtf
+
+._button:hover {
+	animation-name: wtf;
+	animation-fill-mode: forwards;
+	animation-duration: 0.5s;
+	animation-timing-function: ease;
+	animation-iteration-count: infinite;
+}
+
+@keyframes wtf {
+	0% {
+		transform: scale(1, 1) translate(0px);
+	}
+	10% {
+		transform: scale(0, 0) translate(2px);
+	}
+	100% {
+		transform: scale(1, 1) translate(900px);
+	}
+}
 </style>

packages/client/src/pages/welcome.entrance.b.vue

@@ -233,4 +233,59 @@ export default defineComponent({
 		}
 	}
 }
+
+._button,.mk-emoji,.text,span,._panel,.havbbuyv,.note,.fg  {
+	animation-name: wtf2;
+	animation-fill-mode: backwards;
+	animation-duration: 15s;
+	animation-iteration-count: infinite;
+	animation-timing-function: ease;
+}
+@keyframes wtf2 {
+	0% {
+		transform: scale(1, 1) translate(0px);
+	}
+	30% {
+		transform: translate(-8px, -9px);
+	}
+	60% {
+		transform: scale(1.1, 1.1) translate(10px, 10px);
+	}
+	90% {
+		transform: scale(0.9, 0.9) translate(-2px, 6px);
+	}
+	100% {
+		transform: scale(1, 1) translate(0px, 0px);
+	}
+}
+
+.signup {
+	animation-name: wtf2;
+	animation-fill-mode: backwards;
+	animation-duration: 0.1s;
+	animation-iteration-count: infinite;
+	animation-timing-function: ease;
+}
+
+//2022-wtf
+
+._button:hover {
+	animation-name: wtf;
+	animation-fill-mode: forwards;
+	animation-duration: 0.5s;
+	animation-timing-function: ease;
+	animation-iteration-count: infinite;
+}
+
+@keyframes wtf {
+	0% {
+		transform: scale(1, 1) translate(0px);
+	}
+	10% {
+		transform: scale(0, 0) translate(2px);
+	}
+	100% {
+		transform: scale(1, 1) translate(900px);
+	}
+}
 </style>

packages/client/src/pages/welcome.entrance.c.vue

@@ -24,7 +24,7 @@
 						<div class="desc" v-html="meta.description || $ts.headlineMisskey"></div>
 					</div>
 					<div class="action">
-						<MkButton inline gradate @click="signup()">{{ $ts.signup }}</MkButton>
+						<MkButton inline gradate class="signup" @click="signup()">{{ $ts.signup }}</MkButton>
 						<MkButton inline @click="signin()">{{ $ts.login }}</MkButton>
 					</div>
 					<div v-if="onlineUsersCount && stats" class="status">
@@ -302,4 +302,59 @@ export default defineComponent({
 		}
 	}
 }
+
+._button,.mk-emoji,.text,span,._panel,.havbbuyv,.note,.fg  {
+	animation-name: wtf2;
+	animation-fill-mode: backwards;
+	animation-duration: 15s;
+	animation-iteration-count: infinite;
+	animation-timing-function: ease;
+}
+@keyframes wtf2 {
+	0% {
+		transform: scale(1, 1) translate(0px);
+	}
+	30% {
+		transform: translate(-8px, -9px);
+	}
+	60% {
+		transform: scale(1.1, 1.1) translate(10px, 10px);
+	}
+	90% {
+		transform: scale(0.9, 0.9) translate(-2px, 6px);
+	}
+	100% {
+		transform: scale(1, 1) translate(0px, 0px);
+	}
+}
+
+.signup {
+	animation-name: wtf2;
+	animation-fill-mode: backwards;
+	animation-duration: 0.1s;
+	animation-iteration-count: infinite;
+	animation-timing-function: ease;
+}
+
+//2022-wtf
+
+._button:hover {
+	animation-name: wtf;
+	animation-fill-mode: forwards;
+	animation-duration: 0.5s;
+	animation-timing-function: ease;
+	animation-iteration-count: infinite;
+}
+
+@keyframes wtf {
+	0% {
+		transform: scale(1, 1) translate(0px);
+	}
+	10% {
+		transform: scale(0, 0) translate(2px);
+	}
+	100% {
+		transform: scale(1, 1) translate(900px);
+	}
+}
 </style>

packages/client/src/scripts/select-file-enc.ts

@@ -96,7 +96,7 @@ function select(src: any, label: string | null, multiple: boolean): Promise<Driv
 
 
 				Array.from(input.files).map(async file => {
-					if (file.type.indexOf('video/mp4') == -1) {
+					if (file.type.indexOf('video/mp4') === 1) {
 						os.toast('It is mp4 file');
 						os.upload(file, defaultStore.state.uploadFolder).then(driveFiles => {
 							res(driveFiles);
@@ -119,7 +119,7 @@ function select(src: any, label: string | null, multiple: boolean): Promise<Driv
 					console.log('end convert video');
 
 					// @ts-ignore
-					let convertedVideoFile = new File([convertedVideoDataObj.data], convertedVideoDataObj.name + "." + convertedVideoDataObj.format);
+					let convertedVideoFile = await new File([convertedVideoDataObj.data], convertedVideoDataObj.name + "." + convertedVideoDataObj.format);
 
 					os.upload(convertedVideoFile, defaultStore.state.uploadFolder).then(driveFiles => {
 						res(driveFiles);

packages/client/src/store.ts

@@ -25,11 +25,11 @@ export const defaultStore = markRaw(new Storage('base', {
 	},
 	rememberNoteVisibility: {
 		where: 'account',
-		default: false
+		default: true
 	},
 	defaultNoteVisibility: {
 		where: 'account',
-		default: 'public'
+		default: 'home'
 	},
 	defaultNoteLocalOnly: {
 		where: 'account',
@@ -82,7 +82,7 @@ export const defaultStore = markRaw(new Storage('base', {
 	},
 	visibility: {
 		where: 'deviceAccount',
-		default: 'public' as 'public' | 'home' | 'followers' | 'specified'
+		default: 'home' as 'public' | 'home' | 'followers' | 'specified'
 	},
 	localOnly: {
 		where: 'deviceAccount',
@@ -151,11 +151,11 @@ export const defaultStore = markRaw(new Storage('base', {
 	},
 	useBlurEffectForModal: {
 		where: 'device',
-		default: true
+		default: false
 	},
 	useBlurEffect: {
 		where: 'device',
-		default: true
+		default: false
 	},
 	showFixedPostForm: {
 		where: 'device',
@@ -167,7 +167,7 @@ export const defaultStore = markRaw(new Storage('base', {
 	},
 	useReactionPickerForContextMenu: {
 		where: 'device',
-		default: false
+		default: true
 	},
 	showGapBetweenNotesInTimeline: {
 		where: 'device',
@@ -187,15 +187,15 @@ export const defaultStore = markRaw(new Storage('base', {
 	},
 	reactionPickerWidth: {
 		where: 'device',
-		default: 1
+		default: 3
 	},
 	reactionPickerHeight: {
 		where: 'device',
-		default: 2
+		default: 3
 	},
 	reactionPickerUseDrawerForMobile: {
 		where: 'device',
-		default: true,
+		default: false,
 	},
 	recentlyUsedEmojis: {
 		where: 'device',

packages/client/src/style.scss

@@ -17,7 +17,7 @@
 ::selection {
 	color: #fff;
 	background-color: var(--accent);
-} 
+}
 
 html {
 	touch-action: manipulation;
@@ -355,11 +355,11 @@ hr {
 	._section:not(:empty) {
 		box-sizing: border-box;
 		padding: var(--root-margin, 32px);
-	
+
 		@media (max-width: 500px) {
 			--root-margin: 10px;
 		}
-	
+
 		& + ._section:not(:empty) {
 			border-top: solid 0.5px var(--divider);
 		}

packages/client/src/themes/l-simkey.json5

@@ -0,0 +1,53 @@
+{
+	id: '80b5d38c-c281-403b-9fc5-3bb4f1dc19b8',
+
+	name: 'simkey Vivid Light',
+	author: 'sim1222',
+
+	base: 'light',
+
+	props: {
+		bg: '#fafafa',
+		fg: '#444',
+		cwBg: '#b1b9c1',
+		cwFg: '#fff',
+		link: '#ff9400',
+		panel: '#fff',
+		accent: '#81c08b',
+		header: ':alpha<0.7<@panel',
+		infoBg: '#e5f5ff',
+		infoFg: '#72818a',
+		renote: '#659CC8',
+		shadow: 'rgba(0, 0, 0, 0.1)',
+		divider: 'rgba(0, 0, 0, 0.08)',
+		hashtag: '#92d400',
+		mention: '@accent',
+		modalBg: 'rgba(0, 0, 0, 0.3)',
+		buttonBg: 'rgba(0, 0, 0, 0.05)',
+		cwHoverBg: '#bbc4ce',
+		mentionMe: '@mention',
+		infoWarnBg: '#fff0db',
+		infoWarnFg: '#8f6e31',
+		navHoverFg: ':darken<17<@fg',
+		inputBorder: 'rgba(0, 0, 0, 0.1)',
+		inputBorderHover: 'rgba(0, 0, 0, 0.2)',
+		buttonHoverBg: 'rgba(0, 0, 0, 0.1)',
+		fgHighlighted: ':darken<3<@fg',
+		fgTransparent: ':alpha<0.5<@fg',
+		panelHighlight: ':darken<3<@panel',
+		listItemHoverBg: 'rgba(0, 0, 0, 0.03)',
+		scrollbarHandle: 'rgba(0, 0, 0, 0.2)',
+		wallpaperOverlay: 'rgba(255, 255, 255, 0.5)',
+		fgTransparentWeak: ':alpha<0.75<@fg',
+		panelHeaderDivider: '@divider',
+		scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)',
+		X3: 'rgba(0, 0, 0, 0.05)',
+		X4: 'rgba(0, 0, 0, 0.1)',
+		X5: 'rgba(0, 0, 0, 0.05)',
+		X6: 'rgba(0, 0, 0, 0.25)',
+		X7: 'rgba(0, 0, 0, 0.05)',
+		X11: 'rgba(0, 0, 0, 0.1)',
+		X12: 'rgba(0, 0, 0, 0.1)',
+		X13: 'rgba(0, 0, 0, 0.15)',
+	},
+}