From 9cab659392a6ff9bacdc95742d4ff423c843b73f Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sun, 3 Oct 2021 02:46:58 +0900
Subject: :art:

---
 src/client/components/ui/button.vue | 17 +++++++++++++----
 src/client/components/ui/menu.vue   |  2 +-
 2 files changed, 14 insertions(+), 5 deletions(-)

(limited to 'src/client/components/ui')

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;
 		}
 
-- 
cgit v1.2.3-freya