Remove unused avatar sizes
- Update avatars to use only sizes from the 8px grid
This commit is contained in:
parent
b9798c157a
commit
cc8e7ea205
|
@ -69,7 +69,7 @@ export default {
|
|||
:link-href="authorUrl"
|
||||
:img-src="authorAvatar"
|
||||
:img-alt="authorName"
|
||||
:img-size="36"
|
||||
:img-size="40"
|
||||
class="avatar-cell d-none d-sm-block"
|
||||
/>
|
||||
<div class="commit-detail flex-list">
|
||||
|
|
|
@ -7,9 +7,6 @@ $avatar-sizes: (
|
|||
18: (
|
||||
border-radius: $border-radius-small
|
||||
),
|
||||
19: (
|
||||
border-radius: $border-radius-small
|
||||
),
|
||||
20: (
|
||||
border-radius: $border-radius-small
|
||||
),
|
||||
|
@ -28,17 +25,11 @@ $avatar-sizes: (
|
|||
line-height: 32px,
|
||||
border-radius: $border-radius-default
|
||||
),
|
||||
36: (
|
||||
border-radius: $border-radius-default
|
||||
),
|
||||
40: (
|
||||
font-size: 16px,
|
||||
line-height: 38px,
|
||||
border-radius: $border-radius-default
|
||||
),
|
||||
46: (
|
||||
border-radius: $border-radius-default
|
||||
),
|
||||
48: (
|
||||
font-size: 20px,
|
||||
line-height: 48px,
|
||||
|
@ -54,37 +45,16 @@ $avatar-sizes: (
|
|||
line-height: 64px,
|
||||
border-radius: $border-radius-large
|
||||
),
|
||||
70: (
|
||||
font-size: 34px,
|
||||
line-height: 70px,
|
||||
border-radius: $border-radius-large
|
||||
),
|
||||
90: (
|
||||
font-size: 36px,
|
||||
line-height: 88px,
|
||||
border-radius: $border-radius-large
|
||||
),
|
||||
96: (
|
||||
font-size: 48px,
|
||||
line-height: 96px,
|
||||
border-radius: $border-radius-large
|
||||
),
|
||||
100: (
|
||||
font-size: 36px,
|
||||
line-height: 98px,
|
||||
border-radius: $border-radius-large
|
||||
),
|
||||
110: (
|
||||
font-size: 40px,
|
||||
line-height: 108px,
|
||||
font-weight: $gl-font-weight-normal,
|
||||
border-radius: $border-radius-large
|
||||
),
|
||||
140: (
|
||||
font-size: 72px,
|
||||
line-height: 138px,
|
||||
border-radius: $border-radius-large
|
||||
),
|
||||
160: (
|
||||
font-size: 96px,
|
||||
line-height: 158px,
|
||||
|
@ -97,13 +67,13 @@ $identicon-backgrounds: $identicon-red, $identicon-purple, $identicon-indigo, $i
|
|||
|
||||
.avatar-circle {
|
||||
float: left;
|
||||
margin-right: 15px;
|
||||
margin-right: $gl-padding;
|
||||
border-radius: $avatar-radius;
|
||||
border: 1px solid $gray-normal;
|
||||
|
||||
@each $size, $size-config in $avatar-sizes {
|
||||
&.s#{$size} {
|
||||
@include avatar-size(#{$size}px, if($size < 36, 8px, 16px));
|
||||
@include avatar-size(#{$size}px, if($size < 48, 8px, 16px));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -154,8 +154,6 @@
|
|||
}
|
||||
|
||||
.avatar-cell {
|
||||
width: 46px;
|
||||
|
||||
img {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
|
|
@ -15,7 +15,7 @@
|
|||
%li.commit.flex-row.js-toggle-container{ id: "commit-#{commit.short_id}" }
|
||||
|
||||
.avatar-cell.d-none.d-sm-block
|
||||
= author_avatar(commit, size: 36, has_tooltip: false)
|
||||
= author_avatar(commit, size: 40, has_tooltip: false)
|
||||
|
||||
.commit-detail.flex-list
|
||||
.commit-content.qa-commit-content
|
||||
|
|
|
@ -8,7 +8,7 @@ import getDiffWithCommit from '../mock_data/diff_with_commit';
|
|||
|
||||
const TEST_AUTHOR_NAME = 'test';
|
||||
const TEST_AUTHOR_EMAIL = 'test+test@gitlab.com';
|
||||
const TEST_AUTHOR_GRAVATAR = `${TEST_HOST}/avatar/test?s=36`;
|
||||
const TEST_AUTHOR_GRAVATAR = `${TEST_HOST}/avatar/test?s=40`;
|
||||
const TEST_SIGNATURE_HTML = '<a>Legit commit</a>';
|
||||
const TEST_PIPELINE_STATUS_PATH = `${TEST_HOST}/pipeline/status`;
|
||||
|
||||
|
@ -65,7 +65,7 @@ describe('diffs/components/commit_item', () => {
|
|||
const imgElement = avatarElement.querySelector('img');
|
||||
|
||||
expect(avatarElement).toHaveAttr('href', commit.author.web_url);
|
||||
expect(imgElement).toHaveClass('s36');
|
||||
expect(imgElement).toHaveClass('s40');
|
||||
expect(imgElement).toHaveAttr('alt', commit.author.name);
|
||||
expect(imgElement).toHaveAttr('src', commit.author.avatar_url);
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue