components: buttons, dropdown, href, nav

This commit is contained in:
Diana 2024-10-12 13:01:52 -05:00
parent bfde0cc445
commit 7073cd1c21
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,6 +1,7 @@
{{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>
<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">

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}}