matt/opnform-host-nginx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Better code split for faster pages + image compression

Browse Source
This commit is contained in:
Julien Nahum
2022-12-14 10:27:21 +01:00
parent cc0a656223
commit bd80cb58ec
48 changed files with 189 additions and 284 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
resources/js/components/forms/DateInput.vue
View File

@@ -9,8 +9,8 @@
<t-datepicker :id="id?id:name" ref="datepicker" v-model="compVal" class="datepicker" :disabled="disabled"
:class="{ 'ring-red-500 ring-2': hasValidation && form.errors.has(name), 'cursor-not-allowed bg-gray-200':disabled }"
:style="inputStyle" :name="name" :fixed-classes="fixedClasses" :range="dateRange"
:placeholder="placeholder" :timepicker="useTime"
:date-format="useTime?'Z':'Y-m-d'"
:placeholder="placeholder" :timepicker="useTime"
:date-format="useTime?'Z':'Y-m-d'"
:user-format="useTime ? amPm ? 'F j, Y - G:i K' : 'F j, Y - H:i' : 'F j, Y'"
:amPm="amPm"
:disabled-dates="disabledDates"
@@ -18,24 +18,107 @@
<small v-if="help" :class="theme.default.help">
<slot name="help">{{ help }}</slot>
</small>
<has-error v-if="hasValidation" :form="form" :field="name" />
<has-error v-if="hasValidation" :form="form" :field="name"/>
</div>
</template>
<script>
import { fixedClasses } from '../../plugins/config/vue-tailwind/datePicker'
import {fixedClasses} from '../../plugins/config/vue-tailwind/datePicker'
import inputMixin from '~/mixins/forms/input'
import VueTailwind from 'vue-tailwind'
import TDatepicker from 'vue-tailwind/dist/t-datepicker'
import Vue from 'vue'
const settings = {
't-datepicker': {
component: TDatepicker,
props: {
classes: {
dropdown: 'origin-top-left absolute rounded shadow bg-white dark:bg-notion-dark dark:border-gray-100 border overflow-hidden mt-1',
wrapper: 'flex flex-col',
dropdownWrapper: 'relative z-10',
enterClass: 'opacity-0 scale-95',
enterActiveClass: 'transition transform ease-out duration-100',
enterToClass: 'opacity-100 scale-100',
leaveClass: 'opacity-100 scale-100',
leaveActiveClass: 'transition transform ease-in duration-75',
leaveToClass: 'opacity-0 scale-95',
inlineWrapper: '',
inlineViews: 'rounded bg-white border mt-1 inline-flex',
inputWrapper: '',
input: 'text-black placeholder-gray-400 border-gray-300',
clearButton: 'hover:bg-gray-100 rounded transition duration-100 ease-in-out text-gray-600',
clearButtonIcon: '',
viewGroup: '',
view: '',
navigator: 'pt-2 px-3',
navigatorViewButton: 'transition ease-in-out duration-100 inline-flex cursor-pointer rounded-full px-2 py-1 -ml-1 hover:bg-gray-100',
navigatorViewButtonIcon: 'fill-current text-gray-400',
navigatorViewButtonBackIcon: 'fill-current text-gray-400',
navigatorViewButtonMonth: 'text-gray-700 font-semibold',
navigatorViewButtonYear: 'text-gray-500 ml-1',
navigatorViewButtonYearRange: 'text-gray-500 ml-1',
navigatorLabel: 'py-1',
navigatorLabelMonth: 'text-gray-700 font-semibold',
navigatorLabelYear: 'text-gray-500 ml-1',
navigatorPrevButton: 'transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-100 rounded-full p-1 ml-2 ml-auto disabled:opacity-50 disabled:cursor-not-allowed',
navigatorNextButton: 'transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-100 rounded-full p-1 -mr-1 disabled:opacity-50 disabled:cursor-not-allowed',
navigatorPrevButtonIcon: 'text-gray-400',
navigatorNextButtonIcon: 'text-gray-400',
calendarWrapper: 'px-3 pt-2',
calendarHeaderWrapper: '',
calendarHeaderWeekDay: 'uppercase text-xs text-gray-500 w-8 h-8 flex items-center justify-center',
calendarDaysWrapper: '',
calendarDaysDayWrapper: 'w-full h-8 flex flex-shrink-0 items-center',
otherMonthDay: 'text-sm rounded-full w-8 h-8 mx-auto hover:bg-blue-100 text-gray-400 disabled:opacity-50 disabled:cursor-not-allowed',
emptyDay: '',
inRangeFirstDay: 'text-sm bg-blue-500 text-white w-full h-8 rounded-l-full',
inRangeLastDay: 'text-sm bg-blue-500 text-white w-full h-8 rounded-r-full',
inRangeDay: 'text-sm bg-blue-200 w-full h-8 disabled:opacity-50 disabled:cursor-not-allowed',
selectedDay: 'text-sm rounded-full w-8 h-8 mx-auto bg-blue-500 text-white disabled:opacity-50 disabled:cursor-not-allowed',
activeDay: 'text-sm rounded-full bg-blue-100 w-8 h-8 mx-auto disabled:opacity-50 disabled:cursor-not-allowed',
highlightedDay: 'text-sm rounded-full bg-blue-200 w-8 h-8 mx-auto disabled:opacity-50 disabled:cursor-not-allowed',
day: 'text-sm rounded-full w-8 h-8 mx-auto hover:bg-blue-100 disabled:opacity-50 disabled:cursor-not-allowed',
today: 'text-sm rounded-full w-8 h-8 mx-auto hover:bg-blue-100 disabled:opacity-50 disabled:cursor-not-allowed border border-blue-500',
monthWrapper: 'px-3 pt-2',
selectedMonth: 'text-sm rounded w-full h-12 mx-auto bg-blue-500 text-white',
activeMonth: 'text-sm rounded w-full h-12 mx-auto bg-blue-100',
month: 'text-sm rounded w-full h-12 mx-auto hover:bg-blue-100',
yearWrapper: 'px-3 pt-2',
year: 'text-sm rounded w-full h-12 mx-auto hover:bg-blue-100',
selectedYear: 'text-sm rounded w-full h-12 mx-auto bg-blue-500 text-white',
activeYear: 'text-sm rounded w-full h-12 mx-auto bg-blue-100',
timepickerWrapper: 'flex items-center px-4 py-2 space-x-2',
timepickerTimeWrapper: 'flex items-center space-x-2',
timepickerTimeFieldsWrapper: 'bg-gray-100 dark:bg-notion-dark-light rounded-md w-full text-right flex items-center border border-gray-100 focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50',
timepickerOkButton: 'text-blue-600 text-sm uppercase font-semibold transition duration-100 ease-in-out border border-transparent focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50 rounded cursor-pointer',
timepickerInput: 'text-center w-8 border-transparent bg-transparent dark:bg-notion-dark-light p-0 h-6 text-sm transition duration-100 ease-in-out border border-transparent focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50 rounded',
timepickerTimeLabel: 'flex-grow text-sm text-gray-500',
timepickerAmPmWrapper: 'relative inline-flex flex-shrink-0 transition duration-200 ease-in-out bg-gray-100 dark:bg-notion-dark-light border border-transparent rounded cursor-pointer focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50',
timepickerAmPmWrapperChecked: 'relative inline-flex flex-shrink-0 transition duration-200 ease-in-out bg-gray-100 dark:bg-notion-dark-light border border-transparent rounded cursor-pointer focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50',
timepickerAmPmWrapperDisabled: 'relative inline-flex flex-shrink-0 transition duration-200 ease-in-out opacity-50 cursor-not-allowed',
timepickerAmPmWrapperCheckedDisabled: 'relative inline-flex flex-shrink-0 transition duration-200 ease-in-out opacity-50 cursor-not-allowed',
timepickerAmPmButton: 'absolute flex items-center justify-center w-6 h-6 text-xs text-gray-800 transition duration-200 ease-in-out transform translate-x-0 bg-white rounded shadow',
timepickerAmPmButtonChecked: 'absolute flex items-center justify-center w-6 h-6 text-xs text-gray-800 transition duration-200 ease-in-out transform translate-x-full bg-white rounded shadow',
timepickerAmPmCheckedPlaceholder: 'flex items-center justify-center w-6 h-6 text-xs text-gray-500 rounded-sm',
timepickerAmPmUncheckedPlaceholder: 'flex items-center justify-center w-6 h-6 text-xs text-gray-500 rounded-sm'
}
}
}
}
Vue.use(VueTailwind, settings)
export default {
name: 'DateInput',
mixins: [inputMixin],
props: {
withTime: { type: Boolean, default: false },
dateRange: { type: Boolean, default: false },
amPm: { type: Boolean, default: false },
disablePastDates: { type: Boolean, default: false },
disableFutureDates: { type: Boolean, default: false }
withTime: {type: Boolean, default: false},
dateRange: {type: Boolean, default: false},
amPm: {type: Boolean, default: false},
disablePastDates: {type: Boolean, default: false},
disableFutureDates: {type: Boolean, default: false}
},
data: () => ({
@@ -43,21 +126,21 @@ export default {
}),
computed: {
useTime () {
useTime() {
return this.withTime && !this.dateRange
}
},
watch: {
color: {
handler () {
handler() {
this.setInputColor()
},
immediate: true
}
},
mounted () {
mounted() {
fixedClasses.input = this.theme.default.input
this.setInputColor()
},
@@ -68,21 +151,21 @@ export default {
* @param event
* @returns {boolean}
*/
onEnterPress (event) {
onEnterPress(event) {
event.preventDefault()
return false
},
setInputColor () {
setInputColor() {
if (this.$refs.datepicker) {
const dateInput = this.$refs.datepicker.$el.getElementsByTagName('input')[0]
dateInput.style.setProperty('--tw-ring-color', this.color)
}
},
disabledDates (date) {
disabledDates(date) {
const today = new Date()
if(this.disablePastDates){
if (this.disablePastDates) {
return new Date(date.getFullYear(), date.getMonth(), date.getDate()) < new Date(today.getFullYear(), today.getMonth(), today.getDate())
} else if(this.disableFutureDates){
} else if (this.disableFutureDates) {
return new Date(date.getFullYear(), date.getMonth(), date.getDate()) > new Date(today.getFullYear(), today.getMonth(), today.getDate())
}
return false;

17
resources/js/components/forms/index.js vendored
View File

@@ -10,14 +10,11 @@ import VSelect from './components/VSelect'
import CheckboxInput from './CheckboxInput'
import SelectInput from './SelectInput'
import ColorInput from './ColorInput'
import RichTextAreaInput from './RichTextAreaInput'
import FileInput from './FileInput'
import ImageInput from './ImageInput'
import DateInput from './DateInput';
import RatingInput from './RatingInput';
import FlatSelectInput from './FlatSelectInput';
import ToggleSwitchInput from './ToggleSwitchInput';
import SimpleDateInput from './SimpleDateInput';
import RatingInput from './RatingInput'
import FlatSelectInput from './FlatSelectInput'
import ToggleSwitchInput from './ToggleSwitchInput'
// Components that are registered globaly.
[
@@ -33,12 +30,14 @@ import SimpleDateInput from './SimpleDateInput';
TextAreaInput,
FileInput,
ImageInput,
RichTextAreaInput,
DateInput,
RatingInput,
FlatSelectInput,
ToggleSwitchInput,
SimpleDateInput
].forEach(Component => {
Vue.component(Component.name, Component)
})
// Lazy load some heavy component
Vue.component('RichTextAreaInput', () => import('./RichTextAreaInput'))
Vue.component('DateInput', () => import('./DateInput'))
Vue.component('SimpleDateInput', () => import('./SimpleDateInput'))

3
resources/js/components/index.js vendored
View File

@@ -15,3 +15,6 @@ import Loader from './common/Loader'
].forEach(Component => {
Vue.component(Component.name, Component)
})
Vue.component('FormEditor', () => import('./open/forms/components/FormEditor'))
Vue.component('NotionPage', () => import('./open/NotionPage'))

2
resources/js/components/open/forms/fields/FormBlockOptionsModal.vue
View File

@@ -140,7 +140,7 @@
<script>
import ProTag from '../../../common/ProTag'
import FormBlockLogicEditor from '../components/form-logic-components/FormBlockLogicEditor'
const FormBlockLogicEditor = () => import('../components/form-logic-components/FormBlockLogicEditor')
import CodeInput from '../../../forms/CodeInput'
export default {

8
resources/js/components/open/forms/fields/FormFieldOptionsModal.vue
View File

@@ -188,7 +188,7 @@
>
Simple date input
</v-checkbox>
<select-input v-if="field.simple_date_input" v-model="field.simple_date_input_format" name="simple_date_input_format"
<select-input v-if="field.simple_date_input" v-model="field.simple_date_input_format" name="simple_date_input_format"
class="mt-4" :form="field" :options="dateFormatOptions"
label="Date format"
/>
@@ -360,12 +360,8 @@
<script>
import VButton from '../../../common/Button'
import ProTag from '../../../common/ProTag'
import TextInput from '../../../forms/TextInput'
import TextAreaInput from '../../../forms/TextAreaInput'
import timezones from '../../../../../data/timezones.json'
import FormBlockLogicEditor from '../components/form-logic-components/FormBlockLogicEditor'
const FormBlockLogicEditor = () => import('../components/form-logic-components/FormBlockLogicEditor')
export default {
name: 'FormFieldOptionsModal',

6
resources/js/pages/auth/login.vue
View File

@@ -45,9 +45,9 @@
Unlimited submissions
</p>
</div>
<div class="mt-3 p-6">
<testimonials />
</div>
<!-- <div class="mt-3 p-6">-->
<!-- <testimonials />-->
<!-- </div>-->
</div>
</div>
</div>

3
resources/js/pages/community/students-academics-ngos.vue
View File

@@ -13,11 +13,10 @@
</template>
<script>
import NotionPage from '../../components/open/NotionPage'
import OpenFormFooter from '../../components/pages/OpenFormFooter'
export default {
components: { OpenFormFooter, NotionPage },
components: { OpenFormFooter },
layout: 'default',
props: {

3
resources/js/pages/forms/create-guest.vue
View File

@@ -30,8 +30,6 @@ import {mapState, mapActions} from 'vuex'
import QuickRegister from '../auth/components/QuickRegister'
import initForm from "../../mixins/form_editor/initForm"
const FormEditor = () => import('../../components/open/forms/components/FormEditor')
const loadTemplates = function () {
store.commit('open/templates/startLoading')
store.dispatch('open/templates/loadIfEmpty').then(() => {
@@ -43,7 +41,6 @@ export default {
name: 'CreateFormGuest',
mixins: [initForm],
components: {
FormEditor,
QuickRegister
},

6
resources/js/pages/forms/create.vue
View File

@@ -23,8 +23,6 @@ import Form from 'vform'
import {mapState, mapActions} from 'vuex'
import initForm from "../../mixins/form_editor/initForm";
const FormEditor = () => import('../../components/open/forms/components/FormEditor')
const loadTemplates = function () {
store.commit('open/templates/startLoading')
store.dispatch('open/templates/loadIfEmpty').then(() => {
@@ -36,9 +34,7 @@ export default {
name: 'CreateForm',
mixins: [initForm],
components: {
FormEditor,
},
components: {},
metaInfo() {
return {title: 'Create a new Form'}

3
resources/js/pages/forms/edit.vue
View File

@@ -24,7 +24,6 @@ import Breadcrumb from '../../components/common/Breadcrumb'
import Form from 'vform'
import { mapState } from 'vuex'
const FormEditor = () => import('../../components/open/forms/components/FormEditor')
const loadForms = function () {
store.commit('open/forms/startLoading')
@@ -35,7 +34,7 @@ const loadForms = function () {
export default {
name: 'EditForm',
components: { Breadcrumb, FormEditor },
components: { Breadcrumb },
beforeRouteEnter (to, from, next) {
if (!store.getters['open/forms/getBySlug'](to.params.slug)) {

3
resources/js/pages/integrations.vue
View File

@@ -13,11 +13,10 @@
</template>
<script>
import NotionPage from '../components/open/NotionPage'
import OpenFormFooter from '../components/pages/OpenFormFooter'
export default {
components: { OpenFormFooter, NotionPage },
components: { OpenFormFooter },
layout: 'default',
props: {

3
resources/js/pages/legal-help/privacy-policy.vue
View File

@@ -13,11 +13,10 @@
</template>
<script>
import NotionPage from '../../components/open/NotionPage'
import OpenFormFooter from '../../components/pages/OpenFormFooter'
export default {
components: { OpenFormFooter, NotionPage },
components: { OpenFormFooter},
layout: 'default',
metaInfo () {

3
resources/js/pages/legal-help/terms-conditions.vue
View File

@@ -13,11 +13,10 @@
</template>
<script>
import NotionPage from '../../components/open/NotionPage'
import OpenFormFooter from '../../components/pages/OpenFormFooter'
export default {
components: { OpenFormFooter, NotionPage },
components: { OpenFormFooter },
layout: 'default',
metaInfo () {

82
resources/js/plugins/vue-plugins.js vendored
View File

@@ -2,91 +2,9 @@ import Vue from 'vue'
import PortalVue from 'portal-vue'
import VueTailwind from 'vue-tailwind'
import TDatepicker from 'vue-tailwind/dist/t-datepicker'
import Notifications from "vt-notifications"
Vue.use(PortalVue)
const settings = {
't-datepicker': {
component: TDatepicker,
props: {
classes: {
dropdown: 'origin-top-left absolute rounded shadow bg-white dark:bg-notion-dark dark:border-gray-100 border overflow-hidden mt-1',
wrapper: 'flex flex-col',
dropdownWrapper: 'relative z-10',
enterClass: 'opacity-0 scale-95',
enterActiveClass: 'transition transform ease-out duration-100',
enterToClass: 'opacity-100 scale-100',
leaveClass: 'opacity-100 scale-100',
leaveActiveClass: 'transition transform ease-in duration-75',
leaveToClass: 'opacity-0 scale-95',
inlineWrapper: '',
inlineViews: 'rounded bg-white border mt-1 inline-flex',
inputWrapper: '',
input: 'text-black placeholder-gray-400 border-gray-300',
clearButton: 'hover:bg-gray-100 rounded transition duration-100 ease-in-out text-gray-600',
clearButtonIcon: '',
viewGroup: '',
view: '',
navigator: 'pt-2 px-3',
navigatorViewButton: 'transition ease-in-out duration-100 inline-flex cursor-pointer rounded-full px-2 py-1 -ml-1 hover:bg-gray-100',
navigatorViewButtonIcon: 'fill-current text-gray-400',
navigatorViewButtonBackIcon: 'fill-current text-gray-400',
navigatorViewButtonMonth: 'text-gray-700 font-semibold',
navigatorViewButtonYear: 'text-gray-500 ml-1',
navigatorViewButtonYearRange: 'text-gray-500 ml-1',
navigatorLabel: 'py-1',
navigatorLabelMonth: 'text-gray-700 font-semibold',
navigatorLabelYear: 'text-gray-500 ml-1',
navigatorPrevButton: 'transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-100 rounded-full p-1 ml-2 ml-auto disabled:opacity-50 disabled:cursor-not-allowed',
navigatorNextButton: 'transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-100 rounded-full p-1 -mr-1 disabled:opacity-50 disabled:cursor-not-allowed',
navigatorPrevButtonIcon: 'text-gray-400',
navigatorNextButtonIcon: 'text-gray-400',
calendarWrapper: 'px-3 pt-2',
calendarHeaderWrapper: '',
calendarHeaderWeekDay: 'uppercase text-xs text-gray-500 w-8 h-8 flex items-center justify-center',
calendarDaysWrapper: '',
calendarDaysDayWrapper: 'w-full h-8 flex flex-shrink-0 items-center',
otherMonthDay: 'text-sm rounded-full w-8 h-8 mx-auto hover:bg-blue-100 text-gray-400 disabled:opacity-50 disabled:cursor-not-allowed',
emptyDay: '',
inRangeFirstDay: 'text-sm bg-blue-500 text-white w-full h-8 rounded-l-full',
inRangeLastDay: 'text-sm bg-blue-500 text-white w-full h-8 rounded-r-full',
inRangeDay: 'text-sm bg-blue-200 w-full h-8 disabled:opacity-50 disabled:cursor-not-allowed',
selectedDay: 'text-sm rounded-full w-8 h-8 mx-auto bg-blue-500 text-white disabled:opacity-50 disabled:cursor-not-allowed',
activeDay: 'text-sm rounded-full bg-blue-100 w-8 h-8 mx-auto disabled:opacity-50 disabled:cursor-not-allowed',
highlightedDay: 'text-sm rounded-full bg-blue-200 w-8 h-8 mx-auto disabled:opacity-50 disabled:cursor-not-allowed',
day: 'text-sm rounded-full w-8 h-8 mx-auto hover:bg-blue-100 disabled:opacity-50 disabled:cursor-not-allowed',
today: 'text-sm rounded-full w-8 h-8 mx-auto hover:bg-blue-100 disabled:opacity-50 disabled:cursor-not-allowed border border-blue-500',
monthWrapper: 'px-3 pt-2',
selectedMonth: 'text-sm rounded w-full h-12 mx-auto bg-blue-500 text-white',
activeMonth: 'text-sm rounded w-full h-12 mx-auto bg-blue-100',
month: 'text-sm rounded w-full h-12 mx-auto hover:bg-blue-100',
yearWrapper: 'px-3 pt-2',
year: 'text-sm rounded w-full h-12 mx-auto hover:bg-blue-100',
selectedYear: 'text-sm rounded w-full h-12 mx-auto bg-blue-500 text-white',
activeYear: 'text-sm rounded w-full h-12 mx-auto bg-blue-100',
timepickerWrapper: 'flex items-center px-4 py-2 space-x-2',
timepickerTimeWrapper: 'flex items-center space-x-2',
timepickerTimeFieldsWrapper: 'bg-gray-100 dark:bg-notion-dark-light rounded-md w-full text-right flex items-center border border-gray-100 focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50',
timepickerOkButton: 'text-blue-600 text-sm uppercase font-semibold transition duration-100 ease-in-out border border-transparent focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50 rounded cursor-pointer',
timepickerInput: 'text-center w-8 border-transparent bg-transparent dark:bg-notion-dark-light p-0 h-6 text-sm transition duration-100 ease-in-out border border-transparent focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50 rounded',
timepickerTimeLabel: 'flex-grow text-sm text-gray-500',
timepickerAmPmWrapper: 'relative inline-flex flex-shrink-0 transition duration-200 ease-in-out bg-gray-100 dark:bg-notion-dark-light border border-transparent rounded cursor-pointer focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50',
timepickerAmPmWrapperChecked: 'relative inline-flex flex-shrink-0 transition duration-200 ease-in-out bg-gray-100 dark:bg-notion-dark-light border border-transparent rounded cursor-pointer focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50',
timepickerAmPmWrapperDisabled: 'relative inline-flex flex-shrink-0 transition duration-200 ease-in-out opacity-50 cursor-not-allowed',
timepickerAmPmWrapperCheckedDisabled: 'relative inline-flex flex-shrink-0 transition duration-200 ease-in-out opacity-50 cursor-not-allowed',
timepickerAmPmButton: 'absolute flex items-center justify-center w-6 h-6 text-xs text-gray-800 transition duration-200 ease-in-out transform translate-x-0 bg-white rounded shadow',
timepickerAmPmButtonChecked: 'absolute flex items-center justify-center w-6 h-6 text-xs text-gray-800 transition duration-200 ease-in-out transform translate-x-full bg-white rounded shadow',
timepickerAmPmCheckedPlaceholder: 'flex items-center justify-center w-6 h-6 text-xs text-gray-500 rounded-sm',
timepickerAmPmUncheckedPlaceholder: 'flex items-center justify-center w-6 h-6 text-xs text-gray-500 rounded-sm'
}
}
}
}
Vue.use(VueTailwind, settings)
Vue.use(Notifications)
Vue.prototype.$getCrisp = () => {

4
resources/views/spa.blade.php
View File

@@ -48,6 +48,8 @@
</script>
{{-- Load the application scripts --}}
<script src="{{ mix('dist/js/manifest.js') }}"></script>
<script src="{{ mix('dist/js/vendor.js') }}"></script>
<script src="{{ mix('dist/js/app.js') }}"></script>
@if($config['google_analytics_code'])
@@ -60,7 +62,7 @@
gtag('js', new Date())
gtag('config', "{{ $config['google_analytics_code'] }}")
gtag('config', "{{ $config['google_analytics_code'] }}" {{ \Illuminate\Support\Facades\App::isProduction() ? '' : ', { send_page_view: false, debug_mode:true }' }})
</script>
@endif