diff --git a/app/assets/javascripts/diffs/components/diff_file.vue b/app/assets/javascripts/diffs/components/diff_file.vue
index 13274129f1d3b8ea44527930d5de4f6557c4487c..c74a4b47fcb029bbd4239f8ec464788093b53279 100644
--- a/app/assets/javascripts/diffs/components/diff_file.vue
+++ b/app/assets/javascripts/diffs/components/diff_file.vue
@@ -402,23 +402,23 @@ export default {
 
     <div
       v-if="idState.forkMessageVisible"
-      class="js-file-fork-suggestion-section file-fork-suggestion"
+      class="js-file-fork-suggestion-section file-fork-suggestion gl-border-1 gl-border-solid gl-border-gray-100 gl-border-top-0"
     >
       <span v-safe-html="forkMessage" class="file-fork-suggestion-note"></span>
       <gl-button
         :href="file.fork_path"
-        class="js-fork-suggestion-button"
+        class="js-fork-suggestion-button gl-mr-3"
         category="secondary"
         variant="confirm"
         >{{ $options.i18n.fork }}</gl-button
       >
-      <button
-        class="js-cancel-fork-suggestion-button btn btn-grouped"
-        type="button"
+      <gl-button
+        class="js-cancel-fork-suggestion-button"
+        category="secondary"
         @click="hideForkMessage"
       >
         {{ $options.i18n.cancel }}
-      </button>
+      </gl-button>
     </div>
     <template v-else>
       <div
diff --git a/app/assets/javascripts/notes/components/diff_with_note.vue b/app/assets/javascripts/notes/components/diff_with_note.vue
index f08c005259cb671395f24b5f50bec150331de6a4..efb6fc67806a55f60299deba49c258e803876d86 100644
--- a/app/assets/javascripts/notes/components/diff_with_note.vue
+++ b/app/assets/javascripts/notes/components/diff_with_note.vue
@@ -1,5 +1,5 @@
 <script>
-import { GlSkeletonLoader } from '@gitlab/ui';
+import { GlButton, GlSkeletonLoader } from '@gitlab/ui';
 // eslint-disable-next-line no-restricted-imports
 import { mapState, mapActions } from 'vuex';
 import SafeHtml from '~/vue_shared/directives/safe_html';
@@ -19,6 +19,7 @@ export default {
     GlSkeletonLoader,
     DiffViewer,
     ImageDiffOverlay,
+    GlButton,
   },
   directives: {
     SafeHtml,
@@ -127,12 +128,12 @@ export default {
             <td class="new_line diff-line-num"></td>
             <td v-if="error" class="js-error-lazy-load-diff diff-loading-error-block">
               {{ __('Unable to load the diff') }}
-              <button
-                class="gl-button btn-link btn-link-retry gl-p-0 js-toggle-lazy-diff-retry-button gl-reset-font-size!"
+              <gl-button
+                class="btn-link-retry gl-font-regular js-toggle-lazy-diff-retry-button"
                 @click="fetchDiff"
               >
                 {{ __('Try again') }}
-              </button>
+              </gl-button>
             </td>
             <td v-else class="line_content js-success-lazy-load">
               <span></span>