akanealw/misode.github.io
1
0
Fork 0
mirror of https://github.com/misode/misode.github.io.git synced 2026-04-23 23:27:09 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix converting colors with alpha to hex RGB (#705)
Some checks are pending
Deploy to GitHub Pages / build (push) Waiting to run
Details
Deploy to GitHub Pages / deploy (push) Blocked by required conditions
Details

Browse Source 
Convert negative integers to unsigned integers. Truncate the alpha from colors before passing them to the HTML color picker, since it doesn't allow alpha values (and they'd be in the wrong place if it did).
This commit is contained in:
Sol Toder
2025-02-22 09:14:57 -05:00
committed by GitHub
parent 6bf9fcb76e
commit 3f52a908a6
4 changed files with 20 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/components/generator/McdocRenderer.tsx
View File

@@ -14,7 +14,7 @@ import { useCallback, useEffect, useMemo, useState } from 'preact/hooks'
import config from '../../Config.js'
import { useLocale } from '../../contexts/Locale.jsx'
import { useFocus } from '../../hooks/useFocus.js'
import { generateColor, hexId, randomInt, randomSeed } from '../../Utils.js'
import { generateColor, hexId, intToHexRgb, randomInt, randomSeed } from '../../Utils.js'
import { Btn } from '../Btn.jsx'
import { ItemDisplay } from '../ItemDisplay.jsx'
import { Octicon } from '../Octicon.jsx'
@@ -196,7 +196,7 @@ function StringHead({ type, optional, excludeStrings, node, ctx }: Props<StringT
const onRandomColor = useCallback(() => {
const color = generateColor()
onChangeValue('#' + (color.toString(16).padStart(6, '0') ?? '000000'))
onChangeValue(intToHexRgb(color))
}, [onChangeValue])
return <>
@@ -341,7 +341,7 @@ function NumericHead({ type, node, ctx }: Props<NumericType>) {
return <>
<input class="short-input" type="number" value={value} onInput={(e) => setValue((e.target as HTMLInputElement).value)} onBlur={onCommitValue} onSubmit={onCommitValue} onKeyDown={(e) => {if (e.key === 'Enter') onCommitValue()}} />
{colorKind && <>
<input class="short-input" type="color" value={'#' + (nodeValue?.toString(16).padStart(6, '0') ?? '000000')} onChange={(e) => onChangeColor((e.target as HTMLInputElement).value)} />
<input class="short-input" type="color" value={intToHexRgb(nodeValue)} onChange={(e) => onChangeColor((e.target as HTMLInputElement).value)} />
<button class="tooltipped tip-se" aria-label={locale('generate_new_color')} onClick={onRandomColor}>{Octicon.sync}</button>
</>}
{random && <>