Ling0925
/
buster
mirror of https://github.com/buster-so/buster.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add in base css vars

This commit is contained in:
Nate Kelley 2025-08-01 17:25:36 -06:00
parent 4707a87c16
commit b5f8717b95
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
4 changed files with 46 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
apps/web/src/components/ui/report/Editor.tsx
View File

@ -29,14 +29,10 @@ const editorVariants = cva(
}, },
variant: { variant: {
ai: 'w-full px-0 text-base md:text-sm', ai: 'w-full px-0 text-base md:text-sm',
aiChat:
'max-h-[min(70vh,320px)] w-full max-w-[700px] overflow-y-auto px-3 py-2 text-base md:text-sm',
comment: cn('rounded-none border-none bg-transparent text-sm'), comment: cn('rounded-none border-none bg-transparent text-sm'),
default: 'size-full px-16 pt-4 pb-72 text-base sm:px-[max(64px,calc(50%-350px))]', default: 'size-full px-16 pt-4 pb-72 text-base sm:px-[max(64px,calc(50%-350px))]',
demo: 'size-full px-16 pt-4 pb-72 text-base sm:px-[max(64px,calc(50%-350px))]',
fullWidth: 'size-full px-16 pt-4 pb-72 text-base sm:px-24', fullWidth: 'size-full px-16 pt-4 pb-72 text-base sm:px-24',
none: '', none: ''
select: 'px-3 py-2 text-base data-readonly:w-fit'
} }
} }
} }

2
apps/web/src/components/ui/report/ThemeWrapper/ThemeStyles.tsx
View File

@ -11,6 +11,8 @@ export function ThemesStyle() {
return null; return null;
} }
console.log(activeTheme);
return ( return (
<style> <style>
{` {`

42
apps/web/src/components/ui/report/ThemeWrapper/themes.ts
View File

@ -1,3 +1,44 @@
const BASE_THEME = {
'--spacing': '0.25rem',
'--breakpoint-xl': '80rem',
'--breakpoint-2xl': '96rem',
'--container-sm': '24rem',
'--container-lg': '32rem',
'--container-2xl': '42rem',
'--container-3xl': '48rem',
'--text-xs': '0.75rem',
'--text-xs--line-height': 'calc(1 / 0.75)',
'--text-sm': '0.875rem',
'--text-sm--line-height': 'calc(1.25 / 0.875)',
'--text-base': '1rem',
'--text-base--line-height': 'calc(1.5 / 1)',
'--text-lg': '1.125rem',
'--text-lg--line-height': 'calc(1.75 / 1.125)',
'--text-xl': '1.25rem',
'--text-xl--line-height': 'calc(1.75 / 1.25)',
'--text-2xl': '1.5rem',
'--text-2xl--line-height': 'calc(2 / 1.5)',
'--text-3xl': '1.875rem',
'--text-3xl--line-height': 'calc(2.25 / 1.875)',
'--text-4xl': '2.25rem',
'--text-4xl--line-height': 'calc(2.5 / 2.25)',
'--text-5xl': '3rem',
'--text-5xl--line-height': '1',
'--font-weight-light': '300',
'--font-weight-normal': '400',
'--font-weight-medium': '500',
'--font-weight-semibold': '600',
'--font-weight-bold': '700',
'--font-weight-extrabold': '800',
'--tracking-tighter': '-0.05em',
'--tracking-tight': '-0.025em',
'--tracking-widest': '0.1em',
'--leading-tight': '1.25',
'--leading-normal': '1.5',
'--leading-relaxed': '1.625',
'--leading-loose': '2'
};
const _THEMES = { const _THEMES = {
ayu: { ayu: {
id: 'ayu', id: 'ayu',
@ -526,6 +567,7 @@ const _THEMES = {
Object.entries(_THEMES).forEach(([key, theme]) => { Object.entries(_THEMES).forEach(([key, theme]) => {
// @ts-expect-error - key is a string // @ts-expect-error - key is a string
_THEMES[key] = { _THEMES[key] = {
...BASE_THEME,
...theme, ...theme,
dark: themeColorsToCssVariables(theme.dark), dark: themeColorsToCssVariables(theme.dark),
light: themeColorsToCssVariables(theme.light) light: themeColorsToCssVariables(theme.light)

2
apps/web/src/styles/tailwind.css
View File

@ -5,7 +5,7 @@
@import './tailwindAnimations.css'; @import './tailwindAnimations.css';
@plugin 'tailwind-scrollbar'; @plugin 'tailwind-scrollbar';
@plugin 'tailwind-scrollbar-hide'; @plugin 'tailwind-scrollbar-hide';
@import 'shadcn-prose'; /* @import 'shadcn-prose'; */
@custom-variant dark (&:is(.dark *)); @custom-variant dark (&:is(.dark *));