My website
lesbian.skin
Deal with archived projects
- Moved them to the bottom of the Projects list
- Styled them differently to make it visually obvious
+32
-4
+13
src/website/data/projects.gleam
+13
src/website/data/projects.gleam
···
1
+
import gleam/bool
2
+
import gleam/io
1
3
import gleam/list
4
+
import gleam/order
2
5
import gleam/result
3
6
import gleam/string
4
7
import lustre/element/html
···
60
63
)
61
64
})
62
65
}
66
+
67
+
pub fn sorted(projects: List(Project(a))) -> List(Project(a)) {
68
+
projects
69
+
|> list.sort(compare_archived)
70
+
// |> list.reverse
71
+
}
72
+
73
+
fn compare_archived(a: Project(a), with b: Project(b)) -> order.Order {
74
+
bool.compare(a.archived, b.archived)
75
+
}
+19
-4
src/website/page/project.gleam
+19
-4
src/website/page/project.gleam
···
3
3
import lustre/element.{type Element}
4
4
import lustre/element/html
5
5
import website/common.{type Project, Project}
6
+
import website/data/projects
6
7
7
8
pub fn view_all(projects: List(Project(a))) -> List(Element(a)) {
8
9
projects
10
+
|> projects.sorted
9
11
|> list.map(fn(project: Project(a)) {
10
12
html.ul(
11
13
[
12
14
attr.id("project-" <> project.id),
13
15
attr.class(
14
-
"drop-shadow-md text-xl rounded-xl p-4 mb-4 bg-gray-200 dark:bg-neutral-800 dark:text-neutral-200",
16
+
"drop-shadow-md text-xl rounded-xl p-4 mb-4 dark:text-neutral-200 "
17
+
<> case project.archived {
18
+
True -> "bg-red-300 dark:bg-red-700"
19
+
False -> "bg-gray-200 dark:bg-neutral-800"
20
+
},
15
21
),
16
22
],
17
23
[
···
20
26
attr.src(project.img),
21
27
attr.class("rounded-xl max-w-16 max-h-16"),
22
28
]),
23
-
html.h1([attr.class("text-2xl")], [
24
-
common.link(project.title, "/projects/" <> project.id),
25
-
]),
29
+
html.h1(
30
+
[
31
+
attr.class(
32
+
"text-2xl "
33
+
<> case project.archived {
34
+
True -> "before:content-['🗂️_']"
35
+
False -> ""
36
+
},
37
+
),
38
+
],
39
+
[common.link(project.title, "/projects/" <> project.id)],
40
+
),
26
41
html.div(
27
42
[attr.class("flex items-center gap-2")],
28
43
project.links