blob: 808413549218091c154e1522096b1c78a4fd2364 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
|
# Creates an output containing the logo in SVG format (animated and
# static, one for each background colour) and without animations in
# PNG.
{ depot, lib, pkgs, ... }:
let
palette = {
purple = "#CC99C9";
blue = "#9EC1CF";
green = "#9EE09E";
yellow = "#FDFD97";
orange = "#FEB144";
red = "#FF6663";
};
staticCss = colour: ''
#armchair-background {
fill: ${colour};
}
'';
# Create an animated CSS that equally spreads out the colours over
# the animation duration (1min).
animatedCss = colours:
let
# Calculate at which percentage offset each colour should appear.
stepSize = 100 / ((builtins.length colours) - 1);
frames = lib.imap0 (idx: colour: { inherit colour; at = idx * stepSize; }) colours;
frameCss = frame: "${toString frame.at}% { fill: ${frame.colour}; }";
in
''
#armchair-background {
animation: 30s infinite alternate armchairPalette;
}
@keyframes armchairPalette {
${lib.concatStringsSep "\n" (map frameCss frames)}
}
'';
# Dark version of the logo, suitable for light backgrounds.
darkCss = armchairCss: ''
.structure {
fill: #383838;
}
#letters {
fill: #fefefe;
}
${armchairCss}
'';
# Light version, suitable for dark backgrounds.
lightCss = armchairCss: ''
.structure {
fill: #e4e4ef;
}
#letters {
fill: #181818;
}
${armchairCss}
'';
logoShapes = builtins.readFile ./logo-shapes.svg;
logoSvg = style: ''
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="420 860 1640 1500"
xmlns:xlink="http://www.w3.org/1999/xlink">
<style>${style}</style>
${logoShapes}
</svg>
'';
in
depot.nix.readTree.drvTargets (lib.fix (self: {
# Expose the logo construction functions.
inherit palette darkCss lightCss animatedCss staticCss;
# Create a TVL logo SVG with the specified style.
logoSvg = style: pkgs.writeText "logo.svg" (logoSvg style);
# Create a PNG of the TVL logo with the specified style and DPI.
logoPng = style: dpi: pkgs.runCommand "logo.png" { } ''
${pkgs.inkscape}/bin/inkscape \
--export-area-drawing \
--export-background-opacity 0 \
--export-dpi ${toString dpi} \
${self.logoSvg style} -o $out
'';
# Animated dark SVG logo with all colours.
pastelRainbow = self.logoSvg (darkCss (animatedCss (lib.attrValues palette)));
}
# Add individual outputs for static dark logos of each colour.
// (lib.mapAttrs'
(k: v: lib.nameValuePair "${k}Png"
(self.logoPng (darkCss (staticCss v)) 96))
palette)))
|
