Rearrange dashboard items (#819)

- Order of dashboard items is now the same as in user menu
- "Manage pages?" text is now a separate paragraph and not a tile
anymore
- "Your page" was renamed to "My page"

frontend/src/i18n/locales/de.yaml

@@ -218,7 +218,7 @@ realm:
  add-sub-page: Unterseite hinzufügen
  missing-name: Fehlender Name
  user-realm:
- your-page: Persönliche Seite
+ my-page: Meine Seite
  note-label: Nutzerseite
  note-body: >
  Dies ist eine persönliche Nutzerseite, die allein von {{user}} gepflegt wird.

frontend/src/i18n/locales/en.yaml

@@ -213,7 +213,7 @@ realm:
  add-sub-page: Add sub-page
  missing-name: Missing name
  user-realm:
- your-page: Your page
+ my-page: My page
  note-label: User page
  note-body: >
  This is a personal user page which is managed by {{user}}.

frontend/src/layout/header/UserBox.tsx

@@ -213,7 +213,7 @@ const FloatingMenu: React.FC<FloatingMenuProps> = ({ close, type }) => {
  indent
  linkTo={`/@${user.username}`}
  onClick={close}
- >{t("realm.user-realm.your-page")}</MenuItem>}
+ >{t("realm.user-realm.my-page")}</MenuItem>}
  {<MenuItem
  icon={<FiFilm />}
  borderBottom

frontend/src/routes/manage/index.tsx

@@ -65,6 +65,16 @@ const Manage: React.FC = () => {
  gridTemplateColumns: "repeat(auto-fill, minmax(250px, 1fr))",
  gap: 24,
  }}>
+ {user.canCreateUserRealm && <Link to={`/@${user.username}`} css={gridTile}>
+ <HiOutlineFire />
+ <h2>{t("realm.user-realm.my-page")}</h2>
+ {t("manage.dashboard.user-realm-tile")}
+ </Link>}
+ <Link to="/~manage/videos" css={gridTile}>
+ <FiFilm />
+ <h2>{t("manage.my-videos.title")}</h2>
+ {t("manage.dashboard.my-videos-tile")}
+ </Link>
  {user.canUpload && <Link to="/~manage/upload" css={gridTile}>
  <FiUpload />
  <h2>{t("upload.title")}</h2>
@@ -80,20 +90,10 @@ const Manage: React.FC = () => {
  <h2>{t("manage.dashboard.studio-tile-title")}</h2>
  {t("manage.dashboard.studio-tile-body")}
  </ExternalLink>}
- <Link to="/~manage/videos" css={gridTile}>
- <FiFilm />
- <h2>{t("manage.my-videos.title")}</h2>
- {t("manage.dashboard.my-videos-tile")}
- </Link>
- {user.canCreateUserRealm && <Link to={`/@${user.username}`} css={gridTile}>
- <HiOutlineFire />
- <h2>{t("realm.user-realm.your-page")}</h2>
- {t("manage.dashboard.user-realm-tile")}
- </Link>}
- <div css={gridTile}>
- <h2>{t("manage.dashboard.manage-pages-tile-title")}</h2>
- {t("manage.dashboard.manage-pages-tile-body")}
- </div>
+ </div>
+ <div css={{ maxWidth: "80ch", fontSize: 14, h2: { marginBottom: 8, fontSize: 18 } }}>
+ <h2>{t("manage.dashboard.manage-pages-tile-title")}</h2>
+ {t("manage.dashboard.manage-pages-tile-body")}
  </div>
  </>;
 };