format
This commit is contained in:
parent
ff2f68c907
commit
8ee2707ce6
3 changed files with 115 additions and 98 deletions
|
@ -20,8 +20,7 @@
|
||||||
style = nixite.style;
|
style = nixite.style;
|
||||||
|
|
||||||
packages.${system} = {
|
packages.${system} = {
|
||||||
default =
|
default = nixite.mkSite (nixite.site.applyStyle ./testing/src/style.css {
|
||||||
nixite.mkSite (nixite.site.applyStyle ./testing/src/style.css {
|
|
||||||
"index.html" = with nixite.elems; (doc
|
"index.html" = with nixite.elems; (doc
|
||||||
[
|
[
|
||||||
(title "Nixite")
|
(title "Nixite")
|
||||||
|
|
|
@ -2,38 +2,48 @@ let
|
||||||
html = import ./html.nix;
|
html = import ./html.nix;
|
||||||
|
|
||||||
join = {
|
join = {
|
||||||
__functor = self: new: self // new //
|
__functor = self: new:
|
||||||
{ style = self.style + new.style; };
|
self
|
||||||
|
// new
|
||||||
|
// {style = self.style + new.style;};
|
||||||
};
|
};
|
||||||
|
|
||||||
mkStyle = identifier: styles: ''
|
mkStyle = identifier: styles: ''
|
||||||
${identifier} {
|
${identifier} {
|
||||||
${toString (builtins.attrValues (
|
${toString (builtins.attrValues (
|
||||||
builtins.mapAttrs (key: value:
|
builtins.mapAttrs (
|
||||||
''${key}: ${value};''
|
key: value: ''${key}: ${value};''
|
||||||
) styles
|
)
|
||||||
|
styles
|
||||||
))}
|
))}
|
||||||
}
|
}
|
||||||
'';
|
'';
|
||||||
|
|
||||||
mkIdentifier = tag: { class ? [], id ? "", ... }: "${tag}"
|
mkIdentifier = tag: {
|
||||||
|
class ? [],
|
||||||
|
id ? "",
|
||||||
|
...
|
||||||
|
}:
|
||||||
|
"${tag}"
|
||||||
+ builtins.concatStringsSep "" (map (c: "." + c) class)
|
+ builtins.concatStringsSep "" (map (c: "." + c) class)
|
||||||
+ ( if id != "" then "#" else "" ) + id;
|
+ (
|
||||||
|
if id != ""
|
||||||
in
|
then "#"
|
||||||
{
|
else ""
|
||||||
styled = name: tag: cprops: styles: {
|
)
|
||||||
|
+ id;
|
||||||
${name} = props: child:
|
in {
|
||||||
(html.tag tag (props // cprops) child);
|
styled = name: tag: cprops: styles:
|
||||||
|
{
|
||||||
|
${name} = props: child: (html.tag tag (props // cprops) child);
|
||||||
|
|
||||||
style = mkStyle (mkIdentifier tag cprops) styles;
|
style = mkStyle (mkIdentifier tag cprops) styles;
|
||||||
|
}
|
||||||
|
// join;
|
||||||
|
|
||||||
} // join;
|
style = identifier: styles:
|
||||||
|
{
|
||||||
style = identifier: styles: {
|
|
||||||
|
|
||||||
style = mkStyle identifier styles;
|
style = mkStyle identifier styles;
|
||||||
|
}
|
||||||
} // join;
|
// join;
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,41 +7,49 @@ let
|
||||||
(style.styled "p" "p" {} {
|
(style.styled "p" "p" {} {
|
||||||
some-style = "some value";
|
some-style = "some value";
|
||||||
})
|
})
|
||||||
(style.styled "div" "div" { class = ["something"]; } {
|
(style.styled "div" "div" {class = ["something"];} {
|
||||||
this = "that";
|
this = "that";
|
||||||
})
|
})
|
||||||
(style.styled "s" "div" { id = "s"; class = ["something"]; } {
|
(style.styled "s" "div" {
|
||||||
|
id = "s";
|
||||||
|
class = ["something"];
|
||||||
|
} {
|
||||||
s = "yes";
|
s = "yes";
|
||||||
})
|
})
|
||||||
(style.styled "foobar" "div" { class = ["foo" "bar"]; } {
|
(style.styled "foobar" "div" {class = ["foo" "bar"];} {
|
||||||
something = "something";
|
something = "something";
|
||||||
})
|
})
|
||||||
(style.style "body" {
|
(style.style "body" {
|
||||||
foo = "bar";
|
foo = "bar";
|
||||||
});
|
});
|
||||||
|
|
||||||
in [
|
in [
|
||||||
(it "makes a p component" ({
|
(it "makes a p component" {
|
||||||
expected = (html.tag "p" {} "yes");
|
expected = html.tag "p" {} "yes";
|
||||||
actual = my.p {} "yes";
|
actual = my.p {} "yes";
|
||||||
}))
|
})
|
||||||
(it "makes a component" ({
|
(it "makes a component" {
|
||||||
expected = (html.tag "div" { class = ["something"]; } "foobar");
|
expected = html.tag "div" {class = ["something"];} "foobar";
|
||||||
actual = my.div {} "foobar";
|
actual = my.div {} "foobar";
|
||||||
}))
|
})
|
||||||
(it "makes special components" ({
|
(it "makes special components" {
|
||||||
expected = (html.tag "div" { id = "s"; class = ["something"]; } "foobar");
|
expected = html.tag "div" {
|
||||||
|
id = "s";
|
||||||
|
class = ["something"];
|
||||||
|
} "foobar";
|
||||||
actual = my.s {} "foobar";
|
actual = my.s {} "foobar";
|
||||||
}))
|
})
|
||||||
(it "works on many classes" ({
|
(it "works on many classes" {
|
||||||
expected = (html.tag "div" { class = ["foo" "bar"]; } "foobar");
|
expected = html.tag "div" {class = ["foo" "bar"];} "foobar";
|
||||||
actual = my.foobar {} "foobar";
|
actual = my.foobar {} "foobar";
|
||||||
}))
|
})
|
||||||
(it "combines attrs" ({
|
(it "combines attrs" {
|
||||||
expected = (html.tag "div" { id = "foo"; class = ["something"]; } "foobar");
|
expected = html.tag "div" {
|
||||||
actual = my.div { id = "foo"; } "foobar";
|
id = "foo";
|
||||||
}))
|
class = ["something"];
|
||||||
(it "makes a style" ({
|
} "foobar";
|
||||||
|
actual = my.div {id = "foo";} "foobar";
|
||||||
|
})
|
||||||
|
(it "makes a style" {
|
||||||
expected = ''
|
expected = ''
|
||||||
p {
|
p {
|
||||||
some-style: some value;
|
some-style: some value;
|
||||||
|
@ -60,5 +68,5 @@ in [
|
||||||
}
|
}
|
||||||
'';
|
'';
|
||||||
actual = my.style;
|
actual = my.style;
|
||||||
}))
|
})
|
||||||
]
|
]
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue