a small incremental UI library for the web
javascript web ui
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

Scope CSS

garrison 5f235ba7 f918e851

+18 -3
+15 -1
js/css.ts
··· 35 35 state.output += (' {\n ' + body + '\n}\n\n'); 36 36 } 37 37 38 + export function scopeCSS(stylesheet, scope) { 39 + const scopeString = `[s-${scope}]`; 40 + 41 + for (const ruleset of stylesheet.rulesets) { 42 + for (const complexSelector of ruleset.selectorList.selectors) { 43 + for (const entry of complexSelector.entries) { 44 + if (entry.type === 'compound_selector') { 45 + entry.text += scopeString; 46 + } 47 + } 48 + } 49 + } 50 + } 51 + 38 52 export function parseCSS(input) { 39 53 const stylesheet = parseStylesheet(input); 40 54 return stylesheet; ··· 165 179 166 180 assert((state.pos - start) > 0); 167 181 return { 168 - type: 'simple_selector', 182 + type: 'compound_selector', 169 183 text: input.slice(start, state.pos), 170 184 }; 171 185 }
+3 -2
js/hooks.ts
··· 1 1 import { queueFiberTree } from './render.ts'; 2 2 import { getCurrentFiber } from './current.ts'; 3 3 import { pushSideEffect } from './effects.ts'; 4 - import { parseCSS, generateCSS } from './css.ts'; 4 + import { parseCSS, scopeCSS, generateCSS } from './css.ts'; 5 5 6 6 export const Hook = { 7 7 State: 'state', ··· 78 78 79 79 export function useStyle(text) { 80 80 const ast = parseCSS(text); 81 - generateCSS(ast); 81 + scopeCSS(ast, 'foobar'); 82 + const output = generateCSS(ast); 82 83 } 83 84 84 85 export function cleanUpEffects(fiber) {