Merge pull request 'develop components' (#4) from diana/core:develop into develop

Reviewed-on: #4
This commit is contained in:
Zeni Kim 2024-10-14 16:27:09 -04:00
commit 45e7079005
9 changed files with 106 additions and 19 deletions

View file

@ -2,9 +2,8 @@ package components
type FormButton struct {
Text string
Link string
Icon string
IsSubmit bool
IsPrimary bool
TypeClass string // type primary, secondary, success, danger, warning, info, light, dark, link, outline-primary
IsDisabled bool
}

View file

@ -1,19 +1,20 @@
{{define "form_button"}}
<button class="btn btn-{{if .IsPrimary}}primary{{end}}" {{if eq .IsSubmit true}}type="submit"{{else}}type="button"{{end}} {{if .IsDisabled}}disabled{{end}}>
{{.Text}}</button>
<!-- tailwind heroicons -->
{{if eq .Icon "gear"}}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon">
<path stroke-linecap="round" stroke-linejoin="round" d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
{{else if eq .Icon "arrow-right"}}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon">
<path stroke-linecap="round" stroke-linejoin="round" d="M13.5 4.5 21 12m0 0-7.5 7.5M21 12H3" />
</svg>
{{else if eq .Icon "plus"}}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
</svg>
{{end}}
<button class="btn btn-{{.TypeClass}}" {{if eq .IsSubmit true}}type="submit"{{else}}type="button"{{end}} {{if .IsDisabled}}disabled{{end}}>
{{.Text}}
</button>
<!-- tailwind heroicons -->
{{if eq .Icon "gear"}}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon">
<path stroke-linecap="round" stroke-linejoin="round" d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
{{else if eq .Icon "arrow-right"}}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon">
<path stroke-linecap="round" stroke-linejoin="round" d="M13.5 4.5 21 12m0 0-7.5 7.5M21 12H3" />
</svg>
{{else if eq .Icon "plus"}}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
</svg>
{{end}}
{{end}}

View file

@ -0,0 +1,15 @@
package components
type FormDropdown struct {
Label string
TypeClass string
IsDisabled bool
Items []FormDropdownItem
}
type FormDropdownItem struct {
Text string
Link string
IsDisabled bool
IsActive bool
}

View file

@ -0,0 +1,16 @@
{{define "form_dropdown_item"}}
<li><a class="dropdown-item {{if eq .IsActive true}}active{{end}} {{if eq .IsDisabled true}}disabled{{end}}" href="{{.Link}}">{{.Text}}</a></li>
{{end}}
{{define "form_dropdown"}}
<div class="dropdown">
<button class="btn btn-{{.TypeClass}} dropdown-toggle {{if eq .IsDisabled true}}disabled{{end}}" type="button" data-bs-toggle="dropdown" aria-expanded="false">
{{.Label}}
</button>
<ul class="dropdown-menu">
{{ range .Items}}
{{template "form_dropdown_item" .}}
{{end}}
</ul>
</div>
{{end}}

View file

@ -0,0 +1,10 @@
package components
type FormHref struct {
Text string
Link string
Icon string
IsButton bool
TypeClass string // type primary, secondary, success, danger, warning, info, light, dark, link
IsDisabled bool
}

View file

@ -0,0 +1,6 @@
{{define "form_href"}}
<a class="{{if eq .IsButton true}} btn btn-{{.TypeClass}}{{end}} {{if eq .IsDisabled true}}disabled{{end}}"
href="{{.Link}}" {{if eq .IsButton true}}role="button"{{end}} {{if eq .IsDisabled true}}aria-disabled="true"{{end}}>
{{.Text}}
</a>
{{end}}

View file

@ -2,5 +2,6 @@
<footer>
<script src="/public/app.js"></script>
</footer>
<script src="/public/bootstrap/js/popper.min.js"></script>
<script src="/public/bootstrap/js/bootstrap.min.js"></script>
{{end}}

View file

@ -0,0 +1,16 @@
package components
type PageNav struct {
NavClass string // nav-pills
NavItems []PageNavItem
IsVertical bool
IsTab bool
}
type PageNavItem struct {
Text string
Link string
IsDisabled bool
IsActive bool
ChildItems []PageNavItem
}

View file

@ -0,0 +1,23 @@
{{define "page_nav"}}
<ul class="nav justify-content-center {{.NavClass}} {{if eq .IsVertical true}}flex-column{{end}}{{if eq .IsTab true}}nav-tabs{{end}}" {{if eq .IsTab true}}role="tablist"{{end}}>
{{range $item := .NavItems}}
{{if gt (len $item.ChildItems) 0}}
<li class="nav-item dropdown">
<a href="{{$item.Link}}" {{if eq .IsDisabled true}}disabled{{end}} data-bs-toggle="dropdown"
class="nav-link dropdown-toggle {{if eq .IsActive true}}active{{end}} {{if eq .IsDisabled true}}disabled{{end}}">{{$item.Text}}</a>
<ul class="dropdown-menu">
{{ range $item.ChildItems}}
{{template "form_dropdown_item" .}}
{{end}}
</ul>
</li>
{{else}}
<li class="nav-item"><a href="{{$item.Link}}" {{if eq .IsDisabled true}}disabled{{end}} class="nav-link {{if eq .IsActive true}}active{{end}} {{if eq .IsDisabled true}}disabled{{end}}">
{{$item.Text}}
</a></li>
{{end}}
{{end}}
</ul>
{{end}}