diff options
Diffstat (limited to 'app/assets/javascripts/blob')
7 files changed, 31 insertions, 27 deletions
diff --git a/app/assets/javascripts/blob/components/blob_header_viewer_switcher.vue b/app/assets/javascripts/blob/components/blob_header_viewer_switcher.vue index ed03213d7cf..5b15fe2d7cc 100644 --- a/app/assets/javascripts/blob/components/blob_header_viewer_switcher.vue +++ b/app/assets/javascripts/blob/components/blob_header_viewer_switcher.vue @@ -1,5 +1,5 @@ <script> -import { GlDeprecatedButton, GlButtonGroup, GlIcon, GlTooltipDirective } from '@gitlab/ui'; +import { GlButton, GlButtonGroup, GlIcon, GlTooltipDirective } from '@gitlab/ui'; import { RICH_BLOB_VIEWER, RICH_BLOB_VIEWER_TITLE, @@ -11,7 +11,7 @@ export default { components: { GlIcon, GlButtonGroup, - GlDeprecatedButton, + GlButton, }, directives: { GlTooltip: GlTooltipDirective, @@ -46,7 +46,7 @@ export default { </script> <template> <gl-button-group class="js-blob-viewer-switcher mx-2"> - <gl-deprecated-button + <gl-button v-gl-tooltip.hover :aria-label="$options.SIMPLE_BLOB_VIEWER_TITLE" :title="$options.SIMPLE_BLOB_VIEWER_TITLE" @@ -55,8 +55,8 @@ export default { @click="switchToViewer($options.SIMPLE_BLOB_VIEWER)" > <gl-icon name="code" :size="14" /> - </gl-deprecated-button> - <gl-deprecated-button + </gl-button> + <gl-button v-gl-tooltip.hover :aria-label="$options.RICH_BLOB_VIEWER_TITLE" :title="$options.RICH_BLOB_VIEWER_TITLE" @@ -65,6 +65,6 @@ export default { @click="switchToViewer($options.RICH_BLOB_VIEWER)" > <gl-icon name="document" :size="14" /> - </gl-deprecated-button> + </gl-button> </gl-button-group> </template> diff --git a/app/assets/javascripts/blob/components/constants.js b/app/assets/javascripts/blob/components/constants.js index 93dceacabdd..0137bd38d28 100644 --- a/app/assets/javascripts/blob/components/constants.js +++ b/app/assets/javascripts/blob/components/constants.js @@ -25,7 +25,7 @@ export const BLOB_RENDER_ERRORS = { TOO_LARGE: { id: 'too_large', text: sprintf(__('it is larger than %{limit}'), { - limit: numberToHumanSize(104857600), // 100MB in bytes + limit: numberToHumanSize(10485760), // 10MB in bytes }), }, EXTERNAL: { diff --git a/app/assets/javascripts/blob/notebook/notebook_viewer.vue b/app/assets/javascripts/blob/notebook/notebook_viewer.vue index 401fe9beb62..b1713989997 100644 --- a/app/assets/javascripts/blob/notebook/notebook_viewer.vue +++ b/app/assets/javascripts/blob/notebook/notebook_viewer.vue @@ -62,9 +62,7 @@ export default { </script> <template> - <div - class="js-notebook-viewer-mounted container-fluid md prepend-top-default append-bottom-default" - > + <div class="js-notebook-viewer-mounted container-fluid md gl-mt-3 gl-mb-3"> <div v-if="loading && !error" class="text-center loading"> <gl-loading-icon class="mt-5" size="lg" /> </div> diff --git a/app/assets/javascripts/blob/pdf/pdf_viewer.vue b/app/assets/javascripts/blob/pdf/pdf_viewer.vue index 5eaddfc099a..64fc832ee54 100644 --- a/app/assets/javascripts/blob/pdf/pdf_viewer.vue +++ b/app/assets/javascripts/blob/pdf/pdf_viewer.vue @@ -34,7 +34,7 @@ export default { </script> <template> - <div class="js-pdf-viewer container-fluid md prepend-top-default append-bottom-default"> + <div class="js-pdf-viewer container-fluid md gl-mt-3 gl-mb-3"> <div v-if="loading && !error" class="text-center loading"> <gl-loading-icon class="mt-5" size="lg" /> </div> diff --git a/app/assets/javascripts/blob/sketch/index.js b/app/assets/javascripts/blob/sketch/index.js index dbff03dc734..767e205fcaa 100644 --- a/app/assets/javascripts/blob/sketch/index.js +++ b/app/assets/javascripts/blob/sketch/index.js @@ -56,7 +56,7 @@ export default class SketchLoader { error() { const errorMsg = document.createElement('p'); - errorMsg.className = 'prepend-top-default append-bottom-default text-center'; + errorMsg.className = 'gl-mt-3 gl-mb-3 text-center'; errorMsg.textContent = __(` Cannot show preview. For previews on sketch files, they must have the file format introduced by Sketch version 43 and above. diff --git a/app/assets/javascripts/blob/suggest_gitlab_ci_yml/components/popover.vue b/app/assets/javascripts/blob/suggest_gitlab_ci_yml/components/popover.vue index 1e9e36feecc..932b6e8a0f7 100644 --- a/app/assets/javascripts/blob/suggest_gitlab_ci_yml/components/popover.vue +++ b/app/assets/javascripts/blob/suggest_gitlab_ci_yml/components/popover.vue @@ -2,7 +2,6 @@ import { GlPopover, GlSprintf, GlDeprecatedButton, GlIcon } from '@gitlab/ui'; import { parseBoolean, scrollToElement, setCookie, getCookie } from '~/lib/utils/common_utils'; import { s__ } from '~/locale'; -import { glEmojiTag } from '~/emoji'; import Tracking from '~/tracking'; const trackingMixin = Tracking.mixin(); @@ -11,14 +10,16 @@ const popoverStates = { suggest_gitlab_ci_yml: { title: s__(`suggestPipeline|1/2: Choose a template`), content: s__( - `suggestPipeline|We recommend the %{boldStart}Code Quality%{boldEnd} template, which will add a report widget to your Merge Requests. This way you’ll learn about code quality degradations much sooner. %{footerStart} Goodbye technical debt! %{footerEnd}`, + `suggestPipeline|We’re adding a GitLab CI configuration file to add a pipeline to the project. You could create it manually, but we recommend that you start with a GitLab template that works out of the box.`, + ), + footer: s__( + `suggestPipeline|Choose %{boldStart}Code Quality%{boldEnd} to add a pipeline that tests the quality of your code.`, ), - emoji: glEmojiTag('wave'), }, suggest_commit_first_project_gitlab_ci_yml: { title: s__(`suggestPipeline|2/2: Commit your changes`), content: s__( - `suggestPipeline|Commit the changes and your pipeline will automatically run for the first time.`, + `suggestPipeline|The template is ready! You can now commit it to create your first pipeline.`, ), }, }; @@ -66,6 +67,9 @@ export default { suggestContent() { return popoverStates[this.trackLabel].content || ''; }, + suggestFooter() { + return popoverStates[this.trackLabel].footer || ''; + }, emoji() { return popoverStates[this.trackLabel].emoji || ''; }, @@ -123,16 +127,13 @@ export default { </span> </template> - <gl-sprintf :message="suggestContent"> - <template #bold="{content}"> - <strong> {{ content }} </strong> - </template> - <template #footer="{content}"> - <div class="mt-3"> - {{ content }} - <span v-html="emoji"></span> - </div> - </template> - </gl-sprintf> + <gl-sprintf :message="suggestContent" /> + <div class="mt-3"> + <gl-sprintf :message="suggestFooter"> + <template #bold="{ content }"> + <strong> {{ content }} </strong> + </template> + </gl-sprintf> + </div> </gl-popover> </template> diff --git a/app/assets/javascripts/blob/viewer/index.js b/app/assets/javascripts/blob/viewer/index.js index 3ac419557eb..b18faea628a 100644 --- a/app/assets/javascripts/blob/viewer/index.js +++ b/app/assets/javascripts/blob/viewer/index.js @@ -3,6 +3,7 @@ import '~/behaviors/markdown/render_gfm'; import Flash from '../../flash'; import { handleLocationHash } from '../../lib/utils/common_utils'; import axios from '../../lib/utils/axios_utils'; +import eventHub from '../../notes/event_hub'; import { __ } from '~/locale'; const loadRichBlobViewer = type => { @@ -178,6 +179,10 @@ export default class BlobViewer { viewer.innerHTML = data.html; viewer.setAttribute('data-loaded', 'true'); + if (window.gon?.features?.codeNavigation) { + eventHub.$emit('showBlobInteractionZones', viewer.dataset.path); + } + return viewer; }); } |