mirror of
https://github.com/zitadel/zitadel.git
synced 2025-08-11 15:27:33 +00:00
rm prettier, tailwindcss and eslint package
This commit is contained in:
Max Peintner
@@ -1,7 +1,7 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
// This tells ESLint to load the config from the package `@zitadel/eslint-config`
|
||||
extends: ["@zitadel/eslint-config"],
|
||||
// Use basic ESLint config since the login app has its own detailed config
|
||||
extends: ["eslint:recommended"],
|
||||
settings: {
|
||||
next: {
|
||||
rootDir: ["apps/*/"],
|
||||
|
||||
@@ -1,7 +1,15 @@
|
||||
module.exports = {
|
||||
extends: ["next/core-web-vitals"],
|
||||
parser: "@babel/eslint-parser",
|
||||
extends: ["next", "prettier"],
|
||||
rules: {
|
||||
"@next/next/no-html-link-for-pages": "off",
|
||||
"@next/next/no-img-element": "off",
|
||||
"react/no-unescaped-entities": "off"
|
||||
}
|
||||
},
|
||||
parserOptions: {
|
||||
requireConfigFile: false,
|
||||
babelOptions: {
|
||||
presets: ["next/babel"],
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,7 +0,0 @@
|
||||
module.exports = {
|
||||
extends: ["next/core-web-vitals"],
|
||||
rules: {
|
||||
"@next/next/no-img-element": "off",
|
||||
"react/no-unescaped-entities": "off"
|
||||
}
|
||||
};
|
||||
@@ -1,123 +0,0 @@
|
||||
# ZITADEL Login UI - Standalone
|
||||
|
||||
This is the standalone version of the ZITADEL Login UI, a Next.js application that provides the authentication interface for ZITADEL.
|
||||
|
||||
## Quick Start
|
||||
|
||||
### Prerequisites
|
||||
|
||||
- Node.js 18+
|
||||
- npm or pnpm
|
||||
|
||||
### Setup
|
||||
|
||||
1. **Prepare the standalone environment:**
|
||||
|
||||
```bash
|
||||
./prepare-standalone.sh --install
|
||||
```
|
||||
|
||||
Or for manual control:
|
||||
|
||||
```bash
|
||||
./prepare-standalone.sh --no-install
|
||||
npm install
|
||||
```
|
||||
|
||||
2. **Start development server:**
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
3. **Build for production:**
|
||||
```bash
|
||||
npm run build:standalone
|
||||
npm run start
|
||||
```
|
||||
|
||||
## Development
|
||||
|
||||
### Available Scripts
|
||||
|
||||
- `npm run dev` - Start development server with Turbopack
|
||||
- `npm run build` - Build for production
|
||||
- `npm run build:standalone` - Build standalone version with custom base path
|
||||
- `npm run start` - Start production server
|
||||
- `npm run test:unit` - Run unit tests
|
||||
- `npm run lint` - Run linting
|
||||
- `npm run lint:fix` - Fix linting issues
|
||||
|
||||
### Environment Variables
|
||||
|
||||
Create a `.env.local` file with your ZITADEL configuration:
|
||||
|
||||
```env
|
||||
ZITADEL_API_URL=https://your-zitadel-instance.com
|
||||
# Add other required environment variables
|
||||
```
|
||||
|
||||
### Package Management
|
||||
|
||||
This standalone version automatically uses the latest published versions of:
|
||||
|
||||
- `@zitadel/client` - ZITADEL client library (latest)
|
||||
- `@zitadel/proto` - ZITADEL protocol definitions (latest)
|
||||
|
||||
To update to the latest versions, simply run:
|
||||
|
||||
```bash
|
||||
npm update @zitadel/client @zitadel/proto
|
||||
```
|
||||
|
||||
## Differences from Monorepo Version
|
||||
|
||||
This standalone version includes:
|
||||
|
||||
- **Published packages**: Uses latest published versions of `@zitadel/client` and `@zitadel/proto`
|
||||
- **Self-contained configuration**: All configuration files are standalone-ready
|
||||
- **Simplified dependencies**: Removes monorepo-specific devDependencies and tooling
|
||||
- **Streamlined build scripts**: Optimized scripts for standalone development
|
||||
- **Independent dependency management**: No workspace or turbo dependencies
|
||||
|
||||
## Architecture
|
||||
|
||||
### Dual-Mode Design
|
||||
|
||||
This project supports both monorepo and standalone modes:
|
||||
|
||||
- **Monorepo mode**: Uses `workspace:*` dependencies for local development
|
||||
- **Standalone mode**: Uses published npm packages for distribution
|
||||
|
||||
### Automatic Conversion
|
||||
|
||||
The conversion between modes is handled by intelligent scripts:
|
||||
|
||||
1. **`prepare-standalone.sh`**: Main conversion script for end users
|
||||
2. **`scripts/prepare-standalone.js`**: Advanced preparation with latest package versions
|
||||
3. **`scripts/build-standalone.js`**: Generates standalone configs without modifying current setup
|
||||
4. **`scripts/config-manager.js`**: Switches between monorepo and standalone configurations
|
||||
|
||||
## Contributing
|
||||
|
||||
When contributing to this standalone version:
|
||||
|
||||
1. Make changes in the main monorepo first
|
||||
2. Test changes in the monorepo environment
|
||||
3. Update the standalone version via subtree push
|
||||
4. Test the standalone version independently
|
||||
|
||||
## Subtree Sync
|
||||
|
||||
This repository is maintained as a Git subtree of the main ZITADEL repository.
|
||||
|
||||
To sync changes from the main repo:
|
||||
|
||||
```bash
|
||||
# In the main ZITADEL repo
|
||||
git subtree push --prefix=login/apps/login origin typescript-login-standalone
|
||||
```
|
||||
|
||||
## License
|
||||
|
||||
See the main ZITADEL repository for license information.
|
||||
@@ -47,6 +47,7 @@
|
||||
"uuid": "^11.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/eslint-parser": "^7.23.0",
|
||||
"@bufbuild/buf": "^1.53.0",
|
||||
"@testing-library/jest-dom": "^6.6.3",
|
||||
"@testing-library/react": "^16.3.0",
|
||||
@@ -57,20 +58,23 @@
|
||||
"@types/tinycolor2": "1.4.3",
|
||||
"@types/uuid": "^10.0.0",
|
||||
"@vercel/git-hooks": "1.0.0",
|
||||
"@zitadel/eslint-config": "workspace:*",
|
||||
"@zitadel/prettier-config": "workspace:*",
|
||||
"@zitadel/tailwind-config": "workspace:*",
|
||||
"@zitadel/tsconfig": "workspace:*",
|
||||
"autoprefixer": "10.4.21",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-config-next": "15.4.0-canary.86",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"grpc-tools": "1.13.0",
|
||||
"jsdom": "^26.1.0",
|
||||
"lint-staged": "15.5.1",
|
||||
"make-dir-cli": "4.0.0",
|
||||
"postcss": "8.5.3",
|
||||
"prettier": "^3.2.5",
|
||||
"prettier-plugin-organize-imports": "^3.2.0",
|
||||
"prettier-plugin-tailwindcss": "0.6.11",
|
||||
"sass": "^1.87.0",
|
||||
"tailwindcss": "3.4.14",
|
||||
"ts-proto": "^2.7.0",
|
||||
"typescript": "^5.8.3"
|
||||
"typescript": "^5.8.3",
|
||||
"vitest": "^2.0.0"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -37,6 +37,7 @@
|
||||
"uuid": "^11.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/eslint-parser": "^7.23.0",
|
||||
"@bufbuild/buf": "^1.53.0",
|
||||
"@testing-library/jest-dom": "^6.6.3",
|
||||
"@testing-library/react": "^16.3.0",
|
||||
@@ -46,9 +47,13 @@
|
||||
"@types/tinycolor2": "1.4.3",
|
||||
"@types/uuid": "^10.0.0",
|
||||
"autoprefixer": "10.4.21",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-config-next": "15.4.0-canary.86",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"jsdom": "^26.1.0",
|
||||
"postcss": "8.5.3",
|
||||
"prettier": "^3.2.5",
|
||||
"prettier-plugin-organize-imports": "^3.2.0",
|
||||
"prettier-plugin-tailwindcss": "0.6.11",
|
||||
"sass": "^1.87.0",
|
||||
"tailwindcss": "3.4.14",
|
||||
|
||||
@@ -1,8 +1,11 @@
|
||||
export default {
|
||||
semi: true,
|
||||
trailingComma: "all",
|
||||
singleQuote: false,
|
||||
printWidth: 80,
|
||||
tabWidth: 2,
|
||||
plugins: ["prettier-plugin-tailwindcss"],
|
||||
useTabs: false,
|
||||
semi: true,
|
||||
singleQuote: false,
|
||||
trailingComma: 'all',
|
||||
bracketSpacing: true,
|
||||
arrowParens: 'always',
|
||||
plugins: ["prettier-plugin-organize-imports", "prettier-plugin-tailwindcss"]
|
||||
};
|
||||
|
||||
@@ -1,8 +0,0 @@
|
||||
export default {
|
||||
semi: true,
|
||||
trailingComma: "all",
|
||||
singleQuote: false,
|
||||
printWidth: 80,
|
||||
tabWidth: 2,
|
||||
plugins: ["prettier-plugin-tailwindcss"],
|
||||
};
|
||||
@@ -13,21 +13,6 @@ const CONFIG_FILES = [
|
||||
source: 'tsconfig.standalone.json',
|
||||
target: 'tsconfig.json',
|
||||
required: true
|
||||
},
|
||||
{
|
||||
source: '.eslintrc.standalone.cjs',
|
||||
target: '.eslintrc.cjs',
|
||||
required: false
|
||||
},
|
||||
{
|
||||
source: 'prettier.config.standalone.mjs',
|
||||
target: 'prettier.config.mjs',
|
||||
required: false
|
||||
},
|
||||
{
|
||||
source: 'tailwind.config.standalone.mjs',
|
||||
target: 'tailwind.config.mjs',
|
||||
required: false
|
||||
}
|
||||
];
|
||||
|
||||
@@ -54,8 +39,8 @@ async function prepareStandalone() {
|
||||
throw new Error('package.standalone.json not found!');
|
||||
}
|
||||
|
||||
// Step 2: Copy configuration files
|
||||
console.log('\n⚙️ Setting up configuration files...');
|
||||
// Step 2: Copy TypeScript configuration
|
||||
console.log('\n⚙️ Setting up TypeScript configuration...');
|
||||
for (const config of CONFIG_FILES) {
|
||||
try {
|
||||
const sourceExists = await fs.access(config.source).then(() => true).catch(() => false);
|
||||
@@ -94,6 +79,9 @@ async function prepareStandalone() {
|
||||
console.log(' 2. Run: npm run dev');
|
||||
console.log(' 3. Start developing!\n');
|
||||
|
||||
console.log('ℹ️ Note: ESLint, Prettier, and Tailwind configs are now unified');
|
||||
console.log(' - No separate standalone config files needed!');
|
||||
|
||||
} catch (error) {
|
||||
console.error('\n❌ Failed to prepare standalone version:', error.message);
|
||||
console.error('Please check the error above and try again.\n');
|
||||
|
||||
@@ -1,16 +1,184 @@
|
||||
import colors from "tailwindcss/colors";
|
||||
|
||||
// Generate dynamic theme colors
|
||||
let themeColors = {
|
||||
background: { light: { contrast: {} }, dark: { contrast: {} } },
|
||||
primary: { light: { contrast: {} }, dark: { contrast: {} } },
|
||||
warn: { light: { contrast: {} }, dark: { contrast: {} } },
|
||||
text: { light: { contrast: {} }, dark: { contrast: {} } },
|
||||
link: { light: { contrast: {} }, dark: { contrast: {} } },
|
||||
};
|
||||
|
||||
const shades = ["50", "100", "200", "300", "400", "500", "600", "700", "800", "900"];
|
||||
const themes = ["light", "dark"];
|
||||
const types = ["background", "primary", "warn", "text", "link"];
|
||||
|
||||
types.forEach((type) => {
|
||||
themes.forEach((theme) => {
|
||||
shades.forEach((shade) => {
|
||||
themeColors[type][theme][shade] = `var(--theme-${theme}-${type}-${shade})`;
|
||||
themeColors[type][theme][`contrast-${shade}`] =
|
||||
`var(--theme-${theme}-${type}-contrast-${shade})`;
|
||||
themeColors[type][theme][`secondary-${shade}`] =
|
||||
`var(--theme-${theme}-${type}-secondary-${shade})`;
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
],
|
||||
content: ["./src/**/*.{js,ts,jsx,tsx}"],
|
||||
darkMode: "class",
|
||||
future: {
|
||||
hoverOnlyWhenSupported: true,
|
||||
},
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
background: "var(--background)",
|
||||
foreground: "var(--foreground)",
|
||||
// https://vercel.com/design/color
|
||||
fontSize: {
|
||||
"12px": "12px",
|
||||
"14px": "14px",
|
||||
},
|
||||
colors: {
|
||||
gray: colors.zinc,
|
||||
// Dynamic theme colors
|
||||
...themeColors,
|
||||
// State colors
|
||||
state: {
|
||||
success: {
|
||||
light: {
|
||||
background: "#cbf4c9",
|
||||
color: "#0e6245",
|
||||
},
|
||||
dark: {
|
||||
background: "#68cf8340",
|
||||
color: "#cbf4c9",
|
||||
},
|
||||
},
|
||||
error: {
|
||||
light: {
|
||||
background: "#ffc1c1",
|
||||
color: "#620e0e",
|
||||
},
|
||||
dark: {
|
||||
background: "#af455359",
|
||||
color: "#ffc1c1",
|
||||
},
|
||||
},
|
||||
neutral: {
|
||||
light: {
|
||||
background: "#e4e7e4",
|
||||
color: "#000000",
|
||||
},
|
||||
dark: {
|
||||
background: "#1a253c",
|
||||
color: "#ffffff",
|
||||
},
|
||||
},
|
||||
alert: {
|
||||
light: {
|
||||
background: "#fbbf24",
|
||||
color: "#92400e",
|
||||
},
|
||||
dark: {
|
||||
background: "#92400e50",
|
||||
color: "#fbbf24",
|
||||
},
|
||||
},
|
||||
},
|
||||
divider: {
|
||||
dark: "rgba(135,149,161,.2)",
|
||||
light: "rgba(135,149,161,.2)",
|
||||
},
|
||||
input: {
|
||||
light: {
|
||||
label: "#000000c7",
|
||||
background: "#00000004",
|
||||
border: "#1a191954",
|
||||
hoverborder: "1a1b1b",
|
||||
},
|
||||
dark: {
|
||||
label: "#ffffffc7",
|
||||
background: "#00000020",
|
||||
border: "#f9f7f775",
|
||||
hoverborder: "#e0e0e0",
|
||||
},
|
||||
},
|
||||
button: {
|
||||
light: {
|
||||
border: "#0000001f",
|
||||
},
|
||||
dark: {
|
||||
border: "#ffffff1f",
|
||||
},
|
||||
},
|
||||
},
|
||||
backgroundImage: ({ theme }) => ({
|
||||
"dark-vc-border-gradient": `radial-gradient(at left top, ${theme(
|
||||
"colors.gray.800",
|
||||
)}, 50px, ${theme("colors.gray.800")} 50%)`,
|
||||
"vc-border-gradient": `radial-gradient(at left top, ${theme(
|
||||
"colors.gray.200",
|
||||
)}, 50px, ${theme("colors.gray.300")} 50%)`,
|
||||
}),
|
||||
animation: {
|
||||
shake: "shake .8s cubic-bezier(.36,.07,.19,.97) both;",
|
||||
},
|
||||
keyframes: ({ theme }) => ({
|
||||
rerender: {
|
||||
"0%": {
|
||||
["border-color"]: theme("colors.pink.500"),
|
||||
},
|
||||
"40%": {
|
||||
["border-color"]: theme("colors.pink.500"),
|
||||
},
|
||||
},
|
||||
highlight: {
|
||||
"0%": {
|
||||
background: theme("colors.pink.500"),
|
||||
color: theme("colors.white"),
|
||||
},
|
||||
"40%": {
|
||||
background: theme("colors.pink.500"),
|
||||
color: theme("colors.white"),
|
||||
},
|
||||
},
|
||||
shimmer: {
|
||||
"100%": {
|
||||
transform: "translateX(100%)",
|
||||
},
|
||||
},
|
||||
translateXReset: {
|
||||
"100%": {
|
||||
transform: "translateX(0)",
|
||||
},
|
||||
},
|
||||
fadeToTransparent: {
|
||||
"0%": {
|
||||
opacity: 1,
|
||||
},
|
||||
"40%": {
|
||||
opacity: 1,
|
||||
},
|
||||
"100%": {
|
||||
opacity: 0,
|
||||
},
|
||||
},
|
||||
shake: {
|
||||
"10%, 90%": {
|
||||
transform: "translate3d(-1px, 0, 0)",
|
||||
},
|
||||
"20%, 80%": {
|
||||
transform: "translate3d(2px, 0, 0)",
|
||||
},
|
||||
"30%, 50%, 70%": {
|
||||
transform: "translate3d(-4px, 0, 0)",
|
||||
},
|
||||
"40%, 60%": {
|
||||
transform: "translate3d(4px, 0, 0)",
|
||||
},
|
||||
},
|
||||
}),
|
||||
},
|
||||
},
|
||||
plugins: [require("@tailwindcss/forms")],
|
||||
|
||||
@@ -1,17 +0,0 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
background: "var(--background)",
|
||||
foreground: "var(--foreground)",
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [require("@tailwindcss/forms")],
|
||||
};
|
||||
@@ -33,8 +33,6 @@
|
||||
"devDependencies": {
|
||||
"@changesets/cli": "^2.29.2",
|
||||
"@vitejs/plugin-react": "^4.4.1",
|
||||
"@zitadel/eslint-config": "workspace:*",
|
||||
"@zitadel/prettier-config": "workspace:*",
|
||||
"axios": "^1.8.4",
|
||||
"dotenv": "^16.5.0",
|
||||
"dotenv-cli": "^8.0.0",
|
||||
|
||||
@@ -65,7 +65,6 @@
|
||||
"devDependencies": {
|
||||
"@bufbuild/protocompile": "^0.0.1",
|
||||
"@bufbuild/buf": "^1.53.0",
|
||||
"@zitadel/tsconfig": "workspace:*",
|
||||
"@zitadel/eslint-config": "workspace:*"
|
||||
"@zitadel/tsconfig": "workspace:*"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,13 +0,0 @@
|
||||
# @zitadel/eslint-config
|
||||
|
||||
## 0.1.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- README updates
|
||||
|
||||
## 0.1.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
- f32ab7f: Initial release
|
||||
@@ -1,35 +0,0 @@
|
||||
# ZITADEL ESLint Config
|
||||
|
||||
This package provides the ESLint configuration used by ZITADEL projects. It includes a set of rules and plugins to ensure consistent code quality and style across all ZITADEL codebases.
|
||||
|
||||
## Installation
|
||||
|
||||
To install the package, use npm or yarn:
|
||||
|
||||
```sh
|
||||
npm install @zitadel/eslint-config
|
||||
```
|
||||
|
||||
or
|
||||
|
||||
```sh
|
||||
yarn add @zitadel/eslint-config
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
To use the ESLint configuration in your project, extend it in your `.eslintrc` file:
|
||||
|
||||
```js
|
||||
{
|
||||
"extends": "@zitadel/eslint-config"
|
||||
}
|
||||
```
|
||||
|
||||
## Documentation
|
||||
|
||||
For detailed documentation and configuration options, please refer to the [ESLint documentation](https://eslint.org/docs/user-guide/configuring).
|
||||
|
||||
## Contributing
|
||||
|
||||
Contributions are welcome! Please read the contributing guidelines before getting started.
|
||||
@@ -1,13 +0,0 @@
|
||||
module.exports = {
|
||||
parser: "@babel/eslint-parser",
|
||||
extends: ["next", "turbo", "prettier"],
|
||||
rules: {
|
||||
"@next/next/no-html-link-for-pages": "off",
|
||||
},
|
||||
parserOptions: {
|
||||
requireConfigFile: false,
|
||||
babelOptions: {
|
||||
presets: ["next/babel"],
|
||||
},
|
||||
},
|
||||
};
|
||||
@@ -1,17 +0,0 @@
|
||||
{
|
||||
"name": "@zitadel/eslint-config",
|
||||
"version": "0.1.1",
|
||||
"main": "index.js",
|
||||
"license": "MIT",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
"dependencies": {
|
||||
"@typescript-eslint/parser": "^7.9.0",
|
||||
"eslint-config-next": "^14.2.18",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-config-turbo": "^2.0.9",
|
||||
"eslint-plugin-react": "^7.34.1",
|
||||
"@babel/eslint-parser": "^7.25.9"
|
||||
}
|
||||
}
|
||||
@@ -1,13 +0,0 @@
|
||||
# @zitadel/prettier-config
|
||||
|
||||
## 0.1.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- README updates
|
||||
|
||||
## 0.1.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
- f32ab7f: Initial release
|
||||
@@ -1,36 +0,0 @@
|
||||
# ZITADEL Prettier Config
|
||||
|
||||
This package provides the Prettier configuration used by ZITADEL projects. It includes a set of formatting rules to ensure consistent code style across all ZITADEL codebases.
|
||||
|
||||
## Installation
|
||||
|
||||
To install the package, use npm or yarn:
|
||||
|
||||
```sh
|
||||
npm install @zitadel/prettier-config
|
||||
```
|
||||
|
||||
or
|
||||
|
||||
```sh
|
||||
yarn add @zitadel/prettier-config
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
To use the Prettier configuration in your project, extend it in your `prettier.config.js` file:
|
||||
|
||||
```js
|
||||
module.exports = {
|
||||
...require("@zitadel/prettier-config"),
|
||||
// Add your custom configurations here
|
||||
};
|
||||
```
|
||||
|
||||
## Documentation
|
||||
|
||||
For detailed documentation and configuration options, please refer to the [Prettier documentation](https://prettier.io/docs/en/configuration.html).
|
||||
|
||||
## Contributing
|
||||
|
||||
Contributions are welcome! Please read the contributing guidelines before getting started.
|
||||
@@ -1,11 +0,0 @@
|
||||
export default {
|
||||
printWidth: 80,
|
||||
tabWidth: 2,
|
||||
useTabs: false,
|
||||
semi: true,
|
||||
singleQuote: false,
|
||||
trailingComma: 'all',
|
||||
bracketSpacing: true,
|
||||
arrowParens: 'always',
|
||||
plugins: ["prettier-plugin-organize-imports"]
|
||||
};
|
||||
@@ -1,12 +0,0 @@
|
||||
{
|
||||
"name": "@zitadel/prettier-config",
|
||||
"version": "0.1.1",
|
||||
"description": "Prettier configuration",
|
||||
"type": "module",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
"exports": {
|
||||
".": "./index.js"
|
||||
}
|
||||
}
|
||||
@@ -1,13 +0,0 @@
|
||||
# @zitadel/tailwind-config
|
||||
|
||||
## 0.1.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- README updates
|
||||
|
||||
## 0.1.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
- f32ab7f: Initial release
|
||||
@@ -1,36 +0,0 @@
|
||||
# ZITADEL Tailwind Config
|
||||
|
||||
This package provides the Tailwind CSS configuration used by ZITADEL projects. It includes a set of default styles, themes, and utility classes to ensure consistent design and styling across all ZITADEL codebases.
|
||||
|
||||
## Installation
|
||||
|
||||
To install the package, use npm or yarn:
|
||||
|
||||
```sh
|
||||
npm install @zitadel/tailwind-config
|
||||
```
|
||||
|
||||
or
|
||||
|
||||
```sh
|
||||
yarn add @zitadel/tailwind-config
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
To use the Tailwind CSS configuration in your project, extend it in your `tailwind.config.js` file:
|
||||
|
||||
```js
|
||||
module.exports = {
|
||||
presets: [require("@zitadel/tailwind-config")],
|
||||
// Add your custom configurations here
|
||||
};
|
||||
```
|
||||
|
||||
## Documentation
|
||||
|
||||
For detailed documentation and configuration options, please refer to the [Tailwind CSS documentation](https://tailwindcss.com/docs)
|
||||
|
||||
## Contributing
|
||||
|
||||
Contributions are welcome! Please read the contributing guidelines before getting started.
|
||||
@@ -1,16 +0,0 @@
|
||||
{
|
||||
"name": "@zitadel/tailwind-config",
|
||||
"version": "0.1.1",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
},
|
||||
"main": "index.js",
|
||||
"exports": {
|
||||
".": "./index.js",
|
||||
"./tailwind.config.mjs": "./tailwind.config.mjs"
|
||||
},
|
||||
"devDependencies": {
|
||||
"tailwindcss": "^4.1.4",
|
||||
"@tailwindcss/forms": "0.5.3"
|
||||
}
|
||||
}
|
||||
@@ -1,97 +0,0 @@
|
||||
import colors from "tailwindcss/colors";
|
||||
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: ["./app/**/*.{js,ts,jsx,tsx}", "./page/**/*.{js,ts,jsx,tsx}", "./ui/**/*.{js,ts,jsx,tsx}"],
|
||||
future: {
|
||||
hoverOnlyWhenSupported: true,
|
||||
},
|
||||
theme: {
|
||||
extend: {
|
||||
// https://vercel.com/design/color
|
||||
fontSize: {
|
||||
"12px": "12px",
|
||||
"14px": "14px",
|
||||
},
|
||||
colors: {
|
||||
gray: colors.zinc,
|
||||
divider: {
|
||||
dark: "rgba(135,149,161,.2)",
|
||||
light: "rgba(135,149,161,.2)",
|
||||
},
|
||||
input: {
|
||||
light: {
|
||||
label: "#000000c7",
|
||||
background: "#00000004",
|
||||
border: "#1a191954",
|
||||
hoverborder: "1a1b1b",
|
||||
},
|
||||
dark: {
|
||||
label: "#ffffffc7",
|
||||
background: "#00000020",
|
||||
border: "#f9f7f775",
|
||||
hoverborder: "#e0e0e0",
|
||||
},
|
||||
},
|
||||
button: {
|
||||
light: {
|
||||
border: "#0000001f",
|
||||
},
|
||||
dark: {
|
||||
border: "#ffffff1f",
|
||||
},
|
||||
},
|
||||
},
|
||||
backgroundImage: ({ theme }) => ({
|
||||
"dark-vc-border-gradient": `radial-gradient(at left top, ${theme(
|
||||
"colors.gray.800",
|
||||
)}, 50px, ${theme("colors.gray.800")} 50%)`,
|
||||
"vc-border-gradient": `radial-gradient(at left top, ${theme(
|
||||
"colors.gray.200",
|
||||
)}, 50px, ${theme("colors.gray.300")} 50%)`,
|
||||
}),
|
||||
keyframes: ({ theme }) => ({
|
||||
rerender: {
|
||||
"0%": {
|
||||
["border-color"]: theme("colors.pink.500"),
|
||||
},
|
||||
"40%": {
|
||||
["border-color"]: theme("colors.pink.500"),
|
||||
},
|
||||
},
|
||||
highlight: {
|
||||
"0%": {
|
||||
background: theme("colors.pink.500"),
|
||||
color: theme("colors.white"),
|
||||
},
|
||||
"40%": {
|
||||
background: theme("colors.pink.500"),
|
||||
color: theme("colors.white"),
|
||||
},
|
||||
},
|
||||
shimmer: {
|
||||
"100%": {
|
||||
transform: "translateX(100%)",
|
||||
},
|
||||
},
|
||||
translateXReset: {
|
||||
"100%": {
|
||||
transform: "translateX(0)",
|
||||
},
|
||||
},
|
||||
fadeToTransparent: {
|
||||
"0%": {
|
||||
opacity: 1,
|
||||
},
|
||||
"40%": {
|
||||
opacity: 1,
|
||||
},
|
||||
"100%": {
|
||||
opacity: 0,
|
||||
},
|
||||
},
|
||||
}),
|
||||
},
|
||||
},
|
||||
plugins: [require("@tailwindcss/forms")],
|
||||
};
|
||||
1766
login/pnpm-lock.yaml
generated
1766
login/pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user