UPDATE: blog style & content
This commit is contained in:
@ -1,5 +1,7 @@
|
|||||||
# ArKa
|
# ArKa Web
|
||||||
---
|
---
|
||||||
|
|
||||||
This repository contains source code of ArKa infrastructure main page.
|
This repository contains source code of ArKa main page
|
||||||
|
|
||||||
|
Pure [HTML](https://validator.w3.org/nu/?doc=https%3A%2F%2Farka.rocks%2F) & [CSS](https://jigsaw.w3.org/css-validator/validator?uri=https%3A%2F%2Farka.rocks&profile=css3svg&usermedium=all&warning=1&vextwarning=&lang=en), W3C compliant.
|
||||||
|
|
||||||
|
BIN
assets/fonts/BlockZone.ttf
Normal file
BIN
assets/fonts/BlockZone.ttf
Normal file
Binary file not shown.
@ -1,19 +1,24 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: "BlockZone";
|
||||||
|
src: url("../fonts/BlockZone.ttf") format("truetype");
|
||||||
|
}
|
||||||
|
|
||||||
/* Root */
|
/* Root */
|
||||||
:root
|
:root
|
||||||
{
|
{
|
||||||
/* Dark mode */
|
/* Dark mode */
|
||||||
--dark-bg: #0d0d0d;
|
--dark-bg: #191919;
|
||||||
--dark-text: #ffdab9;
|
--dark-text: #BBBBBB;
|
||||||
--dark-link: black;
|
--dark-link: #191919;
|
||||||
--dark-link-bg: #f08080;
|
--dark-link-bg: #f08080;
|
||||||
--dark-title: #f08080;
|
--dark-title: #f08080;
|
||||||
|
|
||||||
/* Light mode */
|
/* Light mode */
|
||||||
--light-bg: #ffdab9;
|
--light-bg: #ffdab9;
|
||||||
--light-text: #0d0d0d;
|
--light-text: #191919;
|
||||||
--light-link: black;
|
--light-link: #191919;
|
||||||
--light-link-bg: #f08080;
|
--light-link-bg: #DE6E7C;
|
||||||
--light-title: #f08080;
|
--light-title: #DE6E7C;
|
||||||
|
|
||||||
/* Default mode */
|
/* Default mode */
|
||||||
--bg-color: var(--dark-bg);
|
--bg-color: var(--dark-bg);
|
||||||
@ -31,9 +36,11 @@ body
|
|||||||
color: var(--text-color);
|
color: var(--text-color);
|
||||||
border: 1px solid var(--link-bg-color);
|
border: 1px solid var(--link-bg-color);
|
||||||
|
|
||||||
|
font-size: calc(10px + 0.390625vw);
|
||||||
|
font-family: "BlockZone";
|
||||||
|
|
||||||
width: 90vw;
|
width: 90vw;
|
||||||
margin-left: auto;
|
margin: 0 auto;
|
||||||
margin-right: auto;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -123,7 +130,16 @@ h1, h2, h3, h4 {
|
|||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
border-bottom: 1px solid var(--title-color);
|
width: 80%;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
text-align: center;
|
||||||
|
border: 1px solid var(--title-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
main div.h1-content {
|
||||||
|
width: 80%;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
#contact ul
|
#contact ul
|
||||||
@ -131,21 +147,20 @@ h1 {
|
|||||||
margin-bottom: 2vh;
|
margin-bottom: 2vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Responsive design */
|
|
||||||
@media screen and (max-width: 700px)
|
@media screen and (max-width: 700px)
|
||||||
{
|
{
|
||||||
body
|
body
|
||||||
{
|
{
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 500px)
|
@media screen and (max-width: 600px)
|
||||||
{
|
{
|
||||||
nav ul, #contact ul
|
nav ul, #contact ul
|
||||||
{
|
{
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 0.5rem;
|
gap: 0.5rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -154,11 +169,11 @@ h1 {
|
|||||||
{
|
{
|
||||||
:root
|
:root
|
||||||
{
|
{
|
||||||
--bg-color: var(--dark-bg);
|
--bg-color: var(--dark-bg);
|
||||||
--text-color: var(--dark-text);
|
--text-color: var(--dark-text);
|
||||||
--link-color: var(--dark-link);
|
--link-color: var(--dark-link);
|
||||||
--link-bg-color: var(--dark-link-bg);
|
--link-bg-color: var(--dark-link-bg);
|
||||||
--title-color: var(--dark-title);
|
--title-color: var(--dark-title);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -167,10 +182,10 @@ h1 {
|
|||||||
{
|
{
|
||||||
:root
|
:root
|
||||||
{
|
{
|
||||||
--bg-color: var(--light-bg);
|
--bg-color: var(--light-bg);
|
||||||
--text-color: var(--light-text);
|
--text-color: var(--light-text);
|
||||||
--link-color: var(--light-link);
|
--link-color: var(--light-link);
|
||||||
--link-bg-color: var(--light-link-bg);
|
--link-bg-color: var(--light-link-bg);
|
||||||
--title-color: var(--light-title);
|
--title-color: var(--light-title);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
66
index.html
66
index.html
@ -1,14 +1,14 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="fr">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<!-- Metadata -->
|
<!-- Metadata -->
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<meta name="description" content="ArKa">
|
<meta name="description" content="ArKa main page">
|
||||||
<meta property="og:title" content="ArKa">
|
<meta property="og:title" content="ArKa">
|
||||||
<meta property="og:url" content="https://arka.rocks">
|
<meta property="og:url" content="https://arka.rocks">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:description" content="ArKa">
|
<meta property="og:description" content="ArKa main page">
|
||||||
<!-- Style -->
|
<!-- Style -->
|
||||||
<link rel="stylesheet" href="assets/style/style.css">
|
<link rel="stylesheet" href="assets/style/style.css">
|
||||||
<link rel="shortcut icon" href="assets/favicon/favicon.ico" type="image/x-icon">
|
<link rel="shortcut icon" href="assets/favicon/favicon.ico" type="image/x-icon">
|
||||||
@ -24,21 +24,24 @@
|
|||||||
|
|
||||||
<!-- ASCII ART -->
|
<!-- ASCII ART -->
|
||||||
<pre>
|
<pre>
|
||||||
█████╗ ██████╗ ██╗ ██╗ █████╗
|
▄████████ ▄████████ ▄█ ▄█▄ ▄████████
|
||||||
██╔══██╗██╔══██╗██║ ██╔╝██╔══██╗
|
███ ███ ███ ███ ███ ▄███▀ ███ ███
|
||||||
███████║██████╔╝█████╔╝ ███████║
|
███ ███ ███ ███ ███▐██▀ ███ ███
|
||||||
██╔══██║██╔══██╗██╔═██╗ ██╔══██║
|
███ ███ ▄███▄▄▄▄██▀ ▄█████▀ ███ ███
|
||||||
██║ ██║██║ ██║██║ ██╗██║ ██║
|
▀███████████ ▀▀███▀▀▀▀▀ ▀▀█████▄ ▀███████████
|
||||||
╚═╝ ╚═╝╚═╝ ╚═╝╚═╝ ╚═╝╚═╝ ╚═╝
|
███ ███ ▀███████████ ███▐██▄ ███ ███
|
||||||
|
███ ███ ███ ███ ███ ▀███▄ ███ ███
|
||||||
|
███ █▀ ███ ███ ███ ▀█▀ ███ █▀
|
||||||
|
███ ███ ▀
|
||||||
</pre>
|
</pre>
|
||||||
|
|
||||||
<!-- Navbar -->
|
<!-- Navbar -->
|
||||||
<nav>
|
<nav>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="https://blog.arka.rocks">Blog</a></li>
|
<li><a href="https://blog.arka.rocks">Blog</a></li>
|
||||||
<li><a href="https://git.arka.rocks">Gitea</a></li>
|
<li><a href="https://git.arka.rocks">Gitea</a></li>
|
||||||
<li><a href="https://bin.arka.rocks">Encryped Bin</a></li>
|
<li><a href="https://bin.arka.rocks">Encryped Bin</a></li>
|
||||||
<li><a href="https://status.arka.rocks/status/arka">Status</a></li>
|
<li><a href="https://status.arka.rocks/status/arka">Status</a></li>
|
||||||
<li><a href="#contact">Contact</a></li>
|
<li><a href="#contact">Contact</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
@ -47,28 +50,41 @@
|
|||||||
<!-- Main content -->
|
<!-- Main content -->
|
||||||
<main>
|
<main>
|
||||||
<div id="content">
|
<div id="content">
|
||||||
<h1>ArKa</h1>
|
<h1>╓───── About ─────╖</h1>
|
||||||
<p>ArKA is the name of this group of websites and services maintained by me, Oxbian.</p>
|
|
||||||
<p>On ArKa you can find a <a href="https://blog.arka.rocks">blog</a> where I talk about good practices in different domains, a <a href="https://git.arka.rocks">git</a> server which contains projects that could be usefull or not for you, and an <a href="https://bin.arka.rocks">encryped</a> text / small files sharing.</p>
|
<div class="h1-content">
|
||||||
<h2>Project made for ArKa</h2>
|
<p>Hello, I’m Oxbian, a geek who loves free software, technology ethics and the Unix philosophy. I’m fascinated by everything related to computers, and I value privacy and security very highly. <b>That’s why ArKa never collects any data about you, and your security is my top priority.</b></p>
|
||||||
|
<p>I enjoy cyberpunk and dystopian media, because they show us the potential pitfalls of our society. But I also hope we can move towards a solarpunk future.</p>
|
||||||
|
<p>I’m always eager to learn new things and share my knowledge, which you can find on the <a href="https://wiki.arka.rocks">wiki</a>.</p>
|
||||||
|
|
||||||
|
<p>ArKa is the small portion of the web maintained by me, Oxbian. Services I offer are mainly read only (Git server, Wiki, Blog), but I also offer a privatebin instance for sharing data securly and privatly.</p>
|
||||||
|
|
||||||
|
<h2> ArKa services </h2>
|
||||||
|
<p>On this small portion of the web, called ArKa, you can find multiple services. Most of them are read only, for security reason, like my <a href="https://wiki.arka.rocks">wiki</a>, <a href="https://blog.arka.rocks">blog</a>, <a href="https://git.arka.rocks">git server</a>.</p>
|
||||||
|
<p>There is also some services you can use like an <a href="https://bin.arka.rocks">encrypted bin</a> called privatebin. You can send text / files, they are encrypted, salt, and even myself can't read them. I also recommand you to setup a password for your bin to improve security.</p>
|
||||||
|
|
||||||
|
<h2>Projects made for ArKa</h2>
|
||||||
|
<p>For the needs of ArKa, I made some tools, and software, all are available on the <a href="https://git.arka.rocks/ArKa/">ArKa organization</a> on the git server.</p>
|
||||||
<ul>
|
<ul>
|
||||||
<li>A blog generator, it take markdown files and generate webpages. Fully customisable thanks to the template system. <a href="https://git.arka.rocks/Oxbian/BlogGenerator">BlogGenerator</a></li>
|
<li>A blog generator, it take markdown files and generate webpages. Fully customisable thanks to the template system. <a href="https://git.arka.rocks/Oxbian/BlogGenerator">BlogGenerator</a></li>
|
||||||
<li>A script to send message to someone via Matrix. <a href="https://git.arka.rocks/Oxbian/matrix-sender">Matrix sender</a></li>
|
<li>A script to send message to someone via Matrix. <a href="https://git.arka.rocks/Oxbian/matrix-sender">Matrix sender</a></li>
|
||||||
<li>Some scripts which sends notifications of logwatch, fail2ban to an user via Matrix. <a href="https://git.arka.rocks/Oxbian/matrix-monitoring">Matrix monitoring</a></li>
|
<li>Some scripts which sends notifications of logwatch, fail2ban to an user via Matrix. <a href="https://git.arka.rocks/Oxbian/matrix-monitoring">Matrix monitoring</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<h2>ArKa philosophy</h2>
|
|
||||||
<p>The philosophy behind ArKa is to have a server with low maintenance, low ressources use (actually all the public services and others privates services runs on a raspberrypi 4), with fast reponse time.</p>
|
<h2>ArKa philosophy</h2>
|
||||||
<p>The philosophy behind the tools made for ArKa is sustainability, no dependencies garbage like Node or Python, light and speed. </p>
|
<p>The philosophy behind ArKa is to have a server with low maintenance, low ressources usage (actually all the public services and others privates services runs on a raspberrypi 4), with fast reponse time.</p>
|
||||||
|
<p>The philosophy behind the tools made for ArKa is sustainability, no dependencies garbage like Node or Python, light and speed. I will create most of my tools in POSIX shell and C, and I'm still searching a good solution for web based tools.</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer>
|
<footer>
|
||||||
<p>Contact me for any questions, in general I answer quite fast.</p>
|
<p>Contact me for any questions, in general I answer quite fast.</p>
|
||||||
|
|
||||||
<!-- Contact -->
|
<!-- Contact -->
|
||||||
<div id="contact">
|
<div id="contact">
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="https://matrix.to/#/@oxbian:matrix.org">Matrix</a></li>
|
<li><a href="https://matrix.to/#/@oxbian:matrix.org">Matrix</a></li>
|
||||||
<li><a rel="me" href="https://social.linux.pizza/@Oxbian">Mastodon</a></li>
|
<li><a rel="me" href="https://social.linux.pizza/@Oxbian">Mastodon</a></li>
|
||||||
|
Reference in New Issue
Block a user