From ba601264ad6e65874acf2fcd35008f420348385c Mon Sep 17 00:00:00 2001 From: Oxbian Date: Mon, 3 Jul 2023 22:47:33 +0200 Subject: Init commit --- README.md | 5 ++ assets/style/style.css | 171 +++++++++++++++++++++++++++++++++++++++++++++++++ index.html | 76 ++++++++++++++++++++++ 3 files changed, 252 insertions(+) create mode 100644 README.md create mode 100644 assets/style/style.css create mode 100644 index.html diff --git a/README.md b/README.md new file mode 100644 index 0000000..8d3ce18 --- /dev/null +++ b/README.md @@ -0,0 +1,5 @@ +# ArKa +--- + +Ce repo contient le code source de la page principale d'ArKa, l'infrastructure de mes services web. + diff --git a/assets/style/style.css b/assets/style/style.css new file mode 100644 index 0000000..00a06b3 --- /dev/null +++ b/assets/style/style.css @@ -0,0 +1,171 @@ +/* Root */ +:root +{ + /* Dark mode */ + --dark-bg: #0d0d0d; + --dark-text: #ffdab9; + --dark-link: black; + --dark-link-bg: #f08080; + --dark-title: #f08080; + + /* Light mode */ + --light-bg: #ffdab9; + --light-text: #0d0d0d; + --light-link: black; + --light-link-bg: #f08080; + --light-title: #f08080; + + /* Default mode */ + --bg-color: var(--dark-bg); + --text-color: var(--dark-text); + --link-color: var(--dark-link); + --link-bg-color: var(--dark-link-bg); + --title-color: var(--dark-title); +} + + +/* Page default disposition */ +body +{ + background-color: var(--bg-color); + color: var(--text-color); + border: 1px solid var(--link-bg-color); + + width: 90vw; + margin-left: auto; + margin-right: auto; + text-align: center; +} + +ul { + list-style-type: none; + margin: 0; + padding: 0; +} + +/* Navbar & Contact */ +#contact +{ + margin-top: 2vh; +} + +nav ul, #contact ul +{ + display: flex; + justify-content: center; +} + +nav a, #contact a +{ + padding: 0.1rem 1rem; + margin: 0rem 0.3rem; + + text-align: center; + text-decoration: none; + text-transform: uppercase; + + color: var(--link-color); + background-color: var(--link-bg-color); +} + +nav a:hover, #contact a:hover +{ + color: var(--link-bg-color); + background-color: var(--link-color); + border: 1px solid var(--link-bg-color); +} + +/* pre */ +pre +{ + color: var(--link-bg-color); +} + +pre:hover +{ + animation: fadePreColor 4s infinite alternate; +} + +@keyframes fadePreColor { + 0% {color: var(--lightred);} + 25% {color: #ff5a5f;} + 50% {color: #c81d25;} + 100% {color: #370617;} +} + +/* top */ +.top +{ + background-color: var(--link-bg-color); + color: var(--link-color); + font-weight: bold; +} + +.top:after { + content: "HTTPS://ARKA.ROCKS" +} + +/* main */ +main +{ + margin: 2vw; + text-align: left; +} + +main a +{ + color: var(--link-bg-color); +} + +/* titles */ +h1, h2, h3, h4 { + color: var(--title-color); +} + +h1 { + border-bottom: 1px solid var(--title-color); +} + +/* Responsive design */ +@media screen and (max-width: 700px) +{ + body + { + font-size: 10px; + } +} + +@media screen and (max-width: 500px) +{ + nav ul, #contact ul + { + flex-direction: column; + gap: 0.5rem; + } +} + +/* Night mode */ +@media (prefers-color-scheme: dark) +{ + :root + { + --bg-color: var(--dark-bg); + --text-color: var(--dark-text); + --link-color: var(--dark-link); + --link-bg-color: var(--dark-link-bg); + --title-color: var(--dark-title); + } +} + +/* Day mode */ +@media (prefers-color-scheme: light) +{ + :root + { + --bg-color: var(--light-bg); + --text-color: var(--light-text); + --link-color: var(--light-link); + --link-bg-color: var(--light-link-bg); + --title-color: var(--light-title); + } +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..1da1b8d --- /dev/null +++ b/index.html @@ -0,0 +1,76 @@ + + + + + + + + + + + + + + + + ArKa + + + + +
+ +
+ + + 
+█████╗ ██████╗ ██╗  ██╗ █████╗ 
+██╔══██╗██╔══██╗██║ ██╔╝██╔══██╗
+███████║██████╔╝█████╔╝ ███████║
+██╔══██║██╔══██╗██╔═██╗ ██╔══██║
+██║  ██║██║  ██║██║  ██╗██║  ██║
+╚═╝  ╚═╝╚═╝  ╚═╝╚═╝  ╚═╝╚═╝  ╚═╝
+
+ + + +
+ + +
+
+

ArKa

+

ArKa est le nom de l'infrastructure crée par moi, Oxbian.

+

Il y a un blog, un serveur gitea, et voilà (Y a d'autres services mais c'est pour mon utilisation perso).

+

Le gitea contient mes projets, certains pourront vous êtres utiles, ou non.

+

Quant au blog, il contient des guides de bonnes pratiques pour apprendre / améliorer un domaine, comme la vie privée, la cybersécurité.. Et parfois j'y poste des articles expliquant mon avis et point de vue sur certaines problématiques.

+ +

Projet créer pour ArKa

+
    +
  • Un générateur de blog à partir de fichier markdown, permettant de générer des pages webs customisables avec seulement un fichier html et css. BlogGenerator
    • +
  • Un script pour envoyer des messages à un utilisateur via le protocol Matrix. Matrix sender
    • +
  • Des scripts qui envoient les notifications de logwatch, fail2ban à un utilisateur via le protocol Matrix. Matrix monitoring
    • +
+
+
+
+ + + -- cgit v1.2.3