{{ define "personal-properties/app.tmpl" }}
	<div class="TitleBar DragArea">
		<button id="closeWindowButton" class="Button" title="Close Window"></button>
		<div id="Drag" class="VisualDragArea"></div>
		<div class="Lable">
			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="ShortBio">
						<img class="Image" src="/system/libs/img/get?path={{ .headerProps.IconPath }}" alt="My Photo">
						<div class="Text">
							<div class="Name">{{ .headerProps.Name }}</div>
							<div>{{ .headerProps.Info1 }}</div>
							<div>{{ .headerProps.Info2 }}</div>
						</div>
					</div> 
					{{ range $propIsland := .allprops }}
					<!-- FIXME -->
						<div class="Island"> 
							<div class="Title">
								{{$propIsland.Header}}:
							</div>
							<div class="Content">
								{{range $prop := $propIsland.Props}}
									<div class="Row">
										<div class="Key">
											{{$prop.Key}}:
											{{ range $keyComment := $prop.KeyComments }}
												<div class="KeyComment">    
													{{ $keyComment }} 
												</div>
											{{ end }}
										</div>
										<div class="Values">
											{{ range $value := $prop.Values }}
												<div class="Value">
													{{ range $block := $value.Blocks }}
														{{ if eq $block.Type "link"}}
															<a href="{{ index $block.Data 0}}">{{ index $block.Data 1}}</a>
														{{ end }}
														{{ if eq $block.Type "string"}}
															{{ range $string := $block.Data}}
																{{ $string }}
															{{ end }}
														{{ end }}
													{{ end }}
												</div>
											{{ end }}
										</div>
									</div>
								{{ end }}
							</div>
						</div>
					{{ end }}
				</div>
			</div>
			<!-- {{template "wde-widgets/scrollbar.tmpl" .}} -->
		</div>
	</div>
{{ end }}