diff --git a/packages/ui-default/components/media/media.page.js b/packages/ui-default/components/media/media.page.js
index f38dc768..6ccf07cb 100644
--- a/packages/ui-default/components/media/media.page.js
+++ b/packages/ui-default/components/media/media.page.js
@@ -8,7 +8,7 @@ export default new AutoloadPage('media', async () => {
         const users = $dom.find('div[data-user]');
         const resolve = (ele, item) => {
             items.push(item);
-            resolvers.push((html) => $(ele).replaceWith($(html)));
+            resolvers.push((html) => html && $(ele).replaceWith($(html)));
         };
         users.get().forEach((ele) => resolve(ele, { type: 'user', id: +$(ele).text() }));
         $dom.find('.typo').get().forEach((el) => {
@@ -30,6 +30,7 @@ export default new AutoloadPage('media', async () => {
                 if (!data) return;
                 if (category === 'user' && Number.isInteger(+data) && !extra) resolve(ele, { type: 'user', id: +data });
                 if (category === 'p' && !extra) resolve(ele, { type: 'problem', id: data, domainId });
+                if (category === 'contest' && !extra) resolve(ele, { type: 'contest', id: data, domainId });
             });
         });
         if (!items.length) return;
diff --git a/packages/ui-default/handler.js b/packages/ui-default/handler.js
index 2a5780fa..1fd5f3f2 100644
--- a/packages/ui-default/handler.js
+++ b/packages/ui-default/handler.js
@@ -4,12 +4,13 @@ const { readdirSync, readFileSync } = require('fs');
 const { join } = require('path');
 const crypto = require('crypto');
 const { tmpdir } = require('os');
+const { ObjectID } = require('mongodb');
 const bus = require('hydrooj/dist/service/bus');
 const { PERM } = require('hydrooj/dist/model/builtin');
 const markdown = require('./backendlib/markdown');
 
 const {
-  system, domain, user, setting, problem,
+  system, domain, user, setting, problem, contest,
 } = global.Hydro.model;
 const { Route, Handler, UiContextBase } = global.Hydro.service.server;
 
@@ -132,18 +133,28 @@ class RichMediaHandler extends Handler {
   async renderProblem(domainId, payload) {
     const cur = payload.domainId ? await user.getById(payload.domainId, this.user._id) : this.user;
     let pdoc = cur.hasPerm(PERM.PERM_VIEW | PERM.PERM_VIEW_PROBLEM)
-      ? await problem.get(domainId, payload.id) || problem.default
+      ? await problem.get(payload.domainId || domainId, payload.id) || problem.default
       : problem.default;
     if (pdoc.hidden && !cur.own(pdoc) && !cur.hasPerm(PERM.PERM_VIEW_PROBLEM_HIDDEN)) pdoc = problem.default;
     return await this.renderHTML('partials/problem.html', { pdoc });
   }
 
+  async renderContest(domainId, payload) {
+    const cur = payload.domainId ? await user.getById(payload.domainId, this.user._id) : this.user;
+    const tdoc = cur.hasPerm(PERM.PERM_VIEW | PERM.PERM_VIEW_CONTEST)
+      ? await contest.get(payload.domainId || domainId, new ObjectID(payload.id))
+      : null;
+    if (tdoc) return await this.renderHTML('partials/contest.html', { tdoc });
+    return '';
+  }
+
   async post({ domainId, items }) {
     const res = [];
     for (const item of items) {
       if (item.domainId && item.domainId === domainId) delete item.domainId;
-      if (item.type === 'user') res.push(this.renderUser(domainId, item));
-      else if (item.type === 'problem') res.push(this.renderProblem(domainId, item));
+      if (item.type === 'user') res.push(this.renderUser(domainId, item).catch(() => ''));
+      else if (item.type === 'problem') res.push(this.renderProblem(domainId, item).catch(() => ''));
+      else if (item.type === 'contest') res.push(this.renderContest(domainId, item).catch(() => ''));
       else res.push('');
     }
     this.response.body = await Promise.all(res);
diff --git a/packages/ui-default/misc/typography.styl b/packages/ui-default/misc/typography.styl
index 6cda1813..77fa4ee4 100644
--- a/packages/ui-default/misc/typography.styl
+++ b/packages/ui-default/misc/typography.styl
@@ -252,7 +252,8 @@ small, figcaption
 .typo a, .typo .link, .typo-a
   &, &:visited, &:active, &:hover
     &:not(.user-profile-name)
-      color: $primary-color
+      &:not(.media-link)
+        color: $primary-color
 
 .typo dl, .typo form, .typo hr, .typo table
   padding-top: 0.3em
diff --git a/packages/ui-default/package.json b/packages/ui-default/package.json
index 6e9e2786..ddb2bb88 100644
--- a/packages/ui-default/package.json
+++ b/packages/ui-default/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.12.11",
+  "version": "4.12.12",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",
@@ -121,6 +121,7 @@
     "markdown-it-mark": "^3.0.1",
     "markdown-it-merge-cells": "^1.0.1",
     "markdown-it-table-of-contents": "^0.5.2",
+    "mongodb": "^3.6.9",
     "nunjucks": "^3.2.3",
     "streamsaver": "^2.0.5",
     "xss": "^1.0.9"
diff --git a/packages/ui-default/templates/partials/contest.html b/packages/ui-default/templates/partials/contest.html
new file mode 100644
index 00000000..9321ad95
--- /dev/null
+++ b/packages/ui-default/templates/partials/contest.html
@@ -0,0 +1,3 @@
+<a class="discussion-node-tag media-link" href="{{ url('contest_detail', domainId=tdoc.domainId, tid=tdoc.docId) }}">
+  <span class="v-center icon icon-award"></span>{{ tdoc.title }}
+</a>
\ No newline at end of file
diff --git a/packages/ui-default/templates/partials/user.html b/packages/ui-default/templates/partials/user.html
index 9e15ce9e..48c89227 100644
--- a/packages/ui-default/templates/partials/user.html
+++ b/packages/ui-default/templates/partials/user.html
@@ -1,2 +1,2 @@
 {% import "components/user.html" as user with context %}
-{{ user.render_inline(udoc) }}
\ No newline at end of file
+{{ user.render_inline(udoc, badge=false) }}
\ No newline at end of file