card-title.vue 644 B

123456789101112131415161718192021222324252627282930313233343536
  1. <script lang="ts" setup>
  2. import { defineComponent } from 'vue'
  3. defineComponent({
  4. name: 'CardTitle'
  5. })
  6. const { title } = defineProps({
  7. title: {
  8. type: String,
  9. required: true
  10. }
  11. })
  12. </script>
  13. <template>
  14. <span class="card-title">{{ title }}</span>
  15. </template>
  16. <style scoped lang="scss">
  17. .card-title {
  18. font-size: 14px;
  19. font-weight: 600;
  20. &::before {
  21. content: '';
  22. display: inline-block;
  23. width: 3px;
  24. height: 14px;
  25. //background-color: #105cfb;
  26. background: var(--el-color-primary);
  27. position: relative;
  28. left: -5px;
  29. top: 8px;
  30. border-radius: 5px;
  31. transform: translateY(-50%);
  32. }
  33. }
  34. </style>