secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Follow button simpler load check; Glow on hover of buttons

Browse Source
This commit is contained in:
James Barnsley
2019-12-11 21:48:50 +13:00
parent 7d21cbdb08
commit 4aab1be5c5
9 changed files with 19469 additions and 27435 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/js/components/Fields/FollowButton.js
View File

@ -37,15 +37,12 @@ class FollowButton extends React.Component {
className += ' button';
if (helpers.isLoading(load_queue, [
'spotify_me/tracks/contains',
'spotify_me/tracks?',
'spotify_me/albums/contains',
'spotify_me/albums?',
'spotify_me/following/contains',
'spotify_me/following?',
`spotify_playlists/${helpers.getFromUri('playlistid', uri)}/followers/contains?`,
`spotify_playlists/${helpers.getFromUri('playlistid', uri)}/followers`,
`spotify_playlists/${helpers.getFromUri('playlistid', uri)}/followers?`,
])) {
console.log("LOADING")
className += ' button--working';
}

2
src/js/services/spotify/actions.js
View File

@ -757,7 +757,7 @@ export function following(uri, method = 'GET') {
if (method == 'GET') {
endpoint = `playlists/${helpers.getFromUri('playlistid', uri)}/followers/contains?ids=${getState().spotify.me.id}`;
} else {
endpoint = `playlists/${helpers.getFromUri('playlistid', uri)}/followers`;
endpoint = `playlists/${helpers.getFromUri('playlistid', uri)}/followers?`;
}
break;
default:

2
src/js/views/Debug.js
View File

@ -57,7 +57,7 @@ class Debug extends React.Component {
render() {
const options = (
<a className="button button--default button--no-hover" onClick={(e) => this.props.history.push('/settings')}>
<a className="button button--discrete button--no-hover" onClick={(e) => this.props.history.push('/settings')}>
<Icon name="keyboard_backspace" />
Back
</a>

4
src/js/views/Settings.js
View File

@ -149,11 +149,11 @@ class Settings extends React.Component {
const options = (
<span>
<a className="button button--default button--no-hover" onClick={(e) => history.push('/settings/debug')}>
<a className="button button--discrete button--no-hover" onClick={(e) => history.push('/settings/debug')}>
<Icon name="code" />
Debug
</a>
<a className="button button--default button--no-hover" href="https://github.com/jaedb/Iris/wiki" target="_blank">
<a className="button button--discrete button--no-hover" href="https://github.com/jaedb/Iris/wiki" target="_blank">
<Icon name="help" />
Help
</a>

40
src/scss/global/_forms.scss
View File

@ -220,6 +220,10 @@ select {
&:active {
background: rgba(128, 128, 128, 0.2);
}
&:hover {
box-shadow: 0 0 10px rgba(colour(darkest_grey), 0.3);
}
}
.dark-theme &--default {
@ -228,6 +232,10 @@ select {
&:active {
background: rgba(128, 128, 128, 0.2);
}
&:hover {
box-shadow: 0 0 10px rgba(colour(white), 0.5);
}
}
&--small {
@ -252,14 +260,26 @@ select {
background: darken(colour(turquoise), 10%);
border-color: darken(colour(turquoise), 10%);
}
&:hover {
box-shadow: 0 0 10px rgba(colour(turquoise), 0.5);
}
}
&--darken {
border-color: rgba(0, 0, 0, 0.8);
&:hover {
box-shadow: 0 0 10px rgba(colour(black), 0.3);
}
}
&--lighten {
border-color: rgba(255, 255, 255, 0.8);
&:hover {
box-shadow: 0 0 10px rgba(colour(white), 0.3);
}
}
&--secondary {
@ -269,6 +289,10 @@ select {
&:active {
background: darken(colour(blue), 10%);
}
&:hover {
box-shadow: 0 0 10px rgba(colour(blue), 0.5);
}
}
&--white {
@ -278,14 +302,26 @@ select {
&:active {
background: rgba(128, 128, 128, 0.2);
}
&:hover {
box-shadow: 0 0 10px rgba(colour(white), 0.5);
}
}
&--grey {
border-color: colour(grey);
&:hover {
box-shadow: 0 0 10px rgba(colour(grey), 0.5);
}
}
&--black {
border-color: colour(darkest_grey);
&:hover {
box-shadow: 0 0 10px rgba(colour(darkest_grey), 0.3);
}
}
&--confirming,
@ -296,6 +332,10 @@ select {
&:active {
background: rgba(128, 128, 128, 0.2);
}
&:hover {
box-shadow: 0 0 10px rgba(colour(red), 0.5);
}
}
&--timing-out {