Links in about-me app

apps/aboutme/personalprops.go

@@ -67,7 +67,19 @@ func (p *AboutMeApp) PrivateRoutes(router *gin.RouterGroup) {
 
 	router.GET("getMock", func(ctx *gin.Context) {
 		ctx.JSON(http.StatusOK, PropertiesFileData{
-			Header: HeaderIsland{},
+			Header: HeaderIsland{
+				Name:     "",
+				IconPath: "",
+				Value1:   "",
+				Value2:   "",
+			},
+			Links: []HeaderLink{
+				{
+					Text: "",
+					Url:  "",
+					Icon: "",
+				},
+			},
 			Islands: []Island{
 				{
 					Header: "qq",
@@ -276,14 +288,25 @@ func (p *AboutMeApp) Render(appCtx appCtx.AppContext, filePath string) (gin.H, e
 	//Make icon path absolute
 	propsData.Header.IconPath = p.fs.RelativeToAbsolute(appCtx, propsData.Header.IconPath)
 
+	absoluteLinks := []HeaderLink{}
+	for _, link := range propsData.Links {
+		absoluteLinks = append(absoluteLinks, HeaderLink{
+			Text: link.Text,
+			Url:  link.Url,
+			Icon: p.fs.RelativeToAbsolute(appCtx, link.Icon),
+		})
+	}
+
 	return gin.H{
 		"HeaderProps": propsData.Header,
+		"Links":       absoluteLinks,
 		"Islands":     renderedIslands,
 	}, nil
 }
 
 type PropertiesFileData struct {
 	Header  HeaderIsland `bson:"header" json:"header"`
+	Links   []HeaderLink `bson:"links" json:"links"`
 	Islands []Island     `bson:"islands" json:"islands"` //TODO rename
 }
 
@@ -294,6 +317,12 @@ type HeaderIsland struct {
 	Value2   string `bson:"value2" json:"value2"`
 }
 
+type HeaderLink struct {
+	Text string `bson:"text" json:"text"`
+	Url  string `bson:"url" json:"url"`
+	Icon string `bson:"icon" json:"icon"`
+}
+
 type Island struct {
 	Header     string           `bson:"header" json:"header"`
 	Properties []IslandProperty `bson:"properties" json:"properties"`

res/dev-fs/apps/AboutMe/about-me.css

@@ -107,7 +107,27 @@
     letter-spacing: 0.35px; 
 }
 
+.PropertiesList .Links {
+    position: absolute;
+    right: 14px;
+    top: 27px;
+    /* background-color: aqua; */
+    height: auto;
+    width: auto;
 
+    /* Auto layout */
+    display: flex;
+    flex-direction: row;
+    align-items: left;
+    padding: 0px;
+    gap:4px;
+}
+
+.PropertiesList .Links .Link {
+    /* background-color:brown; */
+    width:  16px;
+    height: 16px;
+}
 
 .PropertiesList .Island{
     width: 100%;

routes/private.go

@@ -47,12 +47,12 @@ func PrivateRoutes(port string, webfs *webfilesystem.WebFileSystem, webde *wde.W
 			Args:    []string{},
 		}
 
-		// appString2 := AppString{
+		desktop := AppString{
-		// 	AppPath: "/Applications/Finder.app",
+			AppPath: "/Applications/Finder.app",
-		// 	Args:    []string{"/home/user/", "--desktop", "desktop-layer"},
+			Args:    []string{"/home/user/", "--desktop", "desktop-layer"},
-		// }
+		}
 
-		autostart := []AppString{appString, aboutMe}
+		autostart := []AppString{desktop, appString, aboutMe}
 		ctx.HTML(http.StatusOK, "index.tmpl", gin.H{
 			"autostart": autostart,
 		})

templates/personal-properties/app.tmpl

@@ -2,15 +2,20 @@
 	<div class="TitleBar DragArea">
 		<button id="closeWindowButton" class="Button" title="Close Window"></button>
 		<div id="Drag" class="VisualDragArea"></div>
-		<div class="Lable">
+		<div class="Lable">About me</div>
-			About me
-		</div>
 		<div id="Drag" class="VisualDragArea"></div>
 	</div>
 	<div class="ContentBorder AdjectiveElement">
 		<div class="PersPropsContent">
 			<div class="PropsView">
 				<div class="PropertiesList">
+					<div class="Links">
+						{{ range $link := .Links }}
+							<a href="{{$link.Url}}" target="_blank">
+								<img class="Link" src="/system/libs/img/get?path={{$link.Icon}}" alt="{{$link.Text}}">
+							</a>
+						{{ end }}
+					</div>
 					<div class="ShortBio">
 						<img class="Image" src="/system/libs/img/get?path={{ .HeaderProps.IconPath }}" alt="My Photo">
 						<div class="Text">
@@ -21,11 +26,9 @@
 					</div> 
 					{{ range $island := .Islands }}
 						<!-- FIXME -->
-						
 						<div class="Island">
 							<div class="Title"> {{$island.Header}}:</div>
 							<div class="Content">
-								
 								{{range $property := $island.Properties}}
 									<div class="Row">
 										<div class="Key">