ash-project/ash_hq
1
0
Fork 0
mirror of https://github.com/ash-project/ash_hq.git synced 2024-09-20 05:13:23 +12:00
Code Issues Projects Releases Packages Wiki Activity

Single page DSL styling (#105)

Browse source
This commit is contained in:
Rebecca Le 2023-02-21 21:26:31 +08:00 committed by GitHub
parent 14f7ed892b
commit c94ce89a32
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 44 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
lib/ash_hq_web/pages/blog.ex
View file

@ -41,7 +41,7 @@ defmodule AshHqWeb.Pages.Blog do
</div> </div>
</div> </div>
</div> </div>
<div class="prose prose-lg dark:prose-invert max-w-none mt-6"> <div class="prose dark:prose-invert max-w-none mt-6">
{raw(@post.body_html)} {raw(@post.body_html)}
</div> </div>
</div> </div>

64
lib/ash_hq_web/pages/docs.ex
View file

@ -127,12 +127,15 @@ defmodule AshHqWeb.Pages.Docs do
{/if} {/if}
{#if @dsl_target_extensions} {#if @dsl_target_extensions}
{#for extension <- @dsl_target_extensions} {#for extension <- @dsl_target_extensions}
<div class="text-3xl font-extrabold mb-12"> <div class="prose dark:prose-invert mb-8">
{#if extension.default_for_target} <h1>
{extension.target} {#if extension.default_for_target}
{#else} {extension.target}
{extension.module} {#else}
{/if} {extension.module}
{/if}
</h1>
{raw(extension.doc_html)}
</div> </div>
{#for dsl <- extension.dsls |> Enum.filter(&(&1.path == []))} {#for dsl <- extension.dsls |> Enum.filter(&(&1.path == []))}
{render_dsl(assigns, extension, dsl)} {render_dsl(assigns, extension, dsl)}
@ -191,12 +194,12 @@ defmodule AshHqWeb.Pages.Docs do
</footer> </footer>
</div> </div>
{#if @module} {#if @module}
<div class="sidebar-container hidden lg:block lg:w-80 sticky top-36 xl:top-20 shrink-0 overflow-y-auto overflow-x-hidden dark:bg-base-dark-850 bg-opacity-70 mt-4"> <div class="sidebar-container hidden lg:block lg:w-72 sticky top-36 xl:top-20 shrink-0 overflow-y-auto overflow-x-hidden dark:bg-base-dark-850 bg-opacity-70 mt-4">
<ModuleRightNav functions={@module.functions} module={@module.name} /> <ModuleRightNav functions={@module.functions} module={@module.name} />
</div> </div>
{#else} {#else}
{#if @dsl_target} {#if @dsl_target}
<div class="sidebar-container hidden lg:block lg:w-80 sticky top-36 xl:top-20 shrink-0 overflow-y-auto overflow-x-hidden dark:bg-base-dark-850 bg-opacity-70 mt-4"> <div class="sidebar-container hidden lg:block lg:w-72 sticky top-36 xl:top-20 shrink-0 overflow-y-auto overflow-x-hidden dark:bg-base-dark-850 bg-opacity-70 mt-4">
<DslRightNav dsls={Enum.flat_map(@dsl_target_extensions, & &1.dsls)} dsl_target={@dsl_target} /> <DslRightNav dsls={Enum.flat_map(@dsl_target_extensions, & &1.dsls)} dsl_target={@dsl_target} />
</div> </div>
{#else} {#else}
@ -228,7 +231,7 @@ defmodule AshHqWeb.Pages.Docs do
arg_count = Enum.count(arguments) arg_count = Enum.count(arguments)
~F""" ~F"""
<div class={classes(["mb-12", "ml-6": !Enum.empty?(dsl.path)])}> <div class={classes(["mb-12 mt-4"])}>
<div class="flex flex-col"> <div class="flex flex-col">
<div class="w-full"> <div class="w-full">
<div class="text-2xl font-bold nav-anchor" id={String.replace(dsl.sanitized_path, "/", "-")}> <div class="text-2xl font-bold nav-anchor" id={String.replace(dsl.sanitized_path, "/", "-")}>
@ -237,11 +240,14 @@ defmodule AshHqWeb.Pages.Docs do
<div class="text-lg w-full font-semibold"> <div class="text-lg w-full font-semibold">
{dsl.name} {dsl.name}
{#for {arg, i} <- Enum.with_index(arguments)} {#for {arg, i} <- Enum.with_index(arguments)}
<LivePatch to={"##{String.replace(arg.sanitized_path, "/", "-")}-#{DocRoutes.sanitize_name(arg.name)}"}> <LivePatch
<span class="text-primary-light-600 dark:text-primary-dark-400 hover:dark:text-primary-dark-600 hover:text-primary-light-700"> class={"after:content-[',']": i != arg_count - 1}
to={"##{String.replace(arg.sanitized_path, "/", "-")}-#{DocRoutes.sanitize_name(arg.name)}"}
>
<span class="italic text-primary-light-600 dark:text-primary-dark-400 hover:dark:text-primary-dark-500 hover:text-primary-light-700">
{arg.name}</span>{#if arg.name in dsl.optional_args} {arg.name}</span>{#if arg.name in dsl.optional_args}
\\ {Map.get(dsl.arg_defaults, arg.name, "nil")} \\ {Map.get(dsl.arg_defaults, arg.name, "nil")}
{/if}</LivePatch>{#if i != arg_count - 1},{/if} {/if}</LivePatch>
{/for} {/for}
</div> </div>
<a href={"##{String.replace(dsl.sanitized_path, "/", "-")}"}> <a href={"##{String.replace(dsl.sanitized_path, "/", "-")}"}>
@ -251,60 +257,58 @@ defmodule AshHqWeb.Pages.Docs do
</div> </div>
</div> </div>
<div class="prose-lg dark:prose-invert my-4"> <div class="prose dark:prose-invert my-4">
{raw(dsl.doc_html)} {raw(dsl.doc_html)}
</div> </div>
</div> </div>
{#if !Enum.empty?(options)} {#if !Enum.empty?(options)}
<div class="my-2"> {#case modules_in_scope(dsl, extension, @libraries, @selected_versions)}
{#case modules_in_scope(dsl, extension, @libraries, @selected_versions)} {#match []}
{#match []} {#match imports}
{#match imports} <div class="mt-2 mb-6">
<div>Imported Modules:</div> <div>Imported Modules:</div>
<ul> <ul>
{#for mod <- imports} {#for mod <- imports}
<li class="list-disc"> <li class="list-disc">
<LivePatch to={DocRoutes.doc_link(mod, @selected_versions)}> <LivePatch to={DocRoutes.doc_link(mod, @selected_versions)}>
<span class="text-primary-light-600 dark:text-primary-dark-400 hover:dark:text-primary-dark-600 hover:text-primary-light-700"> <span class="text-primary-light-600 dark:text-primary-dark-400 hover:dark:text-primary-dark-500 hover:text-primary-light-700">
{mod.name} {mod.name}
</span> </span>
</LivePatch> </LivePatch>
</li> </li>
{/for} {/for}
</ul> </ul>
{/case} </div>
</div> {/case}
{/if} {/if}
</div> </div>
<div <div
:if={!Enum.empty?(options)} :if={!Enum.empty?(options)}
class="grid w-full" class="grid grid-cols-[min-content_auto] w-full border-b border-gray-300 dark:border-gray-600 pb-2 mb-12"
style="grid-template-columns: min-content auto"
> >
{#for option <- options} {#for option <- options}
<div <div
class="flex flex-col border-t border-gray-600 mt-2 nav-anchor" class="flex flex-col border-t border-gray-300 dark:border-gray-600 py-3 nav-anchor pr-4"
id={"#{String.replace(option.sanitized_path, "/", "-")}-#{DocRoutes.sanitize_name(option.name)}"} id={"#{String.replace(option.sanitized_path, "/", "-")}-#{DocRoutes.sanitize_name(option.name)}"}
> >
<div class="flex flex-row align-middle"> <div class="flex flex-row align-middle leading-7">
<LivePatch <LivePatch
to={"##{String.replace(option.sanitized_path, "/", "-")}-#{DocRoutes.sanitize_name(option.name)}"} to={"##{String.replace(option.sanitized_path, "/", "-")}-#{DocRoutes.sanitize_name(option.name)}"}
class="text-primary-light-600 dark:text-primary-dark-400 hover:dark:text-primary-dark-600 hover:text-primary-light-700 text-lg pr-4" class="text-primary-light-600 dark:text-primary-dark-400 hover:dark:text-primary-dark-500 hover:text-primary-light-700 pr-2"
> >
{option.name} {option.name}
</LivePatch> </LivePatch>
{render_tags(assigns, dsl, option)} {render_tags(assigns, dsl, option)}
</div> </div>
<span class="break-keep"> <span class="break-keep text-sm">
{option.type} {option.type}
</span> </span>
</div> </div>
<div class="prose prose-lg dark:prose-invert border-t border-gray-600 mt-2 pt-0"> <div class="prose dark:prose-invert border-t border-gray-300 dark:border-gray-600 py-3">
{raw(option.doc_html)} {raw(option.doc_html)}
</div> </div>
{/for} {/for}
</div> </div>
<hr class="mt-0 mb-12">
{#case child_dsls(extension, dsl)} {#case child_dsls(extension, dsl)}
{#match []} {#match []}
{#match children} {#match children}
@ -441,12 +445,12 @@ defmodule AshHqWeb.Pages.Docs do
~F""" ~F"""
{#if option.argument_index} {#if option.argument_index}
<Tag color={:blue}> <Tag color={:blue} class="mt-1 py-0.5 h-5">
Arg[{option.argument_index}] Arg[{option.argument_index}]
</Tag> </Tag>
{/if} {/if}
{#if required} {#if required}
<Tag color={:red} class={classes("ml-2": option.argument_index)}> <Tag color={:red} class={classes(["mt-1 py-0.5 h-5", "ml-2": option.argument_index])}>
Required Required
</Tag> </Tag>
{/if} {/if}

12
priv/scripts/build_dsl_docs.exs
View file

@ -150,17 +150,23 @@ defmodule Utils do
defp docs_with_examples(doc, examples) do defp docs_with_examples(doc, examples) do
case doc do case doc do
nil -> nil ->
"### Examples\n#{Enum.map_join(examples, "\n\n", &wrap_code/1)}" maybe_add_examples(examples)
doc -> doc ->
""" """
#{doc} #{doc}
# Examples
#{Enum.map_join(examples, "\n\n", &wrap_code/1)} #{maybe_add_examples(examples)}
""" """
end end
end end
defp maybe_add_examples([]), do: ""
defp maybe_add_examples(examples) do
"Examples:\n\n#{Enum.map_join(examples, "\n\n", &wrap_code/1)}"
end
defp build_entities(entities, path) do defp build_entities(entities, path) do
entities entities
|> Enum.with_index() |> Enum.with_index()