use png twemoji

main v0.3.1
Namekuji 2023-02-20 17:39:27 -05:00
rodzic e2a5fb6fd6
commit 32dbfbc205
5 zmienionych plików z 49 dodań i 47 usunięć

Wyświetl plik

@ -29,7 +29,7 @@
{% end %} {% end %}
</head> </head>
<body> <body>
<div id="app" data-version='0.3.0'></div> <div id="app" data-version='0.3.1'></div>
<script type="module" src="/src/main.js"></script> <script type="module" src="/src/main.js"></script>
</body> </body>
</html> </html>

Wyświetl plik

@ -1,6 +1,6 @@
{ {
"name": "audon-fe", "name": "audon-fe",
"version": "0.3.0", "version": "0.3.1",
"private": true, "private": true,
"scripts": { "scripts": {
"dev": "cp -v index.dev.html index.html && vite", "dev": "cp -v index.dev.html index.html && vite",
@ -9,35 +9,35 @@
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore" "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore"
}, },
"dependencies": { "dependencies": {
"@intlify/unplugin-vue-i18n": "^0.8.1", "@intlify/unplugin-vue-i18n": "^0.8.2",
"@picmo/popup-picker": "^5.7.2", "@picmo/popup-picker": "^5.7.6",
"@picmo/renderer-twemoji": "^5.7.6", "@picmo/renderer-twemoji": "^5.7.6",
"@uriopass/nosleep.js": "^0.12.2", "@uriopass/nosleep.js": "^0.12.2",
"@vuelidate/core": "^2.0.0", "@vuelidate/core": "^2.0.0",
"@vuelidate/validators": "^2.0.0", "@vuelidate/validators": "^2.0.0",
"@vueuse/core": "^9.6.0", "@vueuse/core": "^9.13.0",
"axios": "^1.2.0", "axios": "^1.3.3",
"howler": "^2.2.3", "howler": "^2.2.3",
"livekit-client": "^1.6.0", "livekit-client": "^1.6.5",
"lodash-es": "^4.17.21", "lodash-es": "^4.17.21",
"luxon": "^3.1.1", "luxon": "^3.2.1",
"masto": "^5.6.0", "masto": "^5.10.0",
"picmo": "^5.7.2", "picmo": "^5.7.6",
"pinia": "^2.0.26", "pinia": "^2.0.31",
"vue": "^3.2.45", "vue": "^3.2.47",
"vue-i18n": "^9.2.2", "vue-i18n": "^9.2.2",
"vue-router": "^4.1.6", "vue-router": "^4.1.6",
"vuetify": "^3.0.3" "vuetify": "^3.1.5"
}, },
"devDependencies": { "devDependencies": {
"@mdi/js": "^7.0.96", "@mdi/js": "^7.1.96",
"@rushstack/eslint-patch": "^1.1.4", "@rushstack/eslint-patch": "^1.2.0",
"@vitejs/plugin-vue": "^3.2.0", "@vitejs/plugin-vue": "^3.2.0",
"@vue/eslint-config-prettier": "^7.0.0", "@vue/eslint-config-prettier": "^7.0.0",
"eslint": "^8.22.0", "eslint": "^8.34.0",
"eslint-plugin-vue": "^9.3.0", "eslint-plugin-vue": "^9.9.0",
"prettier": "^2.7.1", "prettier": "^2.8.4",
"vite": "^3.2.4", "vite": "^3.2.5",
"vite-plugin-vuetify": "^1.0.0" "vite-plugin-vuetify": "^1.0.2"
} }
} }

Wyświetl plik

@ -1,34 +1,34 @@
lockfileVersion: 5.4 lockfileVersion: 5.4
specifiers: specifiers:
'@intlify/unplugin-vue-i18n': ^0.8.1 '@intlify/unplugin-vue-i18n': ^0.8.2
'@mdi/js': ^7.0.96 '@mdi/js': ^7.1.96
'@picmo/popup-picker': ^5.7.2 '@picmo/popup-picker': ^5.7.6
'@picmo/renderer-twemoji': ^5.7.6 '@picmo/renderer-twemoji': ^5.7.6
'@rushstack/eslint-patch': ^1.1.4 '@rushstack/eslint-patch': ^1.2.0
'@uriopass/nosleep.js': ^0.12.2 '@uriopass/nosleep.js': ^0.12.2
'@vitejs/plugin-vue': ^3.2.0 '@vitejs/plugin-vue': ^3.2.0
'@vue/eslint-config-prettier': ^7.0.0 '@vue/eslint-config-prettier': ^7.0.0
'@vuelidate/core': ^2.0.0 '@vuelidate/core': ^2.0.0
'@vuelidate/validators': ^2.0.0 '@vuelidate/validators': ^2.0.0
'@vueuse/core': ^9.6.0 '@vueuse/core': ^9.13.0
axios: ^1.2.0 axios: ^1.3.3
eslint: ^8.22.0 eslint: ^8.34.0
eslint-plugin-vue: ^9.3.0 eslint-plugin-vue: ^9.9.0
howler: ^2.2.3 howler: ^2.2.3
livekit-client: ^1.6.0 livekit-client: ^1.6.5
lodash-es: ^4.17.21 lodash-es: ^4.17.21
luxon: ^3.1.1 luxon: ^3.2.1
masto: ^5.6.0 masto: ^5.10.0
picmo: ^5.7.2 picmo: ^5.7.6
pinia: ^2.0.26 pinia: ^2.0.31
prettier: ^2.7.1 prettier: ^2.8.4
vite: ^3.2.4 vite: ^3.2.5
vite-plugin-vuetify: ^1.0.0 vite-plugin-vuetify: ^1.0.2
vue: ^3.2.45 vue: ^3.2.47
vue-i18n: ^9.2.2 vue-i18n: ^9.2.2
vue-router: ^4.1.6 vue-router: ^4.1.6
vuetify: ^3.0.3 vuetify: ^3.1.5
dependencies: dependencies:
'@intlify/unplugin-vue-i18n': 0.8.2_vue-i18n@9.2.2 '@intlify/unplugin-vue-i18n': 0.8.2_vue-i18n@9.2.2

Wyświetl plik

@ -77,7 +77,9 @@ export default {
scrim="#000000" scrim="#000000"
class="align-center justify-center reaction" class="align-center justify-center reaction"
> >
<span>{{ emoji }}</span> <div class="d-flex align-center justify-center">
<img class="emoji" :src="emoji" />
</div>
</v-overlay> </v-overlay>
<v-img <v-img
:class="{ cursorPointer: enableMenu }" :class="{ cursorPointer: enableMenu }"
@ -100,7 +102,9 @@ export default {
scrim="#000000" scrim="#000000"
class="align-center justify-center reaction" class="align-center justify-center reaction"
> >
<span>{{ emoji }}</span> <div class="d-flex align-center justify-center">
<img class="emoji" :src="emoji" />
</div>
</v-overlay> </v-overlay>
<v-img <v-img
:class="{ cursorPointer: enableMenu }" :class="{ cursorPointer: enableMenu }"
@ -147,10 +151,8 @@ export default {
outline: 3px solid cornflowerblue; outline: 3px solid cornflowerblue;
} }
.reaction span { .reaction img {
font-size: 2rem; height: 2rem;
color: white;
text-align: center;
} }
.cursorPointer { .cursorPointer {

Wyświetl plik

@ -545,7 +545,7 @@ export default {
emojiSize: "1.8rem", emojiSize: "1.8rem",
autoFocus: "none", autoFocus: "none",
showPreview: false, showPreview: false,
renderer: new TwemojiRenderer(), renderer: new TwemojiRenderer("png"),
}, },
{ {
referenceElement: btn, referenceElement: btn,
@ -555,8 +555,8 @@ export default {
} }
); );
const self = this; const self = this;
picker.addEventListener("emoji:select", ({ emoji }) => { picker.addEventListener("emoji:select", ({ url }) => {
self.onEmojiSelected(emoji); self.onEmojiSelected(url);
}); });
this.emojiPicker = picker; this.emojiPicker = picker;
} }