From 1ea3f37278ead6dc64532203ef330016df6665f4 Mon Sep 17 00:00:00 2001 From: Camila Carrillo Date: Fri, 20 Mar 2026 18:09:00 -0400 Subject: [PATCH] done --- frontend/package-lock.json | 77 ++++++++----- .../notifications/GrantNotification.tsx | 52 ++++++--- .../notifications/NotificationPopup.tsx | 49 ++++++-- frontend/src/styles/notification.css | 109 ------------------ 4 files changed, 118 insertions(+), 169 deletions(-) delete mode 100644 frontend/src/styles/notification.css diff --git a/frontend/package-lock.json b/frontend/package-lock.json index e3fada70..c9dd8c89 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -288,7 +288,6 @@ "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.4.tgz", "integrity": "sha512-2BCOP7TN8M+gVDj7/ht3hsaO/B/n5oDbiAyyvnRlNOs+u1o+JWNYTQrmpuNp1/Wq2gcFrI01JAW+paEKDMx/CA==", "license": "MIT", - "peer": true, "dependencies": { "@babel/code-frame": "^7.27.1", "@babel/generator": "^7.28.3", @@ -707,7 +706,6 @@ } ], "license": "MIT", - "peer": true, "engines": { "node": ">=18" }, @@ -731,7 +729,6 @@ } ], "license": "MIT", - "peer": true, "engines": { "node": ">=18" } @@ -742,6 +739,7 @@ "integrity": "sha512-97/BJ3iXHww3djw6hYIfErCZFee7qCtrneuLa20UXFCOTCfBM2cvQHjWJ2EG0s0MtdNwInarqCTz35i4wWXHsQ==", "license": "MIT", "optional": true, + "peer": true, "dependencies": { "tslib": "^2.4.0" } @@ -804,7 +802,6 @@ "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.14.0.tgz", "integrity": "sha512-O000MLDBDdk/EohJPFUqvnp4qnHeYkVP5B0xEG0D/L7cOKP9kefu2DXn8dj74cQfsEzUqh+sr1RzFqiL1o+PpA==", "license": "MIT", - "peer": true, "dependencies": { "@babel/runtime": "^7.18.3", "@emotion/babel-plugin": "^11.13.5", @@ -1518,6 +1515,7 @@ "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-7.0.1.tgz", "integrity": "sha512-0VpNtO5cNe1/HQWMkl4OdncYK/mv9hnBte0Ew0n6DMzmo3Q3WzDFABHm6LeNTipt5zAyhQ6Ugjiu8aLaEjh1gg==", "license": "MIT", + "peer": true, "engines": { "node": ">=6" } @@ -2580,6 +2578,7 @@ "integrity": "sha512-A5P/LfWGFSl6nsckYtjw9da+19jB8hkJ6ACTGcDfEJ0aE+l2n2El7dsVM7UVHZQ9s2lmYMWlrS21YLy2IR1LUw==", "license": "MIT", "optional": true, + "peer": true, "engines": { "node": ">=18" } @@ -2596,6 +2595,7 @@ "os": [ "darwin" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2618,6 +2618,7 @@ "os": [ "darwin" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2640,6 +2641,7 @@ "os": [ "darwin" ], + "peer": true, "funding": { "url": "https://opencollective.com/libvips" } @@ -2656,6 +2658,7 @@ "os": [ "darwin" ], + "peer": true, "funding": { "url": "https://opencollective.com/libvips" } @@ -2672,6 +2675,7 @@ "os": [ "linux" ], + "peer": true, "funding": { "url": "https://opencollective.com/libvips" } @@ -2688,6 +2692,7 @@ "os": [ "linux" ], + "peer": true, "funding": { "url": "https://opencollective.com/libvips" } @@ -2704,6 +2709,7 @@ "os": [ "linux" ], + "peer": true, "funding": { "url": "https://opencollective.com/libvips" } @@ -2720,6 +2726,7 @@ "os": [ "linux" ], + "peer": true, "funding": { "url": "https://opencollective.com/libvips" } @@ -2736,6 +2743,7 @@ "os": [ "linux" ], + "peer": true, "funding": { "url": "https://opencollective.com/libvips" } @@ -2752,6 +2760,7 @@ "os": [ "linux" ], + "peer": true, "funding": { "url": "https://opencollective.com/libvips" } @@ -2768,6 +2777,7 @@ "os": [ "linux" ], + "peer": true, "funding": { "url": "https://opencollective.com/libvips" } @@ -2784,6 +2794,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2806,6 +2817,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2828,6 +2840,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2850,6 +2863,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2872,6 +2886,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2894,6 +2909,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2916,6 +2932,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2935,6 +2952,7 @@ ], "license": "Apache-2.0 AND LGPL-3.0-or-later AND MIT", "optional": true, + "peer": true, "dependencies": { "@emnapi/runtime": "^1.5.0" }, @@ -2957,6 +2975,7 @@ "os": [ "win32" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2976,6 +2995,7 @@ "os": [ "win32" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -2995,6 +3015,7 @@ "os": [ "win32" ], + "peer": true, "engines": { "node": "^18.17.0 || ^20.3.0 || >=21.0.0" }, @@ -3028,7 +3049,6 @@ "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.9.0.tgz", "integrity": "sha512-yaN3brAnHRD+4KyyOsJyk49XUvj2wtbNACSqg0bz3u8t2VuzhC8Q5dfRnrSxjnnbDb+ienBnkn1TzQfE154vyg==", "license": "Apache-2.0", - "peer": true, "dependencies": { "@swc/helpers": "^0.5.0" } @@ -3194,7 +3214,8 @@ "version": "15.5.3", "resolved": "https://registry.npmjs.org/@next/env/-/env-15.5.3.tgz", "integrity": "sha512-RSEDTRqyihYXygx/OJXwvVupfr9m04+0vH8vyy0HfZ7keRto6VX9BbEk0J2PUk0VGy6YhklJUSrgForov5F9pw==", - "license": "MIT" + "license": "MIT", + "peer": true }, "node_modules/@next/swc-darwin-arm64": { "version": "15.5.3", @@ -3208,6 +3229,7 @@ "os": [ "darwin" ], + "peer": true, "engines": { "node": ">= 10" } @@ -3224,6 +3246,7 @@ "os": [ "darwin" ], + "peer": true, "engines": { "node": ">= 10" } @@ -3240,6 +3263,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": ">= 10" } @@ -3256,6 +3280,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": ">= 10" } @@ -3272,6 +3297,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": ">= 10" } @@ -3288,6 +3314,7 @@ "os": [ "linux" ], + "peer": true, "engines": { "node": ">= 10" } @@ -3304,6 +3331,7 @@ "os": [ "win32" ], + "peer": true, "engines": { "node": ">= 10" } @@ -3320,6 +3348,7 @@ "os": [ "win32" ], + "peer": true, "engines": { "node": ">= 10" } @@ -3370,7 +3399,6 @@ "integrity": "sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==", "hasInstallScript": true, "license": "MIT", - "peer": true, "dependencies": { "detect-libc": "^1.0.3", "is-glob": "^4.0.3", @@ -3676,7 +3704,6 @@ "resolved": "https://registry.npmjs.org/@pothos/core/-/core-3.41.2.tgz", "integrity": "sha512-iR1gqd93IyD/snTW47HwKSsRCrvnJaYwjVNcUG8BztZPqMxyJKPAnjPHAgu1XB82KEdysrNqIUnXqnzZIs08QA==", "license": "ISC", - "peer": true, "peerDependencies": { "graphql": ">=15.1.0" } @@ -4126,7 +4153,6 @@ "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.1.tgz", "integrity": "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==", "license": "MIT", - "peer": true, "dependencies": { "@babel/code-frame": "^7.10.4", "@babel/runtime": "^7.12.5", @@ -4384,7 +4410,6 @@ "resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.17.tgz", "integrity": "sha512-gfehUI8N1z92kygssiuWvLiwcbOB3IRktR6hTDgJlXMYh5OvkPSRmgfoBUmfZt+vhwJtX7v1Yw4KvvAf7c5QKQ==", "license": "MIT", - "peer": true, "dependencies": { "undici-types": "~6.21.0" } @@ -4406,7 +4431,6 @@ "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.24.tgz", "integrity": "sha512-0dLEBsA1kI3OezMBF8nSsb7Nk19ZnsyE1LLhB8r27KbgU5H4pvuqZLdtE+aUkJVoXgTVuA+iLIwmZ0TuK4tx6A==", "license": "MIT", - "peer": true, "dependencies": { "@types/prop-types": "*", "csstype": "^3.0.2" @@ -4418,7 +4442,6 @@ "integrity": "sha512-MEe3UeoENYVFXzoXEWsvcpg6ZvlrFNlOQ7EOsvhI3CfAXwzPfO8Qwuxd40nepsYKqyyVQnTdEfv68q91yLcKrQ==", "dev": true, "license": "MIT", - "peer": true, "peerDependencies": { "@types/react": "^18.0.0" } @@ -4515,7 +4538,6 @@ "integrity": "sha512-EHrrEsyhOhxYt8MTg4zTF+DJMuNBzWwgvvOYNj/zm1vnaD/IC5zCXFehZv94Piqa2cRFfXrTFxIvO95L7Qc/cw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@typescript-eslint/scope-manager": "8.44.1", "@typescript-eslint/types": "8.44.1", @@ -5858,7 +5880,6 @@ "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==", "dev": true, "license": "MIT", - "peer": true, "bin": { "acorn": "bin/acorn" }, @@ -6375,7 +6396,6 @@ } ], "license": "MIT", - "peer": true, "dependencies": { "baseline-browser-mapping": "^2.8.3", "caniuse-lite": "^1.0.30001741", @@ -6747,7 +6767,8 @@ "version": "0.0.1", "resolved": "https://registry.npmjs.org/client-only/-/client-only-0.0.1.tgz", "integrity": "sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA==", - "license": "MIT" + "license": "MIT", + "peer": true }, "node_modules/cliui": { "version": "8.0.1", @@ -7188,8 +7209,7 @@ "version": "2.2.3", "resolved": "https://registry.npmjs.org/dataloader/-/dataloader-2.2.3.tgz", "integrity": "sha512-y2krtASINtPFS1rSDjacrFgn1dcUuoREVabwlOGOe4SdxenREqwjwjElAdwvbGM7kgZz9a3KVicWR7vcz8rnzA==", - "license": "MIT", - "peer": true + "license": "MIT" }, "node_modules/date-fns": { "version": "4.1.0", @@ -7633,7 +7653,6 @@ "integrity": "sha512-hB4FIzXovouYzwzECDcUkJ4OcfOEkXTv2zRY6B9bkwjx/cprAq0uvm1nl7zvQ0/TsUk0zQiN4uPfJpB9m+rPMQ==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@eslint-community/eslint-utils": "^4.8.0", "@eslint-community/regexpp": "^4.12.1", @@ -8584,7 +8603,6 @@ "resolved": "https://registry.npmjs.org/graphql/-/graphql-16.11.0.tgz", "integrity": "sha512-mS1lbMsxgQj6hge1XZ6p7GPhbrtFwUFYi3wRzXAC/FmYnyXMTvvI3td3rjmQ2u8ewXueaSvRPWaEcgVVOT9Jnw==", "license": "MIT", - "peer": true, "engines": { "node": "^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0" } @@ -8757,7 +8775,6 @@ "resolved": "https://registry.npmjs.org/graphql-yoga/-/graphql-yoga-5.16.0.tgz", "integrity": "sha512-/R2dJea7WgvNlXRU4F8iFwWd95Qn1mN+R+yC8XBs1wKjUzr0Pvv8cGYtt6UUcVHw5CiDEtu7iQY5oOe3sDAWCQ==", "license": "MIT", - "peer": true, "dependencies": { "@envelop/core": "^5.3.0", "@envelop/instrumentation": "^1.0.0", @@ -9480,7 +9497,6 @@ "integrity": "sha512-8i7LzZj7BF8uplX+ZyOlIz86V6TAsSs+np6m1kpW9u0JWi4z/1t+FzcK1aek+ybTnAC4KhBL4uXCNT0wcUIeCw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "cssstyle": "^4.1.0", "data-urls": "^5.0.0", @@ -9994,7 +10010,6 @@ "resolved": "https://registry.npmjs.org/mobx/-/mobx-6.13.7.tgz", "integrity": "sha512-aChaVU/DO5aRPmk1GX8L+whocagUUpBQqoPtJk+cm7UOXUk87J4PeWCh6nNmTTIfEhiR9DI/+FnA8dln/hTK7g==", "license": "MIT", - "peer": true, "funding": { "type": "opencollective", "url": "https://opencollective.com/mobx" @@ -10138,6 +10153,7 @@ "resolved": "https://registry.npmjs.org/next/-/next-15.5.3.tgz", "integrity": "sha512-r/liNAx16SQj4D+XH/oI1dlpv9tdKJ6cONYPwwcCC46f2NjpaRWY+EKCzULfgQYV6YKXjHBchff2IZBSlZmJNw==", "license": "MIT", + "peer": true, "dependencies": { "@next/env": "15.5.3", "@swc/helpers": "0.5.15", @@ -10190,6 +10206,7 @@ "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.15.tgz", "integrity": "sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g==", "license": "Apache-2.0", + "peer": true, "dependencies": { "tslib": "^2.8.0" } @@ -10213,6 +10230,7 @@ } ], "license": "MIT", + "peer": true, "dependencies": { "nanoid": "^3.3.6", "picocolors": "^1.0.0", @@ -10804,7 +10822,6 @@ } ], "license": "MIT", - "peer": true, "dependencies": { "nanoid": "^3.3.11", "picocolors": "^1.1.1", @@ -11265,7 +11282,6 @@ "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz", "integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==", "license": "MIT", - "peer": true, "dependencies": { "@types/use-sync-external-store": "^0.0.6", "use-sync-external-store": "^1.4.0" @@ -11430,8 +11446,7 @@ "version": "5.0.1", "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz", "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==", - "license": "MIT", - "peer": true + "license": "MIT" }, "node_modules/redux-thunk": { "version": "3.1.0", @@ -11880,6 +11895,7 @@ "hasInstallScript": true, "license": "Apache-2.0", "optional": true, + "peer": true, "dependencies": { "@img/colour": "^1.0.0", "detect-libc": "^2.1.0", @@ -11922,6 +11938,7 @@ "integrity": "sha512-vEtk+OcP7VBRtQZ1EJ3bdgzSfBjgnEalLTp5zjJrS+2Z1w2KZly4SBdac/WDU3hhsNAZ9E8SC96ME4Ey8MZ7cg==", "license": "Apache-2.0", "optional": true, + "peer": true, "engines": { "node": ">=8" } @@ -11932,6 +11949,7 @@ "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==", "license": "ISC", "optional": true, + "peer": true, "bin": { "semver": "bin/semver.js" }, @@ -12348,6 +12366,7 @@ "resolved": "https://registry.npmjs.org/styled-jsx/-/styled-jsx-5.1.6.tgz", "integrity": "sha512-qSVyDTeMotdvQYoHWLNGwRFJHC+i+ZvdBRYosOFgC+Wg1vx4frN2/RG/NA7SYqqvKNLf39P2LSRA2pu6n0XYZA==", "license": "MIT", + "peer": true, "dependencies": { "client-only": "0.0.1" }, @@ -12791,7 +12810,6 @@ "integrity": "sha512-CWBzXQrc/qOkhidw1OzBTQuYRbfyxDXJMVJ1XNwUHGROVmuaeiEm3OslpZ1RV96d7SKKjZKrSJu3+t/xlw3R9A==", "devOptional": true, "license": "Apache-2.0", - "peer": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" @@ -12989,7 +13007,6 @@ "resolved": "https://registry.npmjs.org/urql/-/urql-4.2.2.tgz", "integrity": "sha512-3GgqNa6iF7bC4hY/ImJKN4REQILcSU9VKcKL8gfELZM8mM5BnLH1BsCc8kBdnVGD1LIFOs4W3O2idNHhON1r0w==", "license": "MIT", - "peer": true, "dependencies": { "@urql/core": "^5.1.1", "wonka": "^6.3.2" @@ -13091,7 +13108,6 @@ "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.20.tgz", "integrity": "sha512-j3lYzGC3P+B5Yfy/pfKNgVEg4+UtcIJcVRt2cDjIOmhLourAqPqf8P7acgxeiSgUB7E3p2P8/3gNIgDLpwzs4g==", "license": "MIT", - "peer": true, "dependencies": { "esbuild": "^0.21.3", "postcss": "^8.4.43", @@ -13882,7 +13898,6 @@ "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.3.tgz", "integrity": "sha512-PEIGCY5tSlUt50cqyMXfCzX+oOPqN0vuGqWzbcJ2xvnkzkq46oOpz7dQaTDBdfICb4N14+GARUDw2XV2N4tvzg==", "license": "MIT", - "peer": true, "engines": { "node": ">=10.0.0" }, diff --git a/frontend/src/main-page/notifications/GrantNotification.tsx b/frontend/src/main-page/notifications/GrantNotification.tsx index 84c6eb1a..f890a4d5 100644 --- a/frontend/src/main-page/notifications/GrantNotification.tsx +++ b/frontend/src/main-page/notifications/GrantNotification.tsx @@ -1,39 +1,57 @@ -import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { faBell } from "@fortawesome/free-solid-svg-icons"; import { FaTrash } from "react-icons/fa"; interface GrantNotificationProps { notificationId: string; - title: string; message: string; + alertTime: string; onDelete: (notificationId: string) => void; + avatarUrl: string | null; + firstName: string; + lastName: string; +} + +function formatAlertTime(dateStr: string): string { + return new Date(dateStr).toLocaleString('en-US', { + weekday: 'long', + hour: 'numeric', + minute: '2-digit', + hour12: true, + }); } const GrantNotification: React.FC = ({ notificationId, - title, message, - onDelete + alertTime, + onDelete, + avatarUrl, + firstName, + lastName, }) => { - const handleDelete = () => { - onDelete(notificationId); - }; + const initials = `${firstName.charAt(0)}${lastName.charAt(0)}`.toUpperCase(); return ( -
-
- + +
+
+ {avatarUrl ? ( + {`${firstName} + ) : ( + {initials} + )}
-
-
{title}
-
{message}
+ +
+
{message}
+
{formatAlertTime(alertTime)}
+ onDelete(notificationId)} /> -
+
); }; diff --git a/frontend/src/main-page/notifications/NotificationPopup.tsx b/frontend/src/main-page/notifications/NotificationPopup.tsx index 9c8eabf2..ebd6bf38 100644 --- a/frontend/src/main-page/notifications/NotificationPopup.tsx +++ b/frontend/src/main-page/notifications/NotificationPopup.tsx @@ -1,6 +1,6 @@ import { createPortal } from 'react-dom'; import GrantNotification from "./GrantNotification"; -import '../../styles/notification.css'; +import { FaTrashAlt } from "react-icons/fa"; import { api } from "../../api"; import { setNotifications as setNotificationsAction } from "../../external/bcanSatchel/actions"; import { Notification } from "../../../../middle-layer/types/Notification"; @@ -16,6 +16,7 @@ const NotificationPopup: React.FC = observer(({ }) => { const store = getAppStore(); const liveNotifications: Notification[] = store.notifications ?? []; + const user = store.user; const handleDelete = async (notificationId: string) => { try { @@ -49,32 +50,56 @@ const NotificationPopup: React.FC = observer(({ } }; + const handleDeleteAll = async () => { + try { + await Promise.allSettled( + liveNotifications.map((n) => + api(`/notifications/${n.notificationId}`, { method: "DELETE" }) + ) + ); + setNotificationsAction([]); + } catch (error) { + console.error("Error deleting all notifications:", error); + } + }; + return createPortal( -
-
-

Alerts

- +
setOpenModal(false)}> +
e.stopPropagation()}> +
+

Your Notifications

+
+ +
-
+
{liveNotifications && liveNotifications.length > 0 ? ( liveNotifications.map((n) => ( )) ) : ( -

No new notifications

+

No new notifications

)}
-
, +
+
, document.body ); }); diff --git a/frontend/src/styles/notification.css b/frontend/src/styles/notification.css deleted file mode 100644 index 942690e9..00000000 --- a/frontend/src/styles/notification.css +++ /dev/null @@ -1,109 +0,0 @@ -.notification-popup { - position: absolute; - right: 6rem; - top: 2.5rem; - width: min(340px, 70%); - background-color: white; - padding: 0.5rem; - z-index: 1000; -} - - -.popup-header { - display: flex; - justify-content: space-between; - align-items: center; - padding: 0.5rem 0.5rem; - border-bottom: 1px solid var(--color-grey-400); -} - - -.popup-header h3 { - font-size: var(--font-size-lg); - font-weight: 600; - color: black; - margin: 0; -} - - -.close-button { - background: none; - border: none; - font-size: var(--font-size-base); - cursor: pointer; - color: gray; -} -.close-button:hover { - color: var(--color-red); -} - - -.notification-list { - max-height: 200px; - overflow-y: auto; - margin-top: 10px; - scrollbar-width: none; - -ms-overflow-style: none; -} - - -.grant-notification { - position: relative; - border-bottom: 0.2px solid var(--color-grey-400); - border-radius: 0px; - padding: 8px 10px; - padding-right: 35px; - margin-bottom: 2px; - font-size: var(--font-size-sm); - transition: background-color 0.2s ease; - display: flex; -} - -.bell-notif { - margin-right: 10px; - background-color: var(--color-grey-100); - padding: 10px; - border-radius: 100%; - scale: 73%; - flex-shrink: 0; - width: 40px; - height: 40px; - display: flex; - align-items: center; - justify-content: center; -} - -.notification-text { - flex: 1; -} - -.notification-title { - font-weight: 600; - font-size: var(--font-size-sm); - color: black; - line-height: 1.15; -} - -.notification-message { - font-size: var(--font-size-xs); - color: var(--color-grey-600); - margin-top: 4px; - line-height: 1.2; -} - -.grant-notification:hover { - background-color: var(--color-grey-100); -} - -.notification-trash-icon { - position: absolute; - bottom: 8px; - right: 10px; - color: gray; - cursor: pointer; - font-size: var(--font-size-sm); -} - -.notification-trash-icon:hover { - color: var(--color-red) -}