HoovesSocial/hippofish
2
0
Fork 0
Code Issues 3 Pull requests 1 Projects Releases Packages Wiki Activity Actions

underline effect

Browse source
This commit is contained in:
ThatOneCalculator 2022-11-06 19:14:55 -08:00
parent 11082f1fb2
commit c3e6b6544b
18 changed files with 36 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "calckey", "name": "calckey",
"version": "12.119.0-calc.8-b.4", "version": "12.119.0-calc.8-b.5",
"codename": "aqua", "codename": "aqua",
"repository": { "repository": {
"type": "git", "type": "git",

9
packages/client/src/components/MkChatPreview.vue
View file

@ -76,7 +76,6 @@ function isMe(message): boolean {
} }
&:hover { &:hover {
text-decoration: none !important;
.avatar { .avatar {
filter: saturate(200%); filter: saturate(200%);
} }
@ -140,10 +139,6 @@ function isMe(message): boolean {
> .body { > .body {
&:hover {
text-decoration: none !important;
}
> .text { > .text {
display: block; display: block;
margin: 0 0 0 0; margin: 0 0 0 0;
@ -154,10 +149,6 @@ function isMe(message): boolean {
font-size: 1.1em; font-size: 1.1em;
color: var(--faceText); color: var(--faceText);
&:hover {
text-decoration: none !important;
}
.me { .me {
opacity: 0.7; opacity: 0.7;
} }

2
packages/client/src/components/MkEmojiPicker.vue
View file

@ -70,7 +70,7 @@
</div> </div>
<div class="tabs"> <div class="tabs">
<button class="_button tab" :class="{ active: tab === 'index' }" @click="tab = 'index'"><i class="ph-asterisk-bold ph-lg ph-fw ph-lg"></i></button> <button class="_button tab" :class="{ active: tab === 'index' }" @click="tab = 'index'"><i class="ph-asterisk-bold ph-lg ph-fw ph-lg"></i></button>
<button class="_button tab" :class="{ active: tab === 'custom' }" @click="tab = 'custom'"><i class="ph-smiley-wink-bold ph-lg ph-fw ph-lg"></i></button> <button class="_button tab" :class="{ active: tab === 'custom' }" @click="tab = 'custom'"><i class="ph-smiley-bold ph-lg ph-fw ph-lg"></i></button>
<button class="_button tab" :class="{ active: tab === 'unicode' }" @click="tab = 'unicode'"><i class="ph-leaf-bold ph-lg ph-fw ph-lg"></i></button> <button class="_button tab" :class="{ active: tab === 'unicode' }" @click="tab = 'unicode'"><i class="ph-leaf-bold ph-lg ph-fw ph-lg"></i></button>
<button class="_button tab" :class="{ active: tab === 'tags' }" @click="tab = 'tags'"><i class="ph-hash-bold ph-lg ph-fw ph-lg"></i></button> <button class="_button tab" :class="{ active: tab === 'tags' }" @click="tab = 'tags'"><i class="ph-hash-bold ph-lg ph-fw ph-lg"></i></button>
</div> </div>

2
packages/client/src/components/MkNote.vue
View file

@ -79,7 +79,7 @@
<XRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/> <XRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/>
<XStarButton v-if="appearNote.myReaction == null" ref="starButton" class="button" :note="appearNote"/> <XStarButton v-if="appearNote.myReaction == null" ref="starButton" class="button" :note="appearNote"/>
<button v-if="appearNote.myReaction == null" ref="reactButton" class="button _button" @click="react()"> <button v-if="appearNote.myReaction == null" ref="reactButton" class="button _button" @click="react()">
<i class="ph-smiley-wink-bold ph-lg"></i> <i class="ph-smiley-bold ph-lg"></i>
</button> </button>
<button v-if="appearNote.myReaction != null" ref="reactButton" class="button _button reacted" @click="undoReact(appearNote)"> <button v-if="appearNote.myReaction != null" ref="reactButton" class="button _button reacted" @click="undoReact(appearNote)">
<i class="ph-minus-bold ph-lg"></i> <i class="ph-minus-bold ph-lg"></i>

2
packages/client/src/components/MkNoteDetailed.vue
View file

@ -89,7 +89,7 @@
<XRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/> <XRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/>
<XStarButton v-if="appearNote.myReaction == null" ref="starButton" class="button" :note="appearNote"/> <XStarButton v-if="appearNote.myReaction == null" ref="starButton" class="button" :note="appearNote"/>
<button v-if="appearNote.myReaction == null" ref="reactButton" class="button _button" @click="react()"> <button v-if="appearNote.myReaction == null" ref="reactButton" class="button _button" @click="react()">
<i class="ph-smiley-wink-bold ph-lg"></i> <i class="ph-smiley-bold ph-lg"></i>
</button> </button>
<button v-if="appearNote.myReaction != null" ref="reactButton" class="button _button reacted" @click="undoReact(appearNote)"> <button v-if="appearNote.myReaction != null" ref="reactButton" class="button _button reacted" @click="undoReact(appearNote)">
<i class="ph-minus-bold ph-lg"></i> <i class="ph-minus-bold ph-lg"></i>

2
packages/client/src/components/MkPostForm.vue
View file

@ -52,7 +52,7 @@
<button v-tooltip="i18n.ts.useCw" class="_button" :class="{ active: useCw }" @click="useCw = !useCw"><i class="ph-eye-slash-bold ph-lg"></i></button> <button v-tooltip="i18n.ts.useCw" class="_button" :class="{ active: useCw }" @click="useCw = !useCw"><i class="ph-eye-slash-bold ph-lg"></i></button>
<button v-tooltip="i18n.ts.mention" class="_button" @click="insertMention"><i class="ph-at-bold ph-lg"></i></button> <button v-tooltip="i18n.ts.mention" class="_button" @click="insertMention"><i class="ph-at-bold ph-lg"></i></button>
<button v-tooltip="i18n.ts.hashtags" class="_button" :class="{ active: withHashtags }" @click="withHashtags = !withHashtags"><i class="ph-hash-bold ph-lg"></i></button> <button v-tooltip="i18n.ts.hashtags" class="_button" :class="{ active: withHashtags }" @click="withHashtags = !withHashtags"><i class="ph-hash-bold ph-lg"></i></button>
<button v-tooltip="i18n.ts.emoji" class="_button" @click="insertEmoji"><i class="ph-smiley-wink-bold ph-lg"></i></button> <button v-tooltip="i18n.ts.emoji" class="_button" @click="insertEmoji"><i class="ph-smiley-bold ph-lg"></i></button>
<button v-if="postFormActions.length > 0" v-tooltip="i18n.ts.plugin" class="_button" @click="showActions"><i class="ph-plug-bold ph-lg"></i></button> <button v-if="postFormActions.length > 0" v-tooltip="i18n.ts.plugin" class="_button" @click="showActions"><i class="ph-plug-bold ph-lg"></i></button>
</footer> </footer>
<datalist id="hashtags"> <datalist id="hashtags">

1
packages/client/src/components/global/MkPageHeader.vue
View file

@ -297,7 +297,6 @@ onUnmounted(() => {
margin-right: 8px; margin-right: 8px;
width: 16px; width: 16px;
text-align: center; text-align: center;
transform: translateY(0.1em);
} }
> .title { > .title {

2
packages/client/src/pages/about.vue
View file

@ -140,7 +140,7 @@ let theTabs = [{
}, { }, {
key: 'emojis', key: 'emojis',
title: i18n.ts.customEmojis, title: i18n.ts.customEmojis,
icon: 'ph-smiley-wink-bold ph-lg', icon: 'ph-smiley-bold ph-lg',
}, { }, {
key: 'charts', key: 'charts',
title: i18n.ts.charts, title: i18n.ts.charts,

2
packages/client/src/pages/admin/emojis.vue
View file

@ -290,7 +290,7 @@ const headerTabs = $computed(() => [{
definePageMetadata(computed(() => ({ definePageMetadata(computed(() => ({
title: i18n.ts.customEmojis, title: i18n.ts.customEmojis,
icon: 'ph-smiley-wink-bold ph-lg', icon: 'ph-smiley-bold ph-lg',
}))); })));
</script> </script>

2
packages/client/src/pages/admin/index.vue
View file

@ -111,7 +111,7 @@ const menuDef = $computed(() => [{
to: '/admin/users', to: '/admin/users',
active: currentPage?.route.name === 'users', active: currentPage?.route.name === 'users',
}, { }, {
icon: 'ph-smiley-wink-bold ph-lg', icon: 'ph-smiley-bold ph-lg',
text: i18n.ts.customEmojis, text: i18n.ts.customEmojis,
to: '/admin/emojis', to: '/admin/emojis',
active: currentPage?.route.name === 'emojis', active: currentPage?.route.name === 'emojis',

2
packages/client/src/pages/messaging/messaging-room.form.vue
View file

@ -16,7 +16,7 @@
<div v-if="file" class="file" @click="file = null">{{ file.name }}</div> <div v-if="file" class="file" @click="file = null">{{ file.name }}</div>
<div class="buttons"> <div class="buttons">
<button class="_button" @click="chooseFile"><i class="ph-upload-bold ph-lg"></i></button> <button class="_button" @click="chooseFile"><i class="ph-upload-bold ph-lg"></i></button>
<button class="_button" @click="insertEmoji"><i class="ph-smiley-wink-bold ph-lg"></i></button> <button class="_button" @click="insertEmoji"><i class="ph-smiley-bold ph-lg"></i></button>
<button class="send _button" :disabled="!canSend || sending" :title="i18n.ts.send" @click="send"> <button class="send _button" :disabled="!canSend || sending" :title="i18n.ts.send" @click="send">
<template v-if="!sending"><i class="ph-paper-plane-tilt-bold ph-lg"></i></template><template v-if="sending"><i class="ph-circle-notch-bold ph-lg fa-pulse ph-fw ph-lg"></i></template> <template v-if="!sending"><i class="ph-paper-plane-tilt-bold ph-lg"></i></template><template v-if="sending"><i class="ph-circle-notch-bold ph-lg fa-pulse ph-fw ph-lg"></i></template>
</button> </button>

2
packages/client/src/pages/settings/index.vue
View file

@ -68,7 +68,7 @@ const menuDef = computed(() => [{
to: '/settings/privacy', to: '/settings/privacy',
active: currentPage?.route.name === 'privacy', active: currentPage?.route.name === 'privacy',
}, { }, {
icon: 'ph-smiley-wink-bold ph-lg', icon: 'ph-smiley-bold ph-lg',
text: i18n.ts.reaction, text: i18n.ts.reaction,
to: '/settings/reaction', to: '/settings/reaction',
active: currentPage?.route.name === 'reaction', active: currentPage?.route.name === 'reaction',

2
packages/client/src/pages/settings/reaction.vue
View file

@ -126,7 +126,7 @@ const headerTabs = $computed(() => []);
definePageMetadata({ definePageMetadata({
title: i18n.ts.reaction, title: i18n.ts.reaction,
icon: 'ph-smiley-wink-bold ph-lg', icon: 'ph-smiley-bold ph-lg',
action: { action: {
icon: 'ph-eye-bold ph-lg', icon: 'ph-eye-bold ph-lg',
handler: preview, handler: preview,

2
packages/client/src/pages/user/index.vue
View file

@ -103,7 +103,7 @@ const headerTabs = $computed(() => user ? [{
}, ...($i && ($i.id === user.id)) || user.publicReactions ? [{ }, ...($i && ($i.id === user.id)) || user.publicReactions ? [{
key: 'reactions', key: 'reactions',
title: i18n.ts.reaction, title: i18n.ts.reaction,
icon: 'ph-smiley-wink-bold ph-lg', icon: 'ph-smiley-bold ph-lg',
}] : [], { }] : [], {
key: 'clips', key: 'clips',
title: i18n.ts.clips, title: i18n.ts.clips,

22
packages/client/src/style.scss
View file

@ -97,9 +97,27 @@ a {
tap-highlight-color: transparent; tap-highlight-color: transparent;
-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;
&:hover { &::after {
text-decoration: underline; content: '';
position: absolute;
width: 100%;
transform: scaleX(0);
height: 2px;
bottom: 0;
left: 0;
background-color: var(--link);
transform-origin: bottom right;
transition: transform 0.25s ease-out;
} }
&:hover::after {
transform: scaleX(1);
transform-origin: bottom left;
}
}
i {
transform: translateY(0.1em);
} }
textarea, input { textarea, input {

2
packages/client/src/ui/_common_/navbar-for-mobile.vue
View file

@ -80,7 +80,7 @@ function openInstanceMenu(ev: MouseEvent) {
}, { }, {
type: 'link', type: 'link',
text: i18n.ts.customEmojis, text: i18n.ts.customEmojis,
icon: 'ph-smiley-wink-bold ph-lg', icon: 'ph-smiley-bold ph-lg',
to: '/about#emojis', to: '/about#emojis',
}, { }, {
type: 'link', type: 'link',

3
packages/client/src/ui/_common_/navbar.vue
View file

@ -133,7 +133,7 @@ function openInstanceMenu(ev: MouseEvent) {
}, { }, {
type: 'link', type: 'link',
text: i18n.ts.customEmojis, text: i18n.ts.customEmojis,
icon: 'ph-smiley-wink-bold ph-lg', icon: 'ph-smiley-bold ph-lg',
to: '/about#emojis', to: '/about#emojis',
}, { }, {
type: 'link', type: 'link',
@ -244,7 +244,6 @@ function more(ev: MouseEvent) {
display: inline-block; display: inline-block;
width: 55px; width: 55px;
aspect-ratio: 1; aspect-ratio: 1;
transform: translateY(0.2em);
} }
} }
} }

2
packages/client/src/ui/classic.sidebar.vue
View file

@ -146,7 +146,7 @@ function openInstanceMenu(ev: MouseEvent) {
}, { }, {
type: 'link', type: 'link',
text: i18n.ts.customEmojis, text: i18n.ts.customEmojis,
icon: 'ph-smiley-wink-bold ph-lg', icon: 'ph-smiley-bold ph-lg',
to: '/about#emojis', to: '/about#emojis',
}, { }, {
type: 'link', type: 'link',