Compare commits
2 Commits
a4fe5e4efc
...
01bac7e579
| Author | SHA1 | Date | |
|---|---|---|---|
01bac7e579
|
|||
|
15073c9d79
|
@ -1,45 +1,39 @@
|
|||||||
<template>
|
<template>
|
||||||
<section class="max-w-screen-xl mx-auto px-6 xl:px-2 py-11">
|
<section id="about">
|
||||||
<p class="font-bold">
|
<div class="container">
|
||||||
Nazywam się Kamil Niemczycki. Jestem młodym i ambitnym inżynierem oprogramowania. Specjalizuję się w tworzeniu frontendów i backendów.
|
<p>
|
||||||
W projektach wykorzystuję techologie oparte o PHP i JavaScript, tworząc skomplikowane i skalowalne aplikacje internetowe.
|
<strong>Nazywam się Kamil Niemczycki. Jestem młodym i ambitnym inżynierem oprogramowania. Specjalizuję się w tworzeniu frontendów i backendów.
|
||||||
</p>
|
W projektach wykorzystuję techologie oparte o PHP i JavaScript, tworząc skomplikowane i skalowalne aplikacje internetowe.</strong>
|
||||||
<h2 class="text-[2rem]">
|
</p>
|
||||||
Studia
|
<h2>Studia</h2>
|
||||||
</h2>
|
<p>
|
||||||
<p>
|
Jestem absolwentem Państwowej Wyższej Szkoły Zawodowej im. Witelona w Legnicy. Studiowałem na kierunku <em>Informatyka</em> o specjalności <em>Programowanie Aplikacji Mobilnych i Internetowych.</em>
|
||||||
Jestem absolwentem Państwowej Wyższej Szkoły Zawodowej im. Witelona w Legnicy. Studiowałem na kierunku <em>Informatyka</em> o specjalności <em>Programowanie Aplikacji Mobilnych i Internetowych.</em>
|
</p>
|
||||||
</p>
|
<p>
|
||||||
<p>
|
Podczas studiów zdobyłem niezbędną wiedzę z zakresu projektowania, wdrażania i rozwoju aplikacji internetowych, mobilnych i desktopowych.
|
||||||
Podczas studiów zdobyłem niezbędną wiedzę z zakresu projektowania, wdrażania i rozwoju aplikacji internetowych, mobilnych i desktopowych.
|
Zdobyłem także umiejętności pracy w zespole, które owocują tworzeniem merytorycznej dyskusji na temat części lub całości projektu.
|
||||||
Zdobyłem także umiejętności pracy w zespole, które owocują tworzeniem merytorycznej dyskusji na temat części lub całości projektu.
|
</p>
|
||||||
</p>
|
<h3>Kursy</h3>
|
||||||
<h3 class="text-[1.5rem]">
|
<p>
|
||||||
Kursy
|
W ramach studiów uzyskałem zaświadczenie dotyczące ukończenia kursu:
|
||||||
</h3>
|
<strong><a
|
||||||
<p>
|
:href="publicPath + 'download/certyfikat-laravel.pdf'"
|
||||||
W ramach studiów uzyskałem zaświadczenie dotyczące ukończenia kursu:
|
target="_blank"
|
||||||
<a
|
rel="noopener nofollow noreferrer"
|
||||||
:href="publicPath + 'download/certyfikat-laravel.pdf'"
|
>
|
||||||
class="text-gray-500 underline hover:text-kamilcraft-green hover:no-underline"
|
Architektura aplikacji internetowych opartych o framework Laravel</a></strong>.
|
||||||
target="_blank"
|
</p>
|
||||||
rel="noopener nofollow noreferrer"
|
<p>
|
||||||
>
|
Umożliwiło mi to szersze spojrzenie na możliwości jakie daje nam Laravel i wzbogaconie poprzednio zdobytej
|
||||||
Architektura aplikacji internetowych opartych o framework Laravel
|
wiedzy o nowe doświadczenia.
|
||||||
</a>.
|
</p>
|
||||||
</p>
|
<h2>Moje zainteresowania</h2>
|
||||||
<p>
|
<p>
|
||||||
Umożliwiło mi to szersze spojrzenie na możliwości jakie daje nam Laravel i wzbogaconie poprzednio zdobytej
|
W wolnym czasie przyjmuje małe zlecenia na strony lub serwisy internetowe. Uczę się nowych języków
|
||||||
wiedzy o nowe doświadczenia.
|
programowania lub frameworków w znanych mi już technologiach. Hobbistycznie, tworzę także rozwiązania do
|
||||||
</p>
|
problemów przy prywatnych projektach.
|
||||||
<h2 class="text-[2rem]">
|
</p>
|
||||||
Moje zainteresowania
|
</div>
|
||||||
</h2>
|
|
||||||
<p>
|
|
||||||
W wolnym czasie przyjmuje małe zlecenia na strony lub serwisy internetowe. Uczę się nowych języków
|
|
||||||
programowania lub frameworków w znanych mi już technologiach. Hobbistycznie, tworzę także rozwiązania do
|
|
||||||
problemów przy prywatnych projektach.
|
|
||||||
</p>
|
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -66,3 +60,32 @@ onUnmounted(() => {
|
|||||||
store.commit('resetHeaderDescription')
|
store.commit('resetHeaderDescription')
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
section#about {
|
||||||
|
padding: 45px 0;
|
||||||
|
background-color: #fafafa !important;
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
margin-top: 25px;
|
||||||
|
|
||||||
|
&:first-of-type {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 1.3em;
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #8D8D8D;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: #A2CF00;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@ -1,78 +1,74 @@
|
|||||||
<template>
|
<template>
|
||||||
<section
|
<section
|
||||||
v-if="isLoaded"
|
v-if="isLoaded"
|
||||||
class="max-w-screen-xl mx-auto px-6 xl:px-2 py-8"
|
class="project"
|
||||||
>
|
>
|
||||||
<header class="text-neutral-800 font-roboto">
|
<header class="project_header">
|
||||||
<h1 class="text-center text-4xl font-light pb-5">
|
<h1>{{ project.title }}</h1>
|
||||||
{{ project.title }}
|
<ul class="project_info">
|
||||||
</h1>
|
<li class="info_text">
|
||||||
<ul class="grid grid-cols-2 gap-3 md:flex md:gap-5 justify-center list-none">
|
<font-awesome-icon
|
||||||
<li class="flex items-center gap-2">
|
class="icon"
|
||||||
<FontAwesomeIcon
|
|
||||||
class="w-4"
|
|
||||||
:icon="['far', 'clock']"
|
:icon="['far', 'clock']"
|
||||||
/>
|
/>
|
||||||
<span>{{ project.release_date }}</span>
|
<span>{{ project.release_date }}</span>
|
||||||
</li>
|
</li>
|
||||||
<li class="flex items-center gap-2">
|
<li class="info_text">
|
||||||
<FontAwesomeIcon
|
<font-awesome-icon
|
||||||
class="w-4"
|
class="icon"
|
||||||
:icon="['far', 'user']"
|
:icon="['far', 'user']"
|
||||||
/>
|
/>
|
||||||
<span>{{ project.author }}</span>
|
<span>{{ project.author }}</span>
|
||||||
</li>
|
</li>
|
||||||
<li class="flex items-center gap-2">
|
<li class="info_text">
|
||||||
<FontAwesomeIcon
|
<font-awesome-icon
|
||||||
class="w-4"
|
class="icon"
|
||||||
:icon="['far', 'folder']"
|
:icon="['far', 'folder']"
|
||||||
/>
|
/>
|
||||||
<span>{{ getCategoryName(project.categories) }}</span>
|
<span>{{ getCategoryName(project.categories) }}</span>
|
||||||
</li>
|
</li>
|
||||||
<li class="flex items-center gap-2">
|
<li class="info_text">
|
||||||
<FontAwesomeIcon
|
<font-awesome-icon
|
||||||
class="w-4"
|
class="icon"
|
||||||
:icon="['fas', 'code-branch']"
|
:icon="['fas', 'code-branch']"
|
||||||
/>
|
/>
|
||||||
<span>{{ project.project_version }}</span>
|
<span>{{ project.project_version }}</span>
|
||||||
</li>
|
</li>
|
||||||
<li
|
<li
|
||||||
v-if="project.project_url"
|
v-if="project.project_url"
|
||||||
class="flex items-center gap-2"
|
class="info_text"
|
||||||
>
|
>
|
||||||
<FontAwesomeIcon
|
<font-awesome-icon
|
||||||
class="w-4"
|
class="icon"
|
||||||
:icon="['fas', 'link']"
|
:icon="['fas', 'link']"
|
||||||
/>
|
/>
|
||||||
<span>
|
<span><a
|
||||||
<a
|
:href="project.project_url"
|
||||||
:href="project.project_url"
|
target="_blank"
|
||||||
target="_blank"
|
rel="noopener nofollow noreferrer"
|
||||||
rel="noopener nofollow noreferrer"
|
>Link</a></span>
|
||||||
>
|
|
||||||
Link
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</header>
|
</header>
|
||||||
<div class="pt-5">
|
<div class="container">
|
||||||
<figure class="w-full shadow-xl">
|
<component
|
||||||
|
:is="`figure`"
|
||||||
|
class="project-photo"
|
||||||
|
>
|
||||||
<img
|
<img
|
||||||
class="block max-h-[31.25rem] object-cover"
|
:src="`${project.images.large}`"
|
||||||
:src="project.images.large"
|
|
||||||
:alt="project.title"
|
:alt="project.title"
|
||||||
>
|
>
|
||||||
</figure>
|
</component>
|
||||||
<div
|
<div
|
||||||
class="markdown mt-9"
|
class="content"
|
||||||
v-html="markdownToHtml"
|
v-html="markdownToHtml"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<div
|
<div
|
||||||
v-else
|
v-else
|
||||||
class="flex items-center"
|
class="loading"
|
||||||
>
|
>
|
||||||
<div class="loading_animation" />
|
<div class="loading_animation" />
|
||||||
</div>
|
</div>
|
||||||
@ -131,57 +127,143 @@ function loadProject(id) {
|
|||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@import "scss/default";
|
@import "scss/default";
|
||||||
|
|
||||||
a {
|
.loading {
|
||||||
@apply text-neutral-800 hover:text-kamilcraft-green;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.markdown {
|
.project {
|
||||||
h1 {
|
.project_header {
|
||||||
@apply text-4xl;
|
@extend .container;
|
||||||
}
|
text-align: center;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
|
||||||
h2 {
|
h1 {
|
||||||
@apply text-[2rem];
|
font-size: 2.2em;
|
||||||
}
|
font-weight: lighter;
|
||||||
|
line-height: 2.4em;
|
||||||
|
}
|
||||||
|
|
||||||
h3 {
|
.project_info {
|
||||||
@apply text-[1.5rem];
|
display: flex;
|
||||||
}
|
list-style: none;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
p, ol li, ul li {
|
.info_text {
|
||||||
@apply text-lg;
|
display: flex;
|
||||||
}
|
align-items: center;
|
||||||
|
|
||||||
p + ol, p + ul, p + blockquote {
|
.icon {
|
||||||
@apply -mb-2.5;
|
width: 2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
ol {
|
span {
|
||||||
@apply list-decimal;
|
font-weight: lighter;
|
||||||
}
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
ul {
|
&:not(&:last-child) {
|
||||||
@apply list-disc;
|
margin-right: 15px;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
@include media-tablet {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
row-gap: 15px;
|
||||||
|
|
||||||
ol, ul {
|
.info-text {
|
||||||
@apply mb-2.5;
|
&:not(&:last-child) {
|
||||||
padding-inline-start: 1.75rem;
|
margin-right: 0;
|
||||||
|
}
|
||||||
li img {
|
}
|
||||||
@apply block w-full pr-1 pb-1 mt-3.5;
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
.container {
|
||||||
@apply mb-2.5 text-justify;
|
.project-photo {
|
||||||
}
|
box-shadow: 5px 5px 10px rgba(0, 0, 0, .3);
|
||||||
|
}
|
||||||
|
|
||||||
blockquote {
|
.project-photo, .project-photo img {
|
||||||
@apply pl-6 ml-5 border-neutral-400;
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
p {
|
.project-photo img {
|
||||||
text-indent: unset;
|
display: block;
|
||||||
|
object-fit: cover;
|
||||||
|
max-height: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
margin: 35px 0;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #8D8D8D;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: #A2CF00;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h2, h3 {
|
||||||
|
margin-top: 15px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2:first-of-type {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 1.6em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 1.4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
p, ol li, ul li {
|
||||||
|
line-height: 1.8em;
|
||||||
|
font-size: 1.1em;
|
||||||
|
|
||||||
|
@include media-tablet {
|
||||||
|
font-size: 1.2em;
|
||||||
|
line-height: 1.5em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
p + ol, p + ul, p + blockquote {
|
||||||
|
margin-top: -10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
ol, ul {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
padding-inline-start: 2.1em;
|
||||||
|
|
||||||
|
li img {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0 5px 5px;
|
||||||
|
margin-top: .9em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
text-align: justify;
|
||||||
|
/* text-indent: 1.5em; */
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
padding-left: 25px;
|
||||||
|
margin-left: 1.3em;
|
||||||
|
border-left: 1px solid rgb(116, 116, 116);
|
||||||
|
|
||||||
|
p {
|
||||||
|
text-indent: unset;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user