Profile: add subscribe menu

src/profiles/Profile.css

@@ -0,0 +1,82 @@
+.Profile {
+  .intro {
+    background-color: var(--tutu-color-surface-d);
+    color: var(--tutu-color-on-surface);
+    padding: 16px 12px;
+    display: flex;
+    flex-flow: column nowrap;
+    gap: 16px;
+  }
+
+  .description {
+    & a {
+      color: inherit;
+      font-style: italic;
+    }
+
+    word-break: break-all;
+  }
+
+  .acct-grp {
+    display: flex;
+    flex-flow: row wrap;
+    gap: 16px;
+    align-items: center;
+
+    & > :nth-child(2) {
+      flex-grow: 1;
+    }
+
+    & > :last-child {
+      flex-grow: 1;
+      text-align: right;
+    }
+  }
+
+  .name-grp {
+    display: flex;
+    flex-flow: column nowrap;
+  }
+
+  table.acct-fields {
+    word-break: break-all;
+
+    & td > a {
+      display: inline-flex;
+      align-items: center;
+      color: inherit;
+      min-height: 44px;
+    }
+
+    & a > .invisible {
+      display: none;
+    }
+
+    & svg {
+      vertical-align: middle;
+    }
+  }
+
+  .toot-list-toolbar {
+    position: sticky;
+    top: var(--scaffold-topbar-height);
+    z-index: calc(var(--tutu-zidx-nav, 1) - 1);
+    background: var(--tutu-color-surface);
+    border-bottom: 1px solid var(--tutu-color-surface-d);
+    contain: content;
+    /* TODO: box-shadow is needed here (same as app bar, e6).
+    There is no good way to detect if the sticky is "sticked" -
+    so let's leave it for future.
+
+    For now we use a trick to make it looks better.
+    */
+    box-shadow: 0px -2px 4px 0px var(--tutu-color-shadow);
+  }
+}
+
+.Profile__page-title {
+  flex-grow: 1;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}