Skip to content
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit a7112c9

Browse files
garbasgarbas
committedJan 20, 2021
variant A of font
also changing the process how we embed svg into css
1 parent 7562bd1 commit a7112c9

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+739
-161
lines changed
 

‎flake.nix

+152-129
Original file line numberDiff line numberDiff line change
@@ -11,143 +11,166 @@
1111
system = "x86_64-linux";
1212
pkgs = import nixpkgs { inherit system; };
1313
package = builtins.fromJSON (builtins.readFile ./package.json);
14-
in rec {
15-
16-
lib.memoizeAssets = assets:
17-
pkgs.runCommandNoCC "nixos-styles-svg-assets" {
18-
nativeBuildInputs = with pkgs.nodePackages; [
19-
svgo
20-
];
21-
}
22-
''
23-
cp -r "${assets}" assets
24-
chmod -R +w assets
25-
26-
echo ":: Embedding SVG files"
27-
(cd assets
28-
# Skip the source svg files
29-
rm -f *.src.svg
30-
31-
# Optimize svg files
32-
for f in *.svg; do
33-
svgo $f &
34-
done
35-
# Wait until all `svgo` processes are done
36-
# According to light testing, it is twice as fast that way.
37-
wait
38-
39-
# Embed svg files in svg.less
40-
for f in *.svg; do
41-
echo "- $f"
42-
token=''${f^^}
43-
token=''${token//[^A-Z0-9]/_}
44-
token=SVG_''${token/%_SVG/}
45-
substituteInPlace svg.less --replace "@$token)" "'$(cat $f)')"
46-
substituteInPlace svg.less --replace "@$token," "'$(cat $f)',"
47-
done
48-
)
49-
mv assets $out
50-
'';
51-
52-
defaultPackage."${system}" = packages."${system}".commonStyles;
53-
54-
checks."${system}".build = defaultPackage."${system}";
55-
56-
packages."${system}" = rec {
57-
58-
commonStyles = pkgs.stdenv.mkDerivation {
59-
name = "nixos-common-styles-${self.lastModifiedDate}";
60-
61-
src = self;
62-
63-
enableParallelBuilding = true;
64-
65-
installPhase = ''
66-
mkdir $out
67-
cp -R src/* $out/
68-
69-
rm -rf $out/assets
70-
ln -sf ${lib.memoizeAssets ./src/assets} $out/assets
71-
'';
72-
};
7314

74-
storyBookYarnPkg = pkgs.yarn2nix-moretea.mkYarnPackage rec {
75-
name = "${package.name}-yarn-${package.version}";
76-
src = null;
77-
dontUnpack = true;
78-
packageJSON = ./package.json;
79-
yarnLock = ./yarn.lock;
80-
preConfigure = ''
81-
mkdir ${package.name}
82-
cd ${package.name}
83-
ln -s ${packageJSON} ./package.json
84-
ln -s ${yarnLock} ./yarn.lock
85-
'';
86-
yarnPreBuild = ''
87-
mkdir -p $HOME/.node-gyp/${pkgs.nodejs.version}
88-
echo 9 > $HOME/.node-gyp/${pkgs.nodejs.version}/installVersion
89-
ln -sfv ${pkgs.nodejs}/include $HOME/.node-gyp/${pkgs.nodejs.version}
15+
commonStylesAssets =
16+
pkgs.runCommandNoCCLocal
17+
"nixos-common-styles-assets-${self.lastModifiedDate}"
18+
{ nativeBuildInputs = [ flake.packages."${system}".embedSVG ];
19+
src = ./src/assets;
20+
}
21+
''
22+
echo $src
23+
mkdir -p ./assets
24+
cp $src/* ./assets
25+
chmod -R +w ./assets
26+
embed-svg ./assets $out
9027
'';
91-
publishBinsFor =
92-
[
93-
"@storybook/html"
94-
];
95-
postInstall = ''
96-
# XXX: this is a hacky way to get things working
97-
# we need to upstream this fixes
9828

99-
# node_modules is ready only
100-
sed -i -e "s|node_modules/.cache/storybook|.cache/storybook|" \
101-
$out/libexec/${package.name}/node_modules/@storybook/core/dist/server/utils/resolve-path-in-sb-cache.js
29+
flake = {
10230

103-
# copied favicon.ico is not writable
104-
sed -i -e 's|await (0, _cpy.default)(defaultFavIcon, outputDir);|await (0, _cpy.default)(defaultFavIcon, outputDir);_fsExtra.default.chmod(_path.default.join(outputDir, _path.default.basename(defaultFavIcon)), 0o200);|' \
105-
$out/libexec/${package.name}/node_modules/@storybook/core/dist/server/build-static.js
106-
'';
107-
};
31+
defaultPackage."${system}" = flake.packages."${system}".commonStyles;
10832

109-
storyBook = pkgs.stdenv.mkDerivation {
110-
name = "${package.name}-${package.version}";
111-
src = pkgs.lib.cleanSource ./.;
112-
113-
buildInputs =
114-
[
115-
storyBookYarnPkg
116-
] ++
117-
(with pkgs; [
118-
nodejs
119-
]) ++
120-
(with pkgs.nodePackages; [
121-
yarn
122-
]);
123-
124-
patchPhase = ''
125-
rm -rf node_modules
126-
ln -sf ${storyBookYarnPkg}/libexec/${package.name}/node_modules .
127-
'';
33+
checks."${system}".build = flake.defaultPackage."${system}";
12834

129-
buildPhase = ''
130-
# Yarn writes cache directories etc to $HOME.
131-
export HOME=$PWD/yarn_home
132-
yarn run build-storybook
133-
'';
35+
packages."${system}" = rec {
13436

135-
installPhase = ''
136-
mkdir -p $out
137-
cp -R ./storybook-static/* $out/
138-
cp netlify.toml $out/
139-
'';
37+
embedSVG = pkgs.writeScriptBin "embed-svg"
38+
''
39+
#!${pkgs.bash}/bin/bash
14040
141-
shellHook = ''
142-
rm -rf node_modules
143-
ln -sf ${storyBookYarnPkg}/libexec/${package.name}/node_modules .
144-
export PATH=$PWD/node_modules/.bin:$PATH
145-
echo "======================================"
146-
echo "= To develop run: yarn run storybook ="
147-
echo "======================================"
148-
'';
149-
};
41+
in=$1
42+
out=$2
43+
44+
mkdir -p $in.tmp
15045
46+
cp $in/*.svg $in.tmp/
47+
rm -f $in.tmp/*.src.svg
48+
49+
echo ":: Optimizing svg files"
50+
for f in $in.tmp/*.svg; do
51+
echo ":: - $f"
52+
${pkgs.nodePackages.svgo}/bin/svgo $f &
53+
done
54+
# Wait until all `svgo` processes are done
55+
# According to light testing, it is twice as fast that way.
56+
wait
57+
58+
echo ":: Embedding SVG files"
59+
source ${pkgs.stdenv}/setup
60+
ls -la $in
61+
cp $in/svg.less $out
62+
for f in $in.tmp/*.svg; do
63+
echo ":: - $f"
64+
token=$(basename $f)
65+
token=''${token^^}
66+
token=''${token//[^A-Z0-9]/_}
67+
token=SVG_''${token/%_SVG/}
68+
substituteInPlace $out --replace "@$token" "'$(cat $f)'"
69+
done
70+
71+
rm -rf $in.tmp
72+
'';
73+
74+
commonStyles = pkgs.stdenv.mkDerivation {
75+
name = "nixos-common-styles-${self.lastModifiedDate}";
76+
77+
src = self;
78+
79+
enableParallelBuilding = true;
80+
81+
buildInputs = [
82+
embedSVG
83+
];
84+
85+
installPhase = ''
86+
mkdir $out
87+
cp -R src/* $out/
88+
89+
rm -rf $out/assets
90+
mkdir -v $out/assets
91+
cp ${commonStylesAssets} $out/assets/svg.less
92+
'';
93+
};
94+
95+
storyBookYarnPkg = pkgs.yarn2nix-moretea.mkYarnPackage rec {
96+
name = "${package.name}-yarn-${package.version}";
97+
src = null;
98+
dontUnpack = true;
99+
packageJSON = ./package.json;
100+
yarnLock = ./yarn.lock;
101+
preConfigure = ''
102+
mkdir ${package.name}
103+
cd ${package.name}
104+
ln -s ${packageJSON} ./package.json
105+
ln -s ${yarnLock} ./yarn.lock
106+
'';
107+
yarnPreBuild = ''
108+
mkdir -p $HOME/.node-gyp/${pkgs.nodejs.version}
109+
echo 9 > $HOME/.node-gyp/${pkgs.nodejs.version}/installVersion
110+
ln -sfv ${pkgs.nodejs}/include $HOME/.node-gyp/${pkgs.nodejs.version}
111+
'';
112+
publishBinsFor =
113+
[
114+
"@storybook/html"
115+
];
116+
postInstall = ''
117+
# XXX: this is a hacky way to get things working
118+
# we need to upstream this fixes
119+
120+
# node_modules is ready only
121+
sed -i -e "s|node_modules/.cache/storybook|.cache/storybook|" \
122+
$out/libexec/${package.name}/node_modules/@storybook/core/dist/server/utils/resolve-path-in-sb-cache.js
123+
124+
# copied favicon.ico is not writable
125+
sed -i -e 's|await (0, _cpy.default)(defaultFavIcon, outputDir);|await (0, _cpy.default)(defaultFavIcon, outputDir);_fsExtra.default.chmod(_path.default.join(outputDir, _path.default.basename(defaultFavIcon)), 0o200);|' \
126+
$out/libexec/${package.name}/node_modules/@storybook/core/dist/server/build-static.js
127+
'';
128+
};
129+
130+
storyBook = pkgs.stdenv.mkDerivation {
131+
name = "${package.name}-${package.version}";
132+
src = pkgs.lib.cleanSource ./.;
133+
134+
buildInputs =
135+
[
136+
storyBookYarnPkg
137+
] ++
138+
(with pkgs; [
139+
nodejs
140+
]) ++
141+
(with pkgs.nodePackages; [
142+
yarn
143+
]);
144+
145+
patchPhase = ''
146+
rm -rf node_modules
147+
ln -sf ${storyBookYarnPkg}/libexec/${package.name}/node_modules .
148+
'';
149+
150+
buildPhase = ''
151+
# Yarn writes cache directories etc to $HOME.
152+
export HOME=$PWD/yarn_home
153+
yarn run build-storybook
154+
'';
155+
156+
installPhase = ''
157+
mkdir -p $out
158+
cp -R ./storybook-static/* $out/
159+
cp netlify.toml $out/
160+
'';
161+
162+
shellHook = ''
163+
rm -rf node_modules
164+
ln -sf ${storyBookYarnPkg}/libexec/${package.name}/node_modules .
165+
export PATH=$PWD/node_modules/.bin:$PATH
166+
echo "======================================"
167+
echo "= To develop run: yarn run storybook ="
168+
echo "======================================"
169+
'';
170+
};
171+
172+
};
151173
};
152-
};
174+
175+
in flake;
153176
}

‎src/configuration.less

+4-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
//#theme.navbar.variant-darker();
1818
}
1919
.font() {
20-
// Choose between variant-A and variant-B
20+
// Choose between different font variants
2121
#theme.font.variant-A();
2222
//#theme.font.variant-B();
2323
}
@@ -51,3 +51,6 @@
5151
// margin collapse; do NOT divide the margin there.
5252
// https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing
5353
@gutter: 16*@unit;
54+
55+
// Path to the folder where fonts are located
56+
@path-fonts: './fonts';

0 commit comments

Comments
 (0)
Please sign in to comment.