| 12345678910111213141516171819202122232425262728293031323334353637383940 |
- <template lang="pug">
- figure.w-flex.column
- figcaption.w-flex.xs12.justify-space-between.align-center
- p(v-for="(label, index) in labels" :key="label" :class="{ 'main': index === 1 }") {{ label }}
- w-progress(v-model="percentage" size="0.5em" round).mb7
- </template>
-
- <script>
- export default {
- props: {
- labels: {
- required: true,
- type: Array,
- },
- percentage: {
- required: false,
- type: Number,
- default: 50,
- },
- },
- data: () => ({}),
- }
- </script>
- <style lang="sass">
- figure
- figcaption
- font-family: Century Gothic, CenturyGothic, AppleGothic, sans-serif
- text-transform: capitalize
- .main
- color: #4D9127
- font-weight: bold
- text-transform: uppercase
-
-
- .w-progress
- background-color: #4C5264
- .w-progress__progress
- color: #4D9127
-
- </style>
|