Fill chip media propotationally to confidence value (#156)

Signed-off-by: Justin Georgi <justin.georgi@gmail.com>
Reviewed-on: #156
This commit is contained in:
2024-03-27 19:20:10 -07:00
parent e8778f3e24
commit ecdf74a483
3 changed files with 5 additions and 3 deletions

View File

@@ -39,7 +39,8 @@
} }
.chip-media { .chip-media {
background-color: var(--chip-media-background) !important; /*background-color: var(--chip-media-background) !important;*/
background: var(--chip-media-gradient) !important;
} }
.chip-results { .chip-results {

View File

@@ -258,7 +258,8 @@
}, },
methods: { methods: {
chipGradient (confVal) { chipGradient (confVal) {
return `--chip-media-background: hsl(${confVal / 100 * 120}deg 100% 50%)` let confFactor = confVal / 100
return `--chip-media-gradient: conic-gradient(from ${270 - (confFactor * 360 / 2)}deg, hsl(${confFactor * 120}deg, 100%, 50%) ${confFactor}turn, hsl(${confFactor * 120}deg, 50%, 66%) ${confFactor}turn)`
}, },
async setData () { async setData () {
if (this.reloadModel) { if (this.reloadModel) {

View File

@@ -74,7 +74,7 @@
} }
.demo-chip .chip-media { .demo-chip .chip-media {
background: conic-gradient(from 180deg, #00cc00 .75turn, #00000000 .75turn); background: conic-gradient(from 135deg, #00cc00 .75turn, #00cc0088 .75turn) !important;
} }
</style> </style>