sarsoo/Selector
1
0
Fork 0
Code Issues 21 Pull Requests Actions Packages Projects Releases Wiki Activity

properly coloured radar chart, adding hover effects

Browse Source
This commit is contained in:
andy 2021-11-23 09:07:32 +00:00
parent 4952d6bb15
commit b1c1a756df
2 changed files with 22 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
Selector.Web/CSS/now.scss
View File

@ -9,6 +9,12 @@
padding: 15px;
box-shadow: 4px 4px 2px #5e5e5e;
transition: box-shadow 0.5s;
&:hover {
box-shadow: none;
offset: 4px 4px;
}
}
.now-playing-card {

27
Selector.Web/scripts/Now/Spotify.ts
View File

@ -43,7 +43,6 @@ export let AudioFeatureCard: Vue.Component = {
template:
`
<div class="card info-card">
<h3>Info</h3>
<h5>{{ Key }} {{ Mode }}</h5>
<h5>{{ feature.tempo }} BPM</h5>
<h5>{{ feature.timeSignature }}/4</h5>
@ -94,25 +93,31 @@ export let AudioFeatureChartCard: Vue.Component = {
type: "radar",
data: this.chartData,
options: {
// plugins: {
// legend: {
// labels: {
// color: "white"
// }
// }
// },
elements: {
line: {
borderWidth: 4
borderWidth: 4,
borderColor: "#3a3a3a",
backgroundColor: "#727272",
borderCapStyle: "round",
borderJoinStyle: "round"
},
point: {
radius: 4
radius: 4,
pointStyle: "circle",
borderColor: "black",
backgroundColor: "white"
}
},
scales: {
r: {
angleLines: {
display: false
display: true
},
pointLabels: {
color: 'white',
font: {
size: 12
}
},
beginAtZero: true,
suggestedMin: 0,