diff --git a/public/css/otalk.css b/public/css/otalk.css index 8fc458c..fe758ab 100644 --- a/public/css/otalk.css +++ b/public/css/otalk.css @@ -558,6 +558,7 @@ button.secondary:hover:not(:disabled) { left: 0px; width: 200px; background-color: #0b1316; + border-right: 1px solid #eee; z-index: 300; overflow-y: auto; overflow-x: hidden; @@ -1052,7 +1053,8 @@ button.secondary:hover:not(:disabled) { padding: 0px; overflow-y: auto; overflow-x: hidden; - position: fixed; + position: absolute; + width: 100%; top: 0px; bottom: 55px; padding-top: 75px; @@ -1507,12 +1509,19 @@ rgba(0,0,0,0.7) white-space: nowrap; overflow: hidden; text-overflow: ellipsis; + transition: all 0.25s; } #me .status:before { content: '-'; padding-left: 5px; padding-right: 5px; } +#me .status:empty { + font-style: italic; +} +#me .status:empty:before { + content: '- Update your status'; +} #me .name:focus, #me .status:focus { background-color: #fffcea; diff --git a/public/css/pages/chat.styl b/public/css/pages/chat.styl index c103d38..f6edb43 100644 --- a/public/css/pages/chat.styl +++ b/public/css/pages/chat.styl @@ -173,7 +173,8 @@ padding: 0px overflow-y: auto overflow-x: hidden - position: fixed + position: absolute + width: 100% top: 0px bottom: 55px padding-top: 75px diff --git a/public/css/pages/header.styl b/public/css/pages/header.styl index 4d1a9d5..71e79b1 100644 --- a/public/css/pages/header.styl +++ b/public/css/pages/header.styl @@ -43,11 +43,19 @@ overflow: hidden text-overflow: ellipsis + transition: all .25s + &:before content: '-' padding-left: 5px padding-right: 5px + &:empty + font-style: italic + + &:before + content: '- Update your status' + .name, .status &:focus diff --git a/public/css/pages/roster.styl b/public/css/pages/roster.styl index a2200ba..e3af68a 100644 --- a/public/css/pages/roster.styl +++ b/public/css/pages/roster.styl @@ -8,6 +8,7 @@ left: 0px width: 200px background-color: $blue-saturated-darker + border-right: 1px solid $gray-lighter z-index: 300 overflow-y: auto; overflow-x: hidden;