Improve background color specification (#14176)
This commit is contained in:
parent
52d8a54fc7
commit
679318541a
|
@ -48,7 +48,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, ref, watch } from 'vue';
|
import { computed, ref, watch, type StyleValue } from 'vue';
|
||||||
import tinycolor from 'tinycolor2';
|
import tinycolor from 'tinycolor2';
|
||||||
import * as os from '@/os.js';
|
import * as os from '@/os.js';
|
||||||
import { misskeyApi } from '@/scripts/misskey-api.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 {
|
return {
|
||||||
width: `${fsize / usage.value * 100}%`,
|
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),
|
h: 180 - (usage.value / capacity.value * 180),
|
||||||
s: 0.7,
|
s: 0.7,
|
||||||
l: 0.5,
|
l: 0.5,
|
||||||
}),
|
}).toHslString(),
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue