imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

set pill avatar through css variables to set on psuedo-element

Browse source 
this way it won't interfere with editor selection/caret
This commit is contained in:
Bruno Windels 2019-05-17 19:49:46 +01:00
parent 710338c01f
commit 3b598a1782
2 changed files with 31 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

17
res/css/views/elements/_MessageEditor.scss
View file

@ -45,8 +45,23 @@ limitations under the License.
display: inline-block;
color: $primary-fg-color;
background-color: $other-user-pill-bg-color;
padding-left: 5px;
padding-left: 21px;
padding-right: 5px;
position: relative;
&::before {
position: absolute;
left: 2px;
top: 2px;
content: var(--avatar-letter);
width: 16px;
height: 16px;
background: var(--avatar-background); //set on parent by JS
color: var(--avatar-color);
background-repeat: no-repeat;
background-size: 16px;
border-radius: 8px;
}
}
}