diff --git a/src/renderer/components/ft-prompt/ft-prompt.css b/src/renderer/components/ft-prompt/ft-prompt.css new file mode 100644 index 00000000..2cf0eeee --- /dev/null +++ b/src/renderer/components/ft-prompt/ft-prompt.css @@ -0,0 +1,19 @@ +.prompt { + position: fixed; + top: 0px; + left: 0px; + width: 100vw; + height: 100vh; + background-color: rgba(0, 0, 0, 0.7); + z-index: 10; + padding: 15px; +} + +.promptCard { + width: 95%; + margin-top: 40%; +} + +.center { + text-align: center; +} diff --git a/src/renderer/components/ft-prompt/ft-prompt.js b/src/renderer/components/ft-prompt/ft-prompt.js new file mode 100644 index 00000000..e57a939f --- /dev/null +++ b/src/renderer/components/ft-prompt/ft-prompt.js @@ -0,0 +1,34 @@ +import Vue from 'vue' +import FtCard from '../../components/ft-card/ft-card.vue' +import FtFlexBox from '../../components/ft-flex-box/ft-flex-box.vue' +import FtButton from '../../components/ft-button/ft-button.vue' + +export default Vue.extend({ + name: 'FtPrompt', + components: { + 'ft-card': FtCard, + 'ft-flex-box': FtFlexBox, + 'ft-button': FtButton + }, + props: { + label: { + type: String, + default: '' + }, + optionNames: { + type: Array, + default: () => { return [] } + }, + optionValues: { + type: Array, + default: () => { return [] } + } + }, + methods: { + handleHide: function (event) { + if (event.target.className === 'prompt') { + this.$emit('click', null) + } + } + } +}) diff --git a/src/renderer/components/ft-prompt/ft-prompt.vue b/src/renderer/components/ft-prompt/ft-prompt.vue new file mode 100644 index 00000000..62d88ac0 --- /dev/null +++ b/src/renderer/components/ft-prompt/ft-prompt.vue @@ -0,0 +1,23 @@ + + +