natty
/
calckey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

🎨

This commit is contained in:
syuilo 2021-10-03 02:46:58 +09:00
parent dcd216daff
commit 9cab659392
18 changed files with 50 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/client/components/channel-follow-button.vue
View File

@ -91,7 +91,7 @@ export default defineComponent({
width: 31px;
}
&:focus {
&:focus-visible {
&:after {
content: "";
pointer-events: none;

2
src/client/components/emoji-picker-window.vue
View File

@ -153,7 +153,7 @@ export default defineComponent({
height: var(--eachSize);
border-radius: 4px;
&:focus {
&:focus-visible {
outline: solid 2px var(--focus);
z-index: 1;
}

2
src/client/components/emoji-picker.vue
View File

@ -465,7 +465,7 @@ export default defineComponent({
height: var(--eachSize);
border-radius: 4px;
&:focus {
&:focus-visible {
outline: solid 2px var(--focus);
z-index: 1;
}

2
src/client/components/follow-button.vue
View File

@ -161,7 +161,7 @@ export default defineComponent({
width: 31px;
}
&:focus {
&:focus-visible {
&:after {
content: "";
pointer-events: none;

2
src/client/components/media-caption.vue
View File

@ -206,7 +206,7 @@ export default defineComponent({
min-width: 100%;
min-height: 90px;
&:focus {
&:focus-visible {
outline: none;
}

2
src/client/components/note.vue
View File

@ -888,7 +888,7 @@ export default defineComponent({
//content-visibility: auto;
//contain-intrinsic-size: 0 128px;
&:focus {
&:focus-visible {
outline: none;
&:after {

2
src/client/components/post-form.vue
View File

@ -819,7 +819,7 @@ export default defineComponent({
color: var(--fg);
font-family: inherit;
&:focus {
&:focus-visible {
outline: none;
}

17
src/client/components/ui/button.vue
View File

@ -1,7 +1,7 @@
<template>
<component class="bghgjjyj _button"
:is="link ? 'MkA' : 'button'"
:class="{ inline, primary, danger, full }"
:class="{ inline, primary, danger, rounded, full }"
:type="type"
@click="$emit('click', $event)"
@mousedown="onMousedown"
@ -27,6 +27,11 @@ export default defineComponent({
required: false,
default: false
},
rounded: {
type: Boolean,
required: false,
default: false
},
inline: {
type: Boolean,
required: false,
@ -124,8 +129,8 @@ export default defineComponent({
box-shadow: none;
text-decoration: none;
background: var(--buttonBg);
border-radius: 999px;
overflow: hidden;
border-radius: 4px;
overflow: clip;
box-sizing: border-box;
transition: background 0.1s ease;
@ -141,6 +146,10 @@ export default defineComponent({
width: 100%;
}
&.rounded {
border-radius: 999px;
}
&.primary {
font-weight: bold;
color: var(--fgOnAccent) !important;
@ -176,7 +185,7 @@ export default defineComponent({
opacity: 0.7;
}
&:focus {
&:focus-visible {
outline: solid 2px var(--focus);
outline-offset: 2px;
}

2
src/client/components/ui/menu.vue
View File

@ -206,7 +206,7 @@ export default defineComponent({
background: var(--accentDarken);
}
&:not(:active):focus {
&:not(:active):focus-visible {
box-shadow: 0 0 0 2px var(--focus) inset;
}

3
src/client/pages/messaging/index.vue
View File

@ -53,7 +53,8 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.messaging,
icon: 'fas fa-comments'
icon: 'fas fa-comments',
bg: 'var(--bg)',
},
fetching: true,
moreFetching: false,

2
src/client/pages/reversi/game.setting.vue
View File

@ -303,7 +303,7 @@ export default defineComponent({
-moz-appearance: none;
appearance: none;
&:focus,
&:focus-visible,
&:active {
border-color: var(--accent);
}

22
src/client/pages/settings/index.link.vue
View File

@ -1,13 +1,17 @@
<template>
<div class="qmfkfnzj">
<a class="main _button" :href="to" target="_blank" v-if="external">
<a v-if="external" class="main _button" :href="to" target="_blank">
<span class="icon"><slot name="icon"></slot></span>
<span class="text"><slot></slot></span>
</a>
<MkA class="main _button" :class="{ active }" :to="to" :behavior="behavior" v-else>
<MkA v-else-if="to" class="main _button" :class="{ active }" :to="to" :behavior="behavior">
<span class="icon"><slot name="icon"></slot></span>
<span class="text"><slot></slot></span>
</MkA>
<button v-else class="main _button button" :class="{ danger }">
<span class="icon"><slot name="icon"></slot></span>
<span class="text"><slot></slot></span>
</button>
</div>
</template>
@ -18,12 +22,16 @@ export default defineComponent({
props: {
to: {
type: String,
required: true
required: false
},
active: {
type: Boolean,
required: false
},
danger: {
type: Boolean,
required: false
},
external: {
type: Boolean,
required: false
@ -33,10 +41,6 @@ export default defineComponent({
required: false,
},
},
data() {
return {
};
}
});
</script>
@ -61,6 +65,10 @@ export default defineComponent({
background: var(--accentedBg);
}
&.danger {
color: var(--error);
}
> .icon {
width: 32px;
margin-right: 2px;

16
src/client/pages/settings/index.vue
View File

@ -33,12 +33,10 @@
<XLink :active="page === 'api'" replace to="/settings/api"><template #icon><i class="fas fa-key"></i></template>API</XLink>
<XLink :active="page === 'other'" replace to="/settings/other"><template #icon><i class="fas fa-ellipsis-h"></i></template>{{ $ts.other }}</XLink>
</div>
<FormGroup>
<FormButton @click="clear">{{ $ts.clearCache }}</FormButton>
</FormGroup>
<FormGroup>
<FormButton @click="logout" danger>{{ $ts.logout }}</FormButton>
</FormGroup>
<div class="group">
<XLink @click="clear"><template #icon><i class="fas fa-trash"></i></template>{{ $ts.clearCache }}</XLink>
<XLink @click="logout" danger><template #icon><i class="fas fa-sign-in-alt fa-flip-horizontal"></i></template>{{ $ts.logout }}</XLink>
</div>
</div>
<div class="main">
<component :is="component" :key="page" @info="onInfo" v-bind="pageProps"/>
@ -50,8 +48,6 @@
import { computed, defineAsyncComponent, defineComponent, nextTick, onMounted, reactive, ref, watch } from 'vue';
import { i18n } from '@client/i18n';
import XLink from './index.link.vue';
import FormGroup from '@client/components/debobigego/group.vue';
import FormButton from '@client/components/debobigego/button.vue';
import MkInfo from '@client/components/ui/info.vue';
import { scroll } from '@client/scripts/scroll';
import { signout } from '@client/account';
@ -63,8 +59,6 @@ import { $i } from '@client/account';
export default defineComponent({
components: {
XLink,
FormGroup,
FormButton,
MkInfo,
},
@ -220,7 +214,7 @@ export default defineComponent({
display: block;
width: 50px;
height: 50px;
margin: 0 auto 8px auto;
margin: 8px auto 16px auto;
}
}
}

4
src/client/style.scss
View File

@ -178,7 +178,7 @@ hr {
pointer-events: none;
}
&:focus {
&:focus-visible {
outline: none;
}
@ -509,7 +509,7 @@ hr {
padding: 5px;
}
.prism-editor__textarea:focus {
.prism-editor__textarea:focus-visible {
outline: none;
}

2
src/client/ui/chat/note.vue
View File

@ -872,7 +872,7 @@ export default defineComponent({
//content-visibility: auto;
//contain-intrinsic-size: 0 128px;
&:focus {
&:focus-visible {
outline: none;
}

2
src/client/ui/chat/post-form.vue
View File

@ -681,7 +681,7 @@ export default defineComponent({
color: var(--fg);
font-family: inherit;
&:focus {
&:focus-visible {
outline: none;
}

2
src/client/widgets/aiscript.vue
View File

@ -125,7 +125,7 @@ export default defineComponent({
box-sizing: border-box;
font: inherit;
&:focus {
&:focus-visible {
outline: none;
}
}

2
src/client/widgets/memo.vue
View File

@ -81,7 +81,7 @@ export default defineComponent({
font: inherit;
font-size: 0.9em;
&:focus {
&:focus-visible {
outline: none;
}
}