diff --git a/packages/client/src/ui/_common_/common.vue b/packages/client/src/ui/_common_/common.vue index 98069258d..98364b963 100644 --- a/packages/client/src/ui/_common_/common.vue +++ b/packages/client/src/ui/_common_/common.vue @@ -11,6 +11,8 @@ <XStreamIndicator/> <div v-if="pendingApiRequestsCount > 0" id="wait"></div> + +<div v-if="dev" id="devTicker"><span>DEV BUILD</span></div> </template> <script lang="ts"> @@ -52,12 +54,28 @@ export default defineComponent({ uploads, popups, pendingApiRequestsCount, + dev: _DEV_, }; }, }); </script> <style lang="scss"> +@keyframes dev-ticker-blink { + 0% { opacity: 1; } + 50% { opacity: 0; } + 100% { opacity: 1; } +} + +@keyframes progress-spinner { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} + #wait { display: block; position: fixed; @@ -79,12 +97,19 @@ export default defineComponent({ } } -@keyframes progress-spinner { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); +#devTicker { + position: fixed; + top: 0; + left: 0; + z-index: 2147483647; + color: #ff0; + background: rgba(0, 0, 0, 0.5); + padding: 4px 5px; + font-size: 14px; + pointer-events: none; + + > span { + animation: dev-ticker-blink 2s infinite; } } </style>