From 567da4379c9ec215cb94f658ae653d7651f87a14 Mon Sep 17 00:00:00 2001 From: David Arranz Date: Tue, 1 Oct 2024 13:43:10 +0200 Subject: [PATCH] . --- client/components.json | 4 +-- client/package.json | 8 +++-- client/src/app/quotes/create.tsx | 4 +-- client/src/app/quotes/edit.tsx | 4 +-- client/src/app/settings/edit.tsx | 4 +-- client/src/{index.css => global.css} | 45 +++++++++++++------------- client/src/main.tsx | 2 +- client/src/ui/toast.tsx | 7 +++-- client/src/ui/toaster.tsx | 4 +-- client/tailwind.config.js | 5 +-- client/yarn.lock | 47 ++++++++++++++++++++++------ 11 files changed, 84 insertions(+), 50 deletions(-) rename client/src/{index.css => global.css} (80%) diff --git a/client/components.json b/client/components.json index 497ae3c..c8903d9 100644 --- a/client/components.json +++ b/client/components.json @@ -5,7 +5,7 @@ "tsx": true, "tailwind": { "config": "tailwind.config.js", - "css": "src/index.css", + "css": "src/global.css", "baseColor": "slate", "cssVariables": true, "prefix": "" @@ -14,4 +14,4 @@ "components": "src/", "utils": "@/lib/utils" } -} \ No newline at end of file +} diff --git a/client/package.json b/client/package.json index c485461..a90aad6 100644 --- a/client/package.json +++ b/client/package.json @@ -53,6 +53,7 @@ "flag-icons": "^7.2.3", "i18next": "^23.12.2", "i18next-browser-languagedetector": "^8.0.0", + "install": "^0.13.0", "joi": "^17.13.1", "lucide-react": "^0.427.0", "print-js": "^1.6.0", @@ -71,6 +72,7 @@ "react-wrap-balancer": "^1.1.1", "recharts": "^2.12.7", "slugify": "^1.6.6", + "tailwindcss-animate": "^1.0.7", "use-debounce": "^10.0.3", "vaul": "^0.9.1" }, @@ -95,10 +97,10 @@ "identity-obj-proxy": "^3.0.0", "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", - "postcss": "^8.4.41", + "postcss": "^8.4.47", "postcss-import": "^16.1.0", - "tailwind-merge": "^2.3.0", - "tailwindcss": "^3.4.9", + "tailwind-merge": "^2.5.2", + "tailwindcss": "^3.4.13", "ts-jest": "^29.2.4", "ts-node": "^10.9.2", "typescript": "^5.5.4", diff --git a/client/src/app/quotes/create.tsx b/client/src/app/quotes/create.tsx index 2e0c6fb..a857e45 100644 --- a/client/src/app/quotes/create.tsx +++ b/client/src/app/quotes/create.tsx @@ -77,8 +77,8 @@ export const QuoteCreate = () => { onSuccess: (data) => { reset(getValues()); toast({ - title: "Cotización guardada", - className: "bg-green-300", + title: "Cotización creada", + variant: "default", }); navigate(`/quotes/edit/${data.id}`, { relative: "path" }); }, diff --git a/client/src/app/quotes/edit.tsx b/client/src/app/quotes/edit.tsx index a460bd8..4a4cbcb 100644 --- a/client/src/app/quotes/edit.tsx +++ b/client/src/app/quotes/edit.tsx @@ -145,13 +145,13 @@ export const QuoteEdit = () => { mutate(data, { onError: (error) => { console.debug(error); - toast({ description: error.message }); + toast({ title: "Error", description: error.message, variant: "destructive" }); //alert(error.message); }, //onSettled: () => {}, onSuccess: () => { reset(getValues()); - toast({ description: "Cotización guardada" }); + toast({ title: "Cotización guardada", variant: "success" }); if (shouldRedirect) { navigate("/quotes"); } diff --git a/client/src/app/settings/edit.tsx b/client/src/app/settings/edit.tsx index 428eac4..d03ed12 100644 --- a/client/src/app/settings/edit.tsx +++ b/client/src/app/settings/edit.tsx @@ -116,13 +116,13 @@ export const SettingsEditor = () => { mutate(data, { onError: (error) => { console.debug(error); - toast({ title: "Error", description: error.message }); + toast({ title: "Error", description: error.message, variant: "destructive" }); //alert(error.message); }, //onSettled: () => {}, onSuccess: () => { reset(getValues()); - toast({ description: "Ajustes guardados" }); + toast({ description: "Ajustes guardados", variant: "success" }); }, }); }; diff --git a/client/src/index.css b/client/src/global.css similarity index 80% rename from client/src/index.css rename to client/src/global.css index fe56651..d70f8cc 100644 --- a/client/src/index.css +++ b/client/src/global.css @@ -1,5 +1,3 @@ -/*@import url('https://fonts.googleapis.com/css2?family=Public Sans:wght@100;200;300;400;400;500;600;700;800;900;&family=Noto Serif:wght@100;200;300;400;400;500;600;700;800;900;1,500&display=swap');*/ - @tailwind base; @tailwind components; @tailwind utilities; @@ -102,34 +100,35 @@ @layer base { + /*@font-face { + font-family: "Poppins"; + src: url("./assets/fonts/Poppins/Poppins-Regular.ttf"); + font-weight: normal; + font-display: swap; + } + @font-face { + font-family: "Poppins"; + src: url("./assets/fonts/Poppins/Poppins-Bold.ttf"); + font-weight: 700; + font-display: swap; + }*/ + + * { + @apply border-border; + } + body { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; tab-size: 4; font-feature-settings: normal; font-variation-settings: normal; - @apply h-full text-foreground bg-background; + @apply h-full text-foreground bg-background /*font-poppins*/; + font-feature-settings: "rlig" 1, "calt" 1; + } #uecko { @apply flex min-h-screen min-w-[320px] flex-col; } - - .ToastRoot[data-swipe="move"] { - transform: translateX(var(--radix-toast-swipe-move-x)); - } - .ToastRoot[data-swipe="cancel"] { - transform: translateX(0); - transition: transform 200ms ease-out; - } - .ToastRoot[data-swipe="end"] { - animation: slideRight 100ms ease-out; - } - - @keyframes slideRight { - from { - transform: translateX(var(--radix-toast-swipe-end-x)); - } - to { - transform: translateX(100%); - } - } } diff --git a/client/src/main.tsx b/client/src/main.tsx index be3ddaa..eb8c13d 100644 --- a/client/src/main.tsx +++ b/client/src/main.tsx @@ -1,7 +1,7 @@ import React from "react"; import ReactDOM from "react-dom/client"; import App from "./App.tsx"; -import "./index.css"; +import "./global.css"; import "./locales/i18n.ts"; diff --git a/client/src/ui/toast.tsx b/client/src/ui/toast.tsx index cb8c526..72cc77e 100644 --- a/client/src/ui/toast.tsx +++ b/client/src/ui/toast.tsx @@ -25,14 +25,17 @@ const ToastViewport = React.forwardRef< ToastViewport.displayName = ToastPrimitives.Viewport.displayName; const toastVariants = cva( - "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full", + "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-bottom-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full", { variants: { variant: { default: "border bg-background text-foreground", destructive: "destructive group border-destructive bg-destructive text-destructive-foreground", - success: "group border-green-400 bg-green-300 text-foreground", + success: "success bg-green-300 text-success-foreground border-green-400 group", + }, + position: { + center: "bottom-0 mx-auto w-auto sm:bottom-0", }, }, defaultVariants: { diff --git a/client/src/ui/toaster.tsx b/client/src/ui/toaster.tsx index 268fa4b..1cbe1e6 100644 --- a/client/src/ui/toaster.tsx +++ b/client/src/ui/toaster.tsx @@ -14,7 +14,7 @@ export function Toaster() { const { toasts } = useToast(); return ( - + {toasts.map(function ({ id, title, description, action, ...props }) { return ( @@ -27,7 +27,7 @@ export function Toaster() { ); })} - + ); } diff --git a/client/tailwind.config.js b/client/tailwind.config.js index 7bc1f27..c4c0119 100644 --- a/client/tailwind.config.js +++ b/client/tailwind.config.js @@ -4,8 +4,7 @@ import plugin from "tailwindcss/plugin"; export default { darkMode: ["class"], - content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx,html}"], - prefix: "", + content: ["./src/**/*.{js,ts,jsx,tsx,html}"], theme: { container: { @@ -20,6 +19,7 @@ export default { /*fontFamily: { sans: ['"Source Sans Pro"', ...defaultTheme.fontFamily.sans], },*/ + fontFamily: { display: "Public Sans, ui-sans-serif", heading: "Noto Serif, ui-serif", @@ -82,6 +82,7 @@ export default { }, }, plugins: [ + require("tailwindcss-animate"), plugin(function ({ addBase }) { addBase({ html: { fontSize: "16px" }, // 16px es el valor por defecto diff --git a/client/yarn.lock b/client/yarn.lock index b775f04..3374d82 100644 --- a/client/yarn.lock +++ b/client/yarn.lock @@ -3644,6 +3644,11 @@ inherits@2, inherits@^2.0.3: resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c" integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ== +install@^0.13.0: + version "0.13.0" + resolved "https://registry.yarnpkg.com/install/-/install-0.13.0.tgz#6af6e9da9dd0987de2ab420f78e60d9c17260776" + integrity sha512-zDml/jzr2PKU9I8J/xyZBQn8rPCAY//UOYNmR01XwNwyfhEWObo2SWfSl1+0tm1u6PhxLwDnfsT/6jB7OUxqFA== + "internmap@1 - 2": version "2.0.3" resolved "https://registry.yarnpkg.com/internmap/-/internmap-2.0.3.tgz#6685f23755e43c524e251d29cbc97248e3061009" @@ -4752,6 +4757,11 @@ picocolors@^1.0.0, picocolors@^1.0.1: resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.1.tgz#a8ad579b571952f0e5d25892de5445bcfe25aaa1" integrity sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew== +picocolors@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.1.0.tgz#5358b76a78cde483ba5cef6a9dc9671440b27d59" + integrity sha512-TQ92mBOW0l3LeMeyLV6mzy/kWr8lkd/hp3mTg7wYK7zJhuBStmGMBG0BdeDZS/dZx1IukaX6Bk11zcln25o1Aw== + picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.3, picomatch@^2.3.1: version "2.3.1" resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42" @@ -4836,7 +4846,7 @@ postcss@^8.4.23: picocolors "^1.0.1" source-map-js "^1.2.0" -postcss@^8.4.40, postcss@^8.4.41: +postcss@^8.4.40: version "8.4.41" resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.41.tgz#d6104d3ba272d882fe18fc07d15dc2da62fa2681" integrity sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ== @@ -4845,6 +4855,15 @@ postcss@^8.4.40, postcss@^8.4.41: picocolors "^1.0.1" source-map-js "^1.2.0" +postcss@^8.4.47: + version "8.4.47" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.47.tgz#5bf6c9a010f3e724c503bf03ef7947dcb0fea365" + integrity sha512-56rxCq7G/XfB4EkXq9Egn5GCqugWvDFjafDOThIdMBsI15iqPqR5r15TfSr1YPYeEI19YeaXMCbY6u88Y76GLQ== + dependencies: + nanoid "^3.3.7" + picocolors "^1.1.0" + source-map-js "^1.2.1" + prelude-ls@^1.2.1: version "1.2.1" resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396" @@ -5365,6 +5384,11 @@ source-map-js@^1.2.0: resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.2.0.tgz#16b809c162517b5b8c3e7dcd315a2a5c2612b2af" integrity sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg== +source-map-js@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.2.1.tgz#1ce5650fddd87abc099eda37dcff024c2667ae46" + integrity sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA== + source-map-support@0.5.13: version "0.5.13" resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.13.tgz#31b24a9c2e73c2de85066c0feb7d44767ed52932" @@ -5503,15 +5527,20 @@ symbol-tree@^3.2.4: resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.4.tgz#430637d248ba77e078883951fb9aa0eed7c63fa2" integrity sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw== -tailwind-merge@^2.3.0: - version "2.4.0" - resolved "https://registry.yarnpkg.com/tailwind-merge/-/tailwind-merge-2.4.0.tgz#1345209dc1f484f15159c9180610130587703042" - integrity sha512-49AwoOQNKdqKPd9CViyH5wJoSKsCDjUlzL8DxuGp3P1FsGY36NJDAa18jLZcaHAUUuTj+JB8IAo8zWgBNvBF7A== +tailwind-merge@^2.5.2: + version "2.5.2" + resolved "https://registry.yarnpkg.com/tailwind-merge/-/tailwind-merge-2.5.2.tgz#000f05a703058f9f9f3829c644235f81d4c08a1f" + integrity sha512-kjEBm+pvD+6eAwzJL2Bi+02/9LFLal1Gs61+QB7HvTfQQ0aXwC5LGT8PEt1gS0CWKktKe6ysPTAy3cBC5MeiIg== -tailwindcss@^3.4.9: - version "3.4.9" - resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.4.9.tgz#9e04cddce1924d530df62af37d3520f0e2a9d85e" - integrity sha512-1SEOvRr6sSdV5IDf9iC+NU4dhwdqzF4zKKq3sAbasUWHEM6lsMhX+eNN5gkPx1BvLFEnZQEUFbXnGj8Qlp83Pg== +tailwindcss-animate@^1.0.7: + version "1.0.7" + resolved "https://registry.yarnpkg.com/tailwindcss-animate/-/tailwindcss-animate-1.0.7.tgz#318b692c4c42676cc9e67b19b78775742388bef4" + integrity sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA== + +tailwindcss@^3.4.13: + version "3.4.13" + resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.4.13.tgz#3d11e5510660f99df4f1bfb2d78434666cb8f831" + integrity sha512-KqjHOJKogOUt5Bs752ykCeiwvi0fKVkr5oqsFNt/8px/tA8scFPIlkygsf6jXrfCqGHz7VflA6+yytWuM+XhFw== dependencies: "@alloc/quick-lru" "^5.2.0" arg "^5.0.2"