diff --git a/app/views/shared/_app_layout.blade.php b/app/views/shared/_app_layout.blade.php
index 1cab25e0..f69d8609 100644
--- a/app/views/shared/_app_layout.blade.php
+++ b/app/views/shared/_app_layout.blade.php
@@ -45,24 +45,24 @@
diff --git a/public/scripts/app/directives/share-buttons.coffee b/public/scripts/app/directives/share-buttons.coffee
index 43958f07..9a756ff0 100644
--- a/public/scripts/app/directives/share-buttons.coffee
+++ b/public/scripts/app/directives/share-buttons.coffee
@@ -2,5 +2,5 @@ angular.module('ponyfm').directive 'pfmShareButtons', () ->
(scope, element) ->
window.setTimeout((->
Tumblr.activate_share_on_tumblr_buttons()
- FB.XFBML.parse()
+ FB.XFBML.parse(null, -> element.addClass('loaded'))
), 0)
\ No newline at end of file
diff --git a/public/styles/content.less b/public/styles/content.less
index ec387d00..b48b8d67 100644
--- a/public/styles/content.less
+++ b/public/styles/content.less
@@ -145,7 +145,16 @@
}
.share-buttons {
+ .transition(opacity 250ms ease-out);
margin-top: 5px;
+ opacity: 0;
+ overflow: hidden;
+ height: 28px;
+
+ &.loaded {
+ opacity: 1;
+ overflow: visible;
+ }
.facebook, .twitter {
margin-top: 3px;
diff --git a/public/styles/layout.less b/public/styles/layout.less
index 9e640ec4..9c3ef1d2 100644
--- a/public/styles/layout.less
+++ b/public/styles/layout.less
@@ -19,7 +19,7 @@ header {
width: (@pfm-sidebar-size - 25);
height: 64px;
line-height: 52px;
- background: @pfm-purple;
+ background: #84528A;
color: #fff;
font-size: 24pt;
padding-left: 25px;
@@ -29,7 +29,7 @@ header {
font-family: 'Josefin Sans', sans-serif;
&:hover {
- background: darken(@pfm-purple, 25%);
+ background: darken(#84528A, 25%);
color: #fff;
text-decoration: none;
}
@@ -83,13 +83,14 @@ header {
.now-playing {
margin-left: @pfm-sidebar-size;
height: 64px;
- background: #eee;
+ background: #fff;
position: relative;
z-index: 500;
+ border-bottom: 1px solid #bcbcbc;
}
.sidebar {
- background: @pfm-light-grey;
+ background: #515151;
width: @pfm-sidebar-size;
height: 100%;
float: left;
@@ -119,7 +120,7 @@ header {
margin: 0px;
font-size: 10pt;
color: #eee;
- background: darken(@pfm-light-grey, 10%);
+ background: darken(#515151, 5%);
line-height: normal;
a {
diff --git a/public/styles/player.less b/public/styles/player.less
index 46b344d9..566776e4 100644
--- a/public/styles/player.less
+++ b/public/styles/player.less
@@ -19,13 +19,13 @@ body.is-logged {
padding: 1px;
img {
- .img-polaroid();
.box-shadow(none);
display: block;
width: 40px;
height: 40px;
- padding: 1px;
+ padding: 0px;
+ border: 1px solid #bcbcbc;
}
.loader {
@@ -77,15 +77,17 @@ body.is-logged {
}
.transport {
+ .border-radius(4px);
+
background: #aaa;
- height: 8px;
+ height: 5px;
position: relative;
cursor: pointer;
margin-top: 4px;
.bar {
z-index: 500;
- background: @pfm-purple;
+ background: #84528A;
}
.loader-bar {
@@ -94,6 +96,8 @@ body.is-logged {
}
.bar, .loader-bar {
+ .border-radius(4px);
+
position: absolute;
top: 0px;
left: 0px;