This commit is contained in:
tristan 2023-12-31 03:08:41 +00:00
parent ff2f68c907
commit 8ee2707ce6
3 changed files with 115 additions and 98 deletions

View file

@ -20,8 +20,7 @@
style = nixite.style;
packages.${system} = {
default =
nixite.mkSite (nixite.site.applyStyle ./testing/src/style.css {
default = nixite.mkSite (nixite.site.applyStyle ./testing/src/style.css {
"index.html" = with nixite.elems; (doc
[
(title "Nixite")

View file

@ -2,38 +2,48 @@ let
html = import ./html.nix;
join = {
__functor = self: new: self // new //
{ style = self.style + new.style; };
__functor = self: new:
self
// new
// {style = self.style + new.style;};
};
mkStyle = identifier: styles: ''
${identifier} {
${toString (builtins.attrValues (
builtins.mapAttrs (key: value:
''${key}: ${value};''
) styles
builtins.mapAttrs (
key: value: ''${key}: ${value};''
)
styles
))}
}
'';
mkIdentifier = tag: { class ? [], id ? "", ... }: "${tag}"
mkIdentifier = tag: {
class ? [],
id ? "",
...
}:
"${tag}"
+ builtins.concatStringsSep "" (map (c: "." + c) class)
+ ( if id != "" then "#" else "" ) + id;
in
{
styled = name: tag: cprops: styles: {
${name} = props: child:
(html.tag tag (props // cprops) child);
+ (
if id != ""
then "#"
else ""
)
+ id;
in {
styled = name: tag: cprops: styles:
{
${name} = props: child: (html.tag tag (props // cprops) child);
style = mkStyle (mkIdentifier tag cprops) styles;
}
// join;
} // join;
style = identifier: styles: {
style = identifier: styles:
{
style = mkStyle identifier styles;
} // join;
}
// join;
}

View file

@ -7,41 +7,49 @@ let
(style.styled "p" "p" {} {
some-style = "some value";
})
(style.styled "div" "div" { class = ["something"]; } {
(style.styled "div" "div" {class = ["something"];} {
this = "that";
})
(style.styled "s" "div" { id = "s"; class = ["something"]; } {
(style.styled "s" "div" {
id = "s";
class = ["something"];
} {
s = "yes";
})
(style.styled "foobar" "div" { class = ["foo" "bar"]; } {
(style.styled "foobar" "div" {class = ["foo" "bar"];} {
something = "something";
})
(style.style "body" {
foo = "bar";
});
in [
(it "makes a p component" ({
expected = (html.tag "p" {} "yes");
(it "makes a p component" {
expected = html.tag "p" {} "yes";
actual = my.p {} "yes";
}))
(it "makes a component" ({
expected = (html.tag "div" { class = ["something"]; } "foobar");
})
(it "makes a component" {
expected = html.tag "div" {class = ["something"];} "foobar";
actual = my.div {} "foobar";
}))
(it "makes special components" ({
expected = (html.tag "div" { id = "s"; class = ["something"]; } "foobar");
})
(it "makes special components" {
expected = html.tag "div" {
id = "s";
class = ["something"];
} "foobar";
actual = my.s {} "foobar";
}))
(it "works on many classes" ({
expected = (html.tag "div" { class = ["foo" "bar"]; } "foobar");
})
(it "works on many classes" {
expected = html.tag "div" {class = ["foo" "bar"];} "foobar";
actual = my.foobar {} "foobar";
}))
(it "combines attrs" ({
expected = (html.tag "div" { id = "foo"; class = ["something"]; } "foobar");
actual = my.div { id = "foo"; } "foobar";
}))
(it "makes a style" ({
})
(it "combines attrs" {
expected = html.tag "div" {
id = "foo";
class = ["something"];
} "foobar";
actual = my.div {id = "foo";} "foobar";
})
(it "makes a style" {
expected = ''
p {
some-style: some value;
@ -60,5 +68,5 @@ in [
}
'';
actual = my.style;
}))
]
})
]