feat: Make prettier

This commit is contained in:
PapaTutuWawa 2023-07-17 17:01:11 +02:00
parent eac0b06afc
commit 2d0c954a82
13 changed files with 168 additions and 138 deletions

View File

@ -2,24 +2,29 @@
<!-- description: Alexander 'PapaTutuWawa' 's code repositories. --> <!-- description: Alexander 'PapaTutuWawa' 's code repositories. -->
<!-- render: yes --> <!-- render: yes -->
<div class="project-row" /> <div class="flex flex-col pt-8">
<p class="prose text-white">
I keep my code mostly on my private Gitea instance <a class="text-indigo-400"
href="https://{{ gitea_url }}/{{ gitea_username }}">here</a>.
For purposes of allowing other people to also contribute
I try to mirror my code on GitHub and codeberg.
</p>
<p> <div class="pt-8 w-full">
I keep my code mostly on my private Gitea instance <a href="https://{{ gitea_url }}/{{ gitea_username }}">here</a>. For purposes of allowing other people to also contribute <table class="text-white pt-8 w-full">
I try to mirror my code on GitHub and codeberg. <tr>
</p> <td>GitHub</td>
<td><a class="text-indigo-400" href="https://github.com/{{ github_username }}">{{ github_username }}</a></td>
<table id="social-links"> </tr>
<tr> <tr>
<td>GitHub</td> <td>Codeberg</td>
<td><a href="https://github.com/{{ github_username }}">{{ github_username }}</a></td> <td><a class="text-indigo-400" href="https://codeberg.org/{{ codeberg_username }}">{{ codeberg_username }}</a>
</tr> </td>
<tr> </tr>
<td>Codeberg</td> <tr>
<td><a href="https://codeberg.org/{{ codeberg_username }}">{{ codeberg_username }}</a></td> <td>Gitea</td>
</tr> <td><a class="text-indigo-400" href="https://{{ gitea_url }}/{{ gitea_username }}">{{ gitea_username }}</a></td>
<tr> </tr>
<td>Gitea</td> </table>
<td><a href="https://{{ gitea_url }}/{{ gitea_username }}">{{ gitea_username }}</a></td> </div>
</tr> </div>
</table>

View File

@ -1,38 +1,43 @@
<!-- title: Contact | polynom.me --> <!-- title: Contact | polynom.me -->
<!-- description: Contact details for getting in touch with Alexander 'PapaTutuWawa'. --> <!-- description: Contact details for getting in touch with Alexander 'PapaTutuWawa'. -->
<!-- render: yes --> <!-- render: yes -->
<div class="project-row"></div> <div class="flex flex-col pt-8">
<p class="prose text-white">
If you have any questions about my projects or just want to talk, feel
free to reach out to me.
</p>
<p> <div class="w-full pt-8">
If you have any questions about my projects or just want to talk, feel <table class="text-white w-full">
free to reach out to me. <tr>
</p> <td>Fediverse</td>
<td><a class="text-indigo-400" href="https://{{ fediverse_instance}}/{{ fediverse_username }}">@{{
<table id="social-links"> fediverse_username }}@{{
<tr> fediverse_instance }}</a></td>
<td>Fediverse</td> </tr>
<td><a href="https://{{ fediverse_instance}}/{{ fediverse_username }}">@{{ fediverse_username }}@{{ fediverse_instance }}</a></td> <tr>
</tr> <td>E-Mail</td>
<tr> <td>{{ email_user }} [a with a circle] {{ email_domain }}</td>
<td class="table-no-padding-bottom">E-Mail</td> </tr>
<td class="table-no-padding-bottom">{{ email_user }} [a with a circle] {{ email_domain }}</td> <tr>
</tr> <td />
<tr> <td>
<td class="table-no-padding-top" /> Please use my <a class="text-indigo-400" href="https://{{ gpg_key_url }}">GPG public key</a>
<td class="table-no-padding-top"> </td>
Please use my <a href="https://{{ gpg_key_url }}">GPG public key</a> </tr>
</td> <tr>
</tr> <td>GitHub</td>
<tr> <td><a class="text-indigo-400" href="https://github.com/{{ github_username }}">{{ github_username }}</a></td>
<td>GitHub</td> </tr>
<td><a href="https://github.com/{{ github_username }}">{{ github_username }}</a></td> <tr>
</tr> <td>Codeberg</td>
<tr> <td><a class="text-indigo-400" href="https://codeberg.org/{{ codeberg_username }}">{{ codeberg_username }}</a>
<td>Codeberg</td> </td>
<td><a href="https://codeberg.org/{{ codeberg_username }}">{{ codeberg_username }}</a></td> </tr>
</tr> <tr>
<tr> <td>Gitea</td>
<td>Gitea</td> <td><a class="text-indigo-400" href="https://{{ gitea_url }}/{{ gitea_username }}">{{ gitea_username }}</a></td>
<td><a href="https://{{ gitea_url }}/{{ gitea_username }}">{{ gitea_username }}</a></td> </tr>
</tr> </table>
</table> </div>
</div>

View File

@ -1,16 +1,18 @@
<!-- title: Home | polynom.me --> <!-- title: Home | polynom.me -->
<!-- description: The personal website of Alexander 'PapaTutuWawa'. --> <!-- description: The personal website of Alexander 'PapaTutuWawa'. -->
<!-- render: yes --> <!-- render: yes -->
<div class="project-row"></div> <div class="flex flex-col w-full sm:w-4/5">
<p class="quote"> <p class="text-white prose py-8 self-center">
Hello! My online pseudonym is <i>PapaTutuWawa</i> and I am Hello! My online pseudonym is <i>PapaTutuWawa</i> and I am
just some random person on the Internet who is passionate about just some random person on the Internet who is passionate about
topics like XMPP, federated Internet services and privacy. Linux system topics like XMPP, federated Internet services and privacy. Linux system
administration, Linux tinkering and programming are my favourite things to do. administration, Linux tinkering and programming are my favourite things to do.
</p> </p>
<div class="project-row"></div> <h1 class="prose text-2xl text-indigo-400 self-start">Projects</h1>
<h1>Projects</h1> <p class="prose text-white text-left self-start">This is a small selection of my projects. More are available <a
<p>This is a small selection of my projects. More are available <a href="code.html">here.</a></p> class="text-indigo-400" href="code.html">here.</a></p>
{{ for_each projects layout/templates/project.html }} {{ for_each projects layout/templates/project.html }}
</div>

View File

@ -36,16 +36,16 @@
}, },
"nixpkgs_2": { "nixpkgs_2": {
"locked": { "locked": {
"lastModified": 1638239011, "lastModified": 1689449371,
"narHash": "sha256-AjhmbT4UBlJWqxY0ea8a6GU2C2HdKUREkG43oRr3TZg=", "narHash": "sha256-sK3Oi8uEFrFPL83wKPV6w0+96NrmwqIpw9YFffMifVg=",
"owner": "NixOS", "owner": "NixOS",
"repo": "nixpkgs", "repo": "nixpkgs",
"rev": "a7ecde854aee5c4c7cd6177f54a99d2c1ff28a31", "rev": "29bcead8405cfe4c00085843eb372cc43837bb9d",
"type": "github" "type": "github"
}, },
"original": { "original": {
"owner": "NixOS", "owner": "NixOS",
"ref": "21.11", "ref": "nixpkgs-unstable",
"repo": "nixpkgs", "repo": "nixpkgs",
"type": "github" "type": "github"
} }

View File

@ -2,7 +2,7 @@
description = "The website hosted at https://polynom.me"; description = "The website hosted at https://polynom.me";
inputs = { inputs = {
nixpkgs.url = "github:NixOS/nixpkgs/21.11"; nixpkgs.url = "github:NixOS/nixpkgs/nixpkgs-unstable";
assets.url = "git+https://git.polynom.me/polynom.me/shared-assets.git"; assets.url = "git+https://git.polynom.me/polynom.me/shared-assets.git";
}; };
@ -16,9 +16,17 @@
in { in {
packages = forAllSystems (system: let packages = forAllSystems (system: let
pkgs = import nixpkgs { inherit system; }; pkgs = import nixpkgs { inherit system; };
tailwindWithTypography = pkgs.nodePackages.tailwindcss.overrideAttrs (old: {
plugins = [
pkgs.nodePackages."@tailwindcss/typography"
];
});
in { in {
default = pkgs.callPackage ./pkgs/website.nix { default = pkgs.callPackage ./pkgs/website.nix {
shared-assets = assets.packages.${system}.default; shared-assets = assets.packages.${system}.default;
inherit tailwindWithTypography;
}; };
}); });

7
input.css Normal file
View File

@ -0,0 +1,7 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
html {
background-color: #212121;
}

View File

@ -1,53 +1,38 @@
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html>
<head>
<title>{{ title }}</title> <head>
<title>{{ title }}</title>
<meta property="og:title" content="{{ title }}" />
<meta property="og:description" content="{{ description }}" />
<meta property="og:title" content="{{ title }}" />
<meta property="og:description" content="{{ description }}" />
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" <meta name="viewport" content="width=device-width, initial-scale=1.0" />
content="width=device-width, initial-scale=1.0, maximum-scale=1" /> <link href="/assets/css/index.css" rel="stylesheet" />
</head>
<link rel="stylesheet" href="assets/css/index.css" /> <body class="min-h-screen h-full flex flex-col p-8 h-full">
<link rel="stylesheet" href="{{ page_assets }}/css/main.css" /> <div class="flex flex-col items-center">
<!-- Allow the header to be independently sized from the content -->
<div>
<div class="flex flex-row">
<img class="w-32 md:w-36 lg:w-48 h-32 md:h-36 lg:h-48 rounded-lg" src="https://cdn.polynom.me/img/avatar.jpg" />
<!-- Mastodon --> <div class="flex flex-col justify-center px-8">
<link rel="me" href="https://{{ mastodon_instance_url }}/{{ mastodon_handle }}" /> <a href="/"><h1 class="text-xl lg:text-4xl text-indigo-400">PapaTutuWawa</h1></a>
</head>
<body>
<div class="horizontal-center">
<div class="vertical header">
<div id="header" class="horizontal">
<img class="avatar" src="{{ page_assets }}/img/avatar.jpg" alt="" />
<div class="vertical-center"> <div class="flex flex-row justify-between">
<span class="name-title">Alexander "PapaTutuWawa"</span> <a class="text-indigo-400" href="https://blog.polynom.me">Blog</a>
<a class="text-indigo-400" href="/code.html">Code</a>
<a class="text-indigo-400" href="/contact.html">Contact</a>
</div>
</div>
</div>
</div>
<div id="header-links"> {{ content }}
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="https://{{ blog_url }}">Blog</a></li>
<li><a href="code.html">Code</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</div>
</div>
{{ content }}
<br />
<div class="horizontal-center footer">
<span>
Created by <i>PapaTutuWawa</i> with &lt;3 using
<a href="https://github.com/google/roboto">Roboto</a>,
<a href="https://github.com/RedHatOfficial/Overpass">Overpass</a> and
<a href="https://github.com/sunainapai/makesite">makesite</a>
</span>
</div>
</div>
</div> </div>
</body> </body>
</html> </html>

View File

@ -1,9 +1,7 @@
<div class="no-screenshot clickable"> <div class="flex justify-center md:w-48 md:h-48 w-24 h-24 rounded-lg clickable bg-indigo-950">
<a href="https://{{ item.source_url }}"> <a class="prose text-white text-5xl" href="https://{{ item.source_url }}">
<div class="vertical-center"> <div class="md:w-48 md:h-48 w-24 h-24 flex flex-col justify-center">
<div class="horizontal-center"> <span class="text-center">#</span>
<span class="no-screenshot-pound">#</span>
</div>
</div> </div>
</a> </a>
</div> </div>

View File

@ -1,12 +1,14 @@
<div class="horizontal project-row"> <div class="flex flex-row self-start pt-8">
{{ template_if_empty item.screenshot layout/templates/no_screenshot.html layout/templates/screenshot.html }} {{ template_if_empty item.screenshot layout/templates/no_screenshot.html layout/templates/screenshot.html }}
<div class="vertical"> <div class="flex flex-col pl-8">
<h2>{{ item.title }}</h2> <h2 class="prose text-indigo-400 text-2xl">{{ item.title }}</h2>
<p>{{ item.description }}</p> <p class="prose text-white text-justify">{{ item.description }}</p>
<ul> <div class="pt-4">
{{ template_if_empty item.website layout/templates/empty.html layout/templates/project_website.html }} <ul>
<li><a href="https://{{ item.source_url }}">Code</a></li> {{ template_if_empty item.website layout/templates/empty.html layout/templates/project_website.html }}
</ul> <li><a class="prose text-indigo-400" href="https://{{ item.source_url }}">Code</a></li>
</ul>
</div>
</div> </div>
</div> </div>

View File

@ -1 +1 @@
<li><a href="https://{{ item.website }}">Website</a></li> <li><a class="text-indigo-400" href="https://{{ item.website }}">Website</a></li>

View File

@ -1,5 +1,5 @@
<div> <div>
<a href="https://{{ item.source_url }}" target="_blank"> <a href="https://{{ item.source_url }}" target="_blank">
<img class="screenshot clickable" src="{{ item.screenshot }}" alt="Screenshot of {{ item.title }}" /> <img class="w-24 md:w-48 max-w-none rounded-lg clickable" src="{{ item.screenshot }}" alt="Screenshot of {{ item.title }}" />
</a> </a>
</div> </div>

View File

@ -2,23 +2,29 @@
lib, stdenv lib, stdenv
, python3 , python3
, shared-assets , shared-assets
}: , tailwindWithTypography
}: let
stdenv.mkDerivation { pythonEnv = python3.withPackages (ps: with ps; [
markdown pygments
]);
in stdenv.mkDerivation {
pname = "website"; pname = "website";
version = "202205120-01"; version = "20230716";
src = ../.; src = ../.;
buildInputs = [ shared-assets python3 ]; buildInputs = [ shared-assets python3 ];
buildPhase = '' buildPhase = ''
${python3}/bin/python ${shared-assets}/bin/makesite.py \ ${pythonEnv}/bin/python ${shared-assets}/bin/makesite.py \
-v page_assets=https://cdn.polynom.me \ -v page_assets=https://cdn.polynom.me \
--assets ./assets \ --assets ./assets \
--copy-assets \ --copy-assets \
--include robots.txt \ --include robots.txt \
-p params.json -p params.json
# Build Tailwind CSS data
${tailwindWithTypography}/bin/tailwindcss --input ./input.css --output _site/assets/css/index.css
''; '';
installPhase = '' installPhase = ''

12
tailwind.config.js Normal file
View File

@ -0,0 +1,12 @@
module.exports = {
content: [
"./content/*.html",
"./layout/*.html",
"./layout/templates/*.html",
],
theme: {
},
plugins: [
require('@tailwindcss/typography'),
],
}