Something went wrong. Try again.
Monorepo for Tangled tangled.org
Something went wrong. Try again.
HTML
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157{{ define "title" }}{{ .String.Filename }} · by {{ resolve .Owner.DID.String }} · Tangled{{ end }}
{{ define "extrameta" }} {{ $ownerId := resolve .Owner.DID.String }} <meta property="og:title" content="{{ .String.Filename }} · by {{ $ownerId }}" /> <meta property="og:type" content="object" /> <meta property="og:url" content="https://tangled.org/strings/{{ $ownerId }}/{{ .String.Rkey }}" /> <meta property="og:description" content="{{ .String.Description }}" />{{ end }}
{{ define "content" }}{{ $ownerId := resolve .Owner.DID.String }} <section id="string-header" class="mb-2 py-2 px-4 dark:text-white"> <div class="text-lg flex flex-col sm:flex-row items-start gap-4 justify-between"> <!-- left items --> <div class="flex flex-col gap-2"> <!-- string owner / string name --> <div class="flex items-center gap-2 flex-wrap"> {{ template "user/fragments/picHandleLink" .Owner.DID.String }} <span class="select-none">/</span> <a href="/strings/{{ $ownerId }}/{{ .String.Rkey }}" class="font-bold">{{ .String.Filename }}</a> </div>
<span class="flex flex-wrap items-center gap-x-4 gap-y-2 text-sm text-gray-600 dark:text-gray-300"> {{ if .String.Description }} {{ .String.Description }} {{ else }} <span class="italic">This string has no description</span> {{ end }} </span> </div>
{{ $isOwner := and .LoggedInUser (eq .LoggedInUser.Did .String.Did) }} <div class="w-fit grid grid-flow-col grid-cols-3 gap-2"> {{ if $isOwner }} <a class="btn no-underline hover:no-underline group" hx-boost="true" href="/strings/{{ .String.Did }}/{{ .String.Rkey }}/edit"> {{ i "pencil" "w-4 h-4" }} <span class="hidden md:inline">Edit</span> {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} </a> <button class="btn text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300 group" title="Delete string" hx-delete="/strings/{{ .String.Did }}/{{ .String.Rkey }}/" hx-swap="none" hx-confirm="Are you sure you want to delete the string `{{ .String.Filename }}`?" > {{ i "trash-2" "w-4 h-4" }} <span class="hidden md:inline">Delete</span> {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} </button> {{ end }} <div class="{{ if not $isOwner }}col-span-3 justify-self-end{{ end }}"> {{ template "fragments/starBtn" (dict "SubjectAt" .String.AtUri "IsStarred" .IsStarred "StarCount" .StarCount) }} </div> </div> </div> </section> <section class="bg-white dark:bg-gray-800 px-6 py-4 rounded relative w-full dark:text-white"> <div class="flex flex-col md:flex-row md:justify-between md:items-center text-gray-500 dark:text-gray-400 text-sm md:text-base pb-2 mb-3 text-base border-b border-gray-200 dark:border-gray-700"> <span> {{ .String.Filename }} <span class="select-none px-1 md:px-2 [&:before]:content-['·']"></span> <span> {{ with .String.Edited }} edited {{ template "repo/fragments/shortTimeAgo" . }} {{ else }} {{ template "repo/fragments/shortTimeAgo" .String.Created }} {{ end }} </span> </span> <div> <span>{{ .Stats.LineCount }} lines</span> <span class="select-none px-1 md:px-2 [&:before]:content-['·']"></span> <span>{{ byteFmt .Stats.ByteCount }}</span> <span class="select-none px-1 md:px-2 [&:before]:content-['·']"></span> <a href="/strings/{{ $ownerId }}/{{ .String.Rkey }}/raw">View raw</a> {{ if .RenderToggle }} <span class="select-none px-1 md:px-2 [&:before]:content-['·']"></span> <a href="?code={{ .ShowRendered }}" hx-boost="true"> View {{ if .ShowRendered }}code{{ else }}rendered{{ end }} </a> {{ end }} </div> </div> <div class="overflow-x-auto overflow-y-hidden relative"> {{ if .ShowRendered }} <div id="blob-contents" class="prose dark:prose-invert">{{ .String.Contents | readme }}</div> {{ else }} <div id="blob-contents" class="whitespace-pre peer-target:bg-yellow-200 dark:peer-target:bg-yellow-900">{{ code .String.Contents .String.Filename | escapeHtml }}</div> {{ end }} </div> {{ template "fragments/multiline-select" }} </section> <div class="flex flex-col gap-4 mt-4"> {{ template "fragments/comment/commentList" (dict "LoggedInUser" .LoggedInUser "Reactions" .Reactions "UserReacted" .UserReacted "VouchRelationships" .VouchRelationships "CommentList" .CommentList) }} {{ template "newComment" . }} </div>{{ end }}
{{ define "newComment" }} {{ if .LoggedInUser }} <form hx-post="/comment" hx-trigger="submit, keydown[(ctrlKey || metaKey) && key=='Enter'] from:find textarea" hx-swap="none" hx-disabled-elt="find button[type='submit']" class="group/form" > <input name="subject-uri" type="hidden" value="{{ .String.AtUri }}"> <div class="bg-white dark:bg-gray-800 rounded drop-shadow-sm py-4 px-4 relative w-full"> <div class="text-sm pb-2 text-gray-500 dark:text-gray-400"> {{ template "user/fragments/picHandleLink" .LoggedInUser.Did }} </div> {{ template "fragments/markdownEditor" (dict "Name" "body" "Required" true "Placeholder" "Add to the discussion. Markdown is supported.") }} <div id="comment-error" class="error"></div> </div> <div class="flex gap-2 mt-2"> <button id="comment-button" type="submit" class="btn-create p-2 flex items-center gap-2 no-underline hover:no-underline" > {{ i "message-square-plus" "w-4 h-4 inline group-[.htmx-request]/form:hidden" }} {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]/form:inline" }} Comment </button> </div> </form> {{ else }} <div class="bg-amber-50 dark:bg-amber-900 border border-amber-500 rounded drop-shadow-sm p-6 relative flex gap-2 items-center"> <a href="/signup" class="btn-create py-0 hover:no-underline hover:text-white flex items-center gap-2"> Sign up </a> <span class="text-gray-500 dark:text-gray-400">or</span> <a href="/login" class="underline">login</a> to add to the discussion </div> {{ end }}{{ end }}