fix: 修改ui

zhengyiming

3 天以前 7d8aa8e552a7ae8a1c5c60d1daae233da3ca0275

 apps/h5/src/components/NavigationBar/NavBar.vue

@@ -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 {