show pixel equivalents in jit mode (fixes #332)

master
Brad Cornes 2021-05-20 13:24:16 +01:00
parent 0fc7b0aa5a
commit b8dc88d699
2 changed files with 8 additions and 3 deletions

View File

@ -1031,7 +1031,7 @@ export async function resolveCompletionItem(
if (rules.length === 0) return item if (rules.length === 0) return item
if (!item.detail) { if (!item.detail) {
if (rules.length === 1) { if (rules.length === 1) {
item.detail = jit.stringifyDecls(rules[0]) item.detail = await jit.stringifyDecls(state, rules[0])
} else { } else {
item.detail = `${rules.length} rules` item.detail = `${rules.length} rules`
} }

View File

@ -58,10 +58,15 @@ export function stringifyRules(state: State, rules: Rule[], tabSize: number = 2)
.replace(/^(?: )+/gm, (indent: string) => ' '.repeat((indent.length / 4) * tabSize)) .replace(/^(?: )+/gm, (indent: string) => ' '.repeat((indent.length / 4) * tabSize))
} }
export function stringifyDecls(rule: Rule): string { export async function stringifyDecls(state: State, rule: Rule, uri?: string): Promise<string> {
let settings = await state.editor.getConfiguration(uri)
let showPixelEquivalents = dlv(settings, 'tailwindCSS.showPixelEquivalents', true)
let rootFontSize = dlv(settings, 'tailwindCSS.rootFontSize', 16)
let result = [] let result = []
rule.walkDecls(({ prop, value }) => { rule.walkDecls(({ prop, value }) => {
result.push(`${prop}: ${value};`) let px = showPixelEquivalents ? remToPx(value, rootFontSize) : undefined
result.push(`${prop}: ${value}${px ? `/* ${px} */` : ''};`)
}) })
return result.join(' ') return result.join(' ')
} }