do index.html přidány další informace a přidány styly

This commit is contained in:
archos 2024-05-12 13:50:05 +02:00
parent fc0c449046
commit 80609484ec
2 changed files with 88 additions and 14 deletions

View File

@ -13,9 +13,30 @@
<img src="profilovka/archos.jpg" alt="Můj obrázek">
<h2>O mně</h2>
<p>Ahoj, jmenuji se Zdenek Kreml a jsem [vaše povolání nebo zájmy]. Tato stránka je krátkým úvodem do mého světa.</p>
<section>
<p>Ahoj, jmenuji se Zdeněk Kreml. Jsem členem komunity Arch Linux CZ a nadšeným podporovatelem open source. Moje záliba v technologiích sahá od operačních systémů jako Arch Linux až po bezpečnostně orientované mobilní platformy jako GrapheneOS. Své odborné dovednosti nejvíce uplatňuji při správě serverů, které běží na Ubuntu a Debianu, a při hostování a správě různých komunitních platforem a open source aplikací.</p>
<p>Jako <strong>Open Source Nadšenec</strong>, věřím v sílu otevřeného softwaru a jsem aktivním přispěvatelem do jeho komunity. Považuji se za <strong>Uživatele Arch Linuxu a GrapheneOS</strong>, kde mi tyto systémy umožňují spojit moji vášeň pro bezpečnost a stabilitu s praktickým využitím v každodenním životě.</p>
</section>
<section>
<h2>Projekty a Správa</h2>
<p>Věnuji se správě a hostování různých aplikací, které přibližují lidem důležitost bezpečnosti a soukromí v digitálním světě. Zde jsou některé z hlavních projektů, které nabízím:</p>
<ul>
<li>🐘 <strong>Mastodon Instance</strong> - <a href="https://mastodon.arch-linux.cz">mastodon.arch-linux.cz</a><br>Sociální platforma pro uživatele Arch Linuxu.</li>
<li>🖼️ <strong>Pixelfed</strong> - <a href="https://pixelfed.cz">pixelfed.cz</a><br>Platforma pro sdílení obrázků, která respektuje soukromí uživatelů.</li>
<li>🔒 <strong>Cryptpad</strong> - <a href="https://cryptpad.arch-linux.cz">cryptpad.arch-linux.cz</a><br>Bezpečná a šifrovaná kolaborativní platforma pro sdílení dokumentů.</li>
<li>🐘 <strong>Další instance Mastodon</strong> - <a href="https://mamutovo.cz">mamutovo.cz</a><br>Podpora sociální sítě založené na otevřených standardech.</li>
<!-- Další projekty -->
</ul>
<h3>Další Webové Aplikace</h3>
<ul>
<li>📑 <strong>Linkding</strong>: Jednoduchý správce záložek.</li>
<li>📷 <strong>Immich</strong>: Serverová aplikace pro správu fotografií.</li>
<li>📖 <strong>Wallabag</strong>: Služba pro ukládání článků k pozdějšímu čtení.</li>
<!-- Další aplikace -->
</ul>
</section>
<footer>
<p>Kontaktujte mě na email@example.com</p>
</footer>

View File

@ -1,16 +1,69 @@
h1 {
text-align: center;
/* Základní nastavení písma a pozadí pro celou stránku */
body {
font-family: Arial, sans-serif; /* Nastavení písma */
line-height: 1.6; /* řádkování */
color: #333; /* Barva textu */
background-color: #f9f9f9; /* Barva pozadí */
padding: 20px; /* Vnitřní okraj pro celé tělo stránky */
}
/* Centrování nadpisů h1 a h2 a specifické nastavení */
h1, h2 {
text-align: center; /* Zarovnání textu na střed */
color: #555; /* Světle šedá barva textu */
}
/* Nastavení stylu pro všechny obrázky na stránce */
img {
width: 200px;
border-radius: 80px;
display: block; /* Zobrazení jako blok pro možnost centrování */
margin-left: auto; /* Automatický levý okraj pro centrování */
margin-right: auto; /* Automatický pravý okraj pro centrování */
width: 200px; /* Pevná šířka obrázku */
border-radius: 80px; /* Velké zaoblení rohů */
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Lehký stín pro lepší vizuální efekt */
}
img {
display: block;
margin-left: auto;
margin-right: auto;
width: 200px; /* nebo jiná šířka podle potřeby */
/* Dodatečné styly, které můžete potřebovat pro odstavce a další elementy */
p {
margin-top: 20px; /* Horní okraj pro odstavce */
margin-bottom: 20px; /* Dolní okraj pro odstavce */
}
section {
margin: 20px;
padding: 20px;
background-color: #fff; /* Bílé pozadí pro lepší čitelnost */
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
section h2, section h3 {
color: #333;
text-align: center;
}
section p {
font-size: 16px;
line-height: 1.5;
color: #666;
text-align: justify;
}
section ul {
list-style-type: none; /* Odstranění teček u seznamu */
padding: 0;
}
section ul li {
margin-bottom: 10px;
line-height: 1.4;
font-size: 14px;
}
a {
color: #0077cc; /* Modrá barva odkazů */
text-decoration: none; /* Žádné podtržení */
}
a:hover {
text-decoration: underline; /* Podtržení při najetí myši */
}
h2 {
text-align: center;
}