From 932d44c9979cdf7553ad0100de8d431d797c76bb Mon Sep 17 00:00:00 2001 From: niamtokik Date: Thu, 7 Dec 2023 16:27:31 +0000 Subject: [PATCH] update with some examples --- priv/examples/erlang-punch/hero_01.erml | 12 +++ priv/examples/erlang-punch/hero_02.erml | 12 +++ priv/examples/erlang-punch/hero_03.erml | 6 ++ priv/examples/erlang-punch/index.erml | 37 +------- priv/examples/nostr/index.erml | 118 ++++++++++++++++++++++++ 5 files changed, 151 insertions(+), 34 deletions(-) create mode 100644 priv/examples/erlang-punch/hero_01.erml create mode 100644 priv/examples/erlang-punch/hero_02.erml create mode 100644 priv/examples/erlang-punch/hero_03.erml create mode 100644 priv/examples/nostr/index.erml diff --git a/priv/examples/erlang-punch/hero_01.erml b/priv/examples/erlang-punch/hero_01.erml new file mode 100644 index 0000000..36d2a7a --- /dev/null +++ b/priv/examples/erlang-punch/hero_01.erml @@ -0,0 +1,12 @@ +{'div', #{class => "hero bg-primary", style => "min-height: 100vh;"}, [ + {'div', #{class => "hero-body"}, [ + {'div', #{class => "container"}, [ + {h1, #{class => "p-centered"}, <<"Erlang-Punch">>}, + {'div', #{class => "columns"}, [ + {'div', #{class => "column col-8"}, + {include_raw, "examples/erlang-punch/lorem_ipsum.txt"} + } + ]} + ]} + ]} + ]}. diff --git a/priv/examples/erlang-punch/hero_02.erml b/priv/examples/erlang-punch/hero_02.erml new file mode 100644 index 0000000..36618ae --- /dev/null +++ b/priv/examples/erlang-punch/hero_02.erml @@ -0,0 +1,12 @@ +{'div', #{class => "hero bg-secondary", style => "min-height: 100vh;"}, [ + {'div', #{class => "hero-body"}, [ + {'div', #{class => "container"}, [ + {h1, #{class => "p-centered"}, <<"Erlang-Punch">>}, + {'div', #{class => "columns"}, [ + {'div', #{class => "column col-8"}, + {include_template, "examples/erlang-punch/lorem_ipsum.erml"} + } + ]} + ]} + ]} + ]}. diff --git a/priv/examples/erlang-punch/hero_03.erml b/priv/examples/erlang-punch/hero_03.erml new file mode 100644 index 0000000..c9d7635 --- /dev/null +++ b/priv/examples/erlang-punch/hero_03.erml @@ -0,0 +1,6 @@ +{'div', #{class => "hero bg-dark", style => "min-height: 100vh;"}, [ + {'div', #{class => "hero-body"}, [ + {h1, <<"Erlang-Punch">>}, + {p, []} + ]} + ]}. diff --git a/priv/examples/erlang-punch/index.erml b/priv/examples/erlang-punch/index.erml index e0e2e6e..cc25fb5 100644 --- a/priv/examples/erlang-punch/index.erml +++ b/priv/examples/erlang-punch/index.erml @@ -7,39 +7,8 @@ {script, #{src => "https://unpkg.com/htmx.org@1.9.9"}, []} ]}, {body, [ - {'div', #{class => "hero bg-primary", style => "min-height: 100vh;"}, [ - {'div', #{class => "hero-body"}, [ - {'div', #{class => "container"}, [ - {h1, #{class => "p-centered"}, <<"Erlang-Punch">>}, - {'div', #{class => "columns"}, [ - {'div', #{class => "column col-8"}, - {include_raw, "examples/erlang-punch/lorem_ipsum.txt"} - } - ]} - ]} - ]} - ]}, - - {'div', #{class => "hero bg-secondary", style => "min-height: 100vh;"}, [ - {'div', #{class => "hero-body"}, [ - {'div', #{class => "container"}, [ - {h1, #{class => "p-centered"}, <<"Erlang-Punch">>}, - {'div', #{class => "columns"}, [ - {'div', #{class => "column col-8"}, [ - {include_template, "examples/erlang-punch/lorem_ipsum.erml"} - ] - } - ]} - ]} - ]} - ]}, - - {'div', #{class => "hero bg-dark", style => "min-height: 100vh;"}, [ - {'div', #{class => "hero-body"}, [ - {h1, <<"Erlang-Punch">>}, - {p, []} - ]} - ]} - + {include_template, "examples/erlang-punch/hero_01.erml"}, + {include_template, "examples/erlang-punch/hero_02.erml"}, + {include_template, "examples/erlang-punch/hero_03.erml"} ]} ]}. \ No newline at end of file diff --git a/priv/examples/nostr/index.erml b/priv/examples/nostr/index.erml new file mode 100644 index 0000000..71faf33 --- /dev/null +++ b/priv/examples/nostr/index.erml @@ -0,0 +1,118 @@ +{html, [ + {head, [ + {title, [<<"Nostr">>]}, + {link, #{rel => "stylesheet", href => "https://unpkg.com/spectre.css/dist/spectre.min.css"}}, + {link, #{rel => "stylesheet", href => "https://unpkg.com/spectre.css/dist/spectre-exp.min.css"}}, + {link, #{rel => "stylesheet", href => "https://unpkg.com/spectre.css/dist/spectre-icons.min.css"}}, + {script, #{src => "https://unpkg.com/htmx.org@1.9.9"}, []} + ]}, + {body, [ + {'div', #{class => "container", style => "max-width: 1280px; min-height: 100vh;"}, [ + {'div', #{id => "main", class => "columns"}, [ + {'div', #{id => "left-menu", class => "bg-light column col-3"}, [ + {ul, #{class => menu}, [ + {li, #{class => "menu-item"}, [ + {h1, <<"nostr">>} + ]}, + {li, #{class => "menu-item"}, [ + {a, #{href => "#"}, [<<"Home">>]} + ]}, + {li, #{class => "menu-item"}, [ + {a, #{href => "#"}, [<<"Explore">>]} + ]}, + {li, #{class => "menu-item"}, [ + {a, #{href => "#"}, [<<"Notifications">>]} + ]}, + {li, #{class => "menu-item"}, [ + {a, #{href => "#"}, [<<"Messages">>]} + ]}, + {li, #{class => "menu-item"}, [ + {a, #{href => "#"}, [<<"Profile">>]} + ]}, + {li, #{class => "divider"}, []}, + {li, #{class => "menu-item p-centered"}, [ + {button, #{class => "btn btn-primary", style => "width: 100%;"}, [<<"Post">>]} + ]} + ]} + ]}, + {'div', #{id => "content", class => "column col-9"}, [ + {'div', #{class => "columns"}, [ + {'div', #{class => "bg-light column col-9 "}, [ + + {'div', #{class => "tile p-2 m-2", style => "border: 1px solid #d5d5d5;"}, [ + {'div', #{class => "tile-icon"}, [ + {figure, #{class => "avatar avatar-xl"}, [ + {img, #{src => "https://picsum.photos/id/237/200/300", alt => "..."}} + ]} + ]}, + {'div', #{class => "tile-content"}, [ + {p, <<"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur efficitur est ornare neque malesuada, nec consequat mauris vestibulum. Duis a arcu sit amet ex tincidunt porttitor at sit amet tellus. Nam ultricies ante congue sapien feugiat, eu facilisis nisi congue. Aliquam efficitur pellentesque gravida. Nullam eu nisl eget erat facilisis fermentum quis eget ex. Phasellus vestibulum augue sed risus bibendum accumsan. ">>}, + {figure, #{class => figure}, [ + {img, #{ src => "https://picsum.photos/seed/picsum/600/400", class => "img-responsive"}} + ]}, + {p, #{class => "tile-action p-0 m-0 text-right"}, [ + {button, #{class => "btn btn-primay"}, [<<"Contact">>]}, + {button, #{class => "btn btn-primay"}, [<<"Comment">>]}, + {button, #{class => "btn btn-primay"}, [<<"Repost">>]}, + {button, #{class => "btn btn-primay"}, [<<"Like">>]}, + {button, #{class => "btn btn-primay"}, [<<"Share">>]}, + {button, #{class => "btn btn-primay"}, [<<"Ignore">>]} + ]} + ]} + ]}, + + {'div', #{class => "tile p-2 m-2", style => "border: 1px solid #d5d5d5;"}, [ + {'div', #{class => "tile-icon"}, [ + {figure, #{class => "avatar avatar-xl"}, [ + {img, #{src => "https://picsum.photos/id/217/200/300", alt => "..."}} + ]} + ]}, + {'div', #{class => "tile-content"}, [ + {p, <<"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur efficitur est ornare neque malesuada, nec consequat mauris vestibulum. Duis a arcu sit amet ex tincidunt porttitor at sit amet tellus. Nam ultricies ante congue sapien feugiat, eu facilisis nisi congue. Aliquam efficitur pellentesque gravida. Nullam eu nisl eget erat facilisis fermentum quis eget ex. Phasellus vestibulum augue sed risus bibendum accumsan. ">>}, + {figure, #{class => figure}, [ + {img, #{ src => "https://picsum.photos/id/342/600/400", class => "img-responsive"}} + ]}, + {p, #{class => "tile-action p-0 m-0 text-right"}, [ + {button, #{class => "btn btn-primay"}, [<<"Contact">>]}, + {button, #{class => "btn btn-primay"}, [<<"Comment">>]}, + {button, #{class => "btn btn-primay"}, [<<"Repost">>]}, + {button, #{class => "btn btn-primay"}, [<<"Like">>]}, + {button, #{class => "btn btn-primay"}, [<<"Share">>]}, + {button, #{class => "btn btn-primay"}, [<<"Ignore">>]} + ]} + ]} + ]}, + + {'div', #{class => "tile p-2 m-2", style => "border: 1px solid #d5d5d5;"}, [ + {'div', #{class => "tile-icon"}, [ + {figure, #{class => "avatar avatar-xl"}, [ + {img, #{src => "https://picsum.photos/id/451/200/300", alt => "..."}} + ]} + ]}, + {'div', #{class => "tile-content"}, [ + {p, <<"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur efficitur est ornare neque malesuada, nec consequat mauris vestibulum. Duis a arcu sit amet ex tincidunt porttitor at sit amet tellus. Nam ultricies ante congue sapien feugiat, eu facilisis nisi congue. Aliquam efficitur pellentesque gravida. Nullam eu nisl eget erat facilisis fermentum quis eget ex. Phasellus vestibulum augue sed risus bibendum accumsan. ">>}, + {figure, #{class => figure}, [ + {img, #{ src => "https://picsum.photos/id/542/600/400", class => "img-responsive"}} + ]}, + {p, #{class => "tile-action p-0 m-0 text-right"}, [ + {button, #{class => "btn btn-primay"}, [<<"Contact">>]}, + {button, #{class => "btn btn-primay"}, [<<"Comment">>]}, + {button, #{class => "btn btn-primay"}, [<<"Repost">>]}, + {button, #{class => "btn btn-primay"}, [<<"Like">>]}, + {button, #{class => "btn btn-primay"}, [<<"Share">>]}, + {button, #{class => "btn btn-primay"}, [<<"Ignore">>]} + ]} + ]} + ]} + + ]}, + + {'div', #{class => "bg-gray column col-3 mt-2 pt-2 hide-lg"}, [ + <<"test2">> + ]} + ]} + ]} + ]} + ]} + ]} +]}. \ No newline at end of file