summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components/MkKeyValue.vue
diff options
context:
space:
mode:
authorsyuilo <Syuilotan@yahoo.co.jp>2023-05-19 13:58:09 +0900
committersyuilo <Syuilotan@yahoo.co.jp>2023-05-19 13:58:09 +0900
commit6a5ef5b6f29eee9e36f42ac163f065880cd80e8b (patch)
tree4667e309d270252f28bd8b645e3ca85750b89b76 /packages/frontend/src/components/MkKeyValue.vue
parent:art: (diff)
downloadsharkey-6a5ef5b6f29eee9e36f42ac163f065880cd80e8b.tar.gz
sharkey-6a5ef5b6f29eee9e36f42ac163f065880cd80e8b.tar.bz2
sharkey-6a5ef5b6f29eee9e36f42ac163f065880cd80e8b.zip
refactor
Diffstat (limited to 'packages/frontend/src/components/MkKeyValue.vue')
-rw-r--r--packages/frontend/src/components/MkKeyValue.vue26
1 files changed, 13 insertions, 13 deletions
diff --git a/packages/frontend/src/components/MkKeyValue.vue b/packages/frontend/src/components/MkKeyValue.vue
index ff69c79641..4b6a775635 100644
--- a/packages/frontend/src/components/MkKeyValue.vue
+++ b/packages/frontend/src/components/MkKeyValue.vue
@@ -1,9 +1,9 @@
<template>
-<div class="alqyeyti" :class="{ oneline }">
- <div class="key">
+<div :class="[$style.root, { [$style.oneline]: oneline }]">
+ <div :class="$style.key">
<slot name="key"></slot>
</div>
- <div class="value">
+ <div :class="$style.value">
<slot name="value"></slot>
<button v-if="copy" v-tooltip="i18n.ts.copy" class="_textButton" style="margin-left: 0.5em;" @click="copy_"><i class="ti ti-copy"></i></button>
</div>
@@ -30,24 +30,18 @@ const copy_ = () => {
};
</script>
-<style lang="scss" scoped>
-.alqyeyti {
- > .key {
- font-size: 0.85em;
- padding: 0 0 0.25em 0;
- opacity: 0.75;
- }
-
+<style lang="scss" module>
+.root {
&.oneline {
display: flex;
- > .key {
+ .key {
width: 30%;
font-size: 1em;
padding: 0 8px 0 0;
}
- > .value {
+ .value {
width: 70%;
white-space: nowrap;
overflow: hidden;
@@ -55,4 +49,10 @@ const copy_ = () => {
}
}
}
+
+.key {
+ font-size: 0.85em;
+ padding: 0 0 0.25em 0;
+ opacity: 0.75;
+}
</style>