scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-11-02 20:18:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: Add "Coming Soon" overlay to voice channel selector (#11835)

Browse Source 
# Pull Request Template

###  Screenshots

**Dark**
<img width="867" alt="image"
src="https://github.com/user-attachments/assets/74f6da33-1fa1-4472-84b8-5d097f4a00e1"
/>

**Light**
<img width="867" alt="image"
src="https://github.com/user-attachments/assets/5e6d5a4c-cd95-462b-baea-ff3ac333153c"
/>

---------

Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
This commit is contained in:
Sivin Varghese
2025-06-30 14:30:09 +05:30
committed by GitHub
parent b1893c7d96
commit d7c10b4f2a
4 changed files with 27 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
app/javascript/dashboard/components/ChannelSelector.vue
View File

@@ -9,20 +9,31 @@ export default {
type: String,
required: true,
},
isComingSoon: {
type: Boolean,
default: false,
},
},
};
</script>
<template>
<button
class="bg-white dark:bg-slate-900 cursor-pointer flex flex-col justify-end transition-all duration-200 ease-in -m-px py-4 px-0 items-center border border-solid border-slate-25 dark:border-slate-800 hover:border-woot-500 dark:hover:border-woot-500 hover:shadow-md hover:z-50 disabled:opacity-60"
class="relative bg-n-background cursor-pointer flex flex-col justify-end transition-all duration-200 ease-in -m-px py-4 px-0 items-center border border-solid border-n-weak hover:border-n-brand hover:shadow-md hover:z-50 disabled:opacity-60"
>
<img :src="src" :alt="title" draggable="false" class="w-1/2 my-4 mx-auto" />
<h3
class="text-slate-800 dark:text-slate-100 text-base text-center capitalize"
>
<h3 class="text-n-slate-12 text-base text-center capitalize">
{{ title }}
</h3>
<div
v-if="isComingSoon"
class="absolute inset-0 flex items-center justify-center backdrop-blur-[2px] rounded-md bg-gradient-to-br from-n-background/90 via-n-background/70 to-n-background/95"
>
<span class="text-n-slate-12 font-medium text-base">
{{ $t('CHANNEL_SELECTOR.COMING_SOON') }} 🚀
</span>
</div>
</button>
</template>
@@ -33,7 +44,7 @@ export default {
}
&:hover {
@apply border-transparent shadow-none cursor-not-allowed;
@apply border-n-strong shadow-none cursor-not-allowed;
}
}
</style>