LifePaymentFront.git

			@@ -4,16 +4,15 @@
			'navigation-bar-wrapper',
			{ active: props.mode === 'dark', plain: props.plain, hasBorder: props.hasBorder },
			]"
			:style="barStyle"
			>
			<slot></slot>
			</div>
			</template>

			<script setup lang="ts">
			import { CSSProperties } from 'vue';
			import { useSystemStore } from '@/stores/modules/system';
			import { navigationBarProps } from './navBar';
			import { CSSProperties } from 'vue';
			import { useAppStore } from '@/store/modules/app';

			defineOptions({
			name: 'NavBar',
			@@ -21,34 +20,34 @@

			const props = defineProps(navigationBarProps);

			const systemStore = useSystemStore();
			const appStore = useAppStore();

			const barStyle = computed(
			() =>
			({
			paddingTop: systemStore.info.statusBarHeight + 'px',
			// height: systemStore.navigationBarHeight + 'px',
			} as CSSProperties)
			);
			// const barStyle = computed(
			// () =>
			// ({
			// paddingTop: appStore.statusBarHeight / 2 + 'px',
			// } as CSSProperties)
			// );
			</script>

			<style lang="scss">
			@import '@/styles/common.scss';
			<style lang="scss" scoped>
			@use '@/style/common.scss' as *;

			.navigation-bar-wrapper {
			background-color: #fff;
			display: flex;
			position: relative;
			// box-shadow: 0px 1px 7px 0px rgb(237, 238, 241);
			z-index: 10;
			display: flex;
			padding-top: constant(safe-area-inset-top);
			padding-top: env(safe-area-inset-top);
			background-color: #ffffff;

			&.plain {
			border-bottom-left-radius: 20px;
			border-bottom-right-radius: 20px;
			border-bottom-left-radius: 10px;
			border-bottom-right-radius: 10px;
			}

			&.active {
			background-color: boleGetCssVar('color', 'primary');
			background-color: getCssVar('color', 'primary');
			}

			&.hasBorder {