You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

PageHeader.vue 681B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. <template>
  2. <section class="header">
  3. <div class="header__left">
  4. <slot />
  5. </div>
  6. <div v-if="this.$slots.center" class="header__center">
  7. <slot name="center" />
  8. </div>
  9. <div v-if="this.$slots.right" class="header__right">
  10. <slot name="right" />
  11. </div>
  12. </section>
  13. </template>
  14. <style lang="scss" scoped>
  15. .header {
  16. @apply flex mb-9;
  17. &::v-deep {
  18. .title {
  19. @apply text-lg font-bold text-white mb-1;
  20. .icon {
  21. @apply mr-2;
  22. }
  23. }
  24. .subtitle {
  25. @apply font-thin;
  26. }
  27. .tip {
  28. @apply ml-2;
  29. }
  30. }
  31. }
  32. .header__left {
  33. @apply flex-1;
  34. &:not(:last-child) {
  35. @apply mr-3;
  36. }
  37. }
  38. </style>