Skip to content

Commit

Permalink
fix modals using Novas own modal component
Browse files Browse the repository at this point in the history
  • Loading branch information
@bastihilger
bastihilger committed Aug 20, 2023
1 parent 9ee2546 commit 21ebea1
Show file tree
Hide file tree
Showing 6 changed files with 40 additions and 98 deletions.
2 changes: 1 addition & 1 deletion dist/js/field.js
View file

Large diffs are not rendered by default.

12 changes: 0 additions & 12 deletions dist/js/field.js.LICENSE.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,6 @@
* @license MIT
*/

/*!
* Font Awesome Free 6.1.1 by @fontawesome - https://fontawesome.com
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
* Copyright 2022 Fonticons, Inc.
*/

/*!
* Font Awesome Pro 6.1.1 by @fontawesome - https://fontawesome.com
* License - https://fontawesome.com/license (Commercial License)
* Copyright 2022 Fonticons, Inc.
*/

/*!
* condense-newlines <https://github.com/jonschlinkert/condense-newlines>
*
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@
"lodash": "^4.17.21",
"lowlight": "^2.6.1",
"npm": "^7.17.0",
"portal-vue": "^2.1.7",
"portal-vue": "^3.0",
"pretty": "^2.0.0",
"vue": "^3.2.33",
"vue-loader": "^17.0.0",
Expand Down
42 changes: 0 additions & 42 deletions resources/js/components/Modal.vue
View file

This file was deleted.

70 changes: 34 additions & 36 deletions resources/js/components/buttons/ImageButton.vue
View file
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
<template>
<span style="z-index: 10">
<Modal
:isActive="imageMenuIsActive"
:hideMethod="hideImageMenu"
<Modal
:show="imageMenuIsActive"
tabindex="-1"
>
<div class="px-8 py-8 bg-white">
<div
<div
v-if="!imageIsActive && withFileUpload"
>
<span
class="uppercase cursor-pointer font-bold text-sm border-b"
<span
class="inline-block uppercase cursor-pointer font-bold text-sm border-b mr-4"
:class="{
'text-primary-500 border-primary-500': imageMode == 'file',
'text-gray-500 border-transparent': imageMode != 'file'
Expand All @@ -19,8 +19,8 @@
>
</span>

<span
class="ml-4 uppercase cursor-pointer font-bold text-sm border-b"
<span
class="inline-block uppercase cursor-pointer font-bold text-sm border-b"
:class="{
'text-primary-500 border-primary-500': imageMode == 'url',
'text-gray-500 border-transparent': imageMode != 'url'
Expand All @@ -31,52 +31,52 @@
</span>
</div>

<div
<div
v-if="!imageIsActive"
style="padding-top: 32px;"
>
<div v-if="withFileUpload" v-show="imageMode == 'file'">
<div
<div
class="flex items-center"
:class="{
'pointer-events-none opacity-50': uploading
}"
>
<label
}"
>
<label
class="
relative bg-primary-500 text-white rounded
font-bold shadow py-1 px-4 cursor-pointer
"
>
<input
<input
ref="fileInput"
type="file"
type="file"
@change="changeFile($event.target.files)"
accept="image/*"
accept="image/*"
class="w-full h-full absolute top-0 left-0"
style="opacity: 0"
/>
<span v-text="ttt('select file')"></span>
</label>

<div
<div
class="h-16 flex items-center"
style="margin-left: 16px;"
>
<span
<span
v-if="!preview"
v-text="ttt('no file selected')"
>
>
</span>
<img
v-if="preview"
:src="preview"
class="w-auto"
<img
v-if="preview"
:src="preview"
class="w-auto"
style="height: 64px"
/>
</div>

<div
<div
v-if="file"
@click="removeFile()"
class="
Expand All @@ -89,14 +89,14 @@
</div>
</div>

<div
<div
class="w-full h-2"
:class="{
'bg-gray-200': uploading
}"
style="margin-top: 16px"
>
<div
<div
class="
bg-primary-400 h-full
"
Expand All @@ -108,8 +108,8 @@
</div>
</div>
</div>
<div

<div
class=""
v-show="imageMode == 'url'"
>
Expand Down Expand Up @@ -147,7 +147,7 @@
/>
</div>

<div
<div
class="grid grid-cols-2 gap-3 mt-3"
>
<div class="flex flex-col">
Expand Down Expand Up @@ -183,7 +183,7 @@
</div>
</div>

<div class="bg-gray-200 px-8 py-3">
<div class="bg-gray-200 px-8 py-3">
<div class="flex items-center justify-end">
<button
type="button"
Expand All @@ -203,7 +203,7 @@
font-bold shadow py-1 px-4 cursor-pointer
"
:style="((imageMode == 'url' && !url) || (imageMode == 'file' && !file)) ? 'opacity: 0.5' : ''"

:disabled="!imageIsActive && ((imageMode == 'url' && !url) || (imageMode == 'file' && !file))"
@click="imageIsActive ? updateImage($event) : (imageMode == 'url' ? addImageFromUrl($event) : uploadAndAddImage($event))"
v-text="imageIsActive ? ttt('update image') : (imageMode == 'url' ? ttt('add image') : ttt('upload and add image'))"
Expand All @@ -221,10 +221,10 @@
:icon="['fas', 'image']"
:title="!imageIsActive ? ttt('add image') : ttt('edit image')"
>

</base-button>


</span>
</span>
</template>
Expand All @@ -235,7 +235,6 @@ import { library } from '@fortawesome/fontawesome-svg-core';
import { faTimesCircle, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import BaseButton from './BaseButton.vue';
import Modal from '../Modal.vue';
import translations from '../../mixins/translations';
Expand Down Expand Up @@ -271,7 +270,6 @@ export default {
components: {
FontAwesomeIcon,
BaseButton,
Modal,
},
computed: {
Expand Down
10 changes: 4 additions & 6 deletions resources/js/components/buttons/LinkButton.vue
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
<template>
<span>
<Modal
:isActive="linkMenuIsActive"
:hideMethod="hideLinkMenu"
:show="linkMenuIsActive"
tabindex="-1"
>
<div class="px-8 py-8 bg-white">
<template v-if="withFileUpload">
<span
class="
uppercase cursor-pointer font-bold text-sm border-b
inline-block uppercase cursor-pointer font-bold text-sm border-b mr-4
"
:class="{
'text-primary-500 border-primary-500': linkMode == 'url',
Expand All @@ -20,7 +20,7 @@
</span>

<span
class="ml-4 uppercase cursor-pointer font-bold text-sm border-b"
class="inline-block uppercase cursor-pointer font-bold text-sm border-b"
:class="{
'text-primary-500 border-primary-500': linkMode == 'file',
'text-gray-500 border-transparent': linkMode != 'file'
Expand Down Expand Up @@ -302,7 +302,6 @@ import { library } from '@fortawesome/fontawesome-svg-core';
import { faTimesCircle } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import BaseButton from './BaseButton.vue';
import Modal from '../Modal.vue';
import translations from '../../mixins/translations';
Expand Down Expand Up @@ -341,7 +340,6 @@ export default {
components: {
FontAwesomeIcon,
BaseButton,
Modal,
},
computed: {
Expand Down

0 comments on commit 21ebea1

Please sign in to comment.