Merge pull request #59 from solid/view-your-profile

Adds a link to your profile + fixes a photo bug
SolidOS · Aug 19, 2019 · 4b8e970 · 4b8e970
2 parents d6055e3 + 28e0e56
commit 4b8e970
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/src/global/header.ts b/src/global/header.ts
@@ -72,10 +72,19 @@ function createUserMenuButton (label: string, onClick: EventListenerOrEventListe
   return button
 }
 
+function createUserMenuLink (label: string, href: string): HTMLElement {
+  const link = document.createElement("a")
+  link.classList.add("header-user-menu__link")
+  link.href = href
+  link.innerText = label
+  return link
+}
+
 async function createUserMenu (store: IndexedFormula, user: NamedNode): Promise<HTMLElement> {
   const outliner = panes.getOutliner(document)
 
   const loggedInMenuList = document.createElement("ul")
+  loggedInMenuList.appendChild(createUserMenuItem(createUserMenuLink("Show your profile", user.uri)))
   const menuItems = await getMenuItems(outliner)
   menuItems.forEach(item => {
     loggedInMenuList.appendChild(createUserMenuItem(createUserMenuButton(item.label, () => openDashboardPane(outliner, item.tabName || item.paneName))))

diff --git a/src/styles/header.scss b/src/styles/header.scss
@@ -77,8 +77,9 @@ $icon-size: 60px;
     $image-margin: 5px;
     $image-size: $icon-size - $image-margin * 2;
     border-radius: 50%;
+    background-position: center;
     background-repeat: no-repeat;
-    background-size: $image-size;
+    background-size: cover;
     margin: $image-margin;
     height: $image-size;
     width: $image-size;
@@ -87,6 +88,7 @@ $icon-size: 60px;
   &__trigger {
     background: none;
     border: 0;
+    cursor: pointer;
     width: $icon-size;
     height: $icon-size;
     img {