Improve background color specification (#14176)
This commit is contained in:
parent
52d8a54fc7
commit
679318541a
2 changed files with 4 additions and 4 deletions
|
@ -48,7 +48,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import { computed, ref, watch, type StyleValue } from 'vue';
|
||||
import tinycolor from 'tinycolor2';
|
||||
import * as os from '@/os.js';
|
||||
import { misskeyApi } from '@/scripts/misskey-api.js';
|
||||
|
@ -102,10 +102,10 @@ function fetchDriveInfo(): void {
|
|||
});
|
||||
}
|
||||
|
||||
function genUsageBar(fsize: number): object {
|
||||
function genUsageBar(fsize: number): StyleValue {
|
||||
return {
|
||||
width: `${fsize / usage.value * 100}%`,
|
||||
background: tinycolor({ h: 180 - (fsize / usage.value * 180), s: 0.7, l: 0.5 }),
|
||||
background: tinycolor({ h: 180 - (fsize / usage.value * 180), s: 0.7, l: 0.5 }).toHslString(),
|
||||
};
|
||||
}
|
||||
|
||||
|
|
|
@ -95,7 +95,7 @@ const meterStyle = computed(() => {
|
|||
h: 180 - (usage.value / capacity.value * 180),
|
||||
s: 0.7,
|
||||
l: 0.5,
|
||||
}),
|
||||
}).toHslString(),
|
||||
};
|
||||
});
|
||||
|
||||
|
|
Loading…
Reference in a new issue