summaryrefslogtreecommitdiff
path: root/src/client/components/ui
diff options
context:
space:
mode:
authorsyuilo <Syuilotan@yahoo.co.jp>2021-10-03 02:46:58 +0900
committersyuilo <Syuilotan@yahoo.co.jp>2021-10-03 02:46:58 +0900
commit9cab659392a6ff9bacdc95742d4ff423c843b73f (patch)
treee958767b0f5589282a2720d58cfb26779de445c8 /src/client/components/ui
parent:art: (diff)
downloadsharkey-9cab659392a6ff9bacdc95742d4ff423c843b73f.tar.gz
sharkey-9cab659392a6ff9bacdc95742d4ff423c843b73f.tar.bz2
sharkey-9cab659392a6ff9bacdc95742d4ff423c843b73f.zip
:art:
Diffstat (limited to 'src/client/components/ui')
-rw-r--r--src/client/components/ui/button.vue17
-rw-r--r--src/client/components/ui/menu.vue2
2 files changed, 14 insertions, 5 deletions
diff --git a/src/client/components/ui/button.vue b/src/client/components/ui/button.vue
index 6e3cd485c8..53b973fe55 100644
--- a/src/client/components/ui/button.vue
+++ b/src/client/components/ui/button.vue
@@ -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;
}
diff --git a/src/client/components/ui/menu.vue b/src/client/components/ui/menu.vue
index 26b4b04b11..d1cf4f2db8 100644
--- a/src/client/components/ui/menu.vue
+++ b/src/client/components/ui/menu.vue
@@ -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;
}