global.js

import { templates } from '@nousantx/tenoxui-utility-styles'

export const globalStyles = `
(body): fw-500 bg-slate-50 text-slate-950 [--ring-offset]-[0_0_0_0_transparent] [--ring-offset-width]-0px [--ring-color]-neutral-100 [--ring-offset-color]-neutral-950;
(.kenrod): bg-red-500 box-200px;
(.heading1): fw-600 fs-2.5rem family-poppins lh-1 ls--0.035em;
(.heading2): fw-500 fs-1.75rem family-poppins lh-1 ls--0.035em;
(.heading3): fw-500 fs-1.35rem family-poppins lh-1 ls--0.040em;
(.light): fw-600 text-slate-950;
(.code): fs-90% bg-slate-100 family-code px-4px py-2px br-4px mx-2px lh-1.6 text-slate-900;
(.code-block): mt-1rem p-1rem br-8px bg-slate-900 family-code tw-nowrap over-x-scroll text-green-400 fs-14px shadow-md lh-1.6;
(.var): text-rose-400;
(.tag, .content): text-slate-100;
(.attr): text-slate-200 italic;
(.comment): text-slate-500 italic;
(.string): text-green-400;
(.ch-ctr): absolute t-50% l-50% [transform]-[translate(-50%,_-50%)];

`