From 4fee964dee221987ccfa53791f1730ffb89cec12 Mon Sep 17 00:00:00 2001 From: Zaran Date: Fri, 20 Apr 2012 01:12:08 -0700 Subject: More style changes. * titlebar has now a sligh 3D effect * restyling of the roster (the big "vision") * contacts now have an icon on their left depending on their status * adding font-awesome to the project (can be used transparently with bootstrap icons system) --- alias-angular/app/css/app.less | 58 ++++++++++++++++++++++++++++++++++-------- 1 file changed, 48 insertions(+), 10 deletions(-) (limited to 'alias-angular/app/css/app.less') diff --git a/alias-angular/app/css/app.less b/alias-angular/app/css/app.less index 589d9ba..5006542 100644 --- a/alias-angular/app/css/app.less +++ b/alias-angular/app/css/app.less @@ -1,26 +1,64 @@ @import "less/mixins.less"; +@border-gray: #D6D6D6; +@background-gray: #F5F5F5; + +html, body{ + height: 100%; +} + #roster{ + min-height: 100%; + float: left; width: 250px; + background-color: @background-gray; + border: 1px solid @border-gray; ul{ - list-style:none; - padding:0; - margin:0; + list-style: none; + padding: 0; + margin: 0; } - + li{ - background-color: #F4F3F1; - border-bottom: 1px solid #E0E0E0; - border-top: 1px solid white; - border-right: 4px solid #c8c8c8; + background-color: white; + border-bottom: 1px solid @border-gray; padding: 0; margin: 0; padding: 1em 1em; color: #363636; - .transition(0.5s); + .transition(0.3s); + &:hover{ - background-color: white; + background-color: @background-gray; + } + + &:first-child{ + border-top: 1px solid @border-gray; + } + + i{ + font-size:120%; + } + + .online{ + color: #3D9940; + } + + .away{ + color: #D9B232; } } } + +#rostersearch{ + margin: 10px; +} + +#titlebar{ + border-bottom:1px solid @border-gray; + padding:10px; + #gradient > .vertical(@background-gray,#EDEDED); + margin-bottom:20px; +} + -- cgit v1.2.3-70-g09d2