diff options
| -rw-r--r-- | locales/ja-JP.yml | 2 | ||||
| -rw-r--r-- | src/client/app/config.ts | 2 | ||||
| -rw-r--r-- | src/client/app/desktop/views/components/ui.header.vue | 19 | ||||
| -rw-r--r-- | src/client/app/mobile/views/components/ui.header.vue | 18 | ||||
| -rw-r--r-- | src/client/app/mobile/views/components/ui.vue | 7 | ||||
| -rw-r--r-- | webpack.config.ts | 3 |
6 files changed, 46 insertions, 5 deletions
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 84b7ddb26f..6ebd167803 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -94,6 +94,8 @@ common: verified-user: "公式アカウント" disable-animated-mfm: "投稿内の動きのあるテキストを無効にする" + do-not-use-in-production: 'これは開発ビルドです。本番環境で使用しないでください。' + reversi: drawn: "引き分け" my-turn: "あなたのターンです" diff --git a/src/client/app/config.ts b/src/client/app/config.ts index 74b9ea21c8..a326c521db 100644 --- a/src/client/app/config.ts +++ b/src/client/app/config.ts @@ -4,6 +4,7 @@ declare const _THEME_COLOR_: string; declare const _COPYRIGHT_: string; declare const _VERSION_: string; declare const _CODENAME_: string; +declare const _ENV_: string; const address = new URL(location.href); @@ -18,3 +19,4 @@ export const themeColor = _THEME_COLOR_; export const copyright = _COPYRIGHT_; export const version = _VERSION_; export const codename = _CODENAME_; +export const env = _ENV_; diff --git a/src/client/app/desktop/views/components/ui.header.vue b/src/client/app/desktop/views/components/ui.header.vue index 6de4eaf744..ac8a6c7765 100644 --- a/src/client/app/desktop/views/components/ui.header.vue +++ b/src/client/app/desktop/views/components/ui.header.vue @@ -1,5 +1,6 @@ <template> <div class="header"> + <p class="warn" v-if="env != 'production'">%i18n:common.do-not-use-in-production%</p> <mk-special-message/> <div class="main" ref="main"> <div class="backdrop"></div> @@ -28,6 +29,7 @@ <script lang="ts"> import Vue from 'vue'; import * as anime from 'animejs'; +import { env } from '../../../config'; import XNav from './ui.header.nav.vue'; import XSearch from './ui.header.search.vue'; @@ -43,7 +45,13 @@ export default Vue.extend({ XAccount, XNotifications, XPost, - XClock, + XClock + }, + + data() { + return { + env: env + }; }, mounted() { @@ -119,6 +127,15 @@ root(isDark) width 100% box-shadow 0 1px 1px rgba(#000, 0.075) + > .warn + display block + margin 0 + padding 4px + text-align center + font-size 12px + background #f00 + color #fff + > .main height 48px diff --git a/src/client/app/mobile/views/components/ui.header.vue b/src/client/app/mobile/views/components/ui.header.vue index a616586c56..c9b3ab51ae 100644 --- a/src/client/app/mobile/views/components/ui.header.vue +++ b/src/client/app/mobile/views/components/ui.header.vue @@ -1,5 +1,6 @@ <template> -<div class="header"> +<div class="header" ref="root"> + <p class="warn" v-if="env != 'production'">%i18n:common.do-not-use-in-production%</p> <mk-special-message/> <div class="main" ref="main"> <div class="backdrop"></div> @@ -20,6 +21,7 @@ <script lang="ts"> import Vue from 'vue'; import * as anime from 'animejs'; +import { env } from '../../../config'; export default Vue.extend({ props: ['func'], @@ -27,7 +29,8 @@ export default Vue.extend({ return { hasGameInvitation: false, connection: null, - connectionId: null + connectionId: null, + env: env }; }, computed: { @@ -39,7 +42,7 @@ export default Vue.extend({ } }, mounted() { - this.$store.commit('setUiHeaderHeight', 48); + this.$store.commit('setUiHeaderHeight', this.$refs.root.offsetHeight); if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); @@ -133,6 +136,15 @@ root(isDark) height 3px background $theme-color + > .warn + display block + margin 0 + padding 4px + text-align center + font-size 12px + background #f00 + color #fff + > .main color rgba(#fff, 0.9) diff --git a/src/client/app/mobile/views/components/ui.vue b/src/client/app/mobile/views/components/ui.vue index 7e2d39f259..d2af15d235 100644 --- a/src/client/app/mobile/views/components/ui.vue +++ b/src/client/app/mobile/views/components/ui.vue @@ -31,7 +31,14 @@ export default Vue.extend({ connectionId: null }; }, + watch: { + '$store.state.uiHeaderHeight'() { + this.$el.style.paddingTop = this.$store.state.uiHeaderHeight + 'px'; + } + }, mounted() { + this.$el.style.paddingTop = this.$store.state.uiHeaderHeight + 'px'; + if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); diff --git a/webpack.config.ts b/webpack.config.ts index 1e295c245d..e520c59a92 100644 --- a/webpack.config.ts +++ b/webpack.config.ts @@ -73,7 +73,8 @@ const consts = { _VERSION_: version, _CODENAME_: codename, _LANG_: '%lang%', - _LANGS_: Object.keys(locales).map(l => [l, locales[l].meta.lang]) + _LANGS_: Object.keys(locales).map(l => [l, locales[l].meta.lang]), + _ENV_: process.env.NODE_ENV }; const _consts: { [ key: string ]: any } = {}; |