-
-
Notifications
You must be signed in to change notification settings - Fork 21
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #256 from thetarnav/unocss
Switch from ve to unocss
- Loading branch information
Showing
225 changed files
with
15,722 additions
and
17,100 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
--- | ||
'@solid-devtools/frontend': minor | ||
--- | ||
|
||
Change styling library from vanilla extract to unocss. Simplify the styles in the process. | ||
|
||
**Important** | ||
|
||
This changes the styles path from `@solid-devtools/frontend/dist/index.css` to `@solid-devtools/frontend/dist/styles.css` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
--- | ||
'@solid-devtools/extension': patch | ||
'@solid-devtools/debugger': patch | ||
'@solid-devtools/frontend': patch | ||
'@solid-devtools/overlay': patch | ||
'@solid-devtools/logger': patch | ||
'@solid-devtools/shared': patch | ||
'solid-devtools': patch | ||
--- | ||
|
||
Use @nothing-but/utils for some common utilities |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
--- | ||
'@solid-devtools/frontend': patch | ||
'@solid-devtools/shared': patch | ||
--- | ||
|
||
Updated the `atom` helper primitive |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,26 +1,29 @@ | ||
{ | ||
"root": true, | ||
"parser": "@typescript-eslint/parser", | ||
"plugins": ["@typescript-eslint", "no-only-tests", "eslint-comments"], | ||
"ignorePatterns": ["node_modules", "dist", "scripts", "examples"], | ||
"parserOptions": { | ||
"project": "./tsconfig.json", | ||
"tsconfigRootDir": ".", | ||
"sourceType": "module" | ||
}, | ||
"rules": { | ||
"prefer-const": "warn", | ||
"no-console": "warn", | ||
"no-debugger": "warn", | ||
"@typescript-eslint/no-unused-vars": [ | ||
"warn", | ||
{ "argsIgnorePattern": "^_", "varsIgnorePattern": "^_", "caughtErrorsIgnorePattern": "^_" } | ||
], | ||
"@typescript-eslint/no-unnecessary-type-assertion": "warn", | ||
"@typescript-eslint/no-unnecessary-condition": "warn", | ||
"@typescript-eslint/no-useless-empty-export": "warn", | ||
"@typescript-eslint/prefer-enum-initializers": "warn", | ||
"no-only-tests/no-only-tests": "warn", | ||
"eslint-comments/no-unused-disable": "warn" | ||
} | ||
"root": true, | ||
"parser": "@typescript-eslint/parser", | ||
"plugins": ["@typescript-eslint", "no-only-tests", "eslint-comments"], | ||
"ignorePatterns": ["node_modules", "dist", "scripts", "examples"], | ||
"parserOptions": { | ||
"project": "./tsconfig.json", | ||
"tsconfigRootDir": ".", | ||
"sourceType": "module" | ||
}, | ||
"rules": { | ||
"prefer-const": "warn", | ||
"no-console": "warn", | ||
"no-debugger": "warn", | ||
"@typescript-eslint/no-unused-vars": [ | ||
"warn", | ||
{ | ||
"argsIgnorePattern": "^_", | ||
"varsIgnorePattern": "^_", | ||
"caughtErrorsIgnorePattern": "^_" | ||
} | ||
], | ||
"@typescript-eslint/no-unnecessary-type-assertion": "warn", | ||
"@typescript-eslint/no-unnecessary-condition": "warn", | ||
"@typescript-eslint/no-useless-empty-export": "warn", | ||
"no-only-tests/no-only-tests": "warn", | ||
"eslint-comments/no-unused-disable": "warn" | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -8,11 +8,13 @@ jobs: | |
format: | ||
runs-on: ubuntu-latest | ||
|
||
permissions: | ||
# Give the default GITHUB_TOKEN write permission to commit and push the | ||
# added or changed files to the repository. | ||
contents: write | ||
|
||
steps: | ||
- uses: actions/checkout@v3 | ||
with: | ||
# Personal access token is required to get around the protected main branch restriction | ||
token: ${{ secrets.PAT }} | ||
|
||
- uses: pnpm/[email protected] | ||
|
||
|
@@ -31,3 +33,5 @@ jobs: | |
uses: stefanzweifel/git-auto-commit-action@v4 | ||
with: | ||
commit_message: 'Format' | ||
# should match the file pattern in the format script | ||
file_pattern: './{packages,examples}/**/*.{js,ts,json,css,tsx,jsx}' |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,12 +1,20 @@ | ||
{ | ||
"trailingComma": "all", | ||
"tabWidth": 2, | ||
"tabWidth": 4, | ||
"printWidth": 100, | ||
"semi": false, | ||
"singleQuote": true, | ||
"useTabs": false, | ||
"arrowParens": "avoid", | ||
"bracketSpacing": true, | ||
"endOfLine": "lf", | ||
"plugins": ["prettier-plugin-organize-imports"] | ||
"plugins": ["prettier-plugin-organize-imports"], | ||
"overrides": [ | ||
{ | ||
"files": "*.yml", | ||
"options": { | ||
"tabWidth": 2 | ||
} | ||
} | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,255 @@ | ||
// current theme is based on the tailwind default theme | ||
// colors: https://github.com/tailwindlabs/tailwindcss/blob/master/src/public/colors.js | ||
// spacing and other values: https://github.com/tailwindlabs/tailwindcss/blob/master/stubs/defaultConfig.stub.js | ||
|
||
import { misc } from '@nothing-but/utils' | ||
import type { Prettify, UnionToIntersection } from '@nothing-but/utils/types' | ||
|
||
const cyan = { | ||
50: '#ecfeff', | ||
100: '#cffafe', | ||
200: '#a5f3fc', | ||
300: '#67e8f9', | ||
400: '#22d3ee', | ||
500: '#06b6d4', | ||
600: '#0891b2', | ||
700: '#0e7490', | ||
800: '#155e75', | ||
900: '#164e63', | ||
} as const | ||
|
||
const amber = { | ||
50: '#fffbeb', | ||
100: '#fef3c7', | ||
200: '#fde68a', | ||
300: '#fcd34d', | ||
400: '#fbbf24', | ||
500: '#f59e0b', | ||
600: '#d97706', | ||
700: '#b45309', | ||
800: '#92400e', | ||
900: '#78350f', | ||
} as const | ||
|
||
const gray = { | ||
50: '#fafafa', | ||
100: '#f4f4f5', | ||
200: '#e4e4e7', | ||
300: '#d4d4d8', | ||
400: '#a1a1aa', | ||
500: '#71717a', | ||
600: '#52525b', | ||
700: '#3f3f46', | ||
800: '#27272a', | ||
900: '#18181b', | ||
} as const | ||
|
||
export const fontSize = { | ||
xs: '0.5rem', | ||
sm: '0.625rem', | ||
base: '0.75rem', | ||
lg: '0.875rem', | ||
xl: '1rem', | ||
'2xl': '1.125rem', | ||
'3xl': '1.25rem', | ||
} as const | ||
|
||
export const lineHeight = { | ||
'3xs': '1rem', | ||
'2xs': '1rem', | ||
xs: '1rem', | ||
sm: '1.25rem', | ||
base: '1.5rem', | ||
lg: '1.75rem', | ||
xl: '1.75rem', | ||
'2xl': '2rem', | ||
'3xl': '2.25rem', | ||
'4xl': '2.5rem', | ||
'5xl': '1', | ||
'6xl': '1', | ||
} as const | ||
|
||
const raw_spacing = { | ||
px: '1px', | ||
0: '0', | ||
0.25: '0.0625rem', // 1px | ||
0.5: '0.125rem', // 2px | ||
1: '0.25rem', // 4px | ||
1.5: '0.375rem', // 6px | ||
2: '0.5rem', // 8px | ||
2.5: '0.625rem', // 10px | ||
3: '0.75rem', // 12px | ||
3.5: '0.875rem', // 14px | ||
4: '1rem', // 16px | ||
4.5: '1.125rem', // 18px | ||
5: '1.25rem', // 20px | ||
6: '1.5rem', // 24px | ||
7: '1.75rem', // 28px | ||
8: '2rem', // 32px | ||
9: '2.25rem', // 36px | ||
10: '2.5rem', // 40px | ||
11: '2.75rem', // 44px | ||
12: '3rem', // 48px | ||
14: '3.5rem', // 56px | ||
16: '4rem', // 64px | ||
20: '5rem', | ||
24: '6rem', | ||
28: '7rem', | ||
32: '8rem', | ||
36: '9rem', | ||
40: '10rem', | ||
44: '11rem', | ||
48: '12rem', | ||
52: '13rem', | ||
56: '14rem', | ||
60: '15rem', | ||
64: '16rem', | ||
72: '18rem', | ||
80: '20rem', | ||
96: '24rem', | ||
} as const | ||
|
||
/* | ||
Add here any custom spacing values to use in the theme. | ||
*/ | ||
const raw_spacing_with_custom = { | ||
...raw_spacing, | ||
header_height: raw_spacing[7], | ||
inspector_row: raw_spacing[4.5], | ||
} | ||
|
||
export type Spacing = Prettify< | ||
UnionToIntersection< | ||
{ | ||
[K in keyof typeof raw_spacing_with_custom]: { | ||
[K2 in `-${K}`]: `-${(typeof raw_spacing_with_custom)[K]}` | ||
} & { | ||
[K2 in K]: (typeof raw_spacing_with_custom)[K] | ||
} | ||
}[keyof typeof raw_spacing_with_custom] | ||
> | ||
> | ||
|
||
export const spacing = misc.keys(raw_spacing_with_custom).reduce( | ||
(acc, key) => { | ||
const value = raw_spacing_with_custom[key] | ||
acc[key] = value | ||
acc[`-${key}`] = `-${value}` | ||
return acc | ||
}, | ||
{} as Record<string, string>, | ||
) as Spacing | ||
|
||
export function remValue(value: `${number}rem`): number { | ||
return +value.substring(0, value.length - 3) | ||
} | ||
|
||
export interface Var { | ||
name: string | ||
light: string | ||
dark: string | ||
} | ||
|
||
const css_vars: Var[] = [] | ||
|
||
function cssvar<T extends string>(name: T, light: string, dark: string): string { | ||
const css_var: Var = { | ||
name: '--' + name, | ||
light, | ||
dark, | ||
} | ||
css_vars.push(css_var) | ||
return `var(${css_var.name})` | ||
} | ||
|
||
export const vars = { | ||
panel: { | ||
1: cssvar('panel__1', gray[100], gray[800]), | ||
2: cssvar('panel__2', gray[200], gray[700]), | ||
3: cssvar('panel__3', gray[300], gray[600]), | ||
4: cssvar('panel__4', gray[400], gray[500]), | ||
5: cssvar('panel__5', gray[500], gray[400]), | ||
6: cssvar('panel__6', gray[600], gray[300]), | ||
7: cssvar('panel__7', gray[700], gray[200]), | ||
8: cssvar('panel__8', gray[800], gray[100]), | ||
|
||
bg: cssvar('panel__bg', gray[50], gray[800]), | ||
border: cssvar('panel__border', gray[300], gray[600]), | ||
}, | ||
highlight: { | ||
bg: cssvar('gray_highlight__color', gray[300], gray[600]), | ||
border: cssvar('gray_highlight__border', gray[400], gray[500]), | ||
}, | ||
disabled: cssvar('disabled__color', gray[500], gray[400]), | ||
text: { | ||
DEFAULT: cssvar('default-text-color', gray[900], gray[100]), | ||
light: cssvar('light-text-color', gray[800], gray[200]), | ||
}, | ||
component: cssvar('component-color', cyan[600], cyan[400]), | ||
dom: cssvar('dom-color', amber[600], amber[500]), | ||
} as const | ||
|
||
export function make_var_styles(root_class: string) { | ||
return /*css*/ ` | ||
.${root_class} { | ||
${css_vars.map(css_var => `${css_var.name}: ${css_var.light};`).join('')} | ||
} | ||
@media (prefers-color-scheme: dark) { | ||
.${root_class} { | ||
${css_vars.map(css_var => `${css_var.name}: ${css_var.dark};`).join('')} | ||
} | ||
} | ||
` | ||
} | ||
|
||
export const colors = { | ||
inherit: 'inherit', | ||
current: 'currentColor', | ||
transparent: 'transparent', | ||
black: '#000000', | ||
white: '#ffffff', | ||
cyan, | ||
amber, | ||
gray, | ||
green: '#16a34a', | ||
red: '#ef4444', | ||
...vars, | ||
} | ||
|
||
export const easing = { | ||
DEFAULT: 'cubic-bezier(0.4, 0, 0.2, 1)', | ||
linear: 'linear', | ||
in: 'cubic-bezier(0.4, 0, 1, 1)', | ||
out: 'cubic-bezier(0, 0, 0.2, 1)', | ||
'in-out': 'cubic-bezier(0.4, 0, 0.2, 1)', | ||
} | ||
|
||
export const radius = { | ||
none: '0px', | ||
sm: '0.125rem', | ||
DEFAULT: '0.25rem', | ||
md: '0.375rem', | ||
lg: '0.5rem', | ||
xl: '0.75rem', | ||
'2xl': '1rem', | ||
'3xl': '1.5rem', | ||
full: '9999px', | ||
} | ||
|
||
export const duration = { | ||
0: '0ms', | ||
75: '75ms', | ||
100: '100ms', | ||
150: '150ms', | ||
200: '200ms', | ||
300: '300ms', | ||
500: '500ms', | ||
700: '700ms', | ||
1000: '1000ms', | ||
} | ||
|
||
export const font = { | ||
sans: "ui-sans-serif, -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Noto Color Emoji'", | ||
serif: "ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif", | ||
mono: "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace", | ||
} |
Oops, something went wrong.