nav is in center, projects layout, home fixed
This commit is contained in:
@@ -7,6 +7,5 @@
|
||||
<a href="/projects">Projekty</a>
|
||||
<a href="/contact">Kontakt</a>
|
||||
</div>
|
||||
<div></div>
|
||||
</section>
|
||||
|
||||
|
||||
@@ -3,7 +3,6 @@
|
||||
}
|
||||
.home {
|
||||
font-size: 1.2rem;
|
||||
height: 100;
|
||||
}
|
||||
.home section {
|
||||
text-align: center;
|
||||
|
||||
34
v4/css/projects.css
Normal file
34
v4/css/projects.css
Normal file
@@ -0,0 +1,34 @@
|
||||
.projects {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.projects img {
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.card {
|
||||
display: flex;
|
||||
border: 1px solid red;
|
||||
width: min(40rem, calc(100% - 1rem));
|
||||
}
|
||||
|
||||
.card .card_text > * {
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
.card > * {
|
||||
flex-basis: 100%;
|
||||
}
|
||||
|
||||
.card .card_left {
|
||||
border: 1px solid green;
|
||||
}
|
||||
|
||||
.card .card_right {
|
||||
border: 1px solid yellow;
|
||||
}
|
||||
|
||||
@@ -14,11 +14,30 @@ body {
|
||||
border: 1px solid purple;
|
||||
}
|
||||
|
||||
html {
|
||||
overflow-y: scroll !important;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
*::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
}
|
||||
*::-webkit-scrollbar-thumb {
|
||||
background-color: #ffffff;
|
||||
border-radius: 20px;
|
||||
}
|
||||
*::-webkit-scrollbar-track {
|
||||
background: #000000;
|
||||
}
|
||||
|
||||
.nav {
|
||||
position: relative;
|
||||
display: flex;
|
||||
border: 1px solid red;
|
||||
padding: 1rem;
|
||||
justify-content: space-between;
|
||||
isolation: isolate;
|
||||
}
|
||||
|
||||
.nav .logo img {
|
||||
@@ -29,13 +48,22 @@ body {
|
||||
.nav .links {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
border: 1px solid orange;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
@media (min-width: 400px) {
|
||||
.nav .links {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
border: 1px solid green;
|
||||
padding: 2rem 5rem;
|
||||
padding: 2rem 1rem;
|
||||
}
|
||||
|
||||
footer {
|
||||
|
||||
14
v4/index.php
14
v4/index.php
@@ -68,17 +68,17 @@ if($prod) { ?>
|
||||
?>
|
||||
<section class="content">
|
||||
<?php
|
||||
$R = new Router();
|
||||
$R->route('/', 'home');
|
||||
$R->route('/home', 'home');
|
||||
$R->route('/domu', 'home');
|
||||
|
||||
$R = null;
|
||||
$R = new Router();
|
||||
$R->route('/', 'home');
|
||||
$R->route('/home', 'home');
|
||||
$R->route('/domu', 'home');
|
||||
|
||||
$R = null;
|
||||
?>
|
||||
</section>
|
||||
<footer>
|
||||
<?php
|
||||
require_once("./components/footer.php");
|
||||
require_once("./components/footer.php");
|
||||
?>
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
@@ -3,11 +3,11 @@
|
||||
<section>
|
||||
<p>Filip Rojek <filip(at)filiprojek.cz></p>
|
||||
<br>
|
||||
<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>
|
||||
<p>Backend node.js & php developer <a href="https://www.fofrweb.com/" target="_blank">@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>
|
||||
<p><a href="https://github.com/filiprojek">Github</a> <a href="https://t.me/filiprojek">Telegram</a> <a href="#" id="pgpmobile" title="copy pgp to clipboard">PGP</a></p>
|
||||
<p><a href="https://git.filiprojek.cz/fr" target="_blank">Git</a> <a href="https://t.me/filiprojek" target="_blank">Telegram</a> <a href="#" id="pgpmobile" title="copy pgp to clipboard">PGP</a></p>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
|
||||
@@ -1,77 +1,107 @@
|
||||
<link rel="stylesheet" href="/css/projects.css">
|
||||
<h3>Projekty</h3>
|
||||
|
||||
<section>
|
||||
<div>
|
||||
<p>pkmples.cz</p>
|
||||
<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
|
||||
<div class="technologies">
|
||||
<span>PHP</span>
|
||||
<span>Linux</span>
|
||||
<span>Nginx</span>
|
||||
<section class="projects">
|
||||
<div class="card">
|
||||
<div class="card_left card_text">
|
||||
<p>pkmples.cz</p>
|
||||
<p>Komerční webová stránka pro PKM PARTY PLES.</p>
|
||||
<div class="technologies">
|
||||
<span>PHP</span>
|
||||
<span>Linux</span>
|
||||
<span>Nginx</span>
|
||||
</div>
|
||||
<p>01/2023</p>
|
||||
</div>
|
||||
<div class="card_right">
|
||||
<img src="https://www.fofrweb.com/images/pkm_two.png" alt="project screenshot">
|
||||
</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 class="card">
|
||||
<div class="card_left">
|
||||
<img src="https://www.fofrweb.com/images/rapidd.png" alt="project screenshot">
|
||||
</div>
|
||||
<div class="card_right card_text">
|
||||
<p>rapiddglass.cz</p>
|
||||
<p>Komerční webová stránka pro přípravek na ochranu a čištění krbového skla Rapidd Glass.</p>
|
||||
<p>10/2022</p>
|
||||
<div class="technologies">
|
||||
<span>PHP</span>
|
||||
<span>Linux</span>
|
||||
<span>Nginx</span>
|
||||
</div>
|
||||
</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 class="card">
|
||||
<div class="card_left card_text">
|
||||
<p>danielryslavy.cz</p>
|
||||
<p>Komerční webová stránka osobního trenéra Daniela Ryšlavého.</p>
|
||||
<p>06/2022</p>
|
||||
<div class="technologies">
|
||||
<span>PHP</span>
|
||||
<span>Linux</span>
|
||||
<span>Nginx</span>
|
||||
</div>
|
||||
</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 class="card_right">
|
||||
<img src="https://www.fofrweb.com/images/fitness.png" alt="project screenshot">
|
||||
</div>
|
||||
<img src="#" alt="project screenshot">
|
||||
</div>
|
||||
<div>
|
||||
<p>Fofrtasks</p>
|
||||
<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</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 class="card">
|
||||
<div class="card_left">
|
||||
<img src="#" alt="project screenshot">
|
||||
</div>
|
||||
<div class="card_right card_text">
|
||||
<p>Fofrmess</p>
|
||||
<p>Chatovací realtime PWA aplikace.</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>
|
||||
</div>
|
||||
<img src="#" alt="project screenshot">
|
||||
</div>
|
||||
<div>
|
||||
<p>Fofrbazar</p>
|
||||
<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
|
||||
<p>04/2021</p>
|
||||
<div class="technologies">
|
||||
<span>PHP</span>
|
||||
<span>Laravel</span>
|
||||
<span>MySQL</span>
|
||||
<span>Linux</span>
|
||||
<span>Apache</span>
|
||||
|
||||
<div class="card">
|
||||
<div class="card_left card_text">
|
||||
<p>Fofrtasks</p>
|
||||
<p>Aplikace pro vytváření a správu poznámek a úkolů.</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>
|
||||
</div>
|
||||
<div class="card_right">
|
||||
<img src="#" alt="project screenshot">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card_left">
|
||||
<img src="#" alt="project screenshot">
|
||||
</div>
|
||||
<div class="card_right card_text">
|
||||
<p>Fofrbazar</p>
|
||||
<p>Internetová bazarová platforma.</p>
|
||||
<p>04/2021</p>
|
||||
<div class="technologies">
|
||||
<span>PHP</span>
|
||||
<span>Laravel</span>
|
||||
<span>MySQL</span>
|
||||
<span>Linux</span>
|
||||
<span>Apache</span>
|
||||
</div>
|
||||
</div>
|
||||
<img src="#" alt="project screenshot">
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user