feat: tepmlate for all person bricks

and separate page for temporary template viewing
This commit is contained in:
efim
2023-11-16 03:53:25 +00:00
parent 4764300d08
commit 9f4fe20979
3 changed files with 189 additions and 71 deletions

View File

@@ -1,58 +1,97 @@
{{define "main-content"}}
<p2>Single templates</p2>
<section
class="grid grid-cols-2 border-4"
style="--brick-color: var(--expand-color)"
>
<h2>Single templates</h2>
<section class="grid grid-cols-2 border-4">
<div class="border-2">inactive:</div>
<div class="border-2 p-3">
{{ block "inactive-brick" . }}
{{ block "inactiveBrick" .DefaultColor }}
<div
class="h-8 w-20 border-[hsl(var(--brick-color))]/25 border bg-[hsl(var(--brick-color))]/5"
style="--brick-color: var({{.}})"
></div>
{{ end }}
</div>
<div class="border-2">raised:</div>
<div class="border-2 p-3">
{{ block "raised-brick" . }}
{{ block "raisedBrick" .DefaultColor }}
<div
class="h-8 w-20 border-[hsl(var(--brick-color))] border-2 bg-[hsl(var(--brick-color))]/25"
style="--brick-color: var({{.}})"
></div>
{{ end }}
</div>
<div class="border-2">speaker:</div>
<div class="border-2 p-3">
{{ block "speaker-brick" . }}
{{ block "speakerBrick" .DefaultColor }}
<div
class="h-8 w-20 border-[hsl(var(--brick-color))] border-2 bg-[hsl(var(--brick-color))]/50 shadow-[0_0_15px_rgba(0,_0,_0,_0.5)] shadow-[hsl(var(--brick-color))] animate-pulse"
style="--brick-color: var({{.}})"
></div>
{{ end }}
</div>
<div class="border-2">mark:</div>
<div class="border-2 p-3">
{{ block "mark-brick" . }}
{{ block "markBrick" .DefaultColor }}
<div
class="h-8 w-20 border-[hsl(var(--brick-color))]/25 border bg-[hsl(var(--brick-color))]/5 grid place-content-center font-bold text-[hsl(var(--brick-color))]/50"
style="--brick-color: var({{.}})"
>
X
</div>
{{ end }}
</div>
</section>
<p2>For each type</p2>
<section
class="grid grid-cols-2 border-4"
>
<h2>For each type</h2>
<section class="grid grid-cols-2 border-4">
{{ range .Bricks }}
<div class="border-2">for {{ .Name }}</div>
<div class="border-2 p-3 flex flex-row gap-x-3"
style="--brick-color: var({{ .ColorClass }})"
>
{{ template "inactive-brick" . }}
{{ template "raised-brick" . }}
{{ template "speaker-brick" . }}
{{ template "mark-brick" . }}
<div
class="border-2 p-3 flex flex-row gap-x-3"
style="--brick-color: var({{ .ColorClass }})"
>
{{ template "inactiveBrick" .ColorClass }} {{ template "raisedBrick"
.ColorClass }} {{ template "speakerBrick" .ColorClass }} {{ template
"markBrick" .ColorClass }}
</div>
{{ end }}
</section>
<h2>Now for BrickData taking parametrized template name</h2>
{{ block "brick" .ABrick }}
{{ if eq .TemplateType "inactiveBrick" }}
{{ template "inactiveBrick" .ColorClass }}
{{ else if eq .TemplateType "raisedBrick" }}
{{ template "raisedBrick" .ColorClass }}
{{ else if eq .TemplateType "speakerBrick" }}
{{ template "speakerBrick" .ColorClass }}
{{ else if eq .TemplateType "markBrick" }}
{{ template "markBrick" .ColorClass }}
{{ end }}
{{end}}
<h2>Now for a person</h2>
<div class="border p-3">
{{ block "personBlocks" .TestPerson }}
{{ range (bricksForPerson .) }}
{{ template "brick" . }}
{{ end }}
<p>{{ .Name }}</p>
{{ end }}
</div>
<h2>And now i'll want to get all persons for a room</h2>
{{end}}