tgrosinger/saasitone
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Switch to Bulma.

Browse Source
This commit is contained in:
mikestefanello 2021-12-03 08:49:07 -05:00
parent 3c2c698269
commit 869fa82f14
6 changed files with 41 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
controllers/about.go
View File

@ -12,6 +12,7 @@ func (a *About) Get(c echo.Context) error {
p := NewPage(c)
p.Layout = "main"
p.Name = "about"
p.Title = "About"
p.Data = "This is the about page"
return a.RenderPage(c, p)

1
controllers/contact.go
View File

@ -14,6 +14,7 @@ func (a *Contact) Get(c echo.Context) error {
p := NewPage(c)
p.Layout = "main"
p.Name = "contact"
p.Title = "Contact us"
p.Data = "This is the contact page"
return a.RenderPage(c, p)
}

2
funcmap/funcmap.go
View File

@ -50,7 +50,7 @@ func File(filepath string) string {
func Link(url, text, currentPath string, classes ...string) template.HTML {
if currentPath == url {
classes = append(classes, "active")
classes = append(classes, "is-active")
}
html := fmt.Sprintf(`<a class="%s" href="%s">%s</a>`, strings.Join(classes, " "), url, text)

4
views/components/messages.gohtml
View File

@ -14,5 +14,7 @@
{{end}}
{{define "message"}}
<div class="alert alert-{{.Type}}">{{.Text}}</div>
<article class="message is-{{.Type}}">
<div class="message-body">{{.Text}}</div>
</article>
{{end}}

56
views/layouts/main.gohtml
View File

@ -5,45 +5,33 @@
<title>{{ .AppName }}{{ if .Title }} | {{ .Title }}{{ end }}</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="http://stackpath.bootstrapcdn.com/bootswatch/4.5.2/sandstone/bootstrap.min.css" media="screen" id="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
</head>
<body>
<div class="navbar navbar-expand-lg fixed-top navbar-dark bg-primary">
<div class="container">
<div href="#" class="navbar-brand">{{ .AppName }}</div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav">
<li class="nav-item">
{{link (call .Reverse "home") "Home" .Path "nav-link"}}
</li>
<li class="nav-item">
{{link (call .Reverse "about") "About" .Path "nav-link"}}
</li>
<li class="nav-item">
{{link (call .Reverse "contact") "Contact" .Path "nav-link"}}
</li>
</ul>
<nav class="navbar is-dark">
<div class="container">
<div class="navbar-brand">
<a href="{{call .Reverse "home"}}" class="navbar-item">{{.AppName}}</a>
</div>
<div id="navbarMenu" class="navbar-menu">
<div class="navbar-end">
{{link (call .Reverse "home") "Home" .Path "navbar-item"}}
{{link (call .Reverse "about") "About" .Path "navbar-item"}}
{{link (call .Reverse "contact") "Contact" .Path "navbar-item"}}
</div>
</div>
</div>
</div>
</div>
</nav>
<div class="container" style="margin-top:80px">
<div class="row">
<div class="col-12">
{{ if .Title }}
<h2>{{ .Title }}</h2>
{{ end }}
<section class="section">
<div class="container">
{{- if .Title}}
<h1 class="title">{{.Title}}</h1>
{{- end}}
{{ template "messages" . }}
{{ template "content" . }}
{{template "messages" .}}
{{template "content" .}}
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
</section>
</body>
</html>

16
views/pages/contact.gohtml
View File

@ -1,8 +1,18 @@
{{define "content"}}
<form method="POST">
<label for="message">Message</label>
<textarea id="message"></textarea>
<input type="submit" value="Send"/>
<div class="field">
<label class="label">Message</label>
<div class="control">
<textarea class="textarea" placeholder="Textarea"></textarea>
</div>
</div>
<div class="field is-grouped">
<div class="control">
<button class="button is-link">Submit</button>
</div>
</div>
{{template "csrf" .}}
</form>
{{end}}