diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/nothing_to_merge.vue b/app/assets/javascripts/vue_merge_request_widget/components/states/nothing_to_merge.vue index 14a29483d3c0c0393c40331a5b662da38c8e36f0..f2fedd1de42c8804368def17b0ea6be05b851cad 100644 --- a/app/assets/javascripts/vue_merge_request_widget/components/states/nothing_to_merge.vue +++ b/app/assets/javascripts/vue_merge_request_widget/components/states/nothing_to_merge.vue @@ -1,9 +1,13 @@ <script> /* eslint-disable vue/no-v-html */ import emptyStateSVG from 'icons/_mr_widget_empty_state.svg'; +import { GlButton } from '@gitlab/ui'; export default { name: 'MRWidgetNothingToMerge', + components: { + GlButton, + }, props: { mr: { type: Object, @@ -25,11 +29,13 @@ export default { <span v-html="emptyStateSVG"></span> </div> <div class="text col-md-7 order-md-first col-12"> - <span>{{ - s__( - 'mrWidgetNothingToMerge|Merge requests are a place to propose changes you have made to a project and discuss those changes with others.', - ) - }}</span> + <p class="highlight"> + {{ + s__( + 'mrWidgetNothingToMerge|Merge requests are a place to propose changes you have made to a project and discuss those changes with others.', + ) + }} + </p> <p> {{ s__( @@ -45,9 +51,14 @@ export default { }} </p> <div> - <a v-if="mr.newBlobPath" :href="mr.newBlobPath" class="btn btn-inverted btn-success">{{ - __('Create file') - }}</a> + <gl-button + v-if="mr.newBlobPath" + :href="mr.newBlobPath" + category="secondary" + variant="success" + > + {{ __('Create file') }} + </gl-button> </div> </div> </div> diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss index 1a223ec0f730624e88268e1e0aed65f038d90bd4..58f8cf09780469936f816be9dd2de44bcbe34696 100644 --- a/app/assets/stylesheets/pages/merge_requests.scss +++ b/app/assets/stylesheets/pages/merge_requests.scss @@ -375,13 +375,14 @@ $mr-widget-min-height: 69px; } .text { - span { - font-weight: $gl-font-weight-bold; - } - p { margin-top: $gl-padding; } + + .highlight { + margin: 0 0 $gl-padding; + font-weight: $gl-font-weight-bold; + } } } diff --git a/changelogs/unreleased/yo-gl-button-create-file-mr.yml b/changelogs/unreleased/yo-gl-button-create-file-mr.yml new file mode 100644 index 0000000000000000000000000000000000000000..670edb8d8626acbfd5068d72e615ce965399bf27 --- /dev/null +++ b/changelogs/unreleased/yo-gl-button-create-file-mr.yml @@ -0,0 +1,5 @@ +--- +title: Apply GitLab UI for create file button in MR +merge_request: 51795 +author: Yogi (@yo) +type: other