akadmin/chatwoot
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

chore: review comments

Browse Source
This commit is contained in:
Muhsin Keloth
2024-04-25 13:06:20 +05:30
parent a91ed07a46
commit d3c22e22fd
1 changed files with 16 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/javascript/v3/components/Form/Button.vue
+16 -18
View File
@@ -36,6 +36,7 @@ const props = defineProps({
size: {
type: String,
default: '',
validator: value => ['medium', 'large'].includes(value),
},
icon: {
type: String,
@@ -50,6 +51,12 @@ const props = defineProps({
const emits = defineEmits(['click']);
const attrs = useAttrs();
const baseClasses = {
outline: 'outline outline-1 -outline-offset-1 focus:ring focus:ring-offset-1',
ghost: 'hover:text-600 active:text-600 focus:ring focus:ring-offset-1',
default: ' hover:bg-700 active:bg-700 focus:ring focus:ring-offset-1',
};
const colorClass = computed(() => {
if (attrs.disabled) {
return 'bg-ash-200 text-ash-600 cursor-not-allowed';
@@ -57,28 +64,19 @@ const colorClass = computed(() => {
const styleMap = {
primary: {
outline:
'text-primary-800 outline outline-1 -outline-offset-1 outline-primary-400 hover:text-primary-600 active:text-primary-600 focus:ring focus:ring-offset-1 focus:ring-primary-400',
ghost:
'text-primary-800 hover:text-primary-600 active:text-primary-600 focus:ring focus:ring-offset-1 focus:ring-primary-400',
default:
'bg-primary-600 outline-primary-600 text-white hover:bg-primary-700 active:bg-primary-700 focus:ring focus:ring-offset-1 focus:ring-primary-400',
outline: `${baseClasses.outline} outline-primary-400 hover:text-primary-600 active:text-primary-600 focus:ring-primary-400`,
ghost: `${baseClasses.ghost} focus:ring-primary-400`,
default: `bg-primary-600 text-white ${baseClasses.default} focus:ring-primary-400`,
},
secondary: {
outline:
'text-ash-800 outline outline-1 -outline-offset-1 outline-ash-400 hover:text-ash-600 active:text-ash-600 focus:ring focus:ring-offset-1 focus:ring-ash-400',
ghost:
'text-ash-800 hover:text-ash-600 active:text-ash-600 focus:ring focus:ring-offset-1 focus:ring-ash-400',
default:
'bg-ash-100 text-ash-900 hover:bg-ash-200 active:bg-ash-200 focus:ring focus:ring-offset-1 focus:ring-ash-400',
outline: `${baseClasses.outline} outline-ash-400 hover:text-ash-600 active:text-ash-600 focus:ring-ash-400`,
ghost: `${baseClasses.ghost} focus:ring-ash-400`,
default: `bg-ash-100 text-ash-900 ${baseClasses.default} focus:ring-ash-400`,
},
danger: {
outline:
'text-ruby-800 outline outline-1 -outline-offset-1 outline-ruby-400 hover:text-ruby-600 active:text-ruby-600 focus:ring focus:ring-offset-1 focus:ring-ruby-400',
ghost:
'text-ruby-800 hover:text-ruby-600 active:text-ruby-600 focus:ring focus:ring-offset-1 focus:ring-ruby-400',
default:
'bg-ruby-600 text-white hover:bg-ruby-700 active:bg-ruby-700 focus:ring focus:ring-offset-1 focus:ring-ruby-400',
outline: `${baseClasses.outline} outline-ruby-400 hover:text-ruby-600 active:text-ruby-600 focus:ring-ruby-400`,
ghost: `${baseClasses.ghost} focus:ring-ruby-400`,
default: `bg-ruby-600 text-white ${baseClasses.default} focus:ring-ruby-400`,
},
};