diff --git a/src/components/icons/QuestionAnswer.js b/src/components/icons/QuestionAnswer.js
new file mode 100644
index 00000000..62ea0911
--- /dev/null
+++ b/src/components/icons/QuestionAnswer.js
@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+import { _extends } from './common';
+
+export default function QuestionAnswer(props) {
+  return /* #__PURE__ */React.createElement('svg', _extends({
+    width: 20,
+    height: 20,
+    viewBox: '0 0 20 20',
+    fill: 'none',
+    xmlns: 'http://www.w3.org/2000/svg',
+  }, props), /* #__PURE__ */React.createElement('path', {
+    d: 'M16.7371 4.00002H14.2371V11.5H3.4038V14H13.4038L16.7371 17.3334V4.00002ZM12.5705 9.83335V0.666687H0.0704651V13.1667L3.4038 9.83335H12.5705Z',
+    fill: 'currentColor',
+  }));
+}
diff --git a/src/components/icons/QuestionAnswerOutline.js b/src/components/icons/QuestionAnswerOutline.js
new file mode 100644
index 00000000..cdc944dc
--- /dev/null
+++ b/src/components/icons/QuestionAnswerOutline.js
@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+import { _extends } from './common';
+
+export default function QuestionAnswerOutline(props) {
+  return /* #__PURE__ */React.createElement('svg', _extends({
+    width: 20,
+    height: 20,
+    viewBox: '0 0 20 20',
+    fill: 'none',
+    xmlns: 'http://www.w3.org/2000/svg',
+  }, props), /* #__PURE__ */React.createElement('path', {
+    d: 'M 16.7371 4 H 14.2371 V 11.5 H 3.4038 V 14 H 13.4038 L 16.7371 17.3334 V 4 Z M 12.5705 9.8333 V 0.6667 H 0.0705 V 13.1667 L 3.4038 9.8333 H 12.5705 Z M 11.465 8.618 H 1.038 V 1.683 H 11.465Z',
+    fill: 'currentColor',
+  }));
+}
diff --git a/src/components/icons/StarFilled.js b/src/components/icons/StarFilled.js
new file mode 100644
index 00000000..2afce196
--- /dev/null
+++ b/src/components/icons/StarFilled.js
@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+import { _extends } from './common';
+
+export default function StarFilled(props) {
+  return /* #__PURE__ */React.createElement('svg', _extends({
+    width: 20,
+    height: 20,
+    viewBox: '0 0 20 20',
+    fill: 'none',
+    xmlns: 'http://www.w3.org/2000/svg',
+  }, props), /* #__PURE__ */React.createElement('path', {
+    d: 'M8.4038 13.3917L13.5538 16.5L12.1871 10.6417L16.7371 6.70002L10.7455 6.19169L8.4038 0.666687L6.06213 6.19169L0.0704651 6.70002L4.62047 10.6417L3.2538 16.5L8.4038 13.3917Z',
+    fill: 'currentColor',
+  }));
+}
diff --git a/src/components/icons/StarOutline.js b/src/components/icons/StarOutline.js
new file mode 100644
index 00000000..f340015a
--- /dev/null
+++ b/src/components/icons/StarOutline.js
@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+import { _extends } from './common';
+
+export default function StarOutline(props) {
+  return /* #__PURE__ */React.createElement('svg', _extends({
+    width: 20,
+    height: 20,
+    viewBox: '0 0 20 20',
+    fill: 'none',
+    xmlns: 'http://www.w3.org/2000/svg',
+  }, props), /* #__PURE__ */React.createElement('path', {
+    d: 'M16.7371 6.69999L10.7455 6.18332L8.4038 0.666656L6.06213 6.19166L0.0704651 6.69999L4.62047 10.6417L3.2538 16.5L8.4038 13.3917L13.5538 16.5L12.1955 10.6417L16.7371 6.69999ZM8.4038 11.8333L5.27047 13.725L6.1038 10.1583L3.33713 7.75832L6.98713 7.44166L8.4038 4.08332L9.8288 7.44999L13.4788 7.76666L10.7121 10.1667L11.5455 13.7333L8.4038 11.8333Z',
+    fill: 'currentColor',
+  }));
+}
diff --git a/src/components/icons/ThumbUpFilled.js b/src/components/icons/ThumbUpFilled.js
new file mode 100644
index 00000000..18d0da17
--- /dev/null
+++ b/src/components/icons/ThumbUpFilled.js
@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+import { _extends } from './common';
+
+export default function ThumbUpFilled(props) {
+  return /* #__PURE__ */React.createElement('svg', _extends({
+    width: 20,
+    height: 20,
+    viewBox: '0 0 20 20',
+    fill: 'none',
+    xmlns: 'http://www.w3.org/2000/svg',
+  }, props), /* #__PURE__ */React.createElement('path', {
+    d: 'M11.2122 0.833344L5.23715 6.81668V17.5H15.4955L18.5705 10.3333V6.66668H11.6455L12.5788 2.18334L11.2122 0.833344ZM0.237152 7.50001H3.57049V17.5H0.237152V7.50001Z',
+    fill: 'currentColor',
+  }));
+}
diff --git a/src/components/icons/ThumbUpOutline.js b/src/components/icons/ThumbUpOutline.js
new file mode 100644
index 00000000..9870c900
--- /dev/null
+++ b/src/components/icons/ThumbUpOutline.js
@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+import { _extends } from './common';
+
+export default function ThumbUpOutline(props) {
+  return /* #__PURE__ */React.createElement('svg', _extends({
+    width: 20,
+    height: 20,
+    viewBox: '0 0 20 20',
+    fill: 'none',
+    xmlns: 'http://www.w3.org/2000/svg',
+  }, props), /* #__PURE__ */React.createElement('path', {
+    d: 'M18.5705 6.66668V10.3333L15.4955 17.5L5.23715 17.5L5.23715 6.81668L11.2122 0.833344L12.5788 2.18334L11.6455 6.66668L18.5705 6.66668ZM6.90382 7.50834L6.90382 15.8333L14.3955 15.8333L16.9038 9.99168V8.33334L9.59548 8.33334L10.5205 3.88334L6.90382 7.50834Z M3.57049 17.5H0.237152L0.237152 7.50001H3.57049L3.57049 17.5Z',
+    fill: 'currentColor',
+  }));
+}
diff --git a/src/components/icons/common.js b/src/components/icons/common.js
new file mode 100644
index 00000000..7e30aae0
--- /dev/null
+++ b/src/components/icons/common.js
@@ -0,0 +1,21 @@
+/* eslint-disable no-underscore-dangle */
+/* eslint-disable no-func-assign */
+/* eslint-disable prefer-object-spread */
+/* eslint-disable prefer-rest-params */
+/* eslint-disable no-param-reassign */
+/* eslint-disable no-restricted-syntax */
+// eslint-disable-next-line import/prefer-default-export
+export function _extends() {
+  _extends = Object.assign || function (target) {
+    for (let i = 1; i < arguments.length; i++) {
+      const source = arguments[i];
+      for (const key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
diff --git a/src/components/icons/index.js b/src/components/icons/index.js
new file mode 100644
index 00000000..f2e74acb
--- /dev/null
+++ b/src/components/icons/index.js
@@ -0,0 +1,6 @@
+export { default as QuestionAnswer } from './QuestionAnswer';
+export { default as QuestionAnswerOutline } from './QuestionAnswerOutline';
+export { default as StarFilled } from './StarFilled';
+export { default as StarOutline } from './StarOutline';
+export { default as ThumbUpFilled } from './ThumbUpFilled';
+export { default as ThumbUpOutline } from './ThumbUpOutline';
diff --git a/src/discussions/posts/post/LikeButton.jsx b/src/discussions/posts/post/LikeButton.jsx
index b3ec5068..9cb0066d 100644
--- a/src/discussions/posts/post/LikeButton.jsx
+++ b/src/discussions/posts/post/LikeButton.jsx
@@ -5,8 +5,8 @@ import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import {
   Icon, IconButton, OverlayTrigger, Tooltip,
 } from '@edx/paragon';
-import { ThumbUpFilled, ThumbUpOutline } from '@edx/paragon/icons';
 
+import { ThumbUpFilled, ThumbUpOutline } from '../../../components/icons';
 import messages from './messages';
 
 function LikeButton({
@@ -34,7 +34,7 @@ function LikeButton({
       >
         <IconButton
           onClick={handleClick}
-          className="p-3 mr-2"
+          className="p-3 mr-2 mt-1"
           alt="Like"
           iconAs={Icon}
           size="inline"
diff --git a/src/discussions/posts/post/PostFooter.jsx b/src/discussions/posts/post/PostFooter.jsx
index 60e0c672..aa7d11c8 100644
--- a/src/discussions/posts/post/PostFooter.jsx
+++ b/src/discussions/posts/post/PostFooter.jsx
@@ -9,9 +9,15 @@ import {
   Badge, Icon, IconButton, OverlayTrigger, Tooltip,
 } from '@edx/paragon';
 import {
-  Locked, People, QuestionAnswer, QuestionAnswerOutline, StarFilled, StarOutline,
+  Locked, People,
 } from '@edx/paragon/icons';
 
+import {
+  QuestionAnswer,
+  QuestionAnswerOutline,
+  StarFilled,
+  StarOutline,
+} from '../../../components/icons';
 import { updateExistingThread } from '../data/thunks';
 import LikeButton from './LikeButton';
 import messages from './messages';
@@ -45,14 +51,14 @@ function PostFooter({
           alt="Follow"
           iconAs={Icon}
           size="inline"
-          className="mx-2.5 my-0"
+          className="mx-2.5 my-0 mt-1.5"
           src={post.following ? StarFilled : StarOutline}
         />
       </OverlayTrigger>
       {preview && post.commentCount > 1
         && (
           <>
-            <Icon src={post.unreadCommentCount ? QuestionAnswer : QuestionAnswerOutline} className="mx-2 my-0" />
+            <Icon src={post.unreadCommentCount ? QuestionAnswer : QuestionAnswerOutline} className="mx-2 my-0 mt-2" />
             <span style={{ minWidth: '2rem' }}>
               {post.commentCount}
             </span>
diff --git a/src/discussions/posts/post/PostLink.jsx b/src/discussions/posts/post/PostLink.jsx
index bc8454d9..18f91b46 100644
--- a/src/discussions/posts/post/PostLink.jsx
+++ b/src/discussions/posts/post/PostLink.jsx
@@ -47,7 +47,7 @@ function PostLink({
         </div>
       )}
       <div
-        className={classNames('d-flex flex-row flex-fill mw-100 p-1 border-primary-500', { 'bg-light-300': post.read })}
+        className={classNames('d-flex flex-row flex-fill mw-100 p-2.5 border-primary-500', { 'bg-light-300': post.read })}
         style={post.id === postId ? {
           borderRightWidth: '4px',
           borderRightStyle: 'solid',