test/crm
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: modal layout for mobile view

Browse Source
This commit is contained in:
Shariq Ansari 2024-06-05 18:32:40 +05:30
parent 7f42beea69
commit 19826d4250
4 changed files with 16 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/components/Fields.vue
View File

@ -9,7 +9,9 @@
<div <div
class="grid gap-4" class="grid gap-4"
:class=" :class="
section.columns ? 'grid-cols-' + section.columns : 'grid-cols-3' section.columns
? 'grid-cols-' + section.columns
: 'grid-cols-2 sm:grid-cols-3'
" "
> >
<div v-for="field in section.fields" :key="field.name"> <div v-for="field in section.fields" :key="field.name">
@ -131,6 +133,7 @@ import UserAvatar from '@/components/UserAvatar.vue'
import Link from '@/components/Controls/Link.vue' import Link from '@/components/Controls/Link.vue'
import { usersStore } from '@/stores/users' import { usersStore } from '@/stores/users'
import { Tooltip } from 'frappe-ui' import { Tooltip } from 'frappe-ui'
import { isMobileView } from '@/composables/settings'
const { getUser } = usersStore() const { getUser } = usersStore()

2
frontend/src/components/Modals/DealModal.vue
View File

@ -7,7 +7,7 @@
}" }"
> >
<template #body-content> <template #body-content>
<div class="mb-4 grid grid-cols-3 gap-4"> <div class="mb-4 grid sm:grid-cols-3 grid-cols-1 gap-4">
<div class="flex items-center gap-3 text-sm text-gray-600"> <div class="flex items-center gap-3 text-sm text-gray-600">
<div>{{ __('Choose Existing Organization') }}</div> <div>{{ __('Choose Existing Organization') }}</div>
<Switch v-model="chooseExistingOrganization" /> <Switch v-model="chooseExistingOrganization" />

2
frontend/src/components/Modals/EmailTemplateModal.vue
View File

@ -15,7 +15,7 @@
> >
<template #body-content> <template #body-content>
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<div class="flex gap-4"> <div class="flex sm:flex-row flex-col gap-4">
<div class="flex-1"> <div class="flex-1">
<div class="mb-1.5 text-sm text-gray-600"> <div class="mb-1.5 text-sm text-gray-600">
{{ __('Name') }} {{ __('Name') }}

14
frontend/src/components/Modals/TaskModal.vue
View File

@ -22,7 +22,9 @@
variant="outline" variant="outline"
size="sm" size="sm"
:label=" :label="
task.reference_doctype == 'CRM Deal' ? __('Open Deal') : __('Open Lead') task.reference_doctype == 'CRM Deal'
? __('Open Deal')
: __('Open Lead')
" "
@click="redirect()" @click="redirect()"
> >
@ -44,7 +46,9 @@
/> />
</div> </div>
<div> <div>
<div class="mb-1.5 text-sm text-gray-600">{{ __('Description') }}</div> <div class="mb-1.5 text-sm text-gray-600">
{{ __('Description') }}
</div>
<TextEditor <TextEditor
variant="outline" variant="outline"
ref="description" ref="description"
@ -52,10 +56,12 @@
:bubbleMenu="true" :bubbleMenu="true"
:content="_task.description" :content="_task.description"
@change="(val) => (_task.description = val)" @change="(val) => (_task.description = val)"
:placeholder="__('Took a call with John Doe and discussed the new project.')" :placeholder="
__('Took a call with John Doe and discussed the new project.')
"
/> />
</div> </div>
<div class="flex items-center gap-2 overflow-x-auto"> <div class="flex flex-wrap items-center gap-2">
<Dropdown :options="taskStatusOptions(updateTaskStatus)"> <Dropdown :options="taskStatusOptions(updateTaskStatus)">
<Button :label="_task.status" class="w-full justify-between"> <Button :label="_task.status" class="w-full justify-between">
<template #prefix> <template #prefix>