1
0
mirror of https://github.com/moparisthebest/kaiwa synced 2024-11-26 03:02:25 -05:00

[ux] don't let usernames overflow, improve undread marker

This commit is contained in:
karolinaszczur 2013-09-21 18:47:44 +02:00
parent 10d6e8e75a
commit 176115be4e
2 changed files with 36 additions and 31 deletions

View File

@ -128,26 +128,28 @@
margin-left: 30px margin-left: 30px
line-height: 20px line-height: 20px
color: white color: white
text-overflow: ellipsis
overflow: hidden
width: 70%
.status .status
color: #ccc color: $textSecondary
font-size: $fontSmall font-size: $fontSmall-2px
font-style: italic margin: 0
font-weight: 600 margin-left: 30px
margin: 0px
margin-left: 40px &:not(:empty)
margin-top: -5px
.unread .unread
display: none display: none
color: white color: white
padding-left: 5px padding: 0 5px
padding-right: 5px roundall(20px)
roundall: 11px
position: absolute position: absolute
top: 20px top: 10px
left: 20px right: 15px
text-align: center text-align: center
font-weight: bold font-weight: bold
background-color: red background: $activeBlue
border: 1px solid white

View File

@ -413,35 +413,38 @@ td {
margin-left: 30px; margin-left: 30px;
line-height: 20px; line-height: 20px;
color: #fff; color: #fff;
text-overflow: ellipsis;
overflow: hidden;
width: 70%;
} }
#roster li .status, #roster li .status,
#bookmarks li .status { #bookmarks li .status {
color: #ccc; color: #b7b7b7;
font-size: 12px; font-size: $fontSmall-2px;
font-style: italic; margin: 0;
font-weight: 600; margin-left: 30px;
margin: 0px; }
margin-left: 40px; #roster li .status:not(:empty),
#bookmarks li .status:not(:empty) {
margin-top: -5px;
} }
#roster li .unread, #roster li .unread,
#bookmarks li .unread { #bookmarks li .unread {
display: none; display: none;
color: #fff; color: #fff;
padding-left: 5px; padding: 0 5px;
padding-right: 5px; -moz-border-radius: 20px;
-moz-border-radius: 11px; -webkit-border-radius: 20px;
-webkit-border-radius: 11px; -khtml-border-radius: 20px;
-khtml-border-radius: 11px; -o-border-radius: 20px;
-o-border-radius: 11px; -border-radius: 20px;
-border-radius: 11px; border-radius: 20px;
border-radius: 11px;
position: absolute; position: absolute;
top: 20px; top: 10px;
left: 20px; right: 15px;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
background-color: #f00; background: #00aeef;
border: 1px solid #fff;
} }
.page.chat { .page.chat {
padding-top: 0px; padding-top: 0px;