<!DOCTYPE html>
<html lang="en">
  {{template "page_head" "Goffee"}}
  <body>
  <div class="container">
    <fieldset class="mb-3">
        <legend>Demos buttons</legend>
        <div class="container  border rounded-3 p-2">
            {{range .Buttons}}
                {{template "form_button" .}} 
            {{end}}
        </div>
    </fieldset>

    <fieldset class="mb-3">
        <legend>Demos href</legend>
        <div class="container d-flex justify-content-between   border rounded-3 p-2">
            {{range .Hrefs}}
                {{template "content_href" .}} 
            {{end}}
        </div>
    </fieldset>

    <fieldset class="mb-3">
        <legend>Demos Badges</legend>
        <div class="container d-flex justify-content-between   border rounded-3 p-2">
            {{range .Badges}}
                {{template "content_badge" .}} 
            {{end}}
        </div>
    </fieldset>


    <fieldset class="mb-3">
        <legend>Demos dropdown</legend>
        <div class="container d-flex justify-content-between   border rounded-3 p-2">
            {{range .Dropdowns}}
                {{template "content_dropdown" .}} 
            {{end}}
        </div>
    </fieldset>


    <fieldset class="mb-3">
        <legend>Demos List</legend>
        <div class="container d-flex justify-content-between   border rounded-3 p-2">
            {{range .Lists}}
                {{template "content_list" .}} 
            {{end}}
        </div>
    </fieldset>
    
    <fieldset class="mb-3">
        <legend>Demos nav</legend>
        <div class="container   border rounded-3 p-2 ">
            {{range .Menus}}
                <div class="container   border rounded-3 p-2 mb-2">
                    {{template "page_nav" .}} 
                </div>
            {{end}}
        </div>
    </fieldset>
  </div>
  {{template "page_footer"}}
  </body>
</html>
