From e9e6d573dc5ffcc1ca7ddfb355001f2060b8687d Mon Sep 17 00:00:00 2001
From: Filip Rojek <filip@filiprojek.cz>
Date: Sun, 5 Mar 2023 17:45:43 +0100
Subject: [PATCH] update

---
 v4/components/header.php       |   6 +--
 v4/css/contact.css             |  35 ++++++++++++++
 v4/css/style.css               |  12 +++++
 v4/img/fr_logo.webp            | Bin 0 -> 526 bytes
 v4/pages/contact/contact.php   |  17 ++++++-
 v4/pages/home/home.php         |   2 +-
 v4/pages/projects/projects.php |  86 ++++++++++++++++++++++++---------
 7 files changed, 130 insertions(+), 28 deletions(-)
 create mode 100644 v4/css/contact.css
 create mode 100644 v4/img/fr_logo.webp

diff --git a/v4/components/header.php b/v4/components/header.php
index aa1d069..31351c1 100644
--- a/v4/components/header.php
+++ b/v4/components/header.php
@@ -1,7 +1,7 @@
 <section class="nav">
-	<div class="logo">
-		<p>logo</p>
-	</div>
+	<a class="logo" href="/">
+		<img src="img/fr_logo.webp" alt="logo" />
+	</a>
 	<div class="links">
 		<a href="/home">Úvod</a>
 		<a href="/projects">Projekty</a>
diff --git a/v4/css/contact.css b/v4/css/contact.css
new file mode 100644
index 0000000..f41c5ec
--- /dev/null
+++ b/v4/css/contact.css
@@ -0,0 +1,35 @@
+.content {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+}
+
+.form_contact {
+	--base-padding: .5rem 1rem;
+	display: flex;
+	flex-direction: column;
+	width: 15rem;
+	margin-top: 2rem;
+}
+
+.form_contact input {
+	padding: var(--base-padding);
+	margin-bottom: 1rem;
+}
+
+.form_contact button {
+	align-self: center;
+	padding: var(--base-padding);
+	margin-top: 1.5rem;
+	cursor: pointer;
+}
+
+.form_contact textarea {
+	height: 8rem;
+	resize: none;
+	padding: var(--base-padding);
+}
+
+.form_contact input, textarea, button {
+	border-radius: 5px;
+}
diff --git a/v4/css/style.css b/v4/css/style.css
index fdff6e0..061879a 100644
--- a/v4/css/style.css
+++ b/v4/css/style.css
@@ -21,6 +21,18 @@ body {
 	justify-content: space-between;
 }
 
+.nav .logo img {
+	height: 3rem;
+	border: 1px solid orange;
+}
+
+.nav .links {
+	display: flex;
+	align-items: center;
+	gap: 1rem;
+	border: 1px solid orange;
+}
+
 .content {
 	border: 1px solid green;
 	padding: 2rem 5rem;
diff --git a/v4/img/fr_logo.webp b/v4/img/fr_logo.webp
new file mode 100644
index 0000000000000000000000000000000000000000..0a6448005264cb9d69ad46607bf9a47acf0fbac4
GIT binary patch
literal 526
zcmV+p0`dJ)Nk&En0ssJ4MM6+kP&iEb0RR9mE5S+tg)D5F4B4p@+qP}nwrwn~V%xTz
zT-mm5+qRv|Q{hxk@1(24j_CgcfbqZazwy8Ezwy8Ezwy86f7~Lj8-X((blvPGT`g(n
zwgq}h&Uk1Z(3r-5f8az*mA68Zc0F3Rs8c>~44sj!<%Io6e6)Ld>wHYgUc`2Gr{Z@#
zfa3R$$;F^UX#1=qq3f-;(Ba)RgR|<611ToFKpAgl<<uKt=@wWhX#!4RkeD1RER^*E
zuqu{_SW8jj@w`eYp!7qOxeBjxlEO_zsjYClDnZF|3FY1mysAN{{Q)KK#jNJ``l9st
znAOfsh`A{JOJG)C8<BRP{7bnt_D9i9q3}bqJ2x#^<l9nByH8$o`jrhow`Tqz>^>BG
zaY!i;n8vr@?srmfYv~VGpvc!V3W4}+gD>GV;MV5vO-F(In?(SJGnQx9(eLy_`sSjb
zjtX(*n}$ffP!d#9Asz!j%GadMpq2_@0fan>#N%l|S71aKiNqP8oGOv9EE0!+&hR`V
zv;wU`{7@TIv?cA_w!p05I^{u0J+wgexXg#LpiivIpi!EEMi~McWd&%IGhsE#t7M>2
zs)9zD0~+N~B%M+RG|C##C~p&}PD|RbB7qs#9eRQ4dT1W_dD1S0(kWBH_|N#y_|N$7
Qw-Doh<A39S<Nv?w0*)pQmjD0&

literal 0
HcmV?d00001

diff --git a/v4/pages/contact/contact.php b/v4/pages/contact/contact.php
index 6651ce7..8256b3d 100644
--- a/v4/pages/contact/contact.php
+++ b/v4/pages/contact/contact.php
@@ -1 +1,16 @@
-<h1>Kontakt</h1>
+<link rel="stylesheet" href="/css/contact.css">
+<h1>Kontaktujte mě</h1>
+
+<form class="form_contact" action="#" method="post" name="contact">
+	<label for="name">Vaše jméno:</label>
+	<input id="name" type="text" placeholder="Petr Novák" required autocomplete="on" />
+
+	<label for="email">Váš e-mail:</label>
+	<input id="email" type="email" placeholder="petr@novak.cz" required autocomplete="on" />
+
+	<label for="message">Zpráva:</label>
+	<textarea id="message" placeholder="Napište zprávu..." required></textarea>
+
+	<button type="submit">Odeslat zprávu</button>
+</form>
+
diff --git a/v4/pages/home/home.php b/v4/pages/home/home.php
index 3fe6fe6..9379549 100644
--- a/v4/pages/home/home.php
+++ b/v4/pages/home/home.php
@@ -3,7 +3,7 @@
 	<section>
 		<p>Filip Rojek &ltfilip(at)filiprojek.cz&gt</p>
 		<br>
-		<p>Backend nodejs & php developer <a href="https://www.fofrweb.com/">@fofrweb</a>,<br> Linux Void user, student and coffee enthusiast<span class="underscore">_</span><p>
+		<p>Backend nodejs & php developer <a href="https://www.fofrweb.com/">@fofrweb</a>,<br> Linux Gentoo user, student and coffee enthusiast<span class="underscore">_</span><p>
 		<br>
 		<p id="pgp" title="copy pgp to clipboard">PGP: fc37b989787acf8cbce7c0c2a56a345efe321161</p>
 		<br>
diff --git a/v4/pages/projects/projects.php b/v4/pages/projects/projects.php
index 9c145a6..3748887 100644
--- a/v4/pages/projects/projects.php
+++ b/v4/pages/projects/projects.php
@@ -1,37 +1,77 @@
 <h3>Projekty</h3>
-<a href="/?page=home">home</a>
 
 <section>
 	<div>
-		<p>Projekt</p>
+		<p>pkmples.cz</p>
 		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
-		<p>MM/YYYY</p>
+		<div class="technologies">
+			<span>PHP</span>
+			<span>Linux</span>
+			<span>Nginx</span>
+		</div>
+		<p>01/2023</p>
+		<img src="https://www.fofrweb.com/images/pkm_two.png" alt="project screenshot">
+	</div>
+	<div>
+		<p>rapiddglass.cz</p>
+		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
+		<p>10/2022</p>
+		<div class="technologies">
+			<span>PHP</span>
+			<span>Linux</span>
+			<span>Nginx</span>
+		</div>
+		<img src="https://www.fofrweb.com/images/rapidd.png" alt="project screenshot">
+	</div>
+	<div>
+		<p>danielryslavy.cz</p>
+		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
+		<p>06/2022</p>
+		<div class="technologies">
+			<span>PHP</span>
+			<span>Linux</span>
+			<span>Nginx</span>
+		</div>
+		<img src="https://www.fofrweb.com/images/fitness.png" alt="project screenshot">
+	</div>
+	<div>
+		<p>Fofrmess</p>
+		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
+		<p>02/2022</p>
+		<div class="technologies">
+			<span>Node.js</span>
+			<span>Express.js</span>
+			<span>PostgreSQL</span>
+			<span>Linux</span>
+			<span>Nginx</span>
+		</div>
 		<img src="#" alt="project screenshot">
 	</div>
 	<div>
-		<p>Projekt</p>
+		<p>Fofrtasks</p>
 		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
-		<p>MM/YYYY</p>
+		<p>10/2021</p>
+		<div class="technologies">
+			<span>Node.js</span>
+			<span>Express.js</span>
+			<span>MongoDB</span>
+			<span>Linux</span>
+			<span>Nginx</span>
+		</div>
 		<img src="#" alt="project screenshot">
-	</div>	<div>
-		<p>Projekt</p>
+	</div>
+	<div>
+		<p>Fofrbazar</p>
 		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
-		<p>MM/YYYY</p>
-		<img src="#" alt="project screenshot">
-	</div>	<div>
-		<p>Projekt</p>
-		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
-		<p>MM/YYYY</p>
-		<img src="#" alt="project screenshot">
-	</div>	<div>
-		<p>Projekt</p>
-		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
-		<p>MM/YYYY</p>
-		<img src="#" alt="project screenshot">
-	</div>	<div>
-		<p>Projekt</p>
-		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
-		<p>MM/YYYY</p>
+		<p>04/2021</p>
+		<div class="technologies">
+			<span>PHP</span>
+			<span>Laravel</span>
+			<span>MySQL</span>
+			<span>Linux</span>
+			<span>Apache</span>
+		</div>
 		<img src="#" alt="project screenshot">
 	</div>
 </section>
+