discourse
/
discourse-assign
mirror of https://github.com/discourse/discourse-assign.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: fixing alignment issue (#432) 

* UX: fixing alignment issue
This commit is contained in:
chapoi 2023-01-23 18:47:00 +01:00 committed by GitHub
parent c036d030dc
commit 0d695df595
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
assets/javascripts/discourse/templates/components/assignee-chooser-row.hbs
View File

@ -1,15 +1,22 @@
{{#if this.item.isUser}}
{{avatar this.item imageSize="tiny"}}
<span class="identifier">{{format-username this.item.id}}</span>
<span class="name">{{this.item.name}}</span>
{{#if (and this.item.showUserStatus this.item.status)}}
<UserStatusMessage @status={{this.item.status}} @showDescription={{true}} />
{{/if}}
<div class="user-wrapper">
<span class="identifier">{{format-username this.item.id}}</span>
<span class="name">{{this.item.name}}</span>
{{#if (and this.item.showUserStatus this.item.status)}}
<UserStatusMessage
@status={{this.item.status}}
@showDescription={{true}}
/>
{{/if}}
</div>
{{decorate-username-selector this.item.id}}
{{else if this.item.isGroup}}
{{d-icon "users"}}
<span class="identifier">{{this.item.id}}</span>
<span class="name">{{this.item.full_name}}</span>
<div class="user-wrapper">
<span class="identifier">{{this.item.id}}</span>
<span class="name">{{this.item.full_name}}</span>
</div>
{{else}}
{{d-icon "envelope"}}
<span class="identifier">{{this.item.id}}</span>

20
assets/stylesheets/assigns.scss
View File

@ -87,6 +87,12 @@
color: var(--primary-medium);
}
.user-wrapper {
display: flex;
align-items: flex-end;
line-height: var(--line-height-small);
}
.name {
display: contents;
}
@ -96,23 +102,23 @@
}
.user-status-message {
color: var(--primary-medium);
font-size: var(--font-down-2);
margin-left: 0.5em;
.emoji {
height: var(--font-up-1);
width: var(--font-up-1);
height: var(--font-0);
width: var(--font-0);
}
}
.suggestions-label {
position: absolute;
right: 0;
top: 0;
margin: 0.25em 0.25em 0 0;
color: var(--primary-low-mid);
font-size: var(--font-down-2);
font-size: var(--font-down-3);
font-weight: bold;
margin-left: auto;
margin-right: -0.25em;
margin-top: -1em;
text-transform: uppercase;
}
}