- refactor

.env.deployment

@@ -0,0 +1,4 @@
+VITE_APP_NAME="Kamil Niemczycki CV"
+VITE_CV_URL="https://cv.kamilcraft.com"
+VITE_API_URL="https://api.kamilcraft.com"
+VITE_SOURCE_CODE="https://github.com/kamilniemczycki/kamilcraft-cv"

.env.example

@@ -1,2 +1,4 @@
 VITE_APP_NAME="Kamil Niemczycki CV"
+VITE_CV_URL="http://localhost:5173"
 VITE_API_URL="http://localhost"
+VITE_SOURCE_CODE="https://github.com/kamilniemczycki"

src/components/Body.vue

@@ -1,10 +1,10 @@
 <script setup>
 import { defineProps, computed, ref } from 'vue';
-import Education from '../components/Education.vue';
-import MajorAchivments from '../components/MajorAchivments.vue';
-import Skills from '../components/Skills.vue';
-import Certificates from '../components/Certificates.vue';
-import Links from '../components/Links.vue';
+import Education from './Body/Education.vue';
+import MajorAchivments from './Body/MajorAchivments.vue';
+import Skills from './Side/Skills.vue';
+import Certificates from './Side/Certificates.vue';
+import Links from './Side/Links.vue';
 
 const props = defineProps({
     token: {
@@ -21,11 +21,14 @@ const props = defineProps({
     },
 });
 
+const sourceCode = import.meta.env.VITE_SOURCE_CODE;
+
 const qrCodeLink = computed(() => {
+    const url = import.meta.env.VITE_CV_URL;
     if(props.token) {
-        return `https://cv.kamilcraft.com/show/${props.token}`;
+        return `${url}/show/${props.token}`;
     }
-    return 'https://cv.kamilcraft.com';
+    return url;
 });
 </script>
 
@@ -55,8 +58,8 @@ const qrCodeLink = computed(() => {
         <div class="relative print:w-1/3 print:flex-shrink-1 md:w-1/3 md:flex-shrink-1 bg-[#fff0e9]">
             <Skills />
             <Certificates />
-            <Links />
-            <div class="hidden print:block print:absolute bottom-5 right-0 w-full">
+            <Links class="pb-8 md:pb-0" />
+            <div class="hidden print:block print:absolute bottom-7 right-0 w-full">
                 <a :href="qrCodeLink" title="Link do CV w wersji przeglądarkowej" target="_blink">
                     <QRCode
                         render-as="svg"
@@ -66,7 +69,10 @@ const qrCodeLink = computed(() => {
                         level="L"
                         background="transparent" />
                 </a>
-                <div class="text-center">Wersja online</div>
+                <div class="text-center">CV w wersji online</div>
+            </div>
+            <div class="absolute bottom-1.5 right-0 w-full px-5 text-right md:text-center text-xs">
+                <a :href="sourceCode" target="_blank"><FontAwesomeIcon class="mr-1" :icon="['fab', 'github']"/>Kod źródłowy CV</a>
             </div>
         </div>
     </div>

src/components/Header.vue

@@ -1,8 +1,8 @@
 <script setup>
 import { defineProps } from 'vue';
 import { useRoute } from 'vue-router';
-import Mission from '../components/Mission.vue';
-import ContactList from './ContactList.vue';
+import Mission from './Header/Mission.vue';
+import ContactList from './Header/ContactList.vue';
 
 defineProps({
     loading: {

src/components/Side/Links.vue

@@ -0,0 +1,15 @@
+<script setup>
+import links from '../../composables/Links';
+</script>
+
+<template>
+    <div class="px-4 py-3">
+        <h2 class="text-xl text-[#E57D4C] pb-2">Znajdziesz mnie</h2>
+        <ul class="flex flex-col gap-1">
+            <li v-for="link in links" :key="link.slug"><a :href="link.url"
+                    :title="link.title"
+                    target="_blink"
+                ><FontAwesomeIcon class="w-6" :icon="link.faIcon" />{{ link.text }}</a></li>
+        </ul>
+    </div>
+</template>

src/components/Side/Skills.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { ref } from 'vue';
-import { skills as importSkills, otherSkills as importOtherSkills } from '../composables/Skills.js';
+import { skills as importSkills, otherSkills as importOtherSkills } from '../../composables/Skills.js';
 
 const skills = ref(importSkills);
 const otherSkills = ref(importOtherSkills);

src/composables/Links.js

@@ -1,4 +1,3 @@
-<script setup>
 const links = [
     {
         slug: 'kamilcraft',
@@ -22,16 +21,5 @@ const links = [
         text: '/kamilniemczycki',
     },
 ];
-</script>
 
-<template>
-    <div class="px-4 py-3">
-        <h2 class="text-xl text-[#E57D4C] pb-2">Znajdziesz mnie</h2>
-        <ul class="flex flex-col gap-1">
-            <li v-for="link in links" :key="link.slug"><a :href="link.url"
-                    :title="link.title"
-                    target="_blink"
-                ><FontAwesomeIcon class="w-6" :icon="link.faIcon" />{{ link.text }}</a></li>
-        </ul>
-    </div>
-</template>
+export default links;

src/composables/Skills.js

@@ -52,6 +52,9 @@ const skills = [
 const otherSkills = [
     'Composer',
     'GitHub',
+    'VSC',
+    'PhpStorm',
+    'WebStorm',
     'Node.js',
     'NPM',
     'Sqlite',
@@ -59,7 +62,8 @@ const otherSkills = [
     'Docker',
     'WSL',
     'LXC/LXD',
-    'i więcej?',
+    'REST',
+    'i więcej...',
 ];
 
 export {