Fade out for long usernames.
This commit is contained in:
parent
45df995d7f
commit
035d10005a
@ -911,6 +911,9 @@ kbd {
|
||||
padding-right: 10px;
|
||||
text-align: right;
|
||||
width: 134px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#chat .text {
|
||||
@ -1810,6 +1813,25 @@ kbd {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@media (min-width: 480px) {
|
||||
/* Fade out for long usernames */
|
||||
|
||||
#chat .from {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
#chat .from:after {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
width: 10px;
|
||||
height: 100%;
|
||||
background: linear-gradient(to right, rgba(255, 255, 255, .5) 0%, rgba(255, 255, 255, 1) 100%);
|
||||
content: " ";
|
||||
}
|
||||
|
||||
/* End fade out for long usernames */
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
/**
|
||||
* TODO Replace this with `@media (hover: hover)` when Firefox supports it
|
||||
|
@ -253,3 +253,9 @@ body {
|
||||
}
|
||||
|
||||
/* End form elements */
|
||||
|
||||
@media (min-width: 480px) {
|
||||
#chat .from:after {
|
||||
background: linear-gradient(to right, rgba(51, 60, 74, .5) 0%, rgba(51, 60, 74, 1) 100%);
|
||||
}
|
||||
}
|
||||
|
@ -279,3 +279,9 @@ body {
|
||||
}
|
||||
|
||||
/* End form elements */
|
||||
|
||||
@media (min-width: 480px) {
|
||||
#chat .from:after {
|
||||
background: linear-gradient(to right, rgba(63, 63, 63, .5) 0%, rgba(63, 63, 63, 1) 100%);
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user