common-header.vue 554 B

1234567891011121314151617181920212223242526272829
  1. <template>
  2. <div class="screen-header">{{ title }}</div>
  3. </template>
  4. <script lang="ts" setup>
  5. defineProps({
  6. title: {
  7. type: String,
  8. default: "",
  9. },
  10. });
  11. </script>
  12. <style lang="scss" scoped>
  13. .screen-header {
  14. display: flex;
  15. justify-content: center;
  16. align-items: end;
  17. height: $screen-header-height;
  18. padding-bottom: 15px;
  19. font-weight: 500;
  20. font-size: 49px;
  21. color: #ffffff;
  22. line-height: 58px;
  23. background-image: url("@/assets/images/screen_header1.png");
  24. background-size: 100% 100%;
  25. background-position: center;
  26. }
  27. </style>