Add update button
This commit is contained in:
		
							parent
							
								
									e2447b29c8
								
							
						
					
					
						commit
						23f74ff054
					
				@ -4,10 +4,15 @@ import "github.com/maxence-charriere/go-app/v9/pkg/app"
 | 
			
		||||
 | 
			
		||||
type navbar struct {
 | 
			
		||||
	app.Compo
 | 
			
		||||
	updateAvailable bool
 | 
			
		||||
 | 
			
		||||
	OnClickButton func(page string)
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
func (n *navbar) OnAppUpdate(ctx app.Context) {
 | 
			
		||||
	n.updateAvailable = ctx.AppUpdateAvailable()
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
func (n *navbar) Render() app.UI {
 | 
			
		||||
	return app.Div().Body(
 | 
			
		||||
		app.Ul().Body(
 | 
			
		||||
@ -28,5 +33,21 @@ func (n *navbar) Render() app.UI {
 | 
			
		||||
				app.A().Href("/blog").Text("Blog"),
 | 
			
		||||
			).Style("display", "none"),
 | 
			
		||||
		),
 | 
			
		||||
		app.If(n.updateAvailable,
 | 
			
		||||
			app.Div().Body(
 | 
			
		||||
				app.Img().
 | 
			
		||||
					Src("/web/static/images/hot1.gif").
 | 
			
		||||
					Class("update-img"),
 | 
			
		||||
				app.Span().
 | 
			
		||||
					Text("Update available! Click here to update!").
 | 
			
		||||
					Class("update-text"),
 | 
			
		||||
			).
 | 
			
		||||
				Class("update-div").
 | 
			
		||||
				OnClick(n.onUpdateClick),
 | 
			
		||||
		),
 | 
			
		||||
	).Class("navbar")
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
func (n *navbar) onUpdateClick(ctx app.Context, e app.Event) {
 | 
			
		||||
	ctx.Reload()
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -35,12 +35,22 @@ body {
 | 
			
		||||
	height: 100%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.update-box {
 | 
			
		||||
	position:absolute;
 | 
			
		||||
	max-width: 100px;
 | 
			
		||||
	top: 0px;
 | 
			
		||||
	right: 0px;
 | 
			
		||||
.update-div {
 | 
			
		||||
	font-size: 0.8rem;
 | 
			
		||||
	display: flex;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.update-div:hover {
 | 
			
		||||
	cursor: pointer;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.update-text {
 | 
			
		||||
	align-self: center;
 | 
			
		||||
	flex: 70%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.update-img {
 | 
			
		||||
	flex: 30%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.main {
 | 
			
		||||
 | 
			
		||||
		Loading…
	
		Reference in New Issue
	
	Block a user