Compare commits
10 Commits
888a03489b
...
ec0df6f341
| Author | SHA1 | Date |
|---|---|---|
 Bauke
|
ec0df6f341
|
|
|
Bauke
|
b2d5c85bcc
|
|
|
Bauke
|
5b59b7bacb
|
|
|
Bauke
|
e2fc2ac6e8
|
|
|
Bauke
|
07e9a0b6b2
|
|
|
Bauke
|
e64aac603a
|
|
|
Bauke
|
c3735ae205
|
|
|
Bauke
|
02fc799d6f
|
|
|
Bauke
|
12a93a85a6
|
|
|
Bauke
|
1261562043
|
|
|
@ -1,6 +1,11 @@
|
||||||
|
[tasks.build]
|
||||||
|
clear = true
|
||||||
|
command = "bun"
|
||||||
|
args = ["--bun", "astro", "build"]
|
||||||
|
|
||||||
[tasks.dev]
|
[tasks.dev]
|
||||||
clear = true
|
clear = true
|
||||||
command = "bunx"
|
command = "bun"
|
||||||
args = ["--bun", "astro", "dev"]
|
args = ["--bun", "astro", "dev"]
|
||||||
|
|
||||||
[tasks.lint]
|
[tasks.lint]
|
||||||
|
|
@ -9,10 +14,10 @@ dependencies = ["lint-ts", "lint-scss"]
|
||||||
|
|
||||||
[tasks.lint-ts]
|
[tasks.lint-ts]
|
||||||
clear = true
|
clear = true
|
||||||
command = "bunx"
|
command = "bun"
|
||||||
args = ["xo"]
|
args = ["xo"]
|
||||||
|
|
||||||
[tasks.lint-scss]
|
[tasks.lint-scss]
|
||||||
clear = true
|
clear = true
|
||||||
command = "bunx"
|
command = "bun"
|
||||||
args = ["--bun", "stylelint", "source/**/*.scss"]
|
args = ["--bun", "stylelint", "source/**/*.scss"]
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,37 @@
|
||||||
|
---
|
||||||
|
import sources from "../public/interlinked/sources.json";
|
||||||
|
import "./interlinked-image.scss";
|
||||||
|
|
||||||
|
/** Properties for the InterlinkedImage component. */
|
||||||
|
export interface Props {
|
||||||
|
collection: "interlinked" | "numbered";
|
||||||
|
file: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const {collection, file} = Astro.props;
|
||||||
|
|
||||||
|
const imageDirectory = collection === "interlinked" ? "/" : "/numbered";
|
||||||
|
const imagePath = `/interlinked${imageDirectory}/${file}`;
|
||||||
|
const name = file.slice(0, file.indexOf("."));
|
||||||
|
|
||||||
|
let source: string | undefined;
|
||||||
|
if (collection === "interlinked" && name in sources.interlinked) {
|
||||||
|
const location = (sources.interlinked as Record<string, string>)[name];
|
||||||
|
source = `${sources.interlinked.baseUrl}${location}`;
|
||||||
|
}
|
||||||
|
---
|
||||||
|
|
||||||
|
<div class="interlinked-image">
|
||||||
|
<h3 class="heading">
|
||||||
|
{
|
||||||
|
source === undefined ? (
|
||||||
|
name
|
||||||
|
) : (
|
||||||
|
<a class="source-link" href={source}>
|
||||||
|
{name}
|
||||||
|
</a>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
</h3>
|
||||||
|
<img class="image" src={imagePath} />
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
.interlinked-image {
|
||||||
|
background-color: #111;
|
||||||
|
|
||||||
|
.heading {
|
||||||
|
padding: var(--spacing-2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.image {
|
||||||
|
border: 2px solid white;
|
||||||
|
display: block;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.source-link {
|
||||||
|
color: #f0f;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -18,6 +18,11 @@ const {frontmatter} = Astro.props;
|
||||||
<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" />
|
||||||
<title>{frontmatter.pageTitle}</title>
|
<title>{frontmatter.pageTitle}</title>
|
||||||
|
<link
|
||||||
|
rel="shortcut icon"
|
||||||
|
href="/driftingnebula-logo-shadowed.png"
|
||||||
|
type="image/x-icon"
|
||||||
|
/>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<slot />
|
<slot />
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
---
|
---
|
||||||
import BaseLayout, {type Props as BaseProps} from "../layouts/base.astro";
|
import BaseLayout, {type Props as BaseProps} from "../layouts/base.astro";
|
||||||
|
import "../scss/index.scss";
|
||||||
|
|
||||||
const props: BaseProps = {
|
const props: BaseProps = {
|
||||||
frontmatter: {
|
frontmatter: {
|
||||||
|
|
@ -9,5 +10,31 @@ const props: BaseProps = {
|
||||||
---
|
---
|
||||||
|
|
||||||
<BaseLayout {...props}>
|
<BaseLayout {...props}>
|
||||||
<h1>driftingnebula</h1>
|
<header class="page-header">
|
||||||
|
<h1 title="driftingnebula">
|
||||||
|
<img
|
||||||
|
class="big"
|
||||||
|
src="/driftingnebula-shadowed.png"
|
||||||
|
alt="driftingnebula"
|
||||||
|
/>
|
||||||
|
<img
|
||||||
|
class="small"
|
||||||
|
src="/driftingnebula-logo-shadowed.png"
|
||||||
|
alt="driftingnebula"
|
||||||
|
/>
|
||||||
|
</h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="page-main">
|
||||||
|
<div class="project" data-project-name="interlinked">
|
||||||
|
<header>
|
||||||
|
<div class="border-wrap">
|
||||||
|
<a href="/interlinked">
|
||||||
|
<h2>Interlinked</h2>
|
||||||
|
<p>Generative art with GIMP, GEGL and ImageMagick.</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
</BaseLayout>
|
</BaseLayout>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,36 @@
|
||||||
|
---
|
||||||
|
import BaseLayout, {type Props as BaseProps} from "../layouts/base.astro";
|
||||||
|
import InterlinkedImage from "../components/interlinked-image.astro";
|
||||||
|
import "../scss/interlinked.scss";
|
||||||
|
import interlinkedImages from "../public/interlinked/images.json";
|
||||||
|
|
||||||
|
const props: BaseProps = {
|
||||||
|
frontmatter: {
|
||||||
|
pageTitle: "Interlinked - driftingnebula",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
---
|
||||||
|
|
||||||
|
<BaseLayout {...props}>
|
||||||
|
<header class="page-header">
|
||||||
|
<h1>driftingnebula</h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="page-main">
|
||||||
|
<h2>Interlinked</h2>
|
||||||
|
<p>Fully reproducible images with all the operations available.</p>
|
||||||
|
{
|
||||||
|
interlinkedImages.interlinked.map((file) => (
|
||||||
|
<InterlinkedImage collection="interlinked" file={file} />
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
<h2>Numbered</h2>
|
||||||
|
<p>Old images I didn't write the operations down for.</p>
|
||||||
|
{
|
||||||
|
interlinkedImages.numbered.map((file) => (
|
||||||
|
<InterlinkedImage collection="numbered" file={file} />
|
||||||
|
))
|
||||||
|
}
|
||||||
|
</main>
|
||||||
|
</BaseLayout>
|
||||||
|
After Width: | Height: | Size: 45 KiB |
|
After Width: | Height: | Size: 104 KiB |
|
After Width: | Height: | Size: 349 KiB |
|
After Width: | Height: | Size: 262 KiB |
|
After Width: | Height: | Size: 456 KiB |
|
After Width: | Height: | Size: 282 KiB |
|
After Width: | Height: | Size: 1.6 MiB |
|
After Width: | Height: | Size: 3.7 MiB |
|
After Width: | Height: | Size: 663 KiB |
|
After Width: | Height: | Size: 498 KiB |
|
After Width: | Height: | Size: 969 KiB |
|
After Width: | Height: | Size: 1.5 MiB |
|
After Width: | Height: | Size: 997 KiB |
|
|
@ -0,0 +1,76 @@
|
||||||
|
{
|
||||||
|
"interlinked": [
|
||||||
|
"2022-03-06.jpg",
|
||||||
|
"2022-03-07.jpg",
|
||||||
|
"2022-03-08.jpg",
|
||||||
|
"2022-03-09.jpg",
|
||||||
|
"2022-03-10.jpg",
|
||||||
|
"2022-03-11.jpg",
|
||||||
|
"2022-03-12.jpg",
|
||||||
|
"2022-03-13.jpg",
|
||||||
|
"2022-03-14.jpg",
|
||||||
|
"2022-03-15.jpg",
|
||||||
|
"2022-03-29.jpg"
|
||||||
|
],
|
||||||
|
"numbered": [
|
||||||
|
"1.png",
|
||||||
|
"2.png",
|
||||||
|
"3.png",
|
||||||
|
"4.png",
|
||||||
|
"5-1.png",
|
||||||
|
"5-2.png",
|
||||||
|
"6.png",
|
||||||
|
"7-1.png",
|
||||||
|
"7-2.png",
|
||||||
|
"8-1.png",
|
||||||
|
"8-2.png",
|
||||||
|
"9.png",
|
||||||
|
"10.png",
|
||||||
|
"11-1.png",
|
||||||
|
"11-2.png",
|
||||||
|
"11-3.png",
|
||||||
|
"11-4.png",
|
||||||
|
"12.png",
|
||||||
|
"13.png",
|
||||||
|
"14.png",
|
||||||
|
"15.png",
|
||||||
|
"16.png",
|
||||||
|
"17.png",
|
||||||
|
"18-1.png",
|
||||||
|
"18-2.png",
|
||||||
|
"19.png",
|
||||||
|
"20.png",
|
||||||
|
"21.png",
|
||||||
|
"22.png",
|
||||||
|
"23-1.png",
|
||||||
|
"23-2.png",
|
||||||
|
"24.png",
|
||||||
|
"25.png",
|
||||||
|
"26.png",
|
||||||
|
"27.png",
|
||||||
|
"28.png",
|
||||||
|
"29.png",
|
||||||
|
"30-1.png",
|
||||||
|
"30-2.png",
|
||||||
|
"31.png",
|
||||||
|
"32.png",
|
||||||
|
"33.png",
|
||||||
|
"34.png",
|
||||||
|
"35.png",
|
||||||
|
"36-1.png",
|
||||||
|
"36-2.png",
|
||||||
|
"37.png",
|
||||||
|
"38.png",
|
||||||
|
"39-1.png",
|
||||||
|
"39-2.png",
|
||||||
|
"40.png",
|
||||||
|
"41.png",
|
||||||
|
"42.png",
|
||||||
|
"43.png",
|
||||||
|
"44.png",
|
||||||
|
"45.png",
|
||||||
|
"46.png",
|
||||||
|
"47.png",
|
||||||
|
"48.png"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
After Width: | Height: | Size: 3.9 MiB |
|
After Width: | Height: | Size: 3.7 MiB |
|
After Width: | Height: | Size: 602 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 2.3 MiB |
|
After Width: | Height: | Size: 37 KiB |
|
After Width: | Height: | Size: 4.6 MiB |
|
After Width: | Height: | Size: 2.3 MiB |
|
After Width: | Height: | Size: 960 KiB |
|
After Width: | Height: | Size: 116 KiB |
|
After Width: | Height: | Size: 1.5 MiB |
|
After Width: | Height: | Size: 1.9 MiB |
|
After Width: | Height: | Size: 192 KiB |
|
After Width: | Height: | Size: 138 KiB |
|
After Width: | Height: | Size: 3.4 MiB |
|
After Width: | Height: | Size: 302 KiB |
|
After Width: | Height: | Size: 1.7 MiB |
|
After Width: | Height: | Size: 242 KiB |
|
After Width: | Height: | Size: 262 KiB |
|
After Width: | Height: | Size: 573 KiB |
|
After Width: | Height: | Size: 1.3 MiB |
|
After Width: | Height: | Size: 1.5 MiB |
|
After Width: | Height: | Size: 828 KiB |
|
After Width: | Height: | Size: 269 KiB |
|
After Width: | Height: | Size: 241 KiB |
|
After Width: | Height: | Size: 1.8 MiB |
|
After Width: | Height: | Size: 2.6 MiB |
|
After Width: | Height: | Size: 597 KiB |
|
After Width: | Height: | Size: 1.9 MiB |
|
After Width: | Height: | Size: 1.2 MiB |
|
After Width: | Height: | Size: 1.1 MiB |
|
After Width: | Height: | Size: 1.9 MiB |
|
After Width: | Height: | Size: 2.7 MiB |
|
After Width: | Height: | Size: 2.6 MiB |
|
After Width: | Height: | Size: 1.4 MiB |
|
After Width: | Height: | Size: 2.7 MiB |
|
After Width: | Height: | Size: 451 KiB |
|
After Width: | Height: | Size: 1.9 MiB |
|
After Width: | Height: | Size: 409 KiB |
|
After Width: | Height: | Size: 1.2 MiB |
|
After Width: | Height: | Size: 1.4 MiB |
|
After Width: | Height: | Size: 2.3 MiB |
|
After Width: | Height: | Size: 564 KiB |
|
After Width: | Height: | Size: 914 KiB |
|
After Width: | Height: | Size: 360 KiB |
|
After Width: | Height: | Size: 3.9 MiB |
|
After Width: | Height: | Size: 1.8 MiB |
|
After Width: | Height: | Size: 2.1 MiB |
|
After Width: | Height: | Size: 1.1 MiB |
|
After Width: | Height: | Size: 648 KiB |
|
After Width: | Height: | Size: 1.1 MiB |
|
After Width: | Height: | Size: 1.5 MiB |
|
After Width: | Height: | Size: 2.3 MiB |
|
After Width: | Height: | Size: 4.8 MiB |
|
After Width: | Height: | Size: 1.9 MiB |
|
After Width: | Height: | Size: 700 KiB |
|
After Width: | Height: | Size: 363 KiB |
|
After Width: | Height: | Size: 1.1 MiB |
|
After Width: | Height: | Size: 1.3 MiB |
|
|
@ -0,0 +1,16 @@
|
||||||
|
{
|
||||||
|
"interlinked": {
|
||||||
|
"baseUrl": "https://git.bauke.xyz/driftingnebula/interlinked/src/commit/b27237f709b55a103c33b65c0222a2affe26c2e6/interlinked/source/projects",
|
||||||
|
"2022-03-06": "/year_2022/mod.rs#L6",
|
||||||
|
"2022-03-07": "/year_2022/mod.rs#L62",
|
||||||
|
"2022-03-08": "/year_2022/mod.rs#L116",
|
||||||
|
"2022-03-09": "/year_2022/mod.rs#L146",
|
||||||
|
"2022-03-10": "/year_2022/mod.rs#L187",
|
||||||
|
"2022-03-11": "/year_2022/mod.rs#L228",
|
||||||
|
"2022-03-12": "/year_2022/mod.rs#L271",
|
||||||
|
"2022-03-13": "/year_2022/mod.rs#L305",
|
||||||
|
"2022-03-14": "/year_2022/mod.rs#L337",
|
||||||
|
"2022-03-15": "/year_2022/mod.rs#L372",
|
||||||
|
"2022-03-29": "/year_2022/mod.rs#L443"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -14,5 +14,11 @@ html {
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
|
--spacing-1: 4px;
|
||||||
|
--spacing-2: 8px;
|
||||||
|
--spacing-3: 16px;
|
||||||
|
|
||||||
|
background-color: black;
|
||||||
|
color: white;
|
||||||
font-size: 2rem;
|
font-size: 2rem;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,79 @@
|
||||||
|
.page-header {
|
||||||
|
align-items: center;
|
||||||
|
background: center url("/interlinked/numbered/12.png");
|
||||||
|
background-size: cover;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
min-height: 400px;
|
||||||
|
height: 50vh;
|
||||||
|
padding: var(--spacing-3);
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
height: 10rem;
|
||||||
|
|
||||||
|
&.big {
|
||||||
|
display: unset;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.small {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (width <= 600px) {
|
||||||
|
&.big {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.small {
|
||||||
|
display: unset;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.project {
|
||||||
|
align-items: center;
|
||||||
|
background-color: #303030;
|
||||||
|
display: flex;
|
||||||
|
min-height: 400px;
|
||||||
|
height: 50vh;
|
||||||
|
padding: var(--spacing-3);
|
||||||
|
|
||||||
|
&[data-project-name="interlinked"] {
|
||||||
|
background: center url("/interlinked/numbered/15.png");
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
background-color: #220575;
|
||||||
|
border: 1px solid black;
|
||||||
|
display: block;
|
||||||
|
padding: var(--spacing-3);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2,
|
||||||
|
p {
|
||||||
|
color: white;
|
||||||
|
text-shadow: 2px 2px 2px black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-wrap {
|
||||||
|
background: conic-gradient(#ca0600, #7b68c1, #ad8f1e, #ca0600);
|
||||||
|
border: 1px solid black;
|
||||||
|
padding: var(--spacing-1);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: white;
|
||||||
|
border-color: white;
|
||||||
|
|
||||||
|
a {
|
||||||
|
border-color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,11 @@
|
||||||
|
.page-header {
|
||||||
|
border-bottom: 4px solid white;
|
||||||
|
padding: var(--spacing-3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-main {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: var(--spacing-3);
|
||||||
|
padding: var(--spacing-3);
|
||||||
|
}
|
||||||