<template>
  <div style="margin: 0 5px 0 5px">
      <span class="xc-code">
        {{ props.code }}
      </span>
    <strong>
      {{ props.description }}
    </strong>
  </div>
</template>

<script name="XcCode" setup>
const props = defineProps({
  code: {
    type: String,
    default: ''
  },
  description: {
    type: String,
    default: ''
  }
})

</script>

<style lang="scss" scoped>

div {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  line-height: 10px;

  .xc-code {
    background-color: hsl(0, 0%, 7%);
    border-radius: 3px;
    border: 1px solid hsl(0, 0%, 7%);
    padding: 4px 5px;
    font-weight: bold;
    color: white;
  }
}


</style>