CardTitle.vue 590 B

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