Add userinfo in navigation

renderer/model.go

@@ -6,12 +6,14 @@ import (
 )
 
 type NavbarTemplateData struct {
+	User              *mastodon.Account
 	NotificationCount int
 }
 
-func NewNavbarTemplateData(notificationCount int) *NavbarTemplateData {
+func NewNavbarTemplateData(notificationCount int, user *mastodon.Account) *NavbarTemplateData {
 	return &NavbarTemplateData{
 		NotificationCount: notificationCount,
+		User:              user,
 	}
 }
 

service/service.go

@@ -478,7 +478,12 @@ func (svc *service) getNavbarTemplateData(ctx context.Context, client io.Writer,
 		}
 	}
 
-	data = renderer.NewNavbarTemplateData(notificationCount)
+	u, err := c.GetAccountCurrentUser(ctx)
+	if err != nil {
+		return
+	}
+
+	data = renderer.NewNavbarTemplateData(notificationCount, u)
 
 	return
 }

static/main.css

@@ -104,14 +104,6 @@
 	font-size: 23pt;
 }
 
-.navigation {
-	margin: 4px 0;
-}
-
-.navigation a {
-	margin-right: 8px;
-}
-
 .post-form {
 	margin: 8px 0;
 }
@@ -343,3 +335,33 @@
 .post-form-emoji-link i {
 	font-size: 14pt !important;
 }
+
+.user-info {
+	margin-bottom: 8px;
+}
+
+.user-info-img-container {
+	display: inline-block;
+	vertical-align: top;
+}
+
+.user-info-img {
+	max-height: 64px;
+	max-width: 64px;
+	object-fit: contain;
+	vertical-align: middle;
+}
+
+.user-info-details-container {
+	display: inline-block;
+	vertical-align: middle;
+}
+
+.user-info-details-container>div {
+	margin-bottom: 4px;
+}
+
+.nav-link {
+	margin-right: 2px;
+}
+

templates/navigation.tmpl

@@ -1,6 +1,23 @@
-<div class="navigation">
+<div class="user-info">
-	<a href="/timeline">home</a>
+	<div class="user-info-img-container">
-	<a href="/notifications">notifications{{if gt .NotificationCount 0}} ({{.NotificationCount}}){{end}}</a>
+		<a class="img-link" href="/timeline" title="home">
-	<a href="/about">about</a>
+			<img class="user-info-img" src="{{.User.AvatarStatic}}" alt="profile-avatar" />
-	<a href="/signout">sign out</a>
+		</a>
+	</div>
+	<div class="user-info-details-container">
+		<div>
+			<span class="status-dname"> {{EmojiFilter .User.DisplayName .User.Emojis}} </span>  
+			<a class="nav-link" href="/user/{{.User.ID}}">
+				<span class="status-uname"> {{.User.Acct}} </span>
+			</a>
+		</div>
+		<div>
+			<a class="nav-link" href="/timeline">home</a>
+			<a class="nav-link" href="/notifications">notifications{{if gt .NotificationCount 0}}({{.NotificationCount}}){{end}}</a>
+			<a class="nav-link" href="/about">about</a>
+		</div>
+		<div>
+			<a class="nav-link" href="/signout">sign out</a>
+		</div>
+	</div>
 </div>