diff --git a/package.json b/package.json index 401f7d286..110145366 100644 --- a/package.json +++ b/package.json @@ -210,7 +210,6 @@ "vue": "2.5.17", "vue-chartjs": "3.4.0", "vue-cropperjs": "2.2.1", - "vue-js-modal": "1.3.24", "vue-json-tree-view": "2.1.4", "vue-loader": "15.4.1", "vue-router": "3.0.1", diff --git a/src/client/app/app.styl b/src/client/app/app.styl index 431b9daa6..aaa0d34c7 100644 --- a/src/client/app/app.styl +++ b/src/client/app/app.styl @@ -126,3 +126,13 @@ pre [data-fa] display inline-block + +.modal-backdrop + z-index 10000 !important + +.modal-content-wrapper + z-index 10001 !important + +.modal-content + padding 0 !important + background-color transparent !important diff --git a/src/client/app/desktop/views/pages/welcome.vue b/src/client/app/desktop/views/pages/welcome.vue index ac2f921a2..37c776130 100644 --- a/src/client/app/desktop/views/pages/welcome.vue +++ b/src/client/app/desktop/views/pages/welcome.vue @@ -37,9 +37,12 @@ <div class="tl"> <mk-welcome-timeline :max="20"/> </div> - <modal name="signup" width="500px" height="auto" scrollable> - <header :class="$style.signupFormHeader">%i18n:@signup%</header> - <mk-signup :class="$style.signupForm"/> + + <modal name="signup"> + <div :class="$style.modal"> + <header :class="$style.signupFormHeader">%i18n:@signup%</header> + <mk-signup :class="$style.signupForm"/> + </div> </modal> </div> </template> @@ -88,10 +91,10 @@ export default Vue.extend({ this.$refs.pointer.style.left = x.left + 'px'; }, signup() { - this.$modal.show('signup'); + this.$modal.push('signup'); }, signin() { - this.$modal.show('signin'); + this.$modal.push('signin'); }, dark() { this.$store.commit('device/set', { @@ -265,6 +268,10 @@ root(isDark) </style> <style lang="stylus" module> +.modal + width 500px + background #fff !important + .signupForm padding 24px 48px 48px 48px diff --git a/src/client/app/init.ts b/src/client/app/init.ts index dd31f0747..0b2250987 100644 --- a/src/client/app/init.ts +++ b/src/client/app/init.ts @@ -5,7 +5,6 @@ import Vue from 'vue'; import Vuex from 'vuex'; import VueRouter from 'vue-router'; -import VModal from 'vue-js-modal'; import * as TreeView from 'vue-json-tree-view'; import VAnimateCss from 'v-animate-css'; import Element from 'element-ui'; @@ -28,7 +27,6 @@ switch (lang) { Vue.use(Vuex); Vue.use(VueRouter); -Vue.use(VModal); Vue.use(TreeView); Vue.use(VAnimateCss); Vue.use(Element, { locale: elementLocale }); diff --git a/src/client/app/mobile/style.styl b/src/client/app/mobile/style.styl index f78146f8b..df8f4a8fa 100644 --- a/src/client/app/mobile/style.styl +++ b/src/client/app/mobile/style.styl @@ -17,13 +17,3 @@ body display flex flex-direction column min-height 100% - -.modal-backdrop - z-index 10000 !important - -.modal-content-wrapper - z-index 10001 !important - -.modal-content - padding 0 !important - background-color transparent !important