<template>
  <div class="">
    <span class="f-13px lh-16px c-222222" style="letter-spacing: 0.325px">{{title | upperCase | underscoresToSpaces}}</span>
    <p class="f-13px c-767676 fw-300 lh-20px mt-12px">{{description | descUpperCase(propTitle)}}</p>
  </div>
</template>

<script>
export default {
  name: 'DataDescriptionC',
  extends: {},
  props: {
    description: String,
    title: String
  },
  data(){
    return{
      propTitle: this.title
    };
  },
  filters: {
    upperCase (value) {
      if (!value) {
        return ''
      } else {
        return value.toUpperCase()
      }
    },
    underscoresToSpaces (value) {
      if (!value) {
        return ''
      } else {
        return value.replace('_', ' ')
      }
    },
    descUpperCase (value, title) {
      return (!value)
        ? ''
        : (title == 'work_place')
          ? value.toUpperCase()
          : value
    }
  },
  components: {},
  computed: {},
  watch: {},
  methods: {},
  beforeCreate(){},
  mounted(){}
}
</script>
