101 lines
2.2 KiB
Vue
101 lines
2.2 KiB
Vue
<script>
|
|
export default {
|
|
data: () => {
|
|
return {
|
|
|
|
};
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<div class="mt-10 sm:mt-20 bg-primary-light dark:bg-ternary-dark shadow-sm">
|
|
<!-- About me counters start -->
|
|
<div
|
|
class="
|
|
font-general-regular
|
|
container
|
|
mx-auto
|
|
py-20
|
|
block
|
|
sm:flex sm:justify-between sm:items-center
|
|
text-center
|
|
"
|
|
>
|
|
<!-- Years of experience counter -->
|
|
<div class="mb-20 sm:mb-0">
|
|
<span
|
|
class="
|
|
font-general-medium
|
|
text-4xl
|
|
font-general-bold
|
|
text-secondary-dark
|
|
dark:text-secondary-light
|
|
mb-2
|
|
"
|
|
>7+</span
|
|
>
|
|
<span class="block text-md text-ternary-dark dark:text-ternary-light"
|
|
>Years of experience</span
|
|
>
|
|
</div>
|
|
|
|
<!-- GitHub stars counter -->
|
|
<div class="mb-20 sm:mb-0">
|
|
<span
|
|
class="
|
|
font-general-medium
|
|
text-4xl
|
|
font-general-bold
|
|
text-secondary-dark
|
|
dark:text-secondary-light
|
|
mb-2
|
|
"
|
|
>2k</span
|
|
>
|
|
<span class="block text-md text-ternary-dark dark:text-ternary-light"
|
|
>Stars on GitHub</span
|
|
>
|
|
</div>
|
|
|
|
<!-- Positive feedback counter -->
|
|
<div class="mb-20 sm:mb-0">
|
|
<span
|
|
class="
|
|
font-general-medium
|
|
text-4xl
|
|
font-general-bold
|
|
text-secondary-dark
|
|
dark:text-secondary-light
|
|
mb-2
|
|
"
|
|
>32</span
|
|
>
|
|
<span class="block text-md text-ternary-dark dark:text-ternary-light"
|
|
>Positive feedback</span
|
|
>
|
|
</div>
|
|
|
|
<!-- Projects completed counter -->
|
|
<div class="mb-20 sm:mb-0">
|
|
<span
|
|
class="
|
|
font-general-medium
|
|
text-4xl
|
|
font-general-bold
|
|
text-secondary-dark
|
|
dark:text-secondary-light
|
|
mb-2
|
|
"
|
|
>77</span
|
|
>
|
|
<span class="block text-md text-ternary-dark dark:text-ternary-light"
|
|
>Projects completed</span
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped></style>
|