feat: multiple UX improvements to labels (#7358)
Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com> Co-authored-by: Nithin David Thomas <1277421+nithindavid@users.noreply.github.com>
This commit is contained in:
25
app/javascript/dashboard/components/base/Hotkey.vue
Normal file
25
app/javascript/dashboard/components/base/Hotkey.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
<kbd class="hotkey">
|
||||
<slot />
|
||||
</kbd>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
kbd.hotkey {
|
||||
display: inline-flex;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
user-select: none;
|
||||
justify-content: center;
|
||||
padding: var(--space-micro);
|
||||
min-width: var(--space-normal);
|
||||
font-size: var(--font-size-micro);
|
||||
border-radius: var(--space-smaller);
|
||||
background-color: var(--color-background);
|
||||
border: 1px solid var(--color-border);
|
||||
text-transform: uppercase;
|
||||
color: var(--color-body);
|
||||
letter-spacing: var(--space-micro);
|
||||
line-height: var(--font-size-micro);
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user