njump/templates/details.html

<!-- always visible details -->
<div
  class="-ml-4 mb-6 h-1.5 w-1/3 bg-zinc-100 dark:bg-zinc-700 sm:-ml-2.5"
></div>

{{ if not (eq "" .Npub) }}
<div class="mb-6 break-all leading-5">
  <div class="text-sm text-strongpink">Author Public Key</div>
  <span class="text-neutral-500 dark:text-neutral-300 text-[16px]">{{.Npub}}</span>
</div>
{{ end }}

<!------>

{{ if not (eq nil .FileMetadata) }}
<!---->
{{ if not (eq "" .FileMetadata.Summary) }}
<div class="mb-6 leading-5">
  <div class="text-sm text-strongpink">Summary</div>
  <span class="text-neutral-500 dark:text-neutral-300 text-[16px]"
    >{{.FileMetadata.Summary}}</span
  >
</div>
{{ end }}
<!---->
{{ if not (eq "" .FileMetadata.Dim) }}
<div class="mb-6 leading-5">
  <div class="text-sm text-strongpink">Dimension</div>
  <span class="text-neutral-500 dark:text-neutral-300 text-[16px]"
    >{{.FileMetadata.Dim}}</span
  >
</div>
{{ end }}
<!---->
{{ if not (eq "" .FileMetadata.Size) }}
<div class="mb-6 leading-5">
  <div class="text-sm text-strongpink">Size</div>
  <span class="text-neutral-500 dark:text-neutral-300 text-[16px]"
    >{{.FileMetadata.Size}} bytes</span
  >
</div>
{{ end }}
<!---->
{{ if not (eq "" .FileMetadata.Magnet) }}
<div class="mb-6 leading-5">
  <div class="text-sm text-strongpink">Magnet URL</div>
  <span class="text-neutral-500 dark:text-neutral-300 text-[16px]"
    >{{.FileMetadata.Magnet}}</span
  >
</div>
{{ end }}
<!---->
{{ end }}

<!------>

{{ if not (eq 0 (len .SeenOn)) }}
<div class="mb-6 leading-5 text-neutral-500 dark:text-neutral-300 text-[16px]">
  <div class="text-sm text-strongpink">Seen on</div>
  {{ range .SeenOn }}<a
    href="/r/{{.}}"
    class="underline-none pr-2 decoration-neutral-200 decoration-1 underline-offset-[6px] hover:underline"
    >{{.}}</a
  >
  {{ end }}
</div>
{{ end }}

<!-- details hidden behind a toggle -->
{{ if .HideDetails }}
<div class="mb-6 flex items-center print:hidden">
  <input
    type="checkbox"
    id="advanced-switch"
    class="hidden"
    _="on load make a URLSearchParams from location.search then get it.get('details') then if it is 'yes' set my.checked to true then trigger switch on me end
       on change or switch log my checked then if my checked is true
         remove .hidden from #hidden-fields
         tell the next <label /> from me
           add .bg-strongpink .after:translate-x-full
           remove .bg-gray-300 .dark:bg-zinc-800
         end
       otherwise
         add .hidden to #hidden-fields
         tell the next <label /> from me
           remove .bg-strongpink .after:translate-x-full
           add .bg-gray-300 .dark:bg-zinc-800
         end
       end
    "
  />
  <label
    for="advanced-switch"
    class="after:content-[&quot;&quot;] relative mr-2 inline-block h-5 w-9 cursor-pointer rounded-full bg-gray-300 -indent-96 after:absolute after:inset-0.5 after:h-4 after:w-4 after:rounded-2xl after:bg-zinc-50 after:transition dark:bg-zinc-800 dark:after:bg-gray-700"
    >&nbsp;</label
  >
  <label
    for="advanced-switch"
    class="cursor-pointer text-sm leading-4 underline text-neutral-500 dark:text-neutral-300 text-[16px] decoration-neutral-200 dark:decoration-neutral-500 decoration-1 underline-offset-[6px]"
    >Show more details</label
  >
</div>
{{ end }}

<div id="hidden-fields" class="{{if .HideDetails}}hidden{{end}}">
  <div class="mb-6 leading-5">
    <div class="text-sm text-strongpink">Published at</div>
    <span class="text-neutral-500 dark:text-neutral-300 text-[16px]">{{.CreatedAt}}</span>
  </div>

  <div class="mb-6 leading-5">
    <div class="text-sm text-strongpink">Kind type</div>
    <span class="text-neutral-500 dark:text-neutral-300 text-[16px]">{{.Kind}}</span>
    {{ if not (eq .KindNIP "")}} -
    <a
      href="https://github.com/nostr-protocol/nips/blob/master/{{.KindNIP}}.md"
      class="text-neutral-500 underline decoration-neutral-200 dark:decoration-neutral-500 decoration-1 underline-offset-[6px] text-neutral-500 dark:text-neutral-300 text-[16px]"
      >{{.KindDescription}}</a
    >
    {{ end }}
  </div>

  {{ if not (eq "" .Nevent) }}
  <div class="mb-6 leading-5">
    <div class="text-sm text-strongpink">Address Code</div>
    <span class="text-[16px] text-neutral-500 dark:text-neutral-300"
      >{{.Nevent}}</span
    >
  </div>
  {{ end }}

  <!---->

  <div class="-mx-4 my-8 bg-neutral-100 px-4 pb-4 leading-5 dark:bg-neutral-700">
    <div
      class="-mx-4 bg-neutral-300 px-4 py-1 text-neutral-100 dark:bg-neutral-800 dark:text-neutral-400"
    >
      Event JSON
    </div>
    <div class="mt-4 whitespace-pre-wrap break-all font-mono text-sm">
      {{- .EventJSON}}
    </div>
  </div>

  {{ if not (eq "" .Nprofile) }}
  <div class="mb-6 break-all leading-5">
    <div class="text-sm text-strongpink">Author Profile Code</div>
    <span class="text-neutral-500 dark:text-neutral-300 text-[16px]">{{.Nprofile}}</span>
  </div>
  {{ end }}
</div>