fix(deps): update dependency tailwindcss to v4 - abandoned (#4778)

Co-authored-by: qwerty287 <qwerty287@posteo.de>
Co-authored-by: Robert Kaussow <mail@thegeeklab.de>
Co-authored-by: qwerty287 <80460567+qwerty287@users.noreply.github.com>
This commit is contained in:
renovate[bot] 2025-02-14 09:12:16 +02:00 committed by GitHub
parent 5a916a711f
commit 981d5fc55b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
67 changed files with 1371 additions and 886 deletions

View file

@ -1,3 +1,4 @@
.pnpm-store/
pnpm-lock.yaml
dist
coverage/

View file

@ -20,12 +20,10 @@
"dependencies": {
"@kyvg/vue3-notification": "^3.4.1",
"@mdi/js": "^7.4.47",
"@tailwindcss/postcss": "4.0.5",
"@tailwindcss/typography": "^0.5.15",
"@tailwindcss/vite": "4.0.5",
"@vueuse/core": "^12.3.0",
"ansi_up": "^6.0.2",
"autoprefixer": "^10.4.20",
"dompurify": "^3.2.3",
"fuse.js": "^7.0.0",
"js-base64": "^3.7.7",
@ -33,12 +31,11 @@
"marked": "^15.0.5",
"node-emoji": "^2.2.0",
"pinia": "^2.3.0",
"postcss": "^8.4.49",
"prettier-plugin-tailwindcss": "^0.6.9",
"prettier-plugin-tailwindcss": "^0.6.11",
"prismjs": "^1.29.0",
"semver": "^7.6.3",
"simple-icons": "^14.1.0",
"tailwindcss": "^3.4.17",
"tailwindcss": "^4.0.6",
"vue": "^3.5.13",
"vue-i18n": "^11.0.1",
"vue-router": "^4.5.0"

View file

@ -17,12 +17,9 @@ importers:
'@mdi/js':
specifier: ^7.4.47
version: 7.4.47
'@tailwindcss/postcss':
specifier: 4.0.5
version: 4.0.5
'@tailwindcss/typography':
specifier: ^0.5.15
version: 0.5.16(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@22.13.1)(typescript@5.7.3)))
version: 0.5.16(tailwindcss@4.0.6)
'@tailwindcss/vite':
specifier: 4.0.5
version: 4.0.5(vite@6.1.0(@types/node@22.13.1)(jiti@2.4.2)(lightningcss@1.29.1)(stylus@0.57.0)(yaml@2.7.0))
@ -32,9 +29,6 @@ importers:
ansi_up:
specifier: ^6.0.2
version: 6.0.2
autoprefixer:
specifier: ^10.4.20
version: 10.4.20(postcss@8.5.1)
dompurify:
specifier: ^3.2.3
version: 3.2.4
@ -56,11 +50,8 @@ importers:
pinia:
specifier: ^2.3.0
version: 2.3.1(typescript@5.7.3)(vue@3.5.13(typescript@5.7.3))
postcss:
specifier: ^8.4.49
version: 8.5.1
prettier-plugin-tailwindcss:
specifier: ^0.6.9
specifier: ^0.6.11
version: 0.6.11(@ianvs/prettier-plugin-sort-imports@4.4.1(@vue/compiler-sfc@3.5.13)(prettier@3.5.0))(prettier@3.5.0)
prismjs:
specifier: ^1.29.0
@ -72,8 +63,8 @@ importers:
specifier: ^14.1.0
version: 14.6.0
tailwindcss:
specifier: ^3.4.17
version: 3.4.17(ts-node@10.9.2(@types/node@22.13.1)(typescript@5.7.3))
specifier: ^4.0.6
version: 4.0.6
vue:
specifier: ^3.5.13
version: 3.5.13(typescript@5.7.3)
@ -168,10 +159,6 @@ importers:
packages:
'@alloc/quick-lru@5.2.0':
resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
engines: {node: '>=10'}
'@ampproject/remapping@2.3.0':
resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==}
engines: {node: '>=6.0.0'}
@ -901,9 +888,6 @@ packages:
resolution: {integrity: sha512-iWGyOCu0TuzvCBisWbGv2K9+7QCfE0ztgtrZOvb9iF7V7ChVkD15Obe3HevZrhjngAc34jDA+OMSuSvkrpTy4A==}
engines: {node: '>= 10'}
'@tailwindcss/postcss@4.0.5':
resolution: {integrity: sha512-U7IPb+KMASETtUvISwePM+1h+jLQspXf2ncfX/LmP/4AaH7b7DJQhqXzDCaJQd/MIh54dRUO93i9q4+Xm7dlVg==}
'@tailwindcss/typography@0.5.16':
resolution: {integrity: sha512-0wDLwCVF5V3x3b1SGXPCDcdsbDHMBe+lkFzBRaHeLvNi+nrrnZ1lA18u+OTWO8iSWU2GxUOCvlXtDuqftc1oiA==}
peerDependencies:
@ -1188,13 +1172,6 @@ packages:
ansi_up@6.0.2:
resolution: {integrity: sha512-3G3vKvl1ilEp7J1u6BmULpMA0xVoW/f4Ekqhl8RTrJrhEBkonKn5k3bUc5Xt+qDayA6iDX0jyUh3AbZjB/l0tw==}
any-promise@1.3.0:
resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==}
anymatch@3.1.3:
resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
engines: {node: '>= 8'}
are-docs-informative@0.0.2:
resolution: {integrity: sha512-ixiS0nLNNG5jNQzgZJNoUpBKdo9yTYZMGJ+QgT2jmjR7G7+QHRCc4v6LQ3NgE7EBJq+o0ams3waJwkrlBom8Ig==}
engines: {node: '>=14'}
@ -1202,9 +1179,6 @@ packages:
arg@4.1.3:
resolution: {integrity: sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==}
arg@5.0.2:
resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
argparse@2.0.1:
resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
@ -1220,13 +1194,6 @@ packages:
engines: {node: '>= 4.5.0'}
hasBin: true
autoprefixer@10.4.20:
resolution: {integrity: sha512-XY25y5xSv/wEoqzDyXXME4AFfkZI0P23z6Fs3YgymDnKJkCGOnkL0iTxCa85UTqaSgfcqyf3UA6+c7wUvx/16g==}
engines: {node: ^10 || ^12 || >=14}
hasBin: true
peerDependencies:
postcss: ^8.1.0
babel-plugin-prismjs@2.1.0:
resolution: {integrity: sha512-ehzSKYfeAz4U78zi/sfwsjDPlq0LvDKxNefcZTJ/iKBu+plsHsLqZhUeGf1+82LAcA35UZGbU6ksEx2Utphc/g==}
peerDependencies:
@ -1235,10 +1202,6 @@ packages:
balanced-match@1.0.2:
resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
binary-extensions@2.3.0:
resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==}
engines: {node: '>=8'}
boolbase@1.0.0:
resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==}
@ -1269,10 +1232,6 @@ packages:
resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
engines: {node: '>=6'}
camelcase-css@2.0.1:
resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
engines: {node: '>= 6'}
caniuse-lite@1.0.30001696:
resolution: {integrity: sha512-pDCPkvzfa39ehJtJ+OwGT/2yvT2SbjfHhiIW2LWOAcMQ7BzwxT/XuyUp4OTOd0XFWA6BKw0JalnBHgSi5DGJBQ==}
@ -1298,10 +1257,6 @@ packages:
resolution: {integrity: sha512-OAlb+T7V4Op9OwdkjmguYRqncdlx5JiofwOAUkmTF+jNdHwzTaTs4sRAGpzLF3oOz5xAyDGrPgeIDFQmDOTiJw==}
engines: {node: '>= 16'}
chokidar@3.6.0:
resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
engines: {node: '>= 8.10.0'}
ci-info@4.1.0:
resolution: {integrity: sha512-HutrvTNsF48wnxkzERIXOe5/mlcfFcbfCmwcg6CJnizbSue78AbDt+1cgl26zwn61WFxhcPykPfZrbqjGmBb4A==}
engines: {node: '>=8'}
@ -1329,10 +1284,6 @@ packages:
resolution: {integrity: sha512-y4Mg2tXshplEbSGzx7amzPwKKOCGuoSRP/CjEdwwk0FOGlUbq6lKuoyDZTNZkmxHdJtp54hdfY/JUrdL7Xfdug==}
engines: {node: '>=14'}
commander@4.1.1:
resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==}
engines: {node: '>= 6'}
commander@7.2.0:
resolution: {integrity: sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==}
engines: {node: '>= 10'}
@ -1454,16 +1405,10 @@ packages:
devlop@1.1.0:
resolution: {integrity: sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==}
didyoumean@1.2.2:
resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
diff@4.0.2:
resolution: {integrity: sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==}
engines: {node: '>=0.3.1'}
dlv@1.1.3:
resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==}
doctrine@3.0.0:
resolution: {integrity: sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==}
engines: {node: '>=6.0.0'}
@ -1806,9 +1751,6 @@ packages:
resolution: {integrity: sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==}
engines: {node: '>= 6'}
fraction.js@4.3.7:
resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==}
fs.realpath@1.0.0:
resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
@ -1937,10 +1879,6 @@ packages:
is-arrayish@0.2.1:
resolution: {integrity: sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==}
is-binary-path@2.1.0:
resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
engines: {node: '>=8'}
is-builtin-module@3.2.1:
resolution: {integrity: sha512-BSLE3HnV2syZ0FK0iMA/yUGplUeMmNz4AW5fnTunbCIqZi4vG3WjJT9FHMy5D69xmAYBHXQhJdALdpwVxV501A==}
engines: {node: '>=6'}
@ -1977,10 +1915,6 @@ packages:
jackspeak@3.4.3:
resolution: {integrity: sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==}
jiti@1.21.7:
resolution: {integrity: sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==}
hasBin: true
jiti@2.4.2:
resolution: {integrity: sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==}
hasBin: true
@ -2118,10 +2052,6 @@ packages:
resolution: {integrity: sha512-FmGoeD4S05ewj+AkhTY+D+myDvXI6eL27FjHIjoyUkO/uw7WZD1fBVs0QxeYWa7E17CUHJaYX/RUGISCtcrG4Q==}
engines: {node: '>= 12.0.0'}
lilconfig@3.1.3:
resolution: {integrity: sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==}
engines: {node: '>=14'}
lines-and-columns@1.2.4:
resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
@ -2345,9 +2275,6 @@ packages:
muggle-string@0.4.1:
resolution: {integrity: sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==}
mz@2.7.0:
resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==}
nanoid@3.3.8:
resolution: {integrity: sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==}
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
@ -2375,28 +2302,12 @@ packages:
normalize-package-data@2.5.0:
resolution: {integrity: sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==}
normalize-path@3.0.0:
resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
engines: {node: '>=0.10.0'}
normalize-range@0.1.2:
resolution: {integrity: sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==}
engines: {node: '>=0.10.0'}
nth-check@2.1.1:
resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
nwsapi@2.2.16:
resolution: {integrity: sha512-F1I/bimDpj3ncaNDhfyMWuFqmQDBwDB0Fogc2qpL3BWvkQteFD/8BzWuIRl83rq0DXfm8SGt/HFhLXZyljTXcQ==}
object-assign@4.1.1:
resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
engines: {node: '>=0.10.0'}
object-hash@3.0.0:
resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==}
engines: {node: '>= 6'}
once@1.4.0:
resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
@ -2492,10 +2403,6 @@ packages:
resolution: {integrity: sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==}
engines: {node: '>=12'}
pify@2.3.0:
resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
engines: {node: '>=0.10.0'}
pinia@2.3.1:
resolution: {integrity: sha512-khUlZSwt9xXCaTbbxFYBKDc/bWAGWJjOgvxETwkTN7KRm66EeT1ZdZj6i2ceh9sP2Pzqsbc704r2yngBrxBVug==}
peerDependencies:
@ -2505,10 +2412,6 @@ packages:
typescript:
optional: true
pirates@4.0.6:
resolution: {integrity: sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==}
engines: {node: '>= 6'}
pkg-types@1.3.1:
resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
@ -2516,36 +2419,6 @@ packages:
resolution: {integrity: sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA==}
engines: {node: '>=4'}
postcss-import@15.1.0:
resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
engines: {node: '>=14.0.0'}
peerDependencies:
postcss: ^8.0.0
postcss-js@4.0.1:
resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==}
engines: {node: ^12 || ^14 || >= 16}
peerDependencies:
postcss: ^8.4.21
postcss-load-config@4.0.2:
resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==}
engines: {node: '>= 14'}
peerDependencies:
postcss: '>=8.0.9'
ts-node: '>=9.0.0'
peerDependenciesMeta:
postcss:
optional: true
ts-node:
optional: true
postcss-nested@6.2.0:
resolution: {integrity: sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==}
engines: {node: '>=12.0'}
peerDependencies:
postcss: ^8.2.14
postcss-safe-parser@6.0.0:
resolution: {integrity: sha512-FARHN8pwH+WiS2OPCxJI8FuRJpTVnn6ZNFiqAM2aeW2LwTHWWmWgIyKC6cUo0L8aeKiF/14MNvnpls6R2PBeMQ==}
engines: {node: '>=12.0'}
@ -2570,9 +2443,6 @@ packages:
resolution: {integrity: sha512-8I7Cd8sxiEITIp32xBK4K/Aj1ukX6vuWnx8oY/oAH35NfQI4OZaY5nd68Yx8HeN5S49uhQ6DL0rNk0ZBu/TaLg==}
engines: {node: ^8.10.0 || ^10.13.0 || ^11.10.1 || >=12.13.0}
postcss-value-parser@4.2.0:
resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
postcss@8.5.1:
resolution: {integrity: sha512-6oz2beyjc5VMn/KV1pPw8fliQkhBXrVn1Z3TVyqZxU8kZpzEKhBdmCFqI6ZbmGtamQvQGuU1sgPTk8ZrXDD7jQ==}
engines: {node: ^10 || ^12 || >=14}
@ -2655,9 +2525,6 @@ packages:
queue-microtask@1.2.3:
resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
read-cache@1.0.0:
resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
read-pkg-up@7.0.1:
resolution: {integrity: sha512-zK0TB7Xd6JpCLmlLmufqykGE+/TlOePD6qKClNW7hHDKFh/J7/7gCWGR7joEQEW1bKq3a3yUZSObOoWLFQ4ohg==}
engines: {node: '>=8'}
@ -2666,10 +2533,6 @@ packages:
resolution: {integrity: sha512-Ug69mNOpfvKDAc2Q8DRpMjjzdtrnv9HcSMX+4VsZxD1aZ6ZzrIE7rlzXBtWTyhULSMKg076AW6WR5iZpD0JiOg==}
engines: {node: '>=8'}
readdirp@3.6.0:
resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
engines: {node: '>=8.10.0'}
refa@0.12.1:
resolution: {integrity: sha512-J8rn6v4DBb2nnFqkqwy6/NnTYMcgLA+sLr0iIO41qpv0n+ngb7ksag2tMRl0inb1bbO/esUwzW1vbJi7K0sI0g==}
engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0}
@ -2836,11 +2699,6 @@ packages:
resolution: {integrity: sha512-yOI6G8WYfr0q8v8rRvE91wbxFU+rJPo760Va4MF6K0I6BZjO4r+xSynkvyPBP9tV1CIEUeRsiidjIs2rzb1CnQ==}
hasBin: true
sucrase@3.35.0:
resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==}
engines: {node: '>=16 || 14 >=14.17'}
hasBin: true
supports-color@7.2.0:
resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==}
engines: {node: '>=8'}
@ -2865,25 +2723,16 @@ packages:
resolution: {integrity: sha512-vrozgXDQwYO72vHjUb/HnFbQx1exDjoKzqx23aXEg2a9VIg2TSFZ8FmeZpTjUCFMYw7mpX4BE2SFu8wI7asYsw==}
engines: {node: ^14.18.0 || >=16.0.0}
tailwindcss@3.4.17:
resolution: {integrity: sha512-w33E2aCvSDP0tW9RZuNXadXlkHXqFzSkQew/aIa2i/Sj8fThxwovwlXHSPXTbAHwEIhBFXAedUhP2tueAKP8Og==}
engines: {node: '>=14.0.0'}
hasBin: true
tailwindcss@4.0.5:
resolution: {integrity: sha512-DZZIKX3tA23LGTjHdnwlJOTxfICD1cPeykLLsYF1RQBI9QsCR3i0szohJfJDVjr6aNRAIio5WVO7FGB77fRHwg==}
tailwindcss@4.0.6:
resolution: {integrity: sha512-mysewHYJKaXgNOW6pp5xon/emCsfAMnO8WMaGKZZ35fomnR/T5gYnRg2/yRTTrtXiEl1tiVkeRt0eMO6HxEZqw==}
tapable@2.2.1:
resolution: {integrity: sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==}
engines: {node: '>=6'}
thenify-all@1.6.0:
resolution: {integrity: sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==}
engines: {node: '>=0.8'}
thenify@3.3.1:
resolution: {integrity: sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==}
tinybench@2.9.0:
resolution: {integrity: sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==}
@ -2934,9 +2783,6 @@ packages:
peerDependencies:
typescript: '>=4.8.4'
ts-interface-checker@0.1.13:
resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
ts-node@10.9.2:
resolution: {integrity: sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==}
hasBin: true
@ -3257,8 +3103,6 @@ packages:
snapshots:
'@alloc/quick-lru@5.2.0': {}
'@ampproject/remapping@2.3.0':
dependencies:
'@jridgewell/gen-mapping': 0.3.8
@ -3936,22 +3780,13 @@ snapshots:
'@tailwindcss/oxide-win32-arm64-msvc': 4.0.5
'@tailwindcss/oxide-win32-x64-msvc': 4.0.5
'@tailwindcss/postcss@4.0.5':
dependencies:
'@alloc/quick-lru': 5.2.0
'@tailwindcss/node': 4.0.5
'@tailwindcss/oxide': 4.0.5
lightningcss: 1.29.1
postcss: 8.5.1
tailwindcss: 4.0.5
'@tailwindcss/typography@0.5.16(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@22.13.1)(typescript@5.7.3)))':
'@tailwindcss/typography@0.5.16(tailwindcss@4.0.6)':
dependencies:
lodash.castarray: 4.4.0
lodash.isplainobject: 4.0.6
lodash.merge: 4.6.2
postcss-selector-parser: 6.0.10
tailwindcss: 3.4.17(ts-node@10.9.2(@types/node@22.13.1)(typescript@5.7.3))
tailwindcss: 4.0.6
'@tailwindcss/vite@4.0.5(vite@6.1.0(@types/node@22.13.1)(jiti@2.4.2)(lightningcss@1.29.1)(stylus@0.57.0)(yaml@2.7.0))':
dependencies:
@ -4290,19 +4125,10 @@ snapshots:
ansi_up@6.0.2: {}
any-promise@1.3.0: {}
anymatch@3.1.3:
dependencies:
normalize-path: 3.0.0
picomatch: 2.3.1
are-docs-informative@0.0.2: {}
arg@4.1.3: {}
arg@5.0.2: {}
argparse@2.0.1: {}
assertion-error@2.0.1: {}
@ -4311,24 +4137,12 @@ snapshots:
atob@2.1.2: {}
autoprefixer@10.4.20(postcss@8.5.1):
dependencies:
browserslist: 4.24.4
caniuse-lite: 1.0.30001696
fraction.js: 4.3.7
normalize-range: 0.1.2
picocolors: 1.1.1
postcss: 8.5.1
postcss-value-parser: 4.2.0
babel-plugin-prismjs@2.1.0(prismjs@1.29.0):
dependencies:
prismjs: 1.29.0
balanced-match@1.0.2: {}
binary-extensions@2.3.0: {}
boolbase@1.0.0: {}
brace-expansion@1.1.11:
@ -4357,8 +4171,6 @@ snapshots:
callsites@3.1.0: {}
camelcase-css@2.0.1: {}
caniuse-lite@1.0.30001696: {}
ccount@2.0.1: {}
@ -4382,18 +4194,6 @@ snapshots:
check-error@2.1.1: {}
chokidar@3.6.0:
dependencies:
anymatch: 3.1.3
braces: 3.0.3
glob-parent: 5.1.2
is-binary-path: 2.1.0
is-glob: 4.0.3
normalize-path: 3.0.0
readdirp: 3.6.0
optionalDependencies:
fsevents: 2.3.3
ci-info@4.1.0: {}
clean-regexp@1.0.0:
@ -4418,8 +4218,6 @@ snapshots:
commander@10.0.1: {}
commander@4.1.1: {}
commander@7.2.0: {}
comment-parser@1.4.1: {}
@ -4523,12 +4321,8 @@ snapshots:
dependencies:
dequal: 2.0.3
didyoumean@1.2.2: {}
diff@4.0.2: {}
dlv@1.1.3: {}
doctrine@3.0.0:
dependencies:
esutils: 2.0.3
@ -4999,8 +4793,6 @@ snapshots:
combined-stream: 1.0.8
mime-types: 2.1.35
fraction.js@4.3.7: {}
fs.realpath@1.0.0: {}
fsevents@2.3.3:
@ -5114,10 +4906,6 @@ snapshots:
is-arrayish@0.2.1: {}
is-binary-path@2.1.0:
dependencies:
binary-extensions: 2.3.0
is-builtin-module@3.2.1:
dependencies:
builtin-modules: 3.3.0
@ -5150,8 +4938,6 @@ snapshots:
optionalDependencies:
'@pkgjs/parseargs': 0.11.0
jiti@1.21.7: {}
jiti@2.4.2: {}
js-base64@3.7.7: {}
@ -5277,8 +5063,6 @@ snapshots:
lightningcss-win32-arm64-msvc: 1.29.1
lightningcss-win32-x64-msvc: 1.29.1
lilconfig@3.1.3: {}
lines-and-columns@1.2.4: {}
local-pkg@1.0.0:
@ -5661,12 +5445,6 @@ snapshots:
muggle-string@0.4.1: {}
mz@2.7.0:
dependencies:
any-promise: 1.3.0
object-assign: 4.1.1
thenify-all: 1.6.0
nanoid@3.3.8: {}
natural-compare@1.4.0: {}
@ -5693,20 +5471,12 @@ snapshots:
semver: 7.7.1
validate-npm-package-license: 3.0.4
normalize-path@3.0.0: {}
normalize-range@0.1.2: {}
nth-check@2.1.1:
dependencies:
boolbase: 1.0.0
nwsapi@2.2.16: {}
object-assign@4.1.1: {}
object-hash@3.0.0: {}
once@1.4.0:
dependencies:
wrappy: 1.0.2
@ -5791,8 +5561,6 @@ snapshots:
picomatch@4.0.2: {}
pify@2.3.0: {}
pinia@2.3.1(typescript@5.7.3)(vue@3.5.13(typescript@5.7.3)):
dependencies:
'@vue/devtools-api': 6.6.4
@ -5803,8 +5571,6 @@ snapshots:
transitivePeerDependencies:
- '@vue/composition-api'
pirates@4.0.6: {}
pkg-types@1.3.1:
dependencies:
confbox: 0.1.8
@ -5813,31 +5579,6 @@ snapshots:
pluralize@8.0.0: {}
postcss-import@15.1.0(postcss@8.5.1):
dependencies:
postcss: 8.5.1
postcss-value-parser: 4.2.0
read-cache: 1.0.0
resolve: 1.22.10
postcss-js@4.0.1(postcss@8.5.1):
dependencies:
camelcase-css: 2.0.1
postcss: 8.5.1
postcss-load-config@4.0.2(postcss@8.5.1)(ts-node@10.9.2(@types/node@22.13.1)(typescript@5.7.3)):
dependencies:
lilconfig: 3.1.3
yaml: 2.7.0
optionalDependencies:
postcss: 8.5.1
ts-node: 10.9.2(@types/node@22.13.1)(typescript@5.7.3)
postcss-nested@6.2.0(postcss@8.5.1):
dependencies:
postcss: 8.5.1
postcss-selector-parser: 6.1.2
postcss-safe-parser@6.0.0(postcss@8.5.1):
dependencies:
postcss: 8.5.1
@ -5866,8 +5607,6 @@ snapshots:
transitivePeerDependencies:
- supports-color
postcss-value-parser@4.2.0: {}
postcss@8.5.1:
dependencies:
nanoid: 3.3.8
@ -5892,10 +5631,6 @@ snapshots:
queue-microtask@1.2.3: {}
read-cache@1.0.0:
dependencies:
pify: 2.3.0
read-pkg-up@7.0.1:
dependencies:
find-up: 4.1.0
@ -5909,10 +5644,6 @@ snapshots:
parse-json: 5.2.0
type-fest: 0.6.0
readdirp@3.6.0:
dependencies:
picomatch: 2.3.1
refa@0.12.1:
dependencies:
'@eslint-community/regexpp': 4.12.1
@ -6084,16 +5815,6 @@ snapshots:
transitivePeerDependencies:
- supports-color
sucrase@3.35.0:
dependencies:
'@jridgewell/gen-mapping': 0.3.8
commander: 4.1.1
glob: 10.4.5
lines-and-columns: 1.2.4
mz: 2.7.0
pirates: 4.0.6
ts-interface-checker: 0.1.13
supports-color@7.2.0:
dependencies:
has-flag: 4.0.0
@ -6121,45 +5842,12 @@ snapshots:
'@pkgr/core': 0.1.1
tslib: 2.8.1
tailwindcss@3.4.17(ts-node@10.9.2(@types/node@22.13.1)(typescript@5.7.3)):
dependencies:
'@alloc/quick-lru': 5.2.0
arg: 5.0.2
chokidar: 3.6.0
didyoumean: 1.2.2
dlv: 1.1.3
fast-glob: 3.3.3
glob-parent: 6.0.2
is-glob: 4.0.3
jiti: 1.21.7
lilconfig: 3.1.3
micromatch: 4.0.8
normalize-path: 3.0.0
object-hash: 3.0.0
picocolors: 1.1.1
postcss: 8.5.1
postcss-import: 15.1.0(postcss@8.5.1)
postcss-js: 4.0.1(postcss@8.5.1)
postcss-load-config: 4.0.2(postcss@8.5.1)(ts-node@10.9.2(@types/node@22.13.1)(typescript@5.7.3))
postcss-nested: 6.2.0(postcss@8.5.1)
postcss-selector-parser: 6.1.2
resolve: 1.22.10
sucrase: 3.35.0
transitivePeerDependencies:
- ts-node
tailwindcss@4.0.5: {}
tailwindcss@4.0.6: {}
tapable@2.2.1: {}
thenify-all@1.6.0:
dependencies:
thenify: 3.3.1
thenify@3.3.1:
dependencies:
any-promise: 1.3.0
tinybench@2.9.0: {}
tinycolor2@1.6.0: {}
@ -6198,8 +5886,6 @@ snapshots:
dependencies:
typescript: 5.7.3
ts-interface-checker@0.1.13: {}
ts-node@10.9.2(@types/node@22.13.1)(typescript@5.7.3):
dependencies:
'@cspotcode/source-map-support': 0.8.1

View file

@ -1,7 +0,0 @@
// postcss.config.js
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
};

View file

@ -1,14 +1,14 @@
<template>
<div class="app m-auto flex h-full w-full flex-col bg-wp-background-200 dark:bg-wp-background-100">
<div class="app bg-wp-background-200 dark:bg-wp-background-100 m-auto flex h-full w-full flex-col">
<router-view v-if="blank" />
<template v-else>
<Navbar />
<main class="relative flex h-full min-h-0">
<div id="scroll-component" class="flex flex-grow flex-col overflow-y-auto">
<div id="scroll-component" class="flex grow flex-col overflow-y-auto">
<router-view />
</div>
<transition name="slide-right">
<PipelineFeedSidebar class="absolute bottom-0 right-0 top-0 w-full max-w-80 border-l shadow-md xl:max-w-96" />
<PipelineFeedSidebar class="absolute top-0 right-0 bottom-0 w-full max-w-80 border-l shadow-md xl:max-w-96" />
</transition>
</main>
</template>

View file

@ -1,17 +1,17 @@
<template>
<div v-if="stats" class="flex justify-center">
<div
class="w-full rounded-md border border-wp-background-300 bg-wp-background-200 px-5 py-5 text-wp-text-100 dark:bg-wp-background-100"
class="border-wp-background-300 bg-wp-background-200 text-wp-text-100 dark:bg-wp-background-100 w-full rounded-md border px-5 py-5"
>
<div class="flex w-full">
<h3 class="flex-1 text-lg font-semibold uppercase leading-tight">
<h3 class="flex-1 text-lg leading-tight font-semibold uppercase">
{{ $t('admin.settings.queue.stats.completed_count') }}
</h3>
</div>
<div class="relative overflow-hidden transition-all duration-500">
<div>
<div class="pb-4 lg:pb-6">
<h4 class="inline-block text-2xl font-semibold leading-tight lg:text-3xl">
<h4 class="inline-block text-2xl leading-tight font-semibold lg:text-3xl">
{{ stats.completed_count }}
</h4>
</div>
@ -33,9 +33,9 @@
v-for="(item, index) in data"
:key="item.key"
class="px-4 sm:w-full md:w-1/4"
:class="{ 'border-gray-300 dark:border-gray-600 md:border-l': index !== 0 }"
:class="{ 'border-gray-300 md:border-l dark:border-gray-600': index !== 0 }"
>
<div class="overflow-hidden text-ellipsis whitespace-nowrap text-sm">
<div class="overflow-hidden text-sm text-ellipsis whitespace-nowrap">
<span class="mr-1 inline-block h-2 w-2 rounded-full align-middle" :class="`${item.color}`">&nbsp;</span>
<span class="align-middle">{{ item.label }}</span>
</div>

View file

@ -1,9 +1,9 @@
<template>
<div v-if="!props.loading" class="space-y-4 text-wp-text-100">
<div v-if="!props.loading" class="text-wp-text-100 space-y-4">
<ListItem
v-for="agent in props.agents"
:key="agent.id"
class="items-center !bg-wp-background-200 dark:!bg-wp-background-100"
class="bg-wp-background-200! dark:bg-wp-background-100! items-center"
>
<span>{{ agent.name || `Agent ${agent.id}` }}</span>
<span class="ml-auto">
@ -30,7 +30,7 @@
<IconButton
icon="trash"
:title="$t('admin.settings.agents.delete_agent')"
class="ml-2 h-8 w-8 hover:text-wp-error-100"
class="hover:text-wp-error-100 ml-2 h-8 w-8"
:is-loading="props.isDeleting"
@click="$emit('delete', agent)"
/>

View file

@ -1,7 +1,7 @@
<template>
<span class="inline-flex text-xs font-medium">
<span
class="flex items-center rounded-l-full border-2 border-wp-state-neutral-100 bg-wp-state-neutral-100 py-0.5 pl-2 pr-1 text-gray-300"
class="border-wp-state-neutral-100 bg-wp-state-neutral-100 flex items-center rounded-l-full border-2 py-0.5 pr-1 pl-2 text-gray-300"
:class="{
'rounded-r-full pr-2': value === undefined,
}"
@ -10,7 +10,7 @@
</span>
<span
v-if="value !== undefined"
class="flex items-center rounded-r-full border-2 border-wp-state-neutral-100 py-0.5 pl-1 pr-2"
class="border-wp-state-neutral-100 flex items-center rounded-r-full border-2 py-0.5 pr-2 pl-1"
>
{{ value }}
</span>

View file

@ -2,25 +2,25 @@
<component
:is="to === undefined ? 'button' : httpLink ? 'a' : 'router-link'"
v-bind="btnAttrs"
class="relative flex flex-shrink-0 cursor-pointer items-center overflow-hidden whitespace-nowrap rounded-md border px-2 py-1 shadow-sm transition-all duration-150 disabled:cursor-not-allowed disabled:opacity-50"
class="relative flex shrink-0 cursor-pointer items-center overflow-hidden rounded-md border px-2 py-1 whitespace-nowrap shadow-xs transition-all duration-150 disabled:cursor-not-allowed disabled:opacity-50"
:class="{
'border-wp-control-neutral-300 bg-wp-control-neutral-100 text-wp-text-100 hover:bg-wp-control-neutral-200':
color === 'gray',
'border-wp-control-ok-300 bg-wp-control-ok-100 text-white hover:bg-wp-control-ok-200': color === 'green',
'border-wp-control-info-300 bg-wp-control-info-100 text-white hover:bg-wp-control-info-200': color === 'blue',
'border-wp-error-300 bg-wp-error-100 text-white hover:bg-wp-error-200': color === 'red',
'border-wp-control-ok-300 bg-wp-control-ok-100 hover:bg-wp-control-ok-200 text-white': color === 'green',
'border-wp-control-info-300 bg-wp-control-info-100 hover:bg-wp-control-info-200 text-white': color === 'blue',
'border-wp-error-300 bg-wp-error-100 hover:bg-wp-error-200 text-white': color === 'red',
...passedClasses,
}"
:title="title"
:disabled="disabled"
>
<slot>
<Icon v-if="startIcon" :name="startIcon" class="!h-5 !w-5" :class="{ invisible: isLoading, 'mr-1': text }" />
<Icon v-if="startIcon" :name="startIcon" class="h-5! w-5!" :class="{ invisible: isLoading, 'mr-1': text }" />
<span :class="{ invisible: isLoading }">{{ text }}</span>
<Icon v-if="endIcon" :name="endIcon" class="ml-2 h-6 w-6" :class="{ invisible: isLoading }" />
<div
v-if="isLoading"
class="absolute bottom-0 left-0 right-0 top-0 flex items-center justify-center"
class="absolute top-0 right-0 bottom-0 left-0 flex items-center justify-center"
:class="{
'bg-wp-control-neutral-200': color === 'gray',
'bg-wp-control-ok-200': color === 'green',

View file

@ -1,6 +1,6 @@
<template>
<span
class="inline-block min-w-5 rounded-full bg-wp-background-300 px-1.5 py-0.5 text-center text-xs font-bold leading-4 text-wp-text-100 dark:bg-wp-background-100"
class="bg-wp-background-300 text-wp-text-100 dark:bg-wp-background-100 inline-block min-w-5 rounded-full px-1.5 py-0.5 text-center text-xs leading-4 font-bold"
>
{{ value }}
</span>

View file

@ -3,9 +3,9 @@
:href="`${docsUrl}`"
:title="$t('documentation_for', { topic })"
target="_blank"
class="cursor-pointer text-wp-link-100 hover:text-wp-link-200"
class="text-wp-link-100 hover:text-wp-link-200 cursor-pointer"
>
<Icon name="question" class="!h-5 !w-5" />
<Icon name="question" class="h-5! w-5!" />
</a>
</template>

View file

@ -1,6 +1,6 @@
<template>
<div
class="flex items-center gap-2 rounded-md border border-l-4 border-solid border-wp-error-200 bg-wp-error-100 p-2 text-white"
class="border-wp-error-200 bg-wp-error-100 flex items-center gap-2 rounded-md border border-l-4 border-solid p-2 text-white"
>
<Icon v-if="!textOnly" name="alert" />
<slot>

View file

@ -21,7 +21,7 @@
<slot>
<Icon v-if="icon" :name="icon" />
</slot>
<div v-if="isLoading" class="absolute bottom-0 left-0 right-0 top-0 flex items-center justify-center">
<div v-if="isLoading" class="absolute top-0 right-0 bottom-0 left-0 flex items-center justify-center">
<Icon name="loading" class="animate-spin" />
</div>
</button>
@ -44,6 +44,8 @@ defineProps<{
</script>
<style scoped>
@reference '~/tailwind.css';
.icon-button {
@apply hover-effect relative flex items-center justify-center overflow-hidden rounded-md bg-transparent px-1 py-1 disabled:cursor-not-allowed disabled:opacity-50;
}

View file

@ -2,9 +2,9 @@
<component
:is="to ? 'router-link' : clickable ? 'button' : 'div'"
:to="to"
class="flex w-full overflow-hidden rounded-md border border-wp-background-400 bg-wp-background-100 p-4 dark:bg-wp-background-200"
class="border-wp-background-400 bg-wp-background-100 dark:bg-wp-background-200 flex w-full overflow-hidden rounded-md border p-4"
:class="{
'cursor-pointer hover:bg-wp-background-300 hover:shadow-md dark:hover:bg-wp-background-300': clickable || to,
'hover:bg-wp-background-300 dark:hover:bg-wp-background-300 cursor-pointer hover:shadow-md': clickable || to,
}"
>
<slot />

View file

@ -1,8 +1,8 @@
<template>
<div
class="flex items-center gap-4 rounded-md border border-l-4 border-solid border-wp-hint-warn-200 bg-wp-hint-warn-100 p-4 font-bold text-gray-700"
class="border-wp-hint-warn-200 bg-wp-hint-warn-100 flex items-center gap-4 rounded-md border border-l-4 border-solid p-4 font-bold text-gray-700"
>
<Icon v-if="!textOnly" name="alert" class="flex-shrink-0" />
<Icon v-if="!textOnly" name="alert" class="shrink-0" />
<slot>
<span class="whitespace-pre-wrap">{{ text }}</span>
</slot>

View file

@ -3,13 +3,13 @@
<input
:id="`checkbox-${id}`"
type="checkbox"
class="checkbox relative h-5 w-5 flex-shrink-0 cursor-pointer rounded-md border border-wp-control-neutral-200 bg-wp-control-neutral-100 transition-colors duration-150 checked:border-wp-control-ok-200 checked:bg-wp-control-ok-200 focus-visible:border-wp-control-neutral-300 checked:focus-visible:border-wp-control-ok-300"
class="checkbox border-wp-control-neutral-200 bg-wp-control-neutral-100 checked:border-wp-control-ok-200 checked:bg-wp-control-ok-200 focus-visible:border-wp-control-neutral-300 checked:focus-visible:border-wp-control-ok-300 relative h-5 w-5 shrink-0 cursor-pointer rounded-md border transition-colors duration-150"
:checked="innerValue"
@click="innerValue = !innerValue"
/>
<div class="ml-4 flex flex-col">
<label class="cursor-pointer text-wp-text-100" :for="`checkbox-${id}`">{{ label }}</label>
<span v-if="description" class="text-sm text-wp-text-alt-100">{{ description }}</span>
<label class="text-wp-text-100 cursor-pointer" :for="`checkbox-${id}`">{{ label }}</label>
<span v-if="description" class="text-wp-text-alt-100 text-sm">{{ description }}</span>
</div>
</div>
</template>
@ -39,6 +39,8 @@ const id = (Math.random() + 1).toString(36).substring(7);
</script>
<style scoped>
@reference '~/tailwind.css';
.checkbox {
width: 1.3rem;
height: 1.3rem;
@ -61,7 +63,6 @@ const id = (Math.random() + 1).toString(36).substring(7);
border-width: 0 2px 2px 0;
transform: translate(-50%, -60%) rotate(45deg);
opacity: 0;
@apply dark:border-white;
}
.checkbox:checked::before {

View file

@ -1,11 +1,11 @@
<template>
<div class="mb-4 mt-2 flex flex-col">
<div class="mt-2 mb-4 flex flex-col">
<div class="mb-2 flex items-center">
<label class="font-bold text-wp-text-100" :for="id" v-bind="$attrs">{{ label }}</label>
<label class="text-wp-text-100 font-bold" :for="id" v-bind="$attrs">{{ label }}</label>
<DocsLink v-if="docsUrl" :topic="label" :url="docsUrl" class="ml-2" />
<slot v-else-if="$slots.titleActions" name="titleActions" />
</div>
<div v-if="$slots.description" class="mb-2 text-sm text-wp-text-alt-100">
<div v-if="$slots.description" class="text-wp-text-alt-100 mb-2 text-sm">
<slot name="description" />
</div>
<slot :id="id" />

View file

@ -17,7 +17,7 @@
:placeholder="valuePlaceholder"
@update:model-value="updateItem(index, 'value', $event)"
/>
<div class="w-10 flex-shrink-0">
<div class="w-10 shrink-0">
<Button
v-if="index !== displayItems.length - 1"
type="button"

View file

@ -3,14 +3,14 @@
<input
:id="`radio-${id}-${option.value}`"
type="radio"
class="radio relative h-5 w-5 flex-shrink-0 cursor-pointer rounded-full border border-wp-control-neutral-200 bg-wp-control-neutral-100 checked:border-wp-control-ok-200 checked:bg-wp-control-ok-200 focus-visible:border-wp-control-neutral-300 checked:focus-visible:border-wp-control-ok-300"
class="radio border-wp-control-neutral-200 bg-wp-control-neutral-100 checked:border-wp-control-ok-200 checked:bg-wp-control-ok-200 focus-visible:border-wp-control-neutral-300 checked:focus-visible:border-wp-control-ok-300 relative h-5 w-5 shrink-0 cursor-pointer rounded-full border"
:value="option.value"
:checked="innerValue?.includes(option.value)"
@click="innerValue = option.value"
/>
<div class="ml-4 flex flex-col">
<label class="cursor-pointer text-wp-text-100" :for="`radio-${id}-${option.value}`">{{ option.text }}</label>
<span v-if="option.description" class="text-sm text-wp-text-alt-100">{{ option.description }}</span>
<label class="text-wp-text-100 cursor-pointer" :for="`radio-${id}-${option.value}`">{{ option.text }}</label>
<span v-if="option.description" class="text-wp-text-alt-100 text-sm">{{ option.description }}</span>
</div>
</div>
</template>
@ -41,6 +41,8 @@ const id = (Math.random() + 1).toString(36).substring(7);
</script>
<style scoped>
@reference '~/tailwind.css';
.radio {
width: 1.3rem;
height: 1.3rem;
@ -62,7 +64,6 @@ const id = (Math.random() + 1).toString(36).substring(7);
background: white;
transform: translate(-50%, -50%);
opacity: 0;
@apply dark:bg-white;
}
.radio:checked::before {

View file

@ -1,7 +1,7 @@
<template>
<select
v-model="innerValue"
class="w-full rounded-md border border-wp-control-neutral-200 bg-wp-control-neutral-100 px-2 py-1 text-wp-text-100"
class="border-wp-control-neutral-200 bg-wp-control-neutral-100 text-wp-text-100 w-full rounded-md border px-2 py-1"
>
<option v-if="placeholder" value="" class="hidden">{{ placeholder }}</option>
<option v-for="option in options" :key="option.value" :value="option.value" class="text-wp-text-100">

View file

@ -2,7 +2,7 @@
<input
v-if="lines === 1"
v-model="innerValue"
class="w-full rounded-md border border-wp-control-neutral-200 bg-wp-background-100 px-2 py-1 focus-visible:border-wp-control-neutral-300 focus-visible:outline-none"
class="border-wp-control-neutral-200 bg-wp-background-100 focus-visible:border-wp-control-neutral-300 w-full rounded-md border px-2 py-1 focus-visible:outline-hidden"
:class="{ 'opacity-50': disabled }"
:disabled="disabled"
:type="type"
@ -11,7 +11,7 @@
<textarea
v-else
v-model="innerValue"
class="w-full rounded-md border border-wp-control-neutral-200 bg-wp-background-100 px-2 py-1 focus-visible:border-wp-control-neutral-300 focus-visible:outline-none"
class="border-wp-control-neutral-200 bg-wp-background-100 focus-visible:border-wp-control-neutral-300 w-full rounded-md border px-2 py-1 focus-visible:outline-hidden"
:class="{ 'opacity-50': disabled }"
:disabled="disabled"
:placeholder="placeholder"

View file

@ -1,12 +1,12 @@
<template>
<div
class="w-full overflow-hidden rounded-md border border-wp-background-400 bg-wp-background-100 shadow dark:bg-wp-background-200"
class="border-wp-background-400 bg-wp-background-100 dark:bg-wp-background-200 w-full overflow-hidden rounded-md border shadow-sm"
>
<component
:is="collapsable ? 'button' : 'div'"
v-if="title"
type="button"
class="flex w-full gap-2 bg-wp-background-400 px-4 py-2 font-bold text-wp-text-100"
class="bg-wp-background-400 text-wp-text-100 flex w-full gap-2 px-4 py-2 font-bold"
@click="_collapsed = !_collapsed"
>
<Icon
@ -22,9 +22,9 @@
'max-h-auto': !collapsed,
'max-h-0': collapsed,
}"
class="overflow-hidden transition-height duration-150"
class="transition-height overflow-hidden duration-150"
>
<div class="w-full p-4 text-wp-text-100">
<div class="text-wp-text-100 w-full p-4">
<slot />
</div>
</div>

View file

@ -2,7 +2,7 @@
<!-- overlay -->
<div
v-if="open"
class="fixed bottom-0 left-0 right-0 top-0 z-40 bg-gray-900 opacity-80 print:hidden"
class="fixed top-0 right-0 bottom-0 left-0 z-40 bg-gray-900 opacity-80 print:hidden"
@click="$emit('close')"
/>
<!-- overlay end -->

View file

@ -1,8 +1,8 @@
<template>
<Panel>
<div class="mb-4 flex flex-col justify-center border-b pb-4 dark:border-wp-background-100">
<div class="dark:border-wp-background-100 mb-4 flex flex-col justify-center border-b pb-4">
<div class="flex items-center justify-between">
<h1 class="flex items-center gap-1 text-xl text-wp-text-100">
<h1 class="text-wp-text-100 flex items-center gap-1 text-xl">
{{ title }}
<DocsLink v-if="docsUrl" :topic="title" :url="docsUrl" />
</h1>
@ -10,7 +10,7 @@
</div>
<div class="flex flex-wrap items-center justify-between gap-x-4 gap-y-2">
<p v-if="description" class="text-sm text-wp-text-alt-100">{{ description }}</p>
<p v-if="description" class="text-wp-text-alt-100 text-sm">{{ description }}</p>
<div v-if="$slots.headerActions">
<slot name="headerActions" />
</div>

View file

@ -1,13 +1,11 @@
<template>
<IconButton
:title="pipelineCount > 0 ? `${$t('pipeline_feed')} (${pipelineCount})` : $t('pipeline_feed')"
class="active-pipelines-toggle relative !p-1.5 text-current"
class="active-pipelines-toggle relative p-1.5! text-current"
@click="toggle"
>
<div v-if="pipelineCount > 0" class="spinner" />
<div
class="z-0 flex h-full w-full items-center justify-center rounded-md bg-white bg-opacity-15 font-bold dark:bg-black dark:bg-opacity-10"
>
<div class="z-0 flex h-full w-full items-center justify-center rounded-md bg-white/15 font-bold dark:bg-black/10">
<!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
{{ pipelineCount > 9 ? '9+' : pipelineCount }}
</div>
@ -31,6 +29,8 @@ onMounted(async () => {
</script>
<style scoped>
@reference '~/tailwind.css';
@keyframes rotate {
100% {
transform: rotate(1turn);
@ -41,7 +41,7 @@ onMounted(async () => {
overflow: hidden;
}
.spinner::before {
@apply absolute bg-wp-primary-200 dark:bg-wp-primary-300;
@apply bg-wp-primary-200 absolute;
content: '';
left: -50%;
top: -50%;
@ -55,7 +55,7 @@ onMounted(async () => {
animation: rotate 1.5s linear infinite;
}
.spinner::after {
@apply absolute inset-0.5 bg-wp-primary-200 dark:bg-wp-primary-300;
@apply bg-wp-primary-200 absolute inset-0.5;
/*
The nested border radius needs to be calculated correctly to look right:
https://www.30secondsofcode.org/css/s/nested-border-radius/
@ -63,4 +63,9 @@ onMounted(async () => {
border-radius: calc(0.375rem - 0.125rem);
content: '';
}
:root[data-theme='dark'] .spinner::before,
:root[data-theme='dark'] .spinner::after {
@apply bg-wp-primary-300;
}
</style>

View file

@ -1,6 +1,6 @@
<template>
<nav
class="text-neutral-content flex border-b border-wp-background-100 bg-wp-primary-200 p-4 font-bold text-wp-primary-text-100 dark:bg-wp-primary-300"
class="text-neutral-content border-wp-background-100 bg-wp-primary-200 text-wp-primary-text-100 dark:bg-wp-primary-300 flex border-b p-4 font-bold"
>
<div class="flex items-center space-x-2">
<router-link :to="{ name: 'home' }" class="-my-2 flex flex-col px-2">
@ -26,11 +26,11 @@
:to="{ name: 'admin-settings' }"
>
<Icon name="settings" />
<div v-if="version?.needsUpdate" class="absolute right-2 top-2 h-3 w-3 rounded-full bg-wp-error-100" />
<div v-if="version?.needsUpdate" class="bg-wp-error-100 absolute top-2 right-2 h-3 w-3 rounded-full" />
</IconButton>
<ActivePipelines v-if="user" class="navbar-icon !p-1.5" />
<IconButton v-if="user" :to="{ name: 'user' }" :title="$t('user.settings.settings')" class="navbar-icon !p-1.5">
<ActivePipelines v-if="user" class="navbar-icon p-1.5!" />
<IconButton v-if="user" :to="{ name: 'user' }" :title="$t('user.settings.settings')" class="navbar-icon p-1.5!">
<img v-if="user && user.avatar_url" class="rounded-md" :src="`${user.avatar_url}`" />
</IconButton>
<Button v-else :text="$t('login')" :to="`/login?url=${route.fullPath}`" />
@ -62,6 +62,8 @@ const { enableSwagger } = config;
</script>
<style scoped>
@reference '~/tailwind.css';
.navbar-icon {
@apply h-11 w-11 rounded-md p-2.5;
}

View file

@ -2,7 +2,7 @@
<Popup :open="open" @close="$emit('close')">
<Panel v-if="!loading">
<form @submit.prevent="triggerDeployPipeline">
<span class="text-xl text-wp-text-100">{{
<span class="text-wp-text-100 text-xl">{{
$t('repo.deploy_pipeline.title', { pipelineId: pipelineNumber })
}}</span>
<InputField v-slot="{ id }" :label="$t('repo.deploy_pipeline.enter_target')">
@ -12,7 +12,7 @@
<TextField :id="id" v-model="payload.task" />
</InputField>
<InputField v-slot="{ id }" :label="$t('repo.deploy_pipeline.variables.title')">
<span class="mb-2 text-sm text-wp-text-alt-100">{{ $t('repo.deploy_pipeline.variables.desc') }}</span>
<span class="text-wp-text-alt-100 mb-2 text-sm">{{ $t('repo.deploy_pipeline.variables.desc') }}</span>
<KeyValueEditor
:id="id"
v-model="payload.variables"

View file

@ -1,9 +1,9 @@
<template>
<header
class="border-b border-wp-background-400 bg-wp-background-100 text-wp-text-100 dark:border-wp-background-100 dark:bg-wp-background-300"
class="border-wp-background-400 bg-wp-background-100 text-wp-text-100 dark:border-wp-background-100 dark:bg-wp-background-300 border-b"
:class="{ 'md:px-4': fullWidth }"
>
<Container :full-width="fullWidth" class="!py-0">
<Container :full-width="fullWidth" class="py-0!">
<div class="flex w-full flex-col gap-2 py-3 md:flex-row md:items-center md:justify-between md:gap-10">
<div
class="flex min-h-10 content-start items-center"
@ -15,16 +15,16 @@
v-if="goBack"
icon="back"
:title="$t('back')"
class="md:display-unset mr-2 hidden h-8 w-8 flex-shrink-0 md:justify-between"
class="md:display-unset mr-2 hidden h-8 w-8 shrink-0 md:justify-between"
@click="goBack"
/>
<h1 class="flex min-w-0 items-center gap-x-2 text-xl text-wp-text-100">
<h1 class="text-wp-text-100 flex min-w-0 items-center gap-x-2 text-xl">
<slot name="title" />
</h1>
</div>
<TextField
v-if="searchBoxPresent"
class="order-3 w-full flex-grow md:order-none md:w-auto"
class="order-3 w-full grow md:order-none md:w-auto"
:aria-label="$t('search')"
:placeholder="$t('search')"
:model-value="search"

View file

@ -5,14 +5,14 @@
v-for="tab in visibleTabs"
:key="tab.title"
:to="tab.to"
class="flex cursor-pointer items-center whitespace-nowrap border-b-2 border-transparent py-1 text-wp-text-100"
:active-class="tab.matchChildren ? '!border-wp-text-100' : ''"
:exact-active-class="tab.matchChildren ? '' : '!border-wp-text-100'"
class="text-wp-text-100 flex cursor-pointer items-center border-b-2 border-transparent py-1 whitespace-nowrap"
:active-class="tab.matchChildren ? 'border-wp-text-100!' : ''"
:exact-active-class="tab.matchChildren ? '' : 'border-wp-text-100!'"
>
<span
class="flex w-full min-w-20 flex-row items-center justify-center gap-2 rounded-md px-2 py-1 hover:bg-wp-background-200 dark:hover:bg-wp-background-100"
class="hover:bg-wp-background-200 dark:hover:bg-wp-background-100 flex w-full min-w-20 flex-row items-center justify-center gap-2 rounded-md px-2 py-1"
>
<Icon v-if="tab.icon" :name="tab.icon" :class="tab.iconClass" class="flex-shrink-0" />
<Icon v-if="tab.icon" :name="tab.icon" :class="tab.iconClass" class="shrink-0" />
<span>{{ tab.title }}</span>
<CountBadge v-if="tab.count" :value="tab.count" />
</span>
@ -24,20 +24,20 @@
<div
v-if="isDropdownOpen"
class="tabs-dropdown absolute z-20 mt-1 rounded-md border border-wp-background-400 bg-wp-background-100 shadow-lg dark:bg-wp-background-200"
class="tabs-dropdown border-wp-background-400 bg-wp-background-100 dark:bg-wp-background-200 absolute z-20 mt-1 rounded-md border shadow-lg"
:class="[visibleTabs.length === 0 ? 'left-0' : 'right-0']"
>
<router-link
v-for="tab in hiddenTabs"
:key="tab.title"
:to="tab.to"
class="block w-full whitespace-nowrap p-1 text-left"
class="block w-full p-1 text-left whitespace-nowrap"
@click="isDropdownOpen = false"
>
<span
class="flex w-full min-w-20 flex-row items-center justify-center gap-2 rounded-md px-2 py-1 hover:bg-wp-background-200 dark:hover:bg-wp-background-100"
class="hover:bg-wp-background-200 dark:hover:bg-wp-background-100 flex w-full min-w-20 flex-row items-center justify-center gap-2 rounded-md px-2 py-1"
>
<Icon v-if="tab.icon" :name="tab.icon" :class="tab.iconClass" class="flex-shrink-0" />
<Icon v-if="tab.icon" :name="tab.icon" :class="tab.iconClass" class="shrink-0" />
<span>{{ tab.title }}</span>
</span>
</router-link>

View file

@ -1,5 +1,5 @@
<template>
<div v-if="pipeline" class="flex w-full text-wp-text-100">
<div v-if="pipeline" class="text-wp-text-100 flex w-full">
<PipelineStatusIcon :status="pipeline.status" class="flex items-center" />
<div class="ml-4 flex min-w-0 flex-col">
<router-link
@ -12,7 +12,7 @@
<!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
{{ repo?.owner }} / {{ repo?.name }}
</router-link>
<span class="overflow-hidden overflow-ellipsis whitespace-nowrap" :title="message">{{ shortMessage }}</span>
<span class="overflow-hidden text-ellipsis whitespace-nowrap" :title="message">{{ shortMessage }}</span>
<div class="mt-2 flex flex-col">
<div class="flex items-center space-x-2" :title="created">
<Icon name="since" />

View file

@ -2,7 +2,7 @@
<aside
v-if="isOpen"
ref="target"
class="z-50 flex flex-col items-center overflow-y-auto border-wp-background-400 bg-wp-background-100 dark:bg-wp-background-200"
class="border-wp-background-400 bg-wp-background-100 dark:bg-wp-background-200 z-50 flex flex-col items-center overflow-y-auto"
:aria-label="$t('pipeline_feed')"
>
<router-link
@ -12,12 +12,12 @@
name: 'repo-pipeline',
params: { repoId: pipeline.repo_id, pipelineId: pipeline.number },
}"
class="flex w-full border-b border-wp-background-400 px-2 py-4 hover:bg-wp-background-300 hover:shadow-sm dark:hover:bg-wp-background-400"
class="border-wp-background-400 hover:bg-wp-background-300 dark:hover:bg-wp-background-400 flex w-full border-b px-2 py-4 hover:shadow-xs"
>
<PipelineFeedItem :pipeline="pipeline" />
</router-link>
<span v-if="sortedPipelines.length === 0" class="m-4 text-wp-text-100">{{ $t('repo.pipeline.no_pipelines') }}</span>
<span v-if="sortedPipelines.length === 0" class="text-wp-text-100 m-4">{{ $t('repo.pipeline.no_pipelines') }}</span>
</aside>
</template>

View file

@ -1,9 +1,9 @@
<template>
<div class="space-y-4 text-wp-text-100">
<div class="text-wp-text-100 space-y-4">
<ListItem
v-for="registry in registries"
:key="registry.id"
class="items-center !bg-wp-background-200 dark:!bg-wp-background-100"
class="bg-wp-background-200! dark:bg-wp-background-100! items-center"
>
<span>{{ registry.address }}</span>
<IconButton
@ -15,7 +15,7 @@
<IconButton
v-if="!registry.readonly"
icon="trash"
class="h-8 w-8 hover:text-wp-error-100"
class="hover:text-wp-error-100 h-8 w-8"
:is-loading="isDeleting"
:title="$t('registries.delete')"
@click="deleteRegistry(registry)"

View file

@ -2,11 +2,11 @@
<router-link
v-if="repo"
:to="{ name: 'repo', params: { repoId: repo.id } }"
class="flex cursor-pointer flex-col overflow-hidden rounded-md border border-wp-background-400 bg-wp-background-100 p-4 hover:bg-wp-background-300 hover:shadow-md dark:bg-wp-background-200 dark:hover:bg-wp-background-300"
class="border-wp-background-400 bg-wp-background-100 hover:bg-wp-background-300 dark:bg-wp-background-200 dark:hover:bg-wp-background-300 flex cursor-pointer flex-col overflow-hidden rounded-md border p-4 hover:shadow-md"
>
<div class="grid grid-cols-[auto,1fr] items-center gap-y-4">
<div class="text-lg text-wp-text-100">{{ `${repo.owner} / ${repo.name}` }}</div>
<div class="ml-auto text-wp-text-100">
<div class="grid grid-cols-[auto_1fr] items-center gap-y-4">
<div class="text-wp-text-100 text-lg">{{ `${repo.owner} / ${repo.name}` }}</div>
<div class="text-wp-text-100 ml-auto">
<div
v-if="repo.visibility === RepoVisibility.Private"
:title="`${$t('repo.visibility.visibility')}: ${$t(`repo.visibility.private.private`)}`"
@ -21,14 +21,14 @@
</div>
</div>
<div class="col-span-2 flex w-full gap-x-4 text-wp-text-100">
<div class="text-wp-text-100 col-span-2 flex w-full gap-x-4">
<template v-if="lastPipeline">
<div class="flex min-w-0 flex-1 items-center gap-x-1">
<PipelineStatusIcon v-if="lastPipeline" :status="lastPipeline.status" />
<span class="overflow-hidden overflow-ellipsis whitespace-nowrap pl-1">{{ shortMessage }}</span>
<span class="overflow-hidden pl-1 text-ellipsis whitespace-nowrap">{{ shortMessage }}</span>
</div>
<div class="ml-auto flex flex-shrink-0 items-center gap-x-1">
<div class="ml-auto flex shrink-0 items-center gap-x-1">
<Icon name="since" />
<span>{{ since }}</span>
</div>

View file

@ -1,5 +1,5 @@
<template>
<ListItem v-if="pipeline" class="w-full !p-0">
<ListItem v-if="pipeline" class="w-full p-0!">
<div class="flex w-11 items-center">
<div
class="h-full w-3"
@ -17,19 +17,19 @@
</div>
</div>
<div class="flex min-w-0 flex-grow flex-wrap px-4 py-2 md:flex-nowrap">
<div class="hidden flex-shrink-0 items-center md:flex">
<div class="flex min-w-0 grow flex-wrap px-4 py-2 md:flex-nowrap">
<div class="hidden shrink-0 items-center md:flex">
<Icon v-if="pipeline.event === 'cron'" name="stopwatch" class="text-wp-text-100" />
<img v-else class="w-6 rounded-md" :src="pipeline.author_avatar" />
</div>
<div class="flex w-full min-w-0 items-center md:mx-4 md:w-auto">
<!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
<span class="md:display-unset hidden text-wp-text-alt-100">#{{ pipeline.number }}</span>
<span class="md:display-unset text-wp-text-alt-100 hidden">#{{ pipeline.number }}</span>
<!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
<span class="md:display-unset mx-2 hidden text-wp-text-alt-100">-</span>
<span class="md:display-unset text-wp-text-alt-100 mx-2 hidden">-</span>
<span
class="overflow-hidden overflow-ellipsis whitespace-nowrap text-wp-text-100 underline md:no-underline"
class="text-wp-text-100 overflow-hidden text-ellipsis whitespace-nowrap underline md:no-underline"
:title="message"
>
{{ shortMessage }}
@ -37,7 +37,7 @@
</div>
<div
class="grid w-full flex-shrink-0 grid-flow-col grid-cols-2 grid-rows-2 gap-x-4 gap-y-2 py-2 text-wp-text-100 md:ml-auto md:w-96"
class="text-wp-text-100 grid w-full shrink-0 grid-flow-col grid-cols-2 grid-rows-2 gap-x-4 gap-y-2 py-2 md:ml-auto md:w-96"
>
<div class="flex min-w-0 items-center space-x-2">
<span :title="pipelineEventTitle">

View file

@ -1,14 +1,14 @@
<template>
<div v-if="pipeline" class="flex flex-col pt-10 md:pt-0">
<div
class="code-box-log flex flex-grow flex-col overflow-hidden !p-0 shadow md:mt-0 md:!rounded-md"
class="code-box-log flex grow flex-col overflow-hidden p-0! shadow-sm md:mt-0 md:rounded-md!"
@mouseover="showActions = true"
@mouseleave="showActions = false"
>
<div
class="fixed left-0 top-0 flex w-full flex-row items-center bg-wp-code-100 px-4 py-2 md:relative md:left-auto md:top-auto"
class="bg-wp-code-100 fixed top-0 left-0 flex w-full flex-row items-center px-4 py-2 md:relative md:top-auto md:left-auto"
>
<span class="text-base font-bold text-wp-code-text-alt-100">
<span class="text-wp-code-text-alt-100 text-base font-bold">
<span class="md:display-unset hidden">{{ $t('repo.pipeline.log_title') }}</span>
<span class="md:hidden">{{ step?.name }}</span>
</span>
@ -18,14 +18,14 @@
v-if="step?.finished !== undefined && hasLogs"
:is-loading="downloadInProgress"
:title="$t('repo.pipeline.actions.log_download')"
class="hover:!bg-white hover:!bg-opacity-10"
class="hover:bg-white/10!"
icon="download"
@click="download"
/>
<IconButton
v-if="step?.finished !== undefined && hasLogs && hasPushPermission"
:title="$t('repo.pipeline.actions.log_delete')"
class="hover:!bg-white hover:!bg-opacity-10"
class="hover:bg-white/10!"
icon="trash"
@click="deleteLogs"
/>
@ -34,32 +34,28 @@
:title="
autoScroll ? $t('repo.pipeline.actions.log_auto_scroll_off') : $t('repo.pipeline.actions.log_auto_scroll')
"
class="hover:!bg-white hover:!bg-opacity-10"
class="hover:bg-white/10!"
:icon="autoScroll ? 'auto-scroll' : 'auto-scroll-off'"
@click="autoScroll = !autoScroll"
/>
<IconButton
class="hover:!bg-white hover:!bg-opacity-10 md:!hidden"
icon="close"
@click="$emit('update:step-id', null)"
/>
<IconButton class="hover:bg-white/10! md:hidden!" icon="close" @click="$emit('update:step-id', null)" />
</div>
</div>
<div
v-show="hasLogs && loadedLogs && (log?.length || 0) > 0"
ref="consoleElement"
class="grid w-full max-w-full flex-grow auto-rows-min grid-cols-[min-content,minmax(0,1fr),min-content] overflow-y-auto overflow-x-hidden p-4 text-xs md:text-sm"
class="grid w-full max-w-full grow auto-rows-min grid-cols-[min-content_minmax(0,1fr)_min-content] overflow-x-hidden overflow-y-auto p-4 text-xs md:text-sm"
>
<div v-for="line in log" :key="line.index" class="contents font-mono">
<a
:id="`L${line.number}`"
:href="`#L${line.number}`"
class="select-none whitespace-nowrap pl-2 pr-6 text-right text-wp-code-text-alt-100"
class="text-wp-code-text-alt-100 pr-6 pl-2 text-right whitespace-nowrap select-none"
:class="{
'bg-red-600 bg-opacity-40 dark:bg-red-800 dark:bg-opacity-50': line.type === 'error',
'bg-yellow-600 bg-opacity-40 dark:bg-yellow-800 dark:bg-opacity-50': line.type === 'warning',
'bg-blue-600 bg-opacity-30': isSelected(line),
'bg-red-600/40 dark:bg-red-800/50': line.type === 'error',
'bg-yellow-600/40 dark:bg-yellow-800/50': line.type === 'warning',
'bg-blue-600/30': isSelected(line),
underline: isSelected(line),
}"
>
@ -67,21 +63,21 @@
</a>
<!-- eslint-disable vue/no-v-html -->
<span
class="whitespace-pre-wrap break-words align-top"
class="align-top break-words whitespace-pre-wrap"
:class="{
'bg-10.168.64.121-600 bg-opacity-40 dark:bg-red-800 dark:bg-opacity-50': line.type === 'error',
'bg-yellow-600 bg-opacity-40 dark:bg-yellow-800 dark:bg-opacity-50': line.type === 'warning',
'bg-blue-600 bg-opacity-30': isSelected(line),
'bg-red-600/40 dark:bg-red-800/50': line.type === 'error',
'bg-yellow-600/40 dark:bg-yellow-800/50': line.type === 'warning',
'bg-blue-600/30': isSelected(line),
}"
v-html="line.text"
/>
<!-- eslint-enable vue/no-v-html -->
<span
class="select-none whitespace-nowrap pr-1 text-right text-wp-code-text-alt-100"
class="text-wp-code-text-alt-100 pr-1 text-right whitespace-nowrap select-none"
:class="{
'bg-red-600 bg-opacity-40 dark:bg-red-800 dark:bg-opacity-50': line.type === 'error',
'bg-yellow-600 bg-opacity-40 dark:bg-yellow-800 dark:bg-opacity-50': line.type === 'warning',
'bg-blue-600 bg-opacity-30': isSelected(line),
'bg-red-600/40 dark:bg-red-800/50': line.type === 'error',
'bg-yellow-600/40 dark:bg-yellow-800/50': line.type === 'warning',
'bg-blue-600/30': isSelected(line),
}"
>
{{ formatTime(line.time) }}
@ -89,7 +85,7 @@
</div>
</div>
<div class="m-auto text-xl text-wp-text-alt-100">
<div class="text-wp-text-alt-100 m-auto text-xl">
<span v-if="step?.state === 'skipped'">{{ $t('repo.pipeline.actions.canceled') }}</span>
<span v-else-if="!step?.started">{{ $t('repo.pipeline.step_not_started') }}</span>
<div v-else-if="!loadedLogs">{{ $t('repo.pipeline.loading') }}</div>
@ -98,9 +94,9 @@
<div
v-if="step?.finished !== undefined"
class="text-md flex w-full items-center bg-wp-code-100 p-4 font-bold text-wp-code-text-alt-100"
class="text-md bg-wp-code-100 text-wp-code-text-alt-100 flex w-full items-center p-4 font-bold"
>
<PipelineStatusIcon :status="step.state" class="!h-4 !w-4" />
<PipelineStatusIcon :status="step.state" class="h-4! w-4!" />
<span v-if="step?.error" class="px-2">{{ step.error }}</span>
<span v-else class="px-2">{{ $t('repo.pipeline.exit_code', { exitCode: step.exit_code }) }}</span>
</div>

View file

@ -7,6 +7,8 @@ import WoodpeckerIcon from '~/assets/woodpecker.svg?component';
</script>
<style scoped>
@reference '~/tailwind.css';
@keyframes peck {
0% {
transform: rotate(5deg) translateX(5%);

View file

@ -1,9 +1,9 @@
<template>
<div class="md:min-w-xs flex w-full flex-col gap-2 pb-2 text-wp-text-100 md:w-3/12 md:max-w-md">
<div class="text-wp-text-100 flex w-full flex-col gap-2 pb-2 md:w-3/12 md:max-w-md md:min-w-xs">
<div
class="flex flex-shrink-0 flex-wrap justify-between gap-1 rounded-md border border-wp-background-400 bg-wp-background-100 p-4 dark:bg-wp-background-200"
class="border-wp-background-400 bg-wp-background-100 dark:bg-wp-background-200 flex shrink-0 flex-wrap justify-between gap-1 rounded-md border p-4"
>
<div class="flex flex-shrink-0 items-center space-x-1">
<div class="flex shrink-0 items-center space-x-1">
<div class="flex items-center">
<Icon v-if="pipeline.event === 'cron'" name="stopwatch" />
<img v-else class="w-6 rounded-md" :src="pipeline.author_avatar" />
@ -12,7 +12,7 @@
</div>
<a
v-if="pipeline.event === 'pull_request' || pipeline.event === 'pull_request_closed'"
class="flex min-w-0 items-center space-x-1 text-wp-link-100 hover:text-wp-link-200"
class="text-wp-link-100 hover:text-wp-link-200 flex min-w-0 items-center space-x-1"
:href="pipeline.forge_url"
>
<Icon name="pull-request" />
@ -20,7 +20,7 @@
</a>
<router-link
v-else-if="pipeline.event === 'push' || pipeline.event === 'manual' || pipeline.event === 'deployment'"
class="flex min-w-0 items-center space-x-1 text-wp-link-100 hover:text-wp-link-200"
class="text-wp-link-100 hover:text-wp-link-200 flex min-w-0 items-center space-x-1"
:to="{ name: 'repo-branch', params: { branch: prettyRef } }"
>
<Icon v-if="pipeline.event === 'manual'" name="manual-pipeline" />
@ -33,14 +33,14 @@
<span class="truncate">{{ prettyRef }}</span>
</div>
<div class="flex flex-shrink-0 items-center">
<div class="flex shrink-0 items-center">
<template v-if="pipeline.event === 'pull_request'">
<Icon name="commit" />
<span>{{ pipeline.commit.slice(0, 10) }}</span>
</template>
<a
v-else
class="flex items-center text-wp-link-100 hover:text-wp-link-200"
class="text-wp-link-100 hover:text-wp-link-200 flex items-center"
:href="pipeline.forge_url"
target="_blank"
>
@ -54,15 +54,15 @@
<span>{{ $t('repo.pipeline.no_pipeline_steps') }}</span>
</Panel>
<div class="relative min-h-0 w-full flex-grow">
<div class="absolute left-0 right-0 top-0 flex h-full flex-col gap-y-2 md:overflow-y-auto">
<div class="relative min-h-0 w-full grow">
<div class="absolute top-0 right-0 left-0 flex h-full flex-col gap-y-2 md:overflow-y-auto">
<div
v-for="workflow in pipeline.workflows"
:key="workflow.id"
class="rounded-md border border-wp-background-400 bg-wp-background-100 p-2 shadow dark:bg-wp-background-200"
class="border-wp-background-400 bg-wp-background-100 dark:bg-wp-background-200 rounded-md border p-2 shadow-sm"
>
<div class="flex flex-col gap-2">
<div v-if="workflow.environ" class="flex flex-wrap justify-end gap-x-1 gap-y-2 pr-1 pt-1 text-xs">
<div v-if="workflow.environ" class="flex flex-wrap justify-end gap-x-1 gap-y-2 pt-1 pr-1 text-xs">
<div v-for="(value, key) in workflow.environ" :key="key">
<Badge :label="key" :value="value" />
</div>
@ -71,7 +71,7 @@
v-if="!singleConfig"
type="button"
:title="workflow.name"
class="hover-effect flex items-center gap-2 rounded-md px-1 py-2 hover:bg-wp-background-300 dark:hover:bg-wp-background-400"
class="hover-effect hover:bg-wp-background-300 dark:hover:bg-wp-background-400 flex items-center gap-2 rounded-md px-1 py-2"
@click="workflowsCollapsed[workflow.id] = !workflowsCollapsed[workflow.id]"
>
<Icon
@ -79,7 +79,7 @@
class="h-6 min-w-6 transition-transform duration-150"
:class="{ 'rotate-90 transform': !workflowsCollapsed[workflow.id] }"
/>
<PipelineStatusIcon :status="workflow.state" class="!h-4 !w-4" />
<PipelineStatusIcon :status="workflow.state" class="h-4! w-4!" />
<span class="truncate">{{ workflow.name }}</span>
<PipelineStepDuration
v-if="workflow.started !== workflow.finished"
@ -89,7 +89,7 @@
</button>
</div>
<div
class="overflow-hidden transition-height duration-150"
class="transition-height overflow-hidden duration-150"
:class="{ 'max-h-0': workflowsCollapsed[workflow.id], 'ml-[1.6rem]': !singleConfig }"
>
<button
@ -97,14 +97,14 @@
:key="step.pid"
type="button"
:title="step.name"
class="hover-effect flex w-full items-center gap-2 rounded-md border-2 border-transparent p-2 hover:bg-wp-background-300 dark:hover:bg-wp-background-400"
class="hover-effect hover:bg-wp-background-300 dark:hover:bg-wp-background-400 flex w-full items-center gap-2 rounded-md border-2 border-transparent p-2"
:class="{
'bg-wp-background-300 dark:bg-wp-background-400': selectedStepId && selectedStepId === step.pid,
'mt-1': !singleConfig || (workflow.children && step.pid !== workflow.children[0].pid),
}"
@click="$emit('update:selected-step-id', step.pid)"
>
<PipelineStatusIcon :service="step.type === StepType.Service" :status="step.state" class="!h-4 !w-4" />
<PipelineStatusIcon :service="step.type === StepType.Service" :status="step.state" class="h-4! w-4!" />
<span class="truncate">{{ step.name }}</span>
<PipelineStepDuration :step="step" />
</button>

View file

@ -22,7 +22,7 @@
</InputField>
<InputField v-slot="{ id }" :label="$t('secrets.plugins.images')">
<span class="mb-2 ml-1 text-wp-text-alt-100">{{ $t('secrets.plugins.desc') }}</span>
<span class="text-wp-text-alt-100 mb-2 ml-1">{{ $t('secrets.plugins.desc') }}</span>
<div class="flex flex-col gap-2">
<div v-for="image in innerValue.images" :key="image" class="flex gap-2">

View file

@ -1,9 +1,9 @@
<template>
<div class="space-y-4 text-wp-text-100">
<div class="text-wp-text-100 space-y-4">
<ListItem
v-for="secret in secrets"
:key="secret.id"
class="items-center !bg-wp-background-200 dark:!bg-wp-background-100"
class="bg-wp-background-200! dark:bg-wp-background-100! items-center"
>
<span>{{ secret.name }}</span>
<Badge
@ -23,7 +23,7 @@
/>
<IconButton
icon="trash"
class="ml-2 h-8 w-8 hover:text-wp-error-100"
class="hover:text-wp-error-100 ml-2 h-8 w-8"
:is-loading="isDeleting"
:title="$t('secrets.delete')"
@click="deleteSecret(secret)"

View file

@ -1,112 +1,114 @@
@reference "./tailwind.css";
:root,
:root[data-theme='light'] {
--wp-background-100: theme('colors.white');
--wp-background-200: theme('colors.gray.100');
--wp-background-300: theme('colors.gray.200');
--wp-background-400: theme('colors.gray.300');
--wp-background-100: var(--color-white);
--wp-background-200: var(--color-gray-100);
--wp-background-300: var(--color-gray-200);
--wp-background-400: var(--color-gray-300);
--wp-text-100: theme('colors.gray.600');
--wp-text-200: theme('colors.gray.700');
--wp-text-alt-100: theme('colors.gray.500');
--wp-text-100: var(--color-gray-600);
--wp-text-200: var(--color-gray-700);
--wp-text-alt-100: var(--color-gray-500);
--wp-primary-100: theme('colors.int-wp-primary.300');
--wp-primary-200: theme('colors.int-wp-primary.400');
--wp-primary-300: theme('colors.int-wp-primary.500');
--wp-primary-text-100: theme('colors.white');
--wp-primary-100: var(--color-int-wp-primary-300);
--wp-primary-200: var(--color-int-wp-primary-400);
--wp-primary-300: var(--color-int-wp-primary-500);
--wp-primary-text-100: var(--color-white);
--wp-control-neutral-100: theme('colors.white');
--wp-control-neutral-200: theme('colors.gray.300');
--wp-control-neutral-300: theme('colors.gray.400');
--wp-control-neutral-100: var(--color-white);
--wp-control-neutral-200: var(--color-gray-300);
--wp-control-neutral-300: var(--color-gray-400);
--wp-control-info-100: theme('colors.int-wp-control-info.100');
--wp-control-info-200: theme('colors.int-wp-control-info.200');
--wp-control-info-300: theme('colors.int-wp-control-info.300');
--wp-control-info-100: var(--color-int-wp-control-info-100);
--wp-control-info-200: var(--color-int-wp-control-info-200);
--wp-control-info-300: var(--color-int-wp-control-info-300);
--wp-control-ok-100: theme('colors.int-wp-control-ok.100');
--wp-control-ok-200: theme('colors.int-wp-control-ok.200');
--wp-control-ok-300: theme('colors.int-wp-control-ok.300');
--wp-control-ok-100: var(--color-int-wp-control-ok-100);
--wp-control-ok-200: var(--color-int-wp-control-ok-200);
--wp-control-ok-300: var(--color-int-wp-control-ok-300);
--wp-error-100: theme('colors.int-wp-error.100');
--wp-error-200: theme('colors.int-wp-error.200');
--wp-error-300: theme('colors.int-wp-error.300');
--wp-error-100: var(--color-int-wp-error-100);
--wp-error-200: var(--color-int-wp-error-200);
--wp-error-300: var(--color-int-wp-error-300);
--wp-state-neutral-100: theme('colors.int-wp-state-neutral.100');
--wp-state-ok-100: theme('colors.int-wp-state-ok.100');
--wp-state-info-100: theme('colors.int-wp-state-info.100');
--wp-state-warn-100: theme('colors.int-wp-state-warn.100');
--wp-state-neutral-100: var(--color-int-wp-state-neutral-100);
--wp-state-ok-100: var(--color-int-wp-state-ok-100);
--wp-state-info-100: var(--color-int-wp-state-info-100);
--wp-state-warn-100: var(--color-int-wp-state-warn-100);
--wp-hint-warn-100: theme('colors.int-wp-hint-warn.100');
--wp-hint-warn-200: theme('colors.int-wp-hint-warn.200');
--wp-hint-warn-100: var(--color-int-wp-hint-warn-100);
--wp-hint-warn-200: var(--color-int-wp-hint-warn-200);
--wp-code-inline-100: theme('colors.gray.200');
--wp-code-inline-200: theme('colors.gray.200');
--wp-code-inline-100: var(--color-gray-200);
--wp-code-inline-200: var(--color-gray-200);
--wp-code-inline-text-100: theme('colors.gray.600');
--wp-code-inline-text-100: var(--color-gray-600);
--wp-code-100: theme('colors.int-wp-secondary.300');
--wp-code-200: theme('colors.int-wp-secondary.600');
--wp-code-300: theme('colors.int-wp-secondary.600');
--wp-code-100: var(--color-int-wp-secondary-300);
--wp-code-200: var(--color-int-wp-secondary-600);
--wp-code-300: var(--color-int-wp-secondary-600);
--wp-code-text-100: theme('colors.gray.200');
--wp-code-text-alt-100: theme('colors.gray.300');
--wp-code-text-100: var(--color-gray-200);
--wp-code-text-alt-100: var(--color-gray-300);
--wp-link-100: theme('colors.blue.600');
--wp-link-200: theme('colors.blue.700');
--wp-link-100: var(--color-blue-600);
--wp-link-200: var(--color-blue-700);
}
:root[data-theme='dark'] {
--wp-background-100: theme('colors.int-wp-secondary.300');
--wp-background-200: theme('colors.int-wp-secondary.400');
--wp-background-300: theme('colors.int-wp-secondary.500');
--wp-background-400: theme('colors.int-wp-secondary.600');
--wp-background-100: var(--color-int-wp-secondary-300);
--wp-background-200: var(--color-int-wp-secondary-400);
--wp-background-300: var(--color-int-wp-secondary-500);
--wp-background-400: var(--color-int-wp-secondary-600);
--wp-text-100: theme('colors.gray.300');
--wp-text-200: theme('colors.gray.200');
--wp-text-alt-100: theme('colors.gray.400');
--wp-text-100: var(--color-gray-300);
--wp-text-200: var(--color-gray-200);
--wp-text-alt-100: var(--color-gray-400);
--wp-primary-100: theme('colors.int-wp-secondary.300');
--wp-primary-200: theme('colors.int-wp-secondary.400');
--wp-primary-300: theme('colors.int-wp-secondary.600');
--wp-primary-text-100: theme('colors.gray.300');
--wp-primary-100: var(--color-int-wp-secondary-300);
--wp-primary-200: var(--color-int-wp-secondary-400);
--wp-primary-300: var(--color-int-wp-secondary-600);
--wp-primary-text-100: var(--color-gray-300);
--wp-control-neutral-100: theme('colors.int-wp-secondary.300');
--wp-control-neutral-200: theme('colors.int-wp-secondary.600');
--wp-control-neutral-300: theme('colors.int-wp-secondary.700');
--wp-control-neutral-100: var(--color-int-wp-secondary-300);
--wp-control-neutral-200: var(--color-int-wp-secondary-600);
--wp-control-neutral-300: var(--color-int-wp-secondary-700);
--wp-control-info-100: theme('colors.int-wp-control-info-dark.100');
--wp-control-info-200: theme('colors.int-wp-control-info-dark.200');
--wp-control-info-300: theme('colors.int-wp-control-info-dark.300');
--wp-control-info-100: var(--color-int-wp-control-info-dark-100);
--wp-control-info-200: var(--color-int-wp-control-info-dark-200);
--wp-control-info-300: var(--color-int-wp-control-info-dark-300);
--wp-control-ok-100: theme('colors.int-wp-control-ok-dark.100');
--wp-control-ok-200: theme('colors.int-wp-control-ok-dark.200');
--wp-control-ok-300: theme('colors.int-wp-control-ok-dark.300');
--wp-control-ok-100: var(--color-int-wp-control-ok-dark-100);
--wp-control-ok-200: var(--color-int-wp-control-ok-dark-200);
--wp-control-ok-300: var(--color-int-wp-control-ok-dark-300);
--wp-error-100: theme('colors.int-wp-error.200');
--wp-error-200: theme('colors.int-wp-error.300');
--wp-error-300: theme('colors.int-wp-error.300');
--wp-error-100: var(--color-int-wp-error-200);
--wp-error-200: var(--color-int-wp-error-300);
--wp-error-300: var(--color-int-wp-error-300);
--wp-state-neutral-100: theme('colors.int-wp-state-neutral.100');
--wp-state-ok-100: theme('colors.int-wp-state-ok-dark.100');
--wp-state-info-100: theme('colors.int-wp-state-info-dark.100');
--wp-state-warn-100: theme('colors.int-wp-state-warn-dark.100');
--wp-state-neutral-100: var(--color-int-wp-state-neutral-100);
--wp-state-ok-100: var(--color-int-wp-state-ok-dark-100);
--wp-state-info-100: var(--color-int-wp-state-info-dark-100);
--wp-state-warn-100: var(--color-int-wp-state-warn-dark-100);
--wp-hint-warn-100: theme('colors.int-wp-hint-warn-dark.100');
--wp-hint-warn-200: theme('colors.int-wp-hint-warn-dark.200');
--wp-hint-warn-100: var(--color-int-wp-hint-warn-dark-100);
--wp-hint-warn-200: var(--color-int-wp-hint-warn-dark-200);
--wp-code-inline-100: theme('colors.int-wp-secondary.700');
--wp-code-inline-200: theme('colors.int-wp-secondary.300');
--wp-code-inline-100: var(--color-int-wp-secondary-700);
--wp-code-inline-200: var(--color-int-wp-secondary-300);
--wp-code-inline-text-100: theme('colors.gray.300');
--wp-code-inline-text-100: var(--color-gray-300);
--wp-code-100: theme('colors.int-wp-secondary.700'); /* #222631 */
--wp-code-200: theme('colors.int-wp-secondary.600'); /* #2a2e3a */
--wp-code-300: theme('colors.int-wp-secondary.800'); /* #1B1F28 */
--wp-code-100: var(--color-int-wp-secondary-700); /* #222631 */
--wp-code-200: var(--color-int-wp-secondary-600); /* #2a2e3a */
--wp-code-300: var(--color-int-wp-secondary-800); /* #1B1F28 */
--wp-code-text-100: theme('colors.gray.200');
--wp-code-text-alt-100: theme('colors.gray.400');
--wp-code-text-100: var(--color-gray-200);
--wp-code-text-alt-100: var(--color-gray-400);
--wp-link-100: theme('colors.blue.400');
--wp-link-200: theme('colors.blue.500');
--wp-link-100: var(--color-blue-400);
--wp-link-200: var(--color-blue-500);
}
html,
@ -125,11 +127,11 @@ body,
}
.vue-notification.success {
@apply !border-l-wp-control-ok-300 !bg-wp-control-ok-100;
@apply !border-wp-error-200 !bg-wp-control-ok-100 !border-l;
}
.vue-notification.error {
@apply !border-l-wp-error-200 !bg-wp-error-100;
@apply !border-wp-error-200 !bg-wp-error-100 !border-l;
}
*::-webkit-scrollbar {
@ -143,11 +145,11 @@ body,
*::-webkit-scrollbar-thumb {
transition: background 0.2s ease-in-out;
border: 3px solid transparent;
@apply rounded-full bg-gray-200 bg-clip-content dark:bg-wp-background-200;
@apply dark:bg-wp-background-200 rounded-full bg-gray-200 bg-clip-content;
}
*::-webkit-scrollbar-thumb:hover {
@apply bg-gray-300 dark:bg-wp-background-100;
@apply dark:bg-wp-background-100 bg-gray-300;
}
*::-webkit-scrollbar-corner {
@ -155,16 +157,16 @@ body,
}
.code-box {
@apply break-words rounded-md bg-wp-code-inline-100 p-4 text-sm text-wp-code-inline-text-100;
@apply bg-wp-code-inline-100 text-wp-code-inline-text-100 rounded-md p-4 text-sm break-words;
white-space: pre-wrap;
}
.code-box-inline,
code:not(pre > code) {
@apply rounded-md bg-wp-code-inline-100 px-1.5 py-0.5 text-wp-code-inline-text-100;
@apply bg-wp-code-inline-100 text-wp-code-inline-text-100 rounded-md px-1.5 py-0.5;
}
.code-box-log {
@apply break-words bg-wp-code-300 p-4 text-wp-code-text-100;
@apply bg-wp-code-300 text-wp-code-text-100 p-4 break-words;
white-space: pre-wrap;
}

File diff suppressed because it is too large Load diff

View file

@ -7,26 +7,26 @@
v-if="errorUri"
:href="errorUri"
target="_blank"
class="mt-1 cursor-pointer text-wp-link-100 hover:text-wp-link-200"
class="text-wp-link-100 hover:text-wp-link-200 mt-1 cursor-pointer"
>
<span>{{ errorUri }}</span>
</a>
</Error>
<div
class="flex min-h-sm w-full flex-col overflow-hidden border border-wp-background-400 bg-wp-background-100 shadow dark:bg-wp-background-200 md:m-8 md:w-3xl md:flex-row md:rounded-md"
class="min-h-sm border-wp-background-400 bg-wp-background-100 dark:bg-wp-background-200 flex w-full flex-col overflow-hidden border shadow-sm md:m-8 md:w-3xl md:flex-row md:rounded-md"
>
<div class="flex min-h-48 items-center justify-center bg-wp-primary-200 dark:bg-wp-primary-300 md:w-3/5">
<div class="bg-wp-primary-200 dark:bg-wp-primary-300 flex min-h-48 items-center justify-center md:w-3/5">
<WoodpeckerLogo preserveAspectRatio="xMinYMin slice" class="h-32 w-32 md:h-48 md:w-48" />
</div>
<div class="flex min-h-48 flex-col items-center justify-center gap-4 p-4 text-center md:w-2/5">
<h1 class="text-xl text-wp-text-100">{{ $t('welcome') }}</h1>
<h1 class="text-wp-text-100 text-xl">{{ $t('welcome') }}</h1>
<div class="flex flex-col gap-2">
<Button
v-for="forge in forges"
:key="forge.id"
:start-icon="forge.type === 'addon' ? 'repo' : forge.type"
class="!whitespace-normal"
class="whitespace-normal!"
@click="doLogin(forge.id)"
>
{{ $t('login_with', { forge: getHostFromUrl(forge) }) }}

View file

@ -13,7 +13,7 @@
:to="repo.active ? { name: 'repo', params: { repoId: repo.id } } : undefined"
>
<span class="text-wp-text-100">{{ repo.full_name }}</span>
<span v-if="repo.active" class="ml-auto text-wp-text-alt-100">{{ $t('repo.enable.enabled') }}</span>
<span v-if="repo.active" class="text-wp-text-alt-100 ml-auto">{{ $t('repo.enable.enabled') }}</span>
<div v-else class="ml-auto flex items-center">
<Badge v-if="repo.id" class="md:display-unset mr-2 hidden" :label="$t('repo.enable.disabled')" />
<Button
@ -24,7 +24,7 @@
</div>
</ListItem>
</template>
<div v-else-if="loading" class="flex justify-center text-wp-text-100">
<div v-else-if="loading" class="text-wp-text-100 flex justify-center">
<Icon name="spinner" />
</div>
</div>

View file

@ -18,7 +18,7 @@
</div>
<div class="flex flex-col gap-4">
<h2 class="text-lg text-wp-text-100">{{ $t('all_repositories') }}</h2>
<h2 class="text-wp-text-100 text-lg">{{ $t('all_repositories') }}</h2>
<div class="flex flex-col gap-4">
<RepoItem v-for="repo in reposLastActivity" :key="repo.id" :repo="repo" />
</div>
@ -28,7 +28,7 @@
<div v-if="reposLastActivity.length > 0" class="flex flex-col gap-4">
<RepoItem v-for="repo in reposLastActivity" :key="repo.id" :repo="repo" />
</div>
<span v-else class="text-center text-lg text-wp-text-100">{{ $t('no_search_results') }}</span>
<span v-else class="text-wp-text-100 text-center text-lg">{{ $t('no_search_results') }}</span>
</div>
</Transition>
</Scaffold>

View file

@ -1,7 +1,7 @@
<template>
<Settings :title="$t('info')">
<div class="flex flex-col items-center gap-4">
<WoodpeckerLogo class="h-32 w-32 fill-wp-text-200" />
<WoodpeckerLogo class="fill-wp-text-200 h-32 w-32" />
<i18n-t keypath="running_version" tag="p" class="text-center text-xl">
<span class="font-bold">{{ version?.current }}</span>

View file

@ -1,10 +1,10 @@
<template>
<Settings :title="$t('admin.settings.orgs.orgs')" :description="$t('admin.settings.orgs.desc')">
<div class="space-y-4 text-wp-text-100">
<div class="text-wp-text-100 space-y-4">
<ListItem
v-for="org in orgs"
:key="org.id"
class="items-center gap-2 !bg-wp-background-200 dark:!bg-wp-background-100"
class="bg-wp-background-200! dark:bg-wp-background-100! items-center gap-2"
>
<span>{{ org.name }}</span>
<IconButton
@ -22,7 +22,7 @@
<IconButton
icon="trash"
:title="$t('admin.settings.orgs.delete_org')"
class="ml-2 h-8 w-8 hover:text-wp-error-100"
class="hover:text-wp-error-100 ml-2 h-8 w-8"
:is-loading="isDeleting"
@click="deleteOrg(org)"
/>

View file

@ -26,11 +26,11 @@
<AdminQueueStats :stats="queueInfo?.stats" />
<div v-if="tasks.length > 0" class="flex flex-col">
<p class="mb-2 mt-6 text-xl">{{ $t('admin.settings.queue.tasks') }}</p>
<p class="mt-6 mb-2 text-xl">{{ $t('admin.settings.queue.tasks') }}</p>
<ListItem
v-for="task in tasks"
:key="task.id"
class="mb-2 items-center !bg-wp-background-200 dark:!bg-wp-background-100"
class="bg-wp-background-200! dark:bg-wp-background-100! mb-2 items-center"
>
<div
class="flex items-center"

View file

@ -9,11 +9,11 @@
/>
</template>
<div class="space-y-4 text-wp-text-100">
<div class="text-wp-text-100 space-y-4">
<ListItem
v-for="repo in repos"
:key="repo.id"
class="items-center gap-2 bg-wp-background-200 dark:!bg-wp-background-100"
class="bg-wp-background-200 dark:bg-wp-background-100! items-center gap-2"
>
<span>{{ repo.full_name }}</span>
<div class="ml-auto flex items-center">

View file

@ -10,11 +10,11 @@
<Button v-else :text="$t('admin.settings.users.add')" start-icon="plus" @click="showAddUser" />
</template>
<div v-if="!selectedUser" class="space-y-4 text-wp-text-100">
<div v-if="!selectedUser" class="text-wp-text-100 space-y-4">
<ListItem
v-for="user in users"
:key="user.id"
class="items-center gap-2 !bg-wp-background-200 dark:!bg-wp-background-100"
class="bg-wp-background-200! dark:bg-wp-background-100! items-center gap-2"
>
<img v-if="user.avatar_url" class="h-6 rounded-md" :src="user.avatar_url" />
<span>{{ user.login }}</span>
@ -33,7 +33,7 @@
<IconButton
icon="trash"
:title="$t('admin.settings.users.delete_user')"
class="ml-2 h-8 w-8 hover:text-wp-error-100"
class="hover:text-wp-error-100 ml-2 h-8 w-8"
:is-loading="isDeleting"
@click="deleteUser(user)"
/>

View file

@ -1,6 +1,6 @@
<template>
<div class="m-auto flex flex-col gap-4">
<div class="text-center text-wp-text-100">
<div class="text-wp-text-100 text-center">
<WoodpeckerLogo preserveAspectRatio="xMinYMin slice" class="m-auto mb-8 w-32" />
<template v-if="state === 'confirm'">
<h1 class="text-4xl font-bold">{{ $t('login_to_cli') }}</h1>

View file

@ -17,7 +17,7 @@
<RepoItem v-for="repo in reposLastActivity" :key="repo.id" :repo="repo" />
</div>
<div v-if="(reposLastActivity || []).length <= 0" class="text-center">
<span class="m-auto text-wp-text-100">{{ $t('repo.user_none') }}</span>
<span class="text-wp-text-100 m-auto">{{ $t('repo.user_none') }}</span>
</div>
</Scaffold>
</template>

View file

@ -1,6 +1,6 @@
<template>
<div class="mb-4 flex w-full justify-center">
<span class="text-xl text-wp-text-100">{{ $t('repo.pipeline.pipelines_for', { branch }) }}</span>
<span class="text-wp-text-100 text-xl">{{ $t('repo.pipeline.pipelines_for', { branch }) }}</span>
</div>
<PipelineList :pipelines="pipelines" :repo="repo" />
</template>

View file

@ -11,7 +11,7 @@
<Badge v-if="branch === repo?.default_branch" :label="$t('default')" class="ml-auto" />
</ListItem>
</template>
<div v-else-if="loading" class="flex justify-center text-wp-text-100">
<div v-else-if="loading" class="text-wp-text-100 flex justify-center">
<Icon name="spinner" />
</div>
<Panel v-else class="flex justify-center">

View file

@ -1,12 +1,12 @@
<template>
<Panel v-if="!loading">
<form @submit.prevent="triggerManualPipeline">
<span class="text-xl text-wp-text-100">{{ $t('repo.manual_pipeline.title') }}</span>
<span class="text-wp-text-100 text-xl">{{ $t('repo.manual_pipeline.title') }}</span>
<InputField v-slot="{ id }" :label="$t('repo.manual_pipeline.select_branch')">
<SelectField :id="id" v-model="payload.branch" :options="branches" required />
</InputField>
<InputField v-slot="{ id }" :label="$t('repo.manual_pipeline.variables.title')">
<span class="mb-2 text-sm text-wp-text-alt-100">{{ $t('repo.manual_pipeline.variables.desc') }}</span>
<span class="text-wp-text-alt-100 mb-2 text-sm">{{ $t('repo.manual_pipeline.variables.desc') }}</span>
<KeyValueEditor
:id="id"
v-model="payload.variables"
@ -19,7 +19,7 @@
<Button type="submit" :text="$t('repo.manual_pipeline.trigger')" :disabled="!isFormValid" />
</form>
</Panel>
<div v-else class="flex justify-center text-wp-text-100">
<div v-else class="text-wp-text-100 flex justify-center">
<Icon name="spinner" />
</div>
</template>

View file

@ -1,6 +1,6 @@
<template>
<div class="mb-4 flex w-full justify-center">
<span class="text-xl text-wp-text-100">{{ $t('repo.pipeline.pipelines_for_pr', { index: pullRequest }) }}</span>
<span class="text-wp-text-100 text-xl">{{ $t('repo.pipeline.pipelines_for_pr', { index: pullRequest }) }}</span>
</div>
<PipelineList :pipelines="pipelines" :repo="repo" />
</template>

View file

@ -8,15 +8,15 @@
:to="{ name: 'repo-pull-request', params: { pullRequest: pullRequest.index } }"
>
<!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
<span class="md:display-unset hidden text-wp-text-alt-100">#{{ pullRequest.index }}</span>
<span class="md:display-unset text-wp-text-alt-100 hidden">#{{ pullRequest.index }}</span>
<!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
<span class="md:display-unset mx-2 hidden text-wp-text-alt-100">-</span>
<span class="overflow-hidden overflow-ellipsis whitespace-nowrap text-wp-text-100 underline md:no-underline">{{
<span class="md:display-unset text-wp-text-alt-100 mx-2 hidden">-</span>
<span class="text-wp-text-100 overflow-hidden text-ellipsis whitespace-nowrap underline md:no-underline">{{
pullRequest.title
}}</span>
</ListItem>
</template>
<div v-else-if="loading" class="flex justify-center text-wp-text-100">
<div v-else-if="loading" class="text-wp-text-100 flex justify-center">
<Icon name="spinner" />
</div>
<Panel v-else class="flex justify-center">

View file

@ -1,17 +1,17 @@
<template>
<Container full-width class="md:min-h-xs flex flex-grow-0 flex-col md:flex-grow md:px-4">
<div class="flex min-h-0 w-full flex-grow flex-wrap-reverse md:flex-nowrap md:gap-4">
<Container full-width class="md:min-h-xs flex grow-0 flex-col md:grow md:px-4">
<div class="flex min-h-0 w-full grow flex-wrap-reverse md:flex-nowrap md:gap-4">
<PipelineStepList
v-model:selected-step-id="selectedStepId"
:class="{ 'hidden md:flex': pipeline!.status === 'blocked' }"
:pipeline="pipeline!"
/>
<div class="relative flex flex-grow basis-full items-start justify-center md:basis-auto">
<div class="relative flex grow basis-full items-start justify-center md:basis-auto">
<div v-if="pipeline!.errors?.some((e) => !e.is_warning)" class="mb-4 w-full md:mb-auto">
<Panel>
<div class="flex flex-col items-center gap-4 text-center">
<Icon name="status-error" class="h-16 w-16 text-wp-error-100" size="1.5rem" />
<Icon name="status-error" class="text-wp-error-100 h-16 w-16" size="1.5rem" />
<span class="text-xl">{{ $t('repo.pipeline.we_got_some_errors') }}</span>
<Button color="red" :text="$t('repo.pipeline.show_errors')" :to="{ name: 'repo-pipeline-errors' }" />
</div>
@ -44,7 +44,7 @@
<div v-else-if="pipeline!.status === 'declined'" class="mb-4 w-full md:mb-auto">
<Panel>
<div class="flex flex-col items-center gap-4">
<Icon name="status-declined" size="1.5rem" class="h-16 w-16 text-wp-error-100" />
<Icon name="status-declined" size="1.5rem" class="text-wp-error-100 h-16 w-16" />
<p class="text-xl">{{ $t('repo.pipeline.protected.declined') }}</p>
</div>
</Panel>
@ -54,7 +54,7 @@
v-else-if="selectedStepId !== null"
v-model:step-id="selectedStepId"
:pipeline="pipeline!"
class="fixed left-0 top-0 h-full w-full md:absolute"
class="fixed top-0 left-0 h-full w-full md:absolute"
/>
</div>
</div>

View file

@ -7,7 +7,7 @@
collapsed-by-default
:title="pipelineConfigsDecoded && pipelineConfigsDecoded.length > 1 ? pipelineConfig.name : ''"
>
<SyntaxHighlight class="overflow-auto whitespace-pre font-mono" language="yaml" :code="pipelineConfig.data" />
<SyntaxHighlight class="overflow-auto font-mono whitespace-pre" language="yaml" :code="pipelineConfig.data" />
</Panel>
</div>
</template>

View file

@ -2,7 +2,7 @@
<template v-if="repoPermissions && repoPermissions.push">
<Panel>
<InputField :label="$t('repo.pipeline.debug.metadata_exec_title')">
<p class="mb-2 text-sm text-wp-text-alt-100">{{ $t('repo.pipeline.debug.metadata_exec_desc') }}</p>
<p class="text-wp-text-alt-100 mb-2 text-sm">{{ $t('repo.pipeline.debug.metadata_exec_desc') }}</p>
<pre class="code-box">{{ cliExecWithMetadata }}</pre>
</InputField>
<div class="flex items-center space-x-4">
@ -11,7 +11,7 @@
</Panel>
</template>
<div v-else class="flex h-full items-center justify-center">
<div class="rounded-lg bg-wp-error-100 p-8 text-center shadow-lg dark:bg-wp-error-200">
<div class="bg-wp-error-100 dark:bg-wp-error-200 rounded-lg p-8 text-center shadow-lg">
<p class="text-2xl font-bold text-white">{{ $t('repo.pipeline.debug.no_permission') }}</p>
</div>
</div>

View file

@ -3,11 +3,11 @@
<div class="flex flex-col gap-y-4">
<template v-for="(error, _index) in pipeline!.errors" :key="_index">
<div>
<div class="grid grid-cols-[minmax(10rem,auto),3fr]">
<div class="grid grid-cols-[minmax(10rem,auto)_3fr]">
<span class="flex items-center gap-x-2">
<Icon
name="alert"
class="my-1 flex-shrink-0"
class="my-1 shrink-0"
:class="{
'text-wp-state-warn-100': error.is_warning,
'text-wp-error-100': !error.is_warning,
@ -35,7 +35,7 @@
</span>
<span v-else />
</div>
<div class="col-start-2 grid grid-cols-[minmax(10rem,auto),4fr]">
<div class="col-start-2 grid grid-cols-[minmax(10rem,auto)_4fr]">
<span />
<span>
<RenderMarkdown :content="error.message" />

View file

@ -20,11 +20,11 @@
<template #headerActions>
<div class="flex w-full items-center justify-between gap-2">
<div class="flex min-w-0 content-start gap-2">
<PipelineStatusIcon :status="pipeline.status" class="flex flex-shrink-0" />
<span class="flex-shrink-0 text-center">{{ $t('repo.pipeline.pipeline', { pipelineId }) }}</span>
<PipelineStatusIcon :status="pipeline.status" class="flex shrink-0" />
<span class="shrink-0 text-center">{{ $t('repo.pipeline.pipeline', { pipelineId }) }}</span>
<!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -->
<span class="hidden md:inline-block">-</span>
<span class="min-w-0 overflow-hidden overflow-ellipsis whitespace-nowrap" :title="message">{{
<span class="min-w-0 overflow-hidden text-ellipsis whitespace-nowrap" :title="message">{{
shortMessage
}}</span>
</div>
@ -33,20 +33,20 @@
<div class="flex content-start gap-x-2">
<Button
v-if="pipeline.status === 'pending' || pipeline.status === 'running'"
class="flex-shrink-0"
class="shrink-0"
:text="$t('repo.pipeline.actions.cancel')"
:is-loading="isCancelingPipeline"
@click="cancelPipeline"
/>
<Button
class="flex-shrink-0"
class="shrink-0"
:text="$t('repo.pipeline.actions.restart')"
:is-loading="isRestartingPipeline"
@click="restartPipeline"
/>
<Button
v-if="pipeline.status === 'success' && repo.allow_deploy"
class="flex-shrink-0"
class="shrink-0"
:text="$t('repo.pipeline.actions.deploy')"
@click="showDeployPipelinePopup = true"
/>
@ -62,11 +62,11 @@
<template #tabActions>
<div class="flex flex-wrap gap-4 md:flex-nowrap">
<div class="flex flex-shrink-0 items-center gap-2" :title="$t('repo.pipeline.created', { created })">
<div class="flex shrink-0 items-center gap-2" :title="$t('repo.pipeline.created', { created })">
<Icon name="since" />
<span>{{ since }}</span>
</div>
<div class="flex flex-shrink-0 items-center gap-2" :title="$t('repo.pipeline.duration')">
<div class="flex shrink-0 items-center gap-2" :title="$t('repo.pipeline.duration')">
<Icon name="duration" />
<span>{{ duration }}</span>
</div>

View file

@ -14,11 +14,11 @@
<Button v-else start-icon="plus" :text="$t('repo.settings.crons.add')" @click="selectedCron = {}" />
</template>
<div v-if="!selectedCron" class="space-y-4 text-wp-text-100">
<div v-if="!selectedCron" class="text-wp-text-100 space-y-4">
<ListItem
v-for="cron in crons"
:key="cron.id"
class="items-center !bg-wp-background-200 dark:!bg-wp-background-100"
class="bg-wp-background-200! dark:bg-wp-background-100! items-center"
>
<span class="grid w-full grid-cols-3">
<span>{{ cron.name }}</span>
@ -39,7 +39,7 @@
<IconButton icon="edit" class="h-8 w-8" :title="$t('repo.settings.crons.edit')" @click="selectedCron = cron" />
<IconButton
icon="trash"
class="h-8 w-8 hover:text-wp-error-100"
class="hover:text-wp-error-100 h-8 w-8"
:is-loading="isDeleting"
:title="$t('repo.settings.crons.delete')"
@click="deleteCron(cron)"

View file

@ -120,7 +120,7 @@
>
<div class="flex items-center">
<NumberField :id="id" v-model="repoSettings.timeout" class="w-24" />
<span class="ml-4 text-wp-text-alt-100">{{ $t('repo.settings.general.timeout.minutes') }}</span>
<span class="text-wp-text-alt-100 ml-4">{{ $t('repo.settings.general.timeout.minutes') }}</span>
</div>
</InputField>

View file

@ -2,7 +2,7 @@
<Settings :title="$t('user.settings.cli_and_api.cli_and_api')" :description="$t('user.settings.cli_and_api.desc')">
<InputField :label="$t('user.settings.cli_and_api.cli_usage')">
<template #headerActions>
<a :href="cliDownload" target="_blank" class="ml-4 text-wp-link-100 hover:text-wp-link-200">{{
<a :href="cliDownload" target="_blank" class="text-wp-link-100 hover:text-wp-link-200 ml-4">{{
$t('user.settings.cli_and_api.download_cli')
}}</a>
</template>
@ -22,7 +22,7 @@
v-if="enableSwagger"
:href="`${address}/swagger/index.html`"
target="_blank"
class="ml-4 text-wp-link-100 hover:text-wp-link-200"
class="text-wp-link-100 hover:text-wp-link-200 ml-4"
>
{{ $t('user.settings.cli_and_api.swagger_ui') }}
</a>

View file

@ -1,237 +0,0 @@
// cSpell:ignore Segoe Roboto Neue Noto nocheck
// eslint-disable-next-line ts/ban-ts-comment
// @ts-nocheck
import typography from '@tailwindcss/typography';
import type { Config } from 'tailwindcss';
import colors from 'tailwindcss/colors';
import tinycolor from 'tinycolor2';
const customColors = {
'wp-primary': {
100: '#8AD97F',
200: '#68C464',
300: '#4CAF50',
400: '#369943',
500: '#248438',
600: '#166E30',
},
'wp-secondary': {
200: '#434858',
300: '#383C4A',
400: '#303440',
500: '#2D313D',
600: '#2A2E3A',
700: '#222631',
800: '#1B1F28',
},
};
export default {
content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}', './src/**/*.css'],
darkMode: 'class',
theme: {
extend: {
colors: {
// Internals to keep a single source for color definitions
'int-wp-primary': {
100: customColors['wp-primary'][100],
200: customColors['wp-primary'][200],
300: customColors['wp-primary'][300],
400: customColors['wp-primary'][400],
500: customColors['wp-primary'][500],
600: customColors['wp-primary'][600],
},
'int-wp-secondary': {
200: customColors['wp-secondary'][200],
300: customColors['wp-secondary'][300],
400: customColors['wp-secondary'][400],
500: customColors['wp-secondary'][500],
600: customColors['wp-secondary'][600],
700: customColors['wp-secondary'][700],
800: customColors['wp-secondary'][800],
},
'int-wp-control-neutral': {
100: colors.white,
200: colors.gray[300],
300: colors.gray[400],
},
'int-wp-control-info': {
100: colors.cyan[700],
200: colors.cyan[800],
300: colors.cyan[900],
},
'int-wp-control-info-dark': {
100: tinycolor(colors.cyan[700]).desaturate(30).toString(),
200: tinycolor(colors.cyan[800]).desaturate(30).toString(),
300: tinycolor(colors.cyan[900]).desaturate(30).toString(),
},
'int-wp-control-ok': {
100: customColors['wp-primary'][400],
200: customColors['wp-primary'][500],
300: customColors['wp-primary'][600],
},
'int-wp-control-ok-dark': {
100: tinycolor(customColors['wp-primary'][400]).desaturate(10).toString(),
200: tinycolor(customColors['wp-primary'][500]).desaturate(10).toString(),
300: tinycolor(customColors['wp-primary'][600]).desaturate(10).toString(),
},
'int-wp-error': {
100: colors.red[700],
200: colors.red[800],
300: colors.red[900],
},
'int-wp-state-neutral': {
100: colors.gray[600],
},
'int-wp-state-ok': {
100: colors.green[600],
},
'int-wp-state-ok-dark': {
100: tinycolor(colors.green[600]).desaturate(20).toString(),
},
'int-wp-state-info': {
100: colors.cyan[600],
},
'int-wp-state-info-dark': {
100: tinycolor(colors.cyan[600]).desaturate(20).toString(),
},
'int-wp-state-warn': {
100: colors.yellow[400],
},
'int-wp-state-warn-dark': {
100: tinycolor(colors.yellow[400]).desaturate(20).toString(),
},
'int-wp-hint-warn': {
100: colors.yellow[100],
200: colors.yellow[300],
},
'int-wp-hint-warn-dark': {
100: tinycolor(colors.yellow[300]).desaturate(60).toString(),
200: tinycolor(colors.yellow[500]).desaturate(60).toString(),
},
// Theme colors
'wp-background': {
100: 'var(--wp-background-100)',
200: 'var(--wp-background-200)',
300: 'var(--wp-background-300)',
400: 'var(--wp-background-400)',
},
'wp-text': {
100: 'var(--wp-text-100)',
200: 'var(--wp-text-200)',
},
'wp-text-alt': {
100: 'var(--wp-text-alt-100)',
},
'wp-primary': {
100: 'var(--wp-primary-100)',
200: 'var(--wp-primary-200)',
300: 'var(--wp-primary-300)',
},
'wp-primary-text': {
100: 'var(--wp-primary-text-100)',
},
'wp-control-neutral': {
100: 'var(--wp-control-neutral-100)',
200: 'var(--wp-control-neutral-200)',
300: 'var(--wp-control-neutral-300)',
},
'wp-control-info': {
100: 'var(--wp-control-info-100)',
200: 'var(--wp-control-info-200)',
300: 'var(--wp-control-info-300)',
},
'wp-control-ok': {
100: 'var(--wp-control-ok-100)',
200: 'var(--wp-control-ok-200)',
300: 'var(--wp-control-ok-300)',
},
'wp-error': {
100: 'var(--wp-error-100)',
200: 'var(--wp-error-200)',
300: 'var(--wp-error-300)',
},
'wp-state-neutral': {
100: 'var(--wp-state-neutral-100)',
},
'wp-state-ok': {
100: 'var(--wp-state-ok-100)',
},
'wp-state-info': {
100: 'var(--wp-state-info-100)',
},
'wp-state-warn': {
100: 'var(--wp-state-warn-100)',
},
'wp-hint-warn': {
100: 'var(--wp-hint-warn-100)',
200: 'var(--wp-hint-warn-200)',
},
'wp-code-inline': {
100: 'var(--wp-code-inline-100)',
200: 'var(--wp-code-inline-200)',
},
'wp-code-inline-text': {
100: 'var(--wp-code-inline-text-100)',
},
'wp-code': {
100: 'var(--wp-code-100)',
200: 'var(--wp-code-200)',
300: 'var(--wp-code-300)',
},
'wp-code-text': {
100: 'var(--wp-code-text-100)',
},
'wp-code-text-alt': {
100: 'var(--wp-code-text-alt-100)',
},
'wp-link': {
100: 'var(--wp-link-100)',
200: 'var(--wp-link-200)',
},
},
spacing: {
sm: '24rem',
md: '28rem',
lg: '32rem',
xl: '36rem',
'2xl': '42rem',
'3xl': '48rem',
},
fontFamily: {
sans: [
'system-ui',
'-apple-system',
'Segoe UI',
'Roboto',
'Helvetica Neue',
'Noto Sans',
'Liberation Sans',
'Arial',
'sans-serif',
],
},
transitionProperty: {
height: 'max-height',
},
stroke: (theme: (path: string) => object) => theme('colors'),
fill: (theme: (path: string) => object) => theme('colors'),
},
},
plugins: [typography],
} satisfies Config;

View file

@ -27,14 +27,6 @@
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"src/**/*.json",
"tailwind.config.ts",
"vite.config.ts",
"postcss.config.js"
],
"include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", "src/**/*.json", "vite.config.ts"],
"exclude": ["node_modules", "**/__tests__/**/*", "**/dist/**/*"]
}

View file

@ -2,6 +2,7 @@ import { readdirSync } from 'node:fs';
import path from 'node:path';
import process from 'node:process';
import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite';
import tailwindcss from '@tailwindcss/vite';
import vue from '@vitejs/plugin-vue';
import type { Plugin } from 'vite';
import prismjs from 'vite-plugin-prismjs';
@ -75,6 +76,7 @@ export default defineConfig({
prismjs({
languages: ['yaml'],
}),
tailwindcss(),
],
resolve: {
alias: {