Skip to content

G
gitlab-ce
Commit ef3ad5dc authored by Phil Hughes's avatar Phil Hughes
Browse files
Options

Merge branch 'terraform-widget-ui-polish' into 'master' 

Terraform MR widget UI polish

See merge request gitlab-org/gitlab!84627
parents f5263a69 a60b4712
Hide whitespace changes
Inline Side-by-side
Showing with 148 additions and 122 deletions
app/assets/javascripts/vue_merge_request_widget/components/extensions/child_content.vue
View file @ ef3ad5dc
...@@ -55,19 +55,21 @@ export default { ...@@ -55,19 +55,21 @@ export default {
<div class="gl-display-flex"> <div class="gl-display-flex">
<status-icon v-if="data.icon" :icon-name="data.icon.name" :size="12" class="gl-pl-0" /> <status-icon v-if="data.icon" :icon-name="data.icon.name" :size="12" class="gl-pl-0" />
<div class="gl-w-full"> <div class="gl-w-full">
<div class="gl-flex-wrap gl-display-flex gl-w-full"> <div class="gl-display-flex gl-flex-nowrap">
<div class="gl-mr-4 gl-display-flex gl-align-items-center"> <div class="gl-flex-wrap gl-display-flex gl-w-full">
<p v-safe-html="generateText(data.text)" class="gl-m-0"></p> <div class="gl-mr-4 gl-display-flex gl-align-items-center">
<p v-safe-html="generateText(data.text)" class="gl-m-0"></p>
</div>
<div v-if="data.link">
<gl-link :href="data.link.href">{{ data.link.text }}</gl-link>
</div>
<div v-if="data.supportingText">
<p v-safe-html="generateText(data.supportingText)" class="gl-m-0"></p>
</div>
<gl-badge v-if="data.badge" :variant="data.badge.variant || 'info'">
{{ data.badge.text }}
</gl-badge>
</div> </div>
<div v-if="data.link">
<gl-link :href="data.link.href">{{ data.link.text }}</gl-link>
</div>
<div v-if="data.supportingText">
<p v-safe-html="generateText(data.supportingText)" class="gl-m-0"></p>
</div>
<gl-badge v-if="data.badge" :variant="data.badge.variant || 'info'">
{{ data.badge.text }}
</gl-badge>
<actions :widget="widgetLabel" :tertiary-buttons="data.actions" class="gl-ml-auto" /> <actions :widget="widgetLabel" :tertiary-buttons="data.actions" class="gl-ml-auto" />
</div> </div>
<p <p
......
app/assets/javascripts/vue_merge_request_widget/components/extensions/utils.js
View file @ ef3ad5dc
...@@ -32,7 +32,7 @@ const textStyleTags = { ...@@ -32,7 +32,7 @@ const textStyleTags = {
[getStartTag('critical')]: '<span class="gl-font-weight-bold gl-text-red-800">', [getStartTag('critical')]: '<span class="gl-font-weight-bold gl-text-red-800">',
[getStartTag('same')]: '<span class="gl-font-weight-bold gl-text-gray-700">', [getStartTag('same')]: '<span class="gl-font-weight-bold gl-text-gray-700">',
[getStartTag('strong')]: '<span class="gl-font-weight-bold">', [getStartTag('strong')]: '<span class="gl-font-weight-bold">',
[getStartTag('small')]: '<span class="gl-font-sm">', [getStartTag('small')]: '<span class="gl-font-sm gl-text-gray-700">',
}; };
export const generateText = (text) => { export const generateText = (text) => {
......
ee/spec/frontend/vue_mr_widget/extensions/license_compliance/__snapshots__/index_spec.js.snap
View file @ ef3ad5dc
...@@ -28,24 +28,28 @@ exports[`License Compliance extension expanded data with new licesnes displays a ...@@ -28,24 +28,28 @@ exports[`License Compliance extension expanded data with new licesnes displays a
class="gl-w-full" class="gl-w-full"
> >
<div <div
class="gl-flex-wrap gl-display-flex gl-w-full" class="gl-display-flex gl-flex-nowrap"
> >
<div <div
class="gl-mr-4 gl-display-flex gl-align-items-center" class="gl-flex-wrap gl-display-flex gl-w-full"
> >
<p <div
class="gl-m-0" class="gl-mr-4 gl-display-flex gl-align-items-center"
> >
Acceptable for use in this project <p
</p> class="gl-m-0"
>
Acceptable for use in this project
</p>
</div>
<!---->
<!---->
<!---->
</div> </div>
<!---->
<!---->
<!---->
<div <div
class="gl-ml-auto" class="gl-ml-auto"
> >
...@@ -91,36 +95,40 @@ exports[`License Compliance extension expanded data with new licesnes displays a ...@@ -91,36 +95,40 @@ exports[`License Compliance extension expanded data with new licesnes displays a
class="gl-w-full" class="gl-w-full"
> >
<div <div
class="gl-flex-wrap gl-display-flex gl-w-full" class="gl-display-flex gl-flex-nowrap"
> >
<div <div
class="gl-mr-4 gl-display-flex gl-align-items-center" class="gl-flex-wrap gl-display-flex gl-w-full"
> >
<p <div
class="gl-m-0" class="gl-mr-4 gl-display-flex gl-align-items-center"
/>
</div>
<div>
<a
class="gl-link"
href="https://opensource.org/licenses/ISC"
>
ISC License
</a>
</div>
<div>
<p
class="gl-m-0"
> >
<p
Used by abbrev, anymatch class="gl-m-0"
</p> />
</div>
<div>
<a
class="gl-link"
href="https://opensource.org/licenses/ISC"
>
ISC License
</a>
</div>
<div>
<p
class="gl-m-0"
>
Used by abbrev, anymatch
</p>
</div>
<!---->
</div> </div>
<!---->
<div <div
class="gl-ml-auto" class="gl-ml-auto"
> >
...@@ -171,24 +179,28 @@ exports[`License Compliance extension expanded data with new licesnes displays d ...@@ -171,24 +179,28 @@ exports[`License Compliance extension expanded data with new licesnes displays d
class="gl-w-full" class="gl-w-full"
> >
<div <div
class="gl-flex-wrap gl-display-flex gl-w-full" class="gl-display-flex gl-flex-nowrap"
> >
<div <div
class="gl-mr-4 gl-display-flex gl-align-items-center" class="gl-flex-wrap gl-display-flex gl-w-full"
> >
<p <div
class="gl-m-0" class="gl-mr-4 gl-display-flex gl-align-items-center"
> >
Out-of-compliance with the project's policies and should be removed <p
</p> class="gl-m-0"
>
Out-of-compliance with the project's policies and should be removed
</p>
</div>
<!---->
<!---->
<!---->
</div> </div>
<!---->
<!---->
<!---->
<div <div
class="gl-ml-auto" class="gl-ml-auto"
> >
...@@ -234,36 +246,40 @@ exports[`License Compliance extension expanded data with new licesnes displays d ...@@ -234,36 +246,40 @@ exports[`License Compliance extension expanded data with new licesnes displays d
class="gl-w-full" class="gl-w-full"
> >
<div <div
class="gl-flex-wrap gl-display-flex gl-w-full" class="gl-display-flex gl-flex-nowrap"
> >
<div <div
class="gl-mr-4 gl-display-flex gl-align-items-center" class="gl-flex-wrap gl-display-flex gl-w-full"
> >
<p <div
class="gl-m-0" class="gl-mr-4 gl-display-flex gl-align-items-center"
/>
</div>
<div>
<a
class="gl-link"
href="https://opensource.org/licenses/Apache-2.0"
>
Apache License 2.0
</a>
</div>
<div>
<p
class="gl-m-0"
> >
<p
Used by websocket-driver, websocket-extensions, xml-name-validator class="gl-m-0"
</p> />
</div>
<div>
<a
class="gl-link"
href="https://opensource.org/licenses/Apache-2.0"
>
Apache License 2.0
</a>
</div>
<div>
<p
class="gl-m-0"
>
Used by websocket-driver, websocket-extensions, xml-name-validator
</p>
</div>
<!---->
</div> </div>
<!---->
<div <div
class="gl-ml-auto" class="gl-ml-auto"
> >
...@@ -314,24 +330,28 @@ exports[`License Compliance extension expanded data with new licesnes displays u ...@@ -314,24 +330,28 @@ exports[`License Compliance extension expanded data with new licesnes displays u
class="gl-w-full" class="gl-w-full"
> >
<div <div
class="gl-flex-wrap gl-display-flex gl-w-full" class="gl-display-flex gl-flex-nowrap"
> >
<div <div
class="gl-mr-4 gl-display-flex gl-align-items-center" class="gl-flex-wrap gl-display-flex gl-w-full"
> >
<p <div
class="gl-m-0" class="gl-mr-4 gl-display-flex gl-align-items-center"
> >
No policy matches this license <p
</p> class="gl-m-0"
>
No policy matches this license
</p>
</div>
<!---->
<!---->
<!---->
</div> </div>
<!---->
<!---->
<!---->
<div <div
class="gl-ml-auto" class="gl-ml-auto"
> >
...@@ -377,36 +397,40 @@ exports[`License Compliance extension expanded data with new licesnes displays u ...@@ -377,36 +397,40 @@ exports[`License Compliance extension expanded data with new licesnes displays u
class="gl-w-full" class="gl-w-full"
> >
<div <div
class="gl-flex-wrap gl-display-flex gl-w-full" class="gl-display-flex gl-flex-nowrap"
> >
<div <div
class="gl-mr-4 gl-display-flex gl-align-items-center" class="gl-flex-wrap gl-display-flex gl-w-full"
> >
<p <div
class="gl-m-0" class="gl-mr-4 gl-display-flex gl-align-items-center"
/>
</div>
<div>
<a
class="gl-link"
href="http://opensource.linux-mirror.org/licenses/afl-2.1.txt"
> >
Academic Free License v2.1 <p
</a> class="gl-m-0"
</div> />
</div>
<div>
<p <div>
class="gl-m-0" <a
> class="gl-link"
href="http://opensource.linux-mirror.org/licenses/afl-2.1.txt"
Used by json-schema >
</p> Academic Free License v2.1
</a>
</div>
<div>
<p
class="gl-m-0"
>
Used by json-schema
</p>
</div>
<!---->
</div> </div>
<!---->
<div <div
class="gl-ml-auto" class="gl-ml-auto"
> >
......
spec/frontend/vue_mr_widget/components/extensions/utils_spec.js
View file @ ef3ad5dc
...@@ -8,7 +8,7 @@ describe('generateText', () => { ...@@ -8,7 +8,7 @@ describe('generateText', () => {
${'%{danger_start}Hello world%{danger_end}'} | ${'<span class="gl-font-weight-bold gl-text-red-500">Hello world</span>'} ${'%{danger_start}Hello world%{danger_end}'} | ${'<span class="gl-font-weight-bold gl-text-red-500">Hello world</span>'}
${'%{critical_start}Hello world%{critical_end}'} | ${'<span class="gl-font-weight-bold gl-text-red-800">Hello world</span>'} ${'%{critical_start}Hello world%{critical_end}'} | ${'<span class="gl-font-weight-bold gl-text-red-800">Hello world</span>'}
${'%{same_start}Hello world%{same_end}'} | ${'<span class="gl-font-weight-bold gl-text-gray-700">Hello world</span>'} ${'%{same_start}Hello world%{same_end}'} | ${'<span class="gl-font-weight-bold gl-text-gray-700">Hello world</span>'}
${'%{small_start}Hello world%{small_end}'} | ${'<span class="gl-font-sm">Hello world</span>'} ${'%{small_start}Hello world%{small_end}'} | ${'<span class="gl-font-sm gl-text-gray-700">Hello world</span>'}
${'%{strong_start}%{danger_start}Hello world%{danger_end}%{strong_end}'} | ${'<span class="gl-font-weight-bold"><span class="gl-font-weight-bold gl-text-red-500">Hello world</span></span>'} ${'%{strong_start}%{danger_start}Hello world%{danger_end}%{strong_end}'} | ${'<span class="gl-font-weight-bold"><span class="gl-font-weight-bold gl-text-red-500">Hello world</span></span>'}
${'%{no_exist_start}Hello world%{no_exist_end}'} | ${'Hello world'} ${'%{no_exist_start}Hello world%{no_exist_end}'} | ${'Hello world'}
${['array']} | ${null} ${['array']} | ${null}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7