chore: Remove older UI (#11720)

This commit is contained in:
Sivin Varghese
2025-07-01 09:43:44 +05:30
committed by GitHub
parent 58da92a252
commit 24ea968b00
369 changed files with 974 additions and 9363 deletions

View File

@@ -60,7 +60,7 @@ export default {
@apply flex items-center;
}
.user-identifier {
@apply text-xs ml-0.5 text-slate-700 dark:text-slate-100;
@apply text-xs ml-0.5 text-n-slate-12;
}
.option__user-data {
@apply flex flex-col flex-grow ml-2 mr-2;
@@ -73,10 +73,10 @@ export default {
@apply relative top-px mr-0.5 rtl:mr-0 rtl:ml-0.5;
}
.option__title {
@apply text-slate-800 dark:text-slate-100 font-medium mb-0.5;
@apply text-n-slate-12 font-medium mb-0.5;
}
.option__body {
@apply text-xs text-slate-700 dark:text-slate-100 mt-1;
@apply text-xs text-n-slate-12 mt-1;
}
.option__user-data .option__body {

View File

@@ -130,7 +130,7 @@ export default {
</div>
<div class="flex multiselect-wrap--medium">
<div
class="w-8 relative text-base text-slate-100 dark:text-slate-600 after:content-[''] after:h-12 after:w-0 ltr:after:left-4 rtl:after:right-4 after:absolute after:border-l after:border-solid after:border-slate-100 after:dark:border-slate-600 before:content-[''] before:h-0 before:w-4 ltr:before:left-4 rtl:before:right-4 before:top-12 before:absolute before:border-b before:border-solid before:border-slate-100 before:dark:border-slate-600"
class="w-8 relative text-base text-n-strong after:content-[''] after:h-12 after:w-0 ltr:after:left-4 rtl:after:right-4 after:absolute after:border-l after:border-solid after:border-n-strong before:content-[''] before:h-0 before:w-4 ltr:before:left-4 rtl:before:right-4 before:top-12 before:absolute before:border-b before:border-solid before:border-n-strong"
>
<fluent-icon
icon="arrow-up"

View File

@@ -17,9 +17,9 @@ export default {
<template>
<div
v-if="parentContactName"
class="my-4 relative p-2.5 border rounded-[4px] text-slate-800 dark:text-slate-100 border-slate-100 dark:border-slate-700 bg-white dark:bg-slate-800"
class="my-4 relative p-2.5 border rounded-[4px] text-n-slate-12 border-n-weak bg-n-background"
>
<h5 class="text-base font-medium text-slate-900 dark:text-white">
<h5 class="text-base font-medium text-n-slate-12">
{{ $t('MERGE_CONTACTS.SUMMARY.TITLE') }}
</h5>
<ul class="ml-0 list-none">

View File

@@ -257,7 +257,7 @@ export default {
<style lang="scss" scoped>
.menu-container {
@apply p-1 bg-white dark:bg-slate-900 shadow-xl rounded-md;
@apply p-1 bg-n-background shadow-xl rounded-md;
hr:first-child {
@apply hidden;
@@ -277,10 +277,6 @@ export default {
@apply font-medium text-base;
}
}
.modal-footer {
@apply pt-4 pb-8 px-8;
}
}
}
</style>

View File

@@ -41,6 +41,7 @@ const onTabChange = index => {
:name="item.name"
:count="item.count"
:show-badge="item.showBadge"
is-compact
/>
</woot-tabs>
</div>

View File

@@ -140,7 +140,7 @@ export default {
</div>
<div
v-if="isWidgetVisible"
class="widget-wrapper flex flex-col justify-between rounded-lg shadow-md bg-slate-25 dark:bg-slate-800 h-[31.25rem] w-80"
class="widget-wrapper flex flex-col justify-between rounded-lg shadow-md bg-n-slate-2 dark:bg-n-solid-1 h-[31.25rem] w-80"
>
<WidgetHead :config="getWidgetConfig" />
<div>
@@ -151,7 +151,7 @@ export default {
<WidgetFooter :config="getWidgetConfig" />
<div class="py-2.5 flex justify-center">
<a
class="items-center gap-0.5 text-slate-500 dark:text-slate-400 cursor-pointer flex filter grayscale opacity-90 hover:grayscale-0 hover:opacity-100 text-xxs"
class="items-center gap-0.5 text-n-slate-11 cursor-pointer flex filter grayscale opacity-90 hover:grayscale-0 hover:opacity-100 text-xxs"
>
<img
class="max-w-2.5 max-h-2.5"

View File

@@ -28,7 +28,7 @@ defineProps({
</div>
<div
class="bg-white shadow rounded-[1.25rem] rounded-bl-[0.25rem] px-4 py-3 inline-block text-sm text-slate-900 dark:text-white dark:bg-slate-700"
class="shadow rounded-[1.25rem] rounded-bl-[0.25rem] px-4 py-3 inline-block text-sm text-n-slate-12 bg-n-background dark:bg-n-solid-3"
>
<div>
<p class="m-0">

View File

@@ -27,16 +27,16 @@ const getStatusText = computed(() => {
<div class="relative flex flex-col w-full px-4">
<div
v-if="config.isDefaultScreen"
class="p-4 bg-white rounded-md shadow-sm dark:bg-slate-700"
class="p-4 rounded-md shadow-sm bg-n-background dark:bg-n-solid-2"
>
<div class="flex items-center justify-between">
<div>
<div
class="text-sm font-medium leading-4 text-slate-700 dark:text-slate-50"
class="text-sm font-medium leading-4 text-n-slate-12 dark:text-n-slate-50"
>
{{ getStatusText }}
</div>
<div class="mt-1 text-xs text-slate-500 dark:text-slate-100">
<div class="mt-1 text-xs text-n-slate-11">
{{ config.replyTime }}
</div>
</div>
@@ -44,7 +44,7 @@ const getStatusText = computed(() => {
</div>
<button
v-if="config.isDefaultScreen"
class="inline-flex items-center justify-between px-2 py-1 mt-1 -ml-2 font-medium leading-6 bg-transparent rounded-md text-slate-800 dark:bg-transparent dark:text-slate-50 hover:bg-slate-25 dark:hover:bg-slate-800"
class="inline-flex items-center justify-between px-2 py-1 mt-1 -ml-2 font-medium leading-6 bg-transparent rounded-md text-n-slate-12 dark:bg-transparent"
:style="{ color: config.color }"
>
<span class="pr-2 text-xs">
@@ -59,8 +59,8 @@ const getStatusText = computed(() => {
</div>
<div
v-else
class="flex items-center h-10 bg-white rounded-md dark:bg-slate-700"
:class="{ 'ring-2 ring-woot-500 dark:ring-woot-400': isInputFocused }"
class="flex items-center h-10 bg-white rounded-md dark:!bg-n-slate-3"
:class="{ 'ring-2 ring-n-brand dark:ring-n-brand': isInputFocused }"
>
<ResizableTextArea
id="chat-input"
@@ -68,7 +68,7 @@ const getStatusText = computed(() => {
:placeholder="
$t('INBOX_MGMT.WIDGET_BUILDER.FOOTER.CHAT_INPUT_PLACEHOLDER')
"
class="flex-grow !bg-white border-0 outline-none !outline-0 border-none h-8 text-sm dark:!bg-slate-700 pb-0 !pt-1.5 resize-none px-3 !mb-0 focus:outline-none rounded-md"
class="flex-grow !bg-white border-0 outline-none !outline-0 border-none h-8 text-sm dark:!bg-n-slate-3 pb-0 !pt-1.5 resize-none px-3 !mb-0 focus:outline-none rounded-md"
@focus="isInputFocused = true"
@blur="isInputFocused = false"
/>

View File

@@ -26,8 +26,8 @@ const isDefaultScreen = computed(() => {
class="rounded-t-lg flex-shrink-0 transition-[max-height] duration-300"
:class="
isDefaultScreen
? 'bg-slate-25 dark:bg-slate-800 px-4 py-5'
: 'bg-white dark:bg-slate-900 p-4'
? 'bg-n-slate-2 dark:bg-n-solid-1 px-4 py-5'
: 'bg-n-slate-2 dark:bg-n-solid-1 p-4'
"
>
<div class="relative top-px">
@@ -40,17 +40,15 @@ const isDefaultScreen = computed(() => {
/>
<div v-if="!isDefaultScreen">
<div class="flex items-center justify-start gap-1">
<span
class="text-base font-medium leading-3 text-slate-900 dark:text-white"
>
<span class="text-base font-medium leading-3 text-n-slate-12">
{{ config.websiteName }}
</span>
<div
v-if="config.isOnline"
class="w-2 h-2 bg-green-500 rounded-full"
class="w-2 h-2 bg-n-teal-10 rounded-full"
/>
</div>
<span class="mt-1 text-xs text-slate-600 dark:text-slate-400">
<span class="mt-1 text-xs text-n-slate-11">
{{ config.replyTime }}
</span>
</div>