mirror of
https://github.com/Poniverse/Pony.fm.git
synced 2024-11-26 23:07:59 +01:00
Updated nav and fixed cross origin bug
This commit is contained in:
parent
b98a776db7
commit
1edff69571
4 changed files with 25 additions and 20 deletions
|
@ -30,6 +30,8 @@ module.exports = angular.module('ponyfm').controller "artist", [
|
||||||
|
|
||||||
tempImg = document.createElement('img')
|
tempImg = document.createElement('img')
|
||||||
tempImg.setAttribute 'src', artistResponse.artist.avatars.small
|
tempImg.setAttribute 'src', artistResponse.artist.avatars.small
|
||||||
|
tempImg.setAttribute 'crossOrigin', ''
|
||||||
|
tempImg.crossOrigin = 'Anonymous'
|
||||||
tempImg.addEventListener 'load', ->
|
tempImg.addEventListener 'load', ->
|
||||||
colorThief = new ColorThief();
|
colorThief = new ColorThief();
|
||||||
palette = colorThief.getPalette(tempImg, 2)
|
palette = colorThief.getPalette(tempImg, 2)
|
||||||
|
|
2
resources/assets/styles/content.less
vendored
2
resources/assets/styles/content.less
vendored
|
@ -644,7 +644,7 @@ html {
|
||||||
top: 64px;
|
top: 64px;
|
||||||
right: -410px;
|
right: -410px;
|
||||||
width: 400px;
|
width: 400px;
|
||||||
height: ~"calc(100% - 64px)";
|
height: ~"calc(100% - 128px)";
|
||||||
z-index: 500;
|
z-index: 500;
|
||||||
background: #eee;
|
background: #eee;
|
||||||
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
|
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
|
||||||
|
|
35
resources/assets/styles/mobile.less
vendored
35
resources/assets/styles/mobile.less
vendored
|
@ -42,6 +42,13 @@
|
||||||
|
|
||||||
.burger-wrapper {
|
.burger-wrapper {
|
||||||
display: block;
|
display: block;
|
||||||
|
top: 15px;
|
||||||
|
left: 15px;
|
||||||
|
|
||||||
|
i {
|
||||||
|
font-size: 32px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
|
@ -101,7 +108,11 @@
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 60px;
|
left: 60px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
padding: 16px 7px;
|
padding: 13px 7px 18px;
|
||||||
|
|
||||||
|
i {
|
||||||
|
font-size: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
&:hover, &:focus, &:active {
|
&:hover, &:focus, &:active {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
@ -115,6 +126,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
input.search-input {
|
input.search-input {
|
||||||
|
background: lighten(@pfm-logo-purple, 10%);
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -335,9 +347,7 @@
|
||||||
|
|
||||||
.notification-pullout {
|
.notification-pullout {
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 108px;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: ~"calc(100% - 172px)";
|
|
||||||
transform: translateY(-120%) translateZ(0);
|
transform: translateY(-120%) translateZ(0);
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
|
@ -352,13 +362,13 @@
|
||||||
.notification-menu {
|
.notification-menu {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
right: 53px !important;
|
right: 60px !important;
|
||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
margin-right: 0 !important;
|
margin-right: 0 !important;
|
||||||
margin-top: 16px !important;
|
margin-top: 12px !important;
|
||||||
|
|
||||||
a {
|
a {
|
||||||
padding: 17px 7px;
|
padding: 13px 7px 22px;
|
||||||
}
|
}
|
||||||
|
|
||||||
a, a:active, a:hover, a:focus {
|
a, a:active, a:hover, a:focus {
|
||||||
|
@ -447,14 +457,10 @@
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.burger-wrapper {
|
|
||||||
top: 23px;
|
|
||||||
left: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.notification-menu {
|
.notification-menu {
|
||||||
top: 0;
|
top: 0;
|
||||||
right: 54px;
|
right: 55px !important;
|
||||||
|
margin-top: 14px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.top-bar .logo {
|
.top-bar .logo {
|
||||||
|
@ -471,11 +477,12 @@
|
||||||
.search-button {
|
.search-button {
|
||||||
right: 90px;
|
right: 90px;
|
||||||
left: initial;
|
left: initial;
|
||||||
|
padding: 15px 7px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.top-bar .burger-wrapper {
|
.top-bar .burger-wrapper {
|
||||||
top: 22px;
|
top: 17px;
|
||||||
left: 16px;
|
left: 11px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.albums-listing, .playlists-listing, .users-listing {
|
.albums-listing, .playlists-listing, .users-listing {
|
||||||
|
|
|
@ -44,11 +44,7 @@
|
||||||
<header>
|
<header>
|
||||||
<div class="top-bar">
|
<div class="top-bar">
|
||||||
<div class="burger-wrapper" ng-click="menuToggle()">
|
<div class="burger-wrapper" ng-click="menuToggle()">
|
||||||
<div class="burger">
|
<i class="material-icons">menu</i>
|
||||||
<div class="bun-top"></div>
|
|
||||||
<div class="meat"></div>
|
|
||||||
<div class="bun-bottom"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<a href="/" class="logo"><img class="default-logo" src="/images/ponyfm-logo-white.svg"><img class="small-logo" src="/images/ponyfm-logo-white-nodisc.svg"></a>
|
<a href="/" class="logo"><img class="default-logo" src="/images/ponyfm-logo-white.svg"><img class="small-logo" src="/images/ponyfm-logo-white-nodisc.svg"></a>
|
||||||
<pfm-search></pfm-search>
|
<pfm-search></pfm-search>
|
||||||
|
|
Loading…
Reference in a new issue