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

Reviewed-on: #4
components: buttons, dropdown, href, nav
2024-10-14 16:27:09 -04:00 · 2024-10-12 13:01:52 -05:00 · 2024-10-12 13:47:50 -04:00
9 changed files with 106 additions and 19 deletions
--- a/template/components/form_button.go
+++ b/template/components/form_button.go
@ -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
 }
--- a/template/components/form_button.html
+++ b/template/components/form_button.html
@ -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}}
--- a/template/components/form_dropdown.go
+++ b/template/components/form_dropdown.go
@ -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
+}
--- a/template/components/form_dropdown.html
+++ b/template/components/form_dropdown.html
@ -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}}
--- a/template/components/form_href.go
+++ b/template/components/form_href.go
@ -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
+}
--- a/template/components/form_href.html
+++ b/template/components/form_href.html
@ -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}}
--- a/template/components/page_footer.html
+++ b/template/components/page_footer.html
@ -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}}
--- a/template/components/page_nav.go
+++ b/template/components/page_nav.go
@ -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
+}
--- a/template/components/page_nav.html
+++ b/template/components/page_nav.html
@ -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}}
Author	SHA1	Message	Date
Zeni Kim	45e7079005	Merge pull request 'develop components' (#4 ) from diana/core:develop into develop Reviewed-on: #4	2024-10-14 16:27:09 -04:00
Diana	7073cd1c21	components: buttons, dropdown, href, nav	2024-10-12 13:01:52 -05:00
diana	bfde0cc445	Merge pull request 'develop' (#1 ) from goffee/core:develop into develop Reviewed-on: diana/core#1	2024-10-12 13:47:50 -04:00