From d0d4a5128156f3afc5d45e0c369145f88eef2f5d Mon Sep 17 00:00:00 2001 From: "Embruch, Gerd" <gerd.embruch@uni-hamburg.de> Date: Mon, 1 Jul 2024 11:23:28 +0200 Subject: [PATCH] added basic responsive header --- package-lock.json | 456 +++++++++++++++++++++++++++++++- package.json | 5 +- public/vite.svg | 1 - src/assets/img/uhh_logo.svg | 162 ++++++++++++ src/layouts/MainLayout.jsx | 2 + src/layouts/partials/Header.jsx | 63 +++++ vite.config.js | 9 +- 7 files changed, 691 insertions(+), 7 deletions(-) delete mode 100644 public/vite.svg create mode 100755 src/assets/img/uhh_logo.svg create mode 100644 src/layouts/partials/Header.jsx diff --git a/package-lock.json b/package-lock.json index c6a7438..60347a3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,8 +8,10 @@ "name": "ragchat-frontend", "version": "0.0.0", "dependencies": { + "hamburger-react": "^2.5.1", "react": "^18.3.1", "react-dom": "^18.3.1", + "react-icons": "^5.2.1", "react-router-dom": "^6.24.0" }, "devDependencies": { @@ -24,7 +26,8 @@ "postcss": "^8.4.39", "sass": "^1.77.6", "tailwindcss": "^3.4.4", - "vite": "^5.3.1" + "vite": "^5.3.1", + "vite-plugin-svgr": "^4.2.0" } }, "node_modules/@alloc/quick-lru": { @@ -1073,6 +1076,29 @@ "node": ">=14.0.0" } }, + "node_modules/@rollup/pluginutils": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.1.0.tgz", + "integrity": "sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/estree": "^1.0.0", + "estree-walker": "^2.0.2", + "picomatch": "^2.3.1" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0" + }, + "peerDependenciesMeta": { + "rollup": { + "optional": true + } + } + }, "node_modules/@rollup/rollup-android-arm-eabi": { "version": "4.18.0", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.18.0.tgz", @@ -1297,6 +1323,231 @@ "win32" ] }, + "node_modules/@svgr/babel-plugin-add-jsx-attribute": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-8.0.0.tgz", + "integrity": "sha512-b9MIk7yhdS1pMCZM8VeNfUlSKVRhsHZNMl5O9SfaX0l0t5wjdgu4IDzGB8bpnGBBOjGST3rRFVsaaEtI4W6f7g==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@svgr/babel-plugin-remove-jsx-attribute": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-remove-jsx-attribute/-/babel-plugin-remove-jsx-attribute-8.0.0.tgz", + "integrity": "sha512-BcCkm/STipKvbCl6b7QFrMh/vx00vIP63k2eM66MfHJzPr6O2U0jYEViXkHJWqXqQYjdeA9cuCl5KWmlwjDvbA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@svgr/babel-plugin-remove-jsx-empty-expression": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-remove-jsx-empty-expression/-/babel-plugin-remove-jsx-empty-expression-8.0.0.tgz", + "integrity": "sha512-5BcGCBfBxB5+XSDSWnhTThfI9jcO5f0Ai2V24gZpG+wXF14BzwxxdDb4g6trdOux0rhibGs385BeFMSmxtS3uA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@svgr/babel-plugin-replace-jsx-attribute-value": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-replace-jsx-attribute-value/-/babel-plugin-replace-jsx-attribute-value-8.0.0.tgz", + "integrity": "sha512-KVQ+PtIjb1BuYT3ht8M5KbzWBhdAjjUPdlMtpuw/VjT8coTrItWX6Qafl9+ji831JaJcu6PJNKCV0bp01lBNzQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@svgr/babel-plugin-svg-dynamic-title": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-svg-dynamic-title/-/babel-plugin-svg-dynamic-title-8.0.0.tgz", + "integrity": "sha512-omNiKqwjNmOQJ2v6ge4SErBbkooV2aAWwaPFs2vUY7p7GhVkzRkJ00kILXQvRhA6miHnNpXv7MRnnSjdRjK8og==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@svgr/babel-plugin-svg-em-dimensions": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-svg-em-dimensions/-/babel-plugin-svg-em-dimensions-8.0.0.tgz", + "integrity": "sha512-mURHYnu6Iw3UBTbhGwE/vsngtCIbHE43xCRK7kCw4t01xyGqb2Pd+WXekRRoFOBIY29ZoOhUCTEweDMdrjfi9g==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@svgr/babel-plugin-transform-react-native-svg": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-transform-react-native-svg/-/babel-plugin-transform-react-native-svg-8.1.0.tgz", + "integrity": "sha512-Tx8T58CHo+7nwJ+EhUwx3LfdNSG9R2OKfaIXXs5soiy5HtgoAEkDay9LIimLOcG8dJQH1wPZp/cnAv6S9CrR1Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@svgr/babel-plugin-transform-svg-component": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-transform-svg-component/-/babel-plugin-transform-svg-component-8.0.0.tgz", + "integrity": "sha512-DFx8xa3cZXTdb/k3kfPeaixecQLgKh5NVBMwD0AQxOzcZawK4oo1Jh9LbrcACUivsCA7TLG8eeWgrDXjTMhRmw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@svgr/babel-preset": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/@svgr/babel-preset/-/babel-preset-8.1.0.tgz", + "integrity": "sha512-7EYDbHE7MxHpv4sxvnVPngw5fuR6pw79SkcrILHJ/iMpuKySNCl5W1qcwPEpU+LgyRXOaAFgH0KhwD18wwg6ug==", + "dev": true, + "license": "MIT", + "dependencies": { + "@svgr/babel-plugin-add-jsx-attribute": "8.0.0", + "@svgr/babel-plugin-remove-jsx-attribute": "8.0.0", + "@svgr/babel-plugin-remove-jsx-empty-expression": "8.0.0", + "@svgr/babel-plugin-replace-jsx-attribute-value": "8.0.0", + "@svgr/babel-plugin-svg-dynamic-title": "8.0.0", + "@svgr/babel-plugin-svg-em-dimensions": "8.0.0", + "@svgr/babel-plugin-transform-react-native-svg": "8.1.0", + "@svgr/babel-plugin-transform-svg-component": "8.0.0" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@svgr/core": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/@svgr/core/-/core-8.1.0.tgz", + "integrity": "sha512-8QqtOQT5ACVlmsvKOJNEaWmRPmcojMOzCz4Hs2BGG/toAp/K38LcsMRyLp349glq5AzJbCEeimEoxaX6v/fLrA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/core": "^7.21.3", + "@svgr/babel-preset": "8.1.0", + "camelcase": "^6.2.0", + "cosmiconfig": "^8.1.3", + "snake-case": "^3.0.4" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + } + }, + "node_modules/@svgr/hast-util-to-babel-ast": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@svgr/hast-util-to-babel-ast/-/hast-util-to-babel-ast-8.0.0.tgz", + "integrity": "sha512-EbDKwO9GpfWP4jN9sGdYwPBU0kdomaPIL2Eu4YwmgP+sJeXT+L7bMwJUBnhzfH8Q2qMBqZ4fJwpCyYsAN3mt2Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/types": "^7.21.3", + "entities": "^4.4.0" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + } + }, + "node_modules/@svgr/plugin-jsx": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/@svgr/plugin-jsx/-/plugin-jsx-8.1.0.tgz", + "integrity": "sha512-0xiIyBsLlr8quN+WyuxooNW9RJ0Dpr8uOnH/xrCVO8GLUcwHISwj1AG0k+LFzteTkAA0GbX0kj9q6Dk70PTiPA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/core": "^7.21.3", + "@svgr/babel-preset": "8.1.0", + "@svgr/hast-util-to-babel-ast": "8.0.0", + "svg-parser": "^2.0.4" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/gregberge" + }, + "peerDependencies": { + "@svgr/core": "*" + } + }, "node_modules/@types/babel__core": { "version": "7.20.5", "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", @@ -1813,6 +2064,19 @@ "node": ">=6" } }, + "node_modules/camelcase": { + "version": "6.3.0", + "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz", + "integrity": "sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/camelcase-css": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz", @@ -1938,6 +2202,33 @@ "dev": true, "license": "MIT" }, + "node_modules/cosmiconfig": { + "version": "8.3.6", + "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.3.6.tgz", + "integrity": "sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==", + "dev": true, + "license": "MIT", + "dependencies": { + "import-fresh": "^3.3.0", + "js-yaml": "^4.1.0", + "parse-json": "^5.2.0", + "path-type": "^4.0.0" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/d-fischer" + }, + "peerDependencies": { + "typescript": ">=4.9.5" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, "node_modules/cross-spawn": { "version": "7.0.3", "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz", @@ -2115,6 +2406,17 @@ "node": ">=6.0.0" } }, + "node_modules/dot-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", + "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", + "dev": true, + "license": "MIT", + "dependencies": { + "no-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, "node_modules/eastasianwidth": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz", @@ -2136,6 +2438,29 @@ "dev": true, "license": "MIT" }, + "node_modules/entities": { + "version": "4.5.0", + "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz", + "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==", + "dev": true, + "license": "BSD-2-Clause", + "engines": { + "node": ">=0.12" + }, + "funding": { + "url": "https://github.com/fb55/entities?sponsor=1" + } + }, + "node_modules/error-ex": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz", + "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==", + "dev": true, + "license": "MIT", + "dependencies": { + "is-arrayish": "^0.2.1" + } + }, "node_modules/es-abstract": { "version": "1.23.3", "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.3.tgz", @@ -2675,6 +3000,13 @@ "node": ">=4.0" } }, + "node_modules/estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true, + "license": "MIT" + }, "node_modules/esutils": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz", @@ -3043,6 +3375,15 @@ "dev": true, "license": "MIT" }, + "node_modules/hamburger-react": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/hamburger-react/-/hamburger-react-2.5.1.tgz", + "integrity": "sha512-XlTIinYeYzLu76q4Vd9olwOJP0hFgAeZfJFX6tTT/ufTLhmOjI77CGFYIwGc6gcDeeT86660ZoKx3/L67vdZEw==", + "license": "MIT", + "peerDependencies": { + "react": "^16.8 || ^17 || ^18" + } + }, "node_modules/has-bigints": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.0.2.tgz", @@ -3226,6 +3567,13 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-arrayish": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz", + "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==", + "dev": true, + "license": "MIT" + }, "node_modules/is-async-function": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.0.0.tgz", @@ -3703,6 +4051,13 @@ "dev": true, "license": "MIT" }, + "node_modules/json-parse-even-better-errors": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz", + "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==", + "dev": true, + "license": "MIT" + }, "node_modules/json-schema-traverse": { "version": "0.4.1", "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz", @@ -3822,6 +4177,16 @@ "loose-envify": "cli.js" } }, + "node_modules/lower-case": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", + "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", + "dev": true, + "license": "MIT", + "dependencies": { + "tslib": "^2.0.3" + } + }, "node_modules/lru-cache": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz", @@ -3924,6 +4289,17 @@ "dev": true, "license": "MIT" }, + "node_modules/no-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", + "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", + "dev": true, + "license": "MIT", + "dependencies": { + "lower-case": "^2.0.2", + "tslib": "^2.0.3" + } + }, "node_modules/node-releases": { "version": "2.0.14", "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz", @@ -4163,6 +4539,25 @@ "node": ">=6" } }, + "node_modules/parse-json": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz", + "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/code-frame": "^7.0.0", + "error-ex": "^1.3.1", + "json-parse-even-better-errors": "^2.3.0", + "lines-and-columns": "^1.1.6" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/path-exists": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", @@ -4227,6 +4622,16 @@ "node": "14 || >=16.14" } }, + "node_modules/path-type": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", + "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, "node_modules/picocolors": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz", @@ -4530,6 +4935,15 @@ "react": "^18.3.1" } }, + "node_modules/react-icons": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.2.1.tgz", + "integrity": "sha512-zdbW5GstTzXaVKvGSyTaBalt7HSfuK5ovrzlpyiWHAFXndXTdd/1hdDHI4xBM1Mn7YriT6aqESucFl9kEXzrdw==", + "license": "MIT", + "peerDependencies": { + "react": "*" + } + }, "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", @@ -4922,6 +5336,17 @@ "url": "https://github.com/sponsors/isaacs" } }, + "node_modules/snake-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz", + "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==", + "dev": true, + "license": "MIT", + "dependencies": { + "dot-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, "node_modules/source-map-js": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz", @@ -5220,6 +5645,13 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/svg-parser": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/svg-parser/-/svg-parser-2.0.4.tgz", + "integrity": "sha512-e4hG1hRwoOdRb37cIMSgzNsxyzKfayW6VOflrwvR+/bzrkyxY/31WkbgnQpgtrNp1SdpJvpUAGTa/ZoiPNDuRQ==", + "dev": true, + "license": "MIT" + }, "node_modules/tailwindcss": { "version": "3.4.4", "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.4.tgz", @@ -5336,6 +5768,13 @@ "dev": true, "license": "Apache-2.0" }, + "node_modules/tslib": { + "version": "2.6.3", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.3.tgz", + "integrity": "sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ==", + "dev": true, + "license": "0BSD" + }, "node_modules/type-check": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz", @@ -5559,6 +5998,21 @@ } } }, + "node_modules/vite-plugin-svgr": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/vite-plugin-svgr/-/vite-plugin-svgr-4.2.0.tgz", + "integrity": "sha512-SC7+FfVtNQk7So0XMjrrtLAbEC8qjFPifyD7+fs/E6aaNdVde6umlVVh0QuwDLdOMu7vp5RiGFsB70nj5yo0XA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@rollup/pluginutils": "^5.0.5", + "@svgr/core": "^8.1.0", + "@svgr/plugin-jsx": "^8.1.0" + }, + "peerDependencies": { + "vite": "^2.6.0 || 3 || 4 || 5" + } + }, "node_modules/which": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz", diff --git a/package.json b/package.json index 1957a22..4dd3acf 100644 --- a/package.json +++ b/package.json @@ -11,8 +11,10 @@ "preview": "vite preview" }, "dependencies": { + "hamburger-react": "^2.5.1", "react": "^18.3.1", "react-dom": "^18.3.1", + "react-icons": "^5.2.1", "react-router-dom": "^6.24.0" }, "devDependencies": { @@ -27,6 +29,7 @@ "postcss": "^8.4.39", "sass": "^1.77.6", "tailwindcss": "^3.4.4", - "vite": "^5.3.1" + "vite": "^5.3.1", + "vite-plugin-svgr": "^4.2.0" } } diff --git a/public/vite.svg b/public/vite.svg deleted file mode 100644 index e7b8dfb..0000000 --- a/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ -<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg> \ No newline at end of file diff --git a/src/assets/img/uhh_logo.svg b/src/assets/img/uhh_logo.svg new file mode 100755 index 0000000..0e6c0de --- /dev/null +++ b/src/assets/img/uhh_logo.svg @@ -0,0 +1,162 @@ +<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" className="h-full pointer-events-none" viewBox="0 0 392.46 127.19"> + <defs> + <style> + .uhhlogo--cls-1 { + fill: #1d1d1b; + stroke-opacity: 0; + } + + .uhhlogo--cls-2 { + fill: #e2001a; + } + + .uhhlogo--cls-3 { + fill: #fff; + } + </style> + </defs> + <title>UHH [external]</title> + <path className="uhhlogo--cls-1" + d="M120.1,97.25c-6.11,0-7.41-3.51-7.41-7.26V76.53h3.14V89.75c0,2.72.87,4.78,4.47,4.78,3.17,0,4.61-1.39,4.61-5.2V76.53H128V89.08C128,94.53,125.21,97.25,120.1,97.25Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M142,96.95V88c0-1.74-.48-2.74-2.07-2.74-2.1,0-3.64,2.21-3.64,5v6.72h-3V83h2.86a18.23,18.23,0,0,1-.2,2.72l0,0a5.08,5.08,0,0,1,4.84-3c3.16,0,4.14,2,4.14,4.45v9.74Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M151.7,81a1.88,1.88,0,1,1,0-3.75,1.88,1.88,0,1,1,0,3.75Zm-1.51,16V83h3V96.95Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M164.64,96.95h-3.05L156.38,83h3.3l2.6,7.36c.34,1,.64,1.93.9,2.86h0c.22-.87.5-1.85.81-2.74L166.68,83h3.22Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M183.93,90.17h-8.88c-.08,3.22,1.34,4.68,4.12,4.68a9.59,9.59,0,0,0,4.06-.9l.28,2.38a12.72,12.72,0,0,1-4.82.9c-4.34,0-6.72-2.24-6.72-7.14,0-4.2,2.3-7.34,6.36-7.34s5.68,2.72,5.68,6A13.66,13.66,0,0,1,183.93,90.17ZM178.22,85c-1.68,0-2.86,1.23-3.11,3.11H181A2.71,2.71,0,0,0,178.22,85Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M195.35,85.69c-2.77-.5-4.12,1.43-4.12,5.6v5.66h-3V83h2.86a18.68,18.68,0,0,1-.28,3.08h.06c.62-1.88,2-3.61,4.62-3.36Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M201.32,97.23a15.89,15.89,0,0,1-2.94-.28l.08-2.55a11.25,11.25,0,0,0,3,.45c1.62,0,2.74-.7,2.74-1.85,0-2.8-6.1-1.12-6.1-5.94,0-2.41,2-4.31,5.74-4.31a16.75,16.75,0,0,1,2.6.25l-.08,2.44a9.8,9.8,0,0,0-2.72-.39c-1.65,0-2.46.67-2.46,1.74,0,2.69,6.16,1.32,6.16,5.94C207.37,95.32,205,97.23,201.32,97.23Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M213.16,81a1.88,1.88,0,1,1,0-3.75,1.88,1.88,0,1,1,0,3.75Zm-1.51,16V83h3V96.95Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M224.87,97.19c-3,0-3.86-1.12-3.86-4.17V85.59h-2.66V83.31H221V79l3-.8v5.13h3.67v2.28H224v6.53c0,2,.42,2.58,1.82,2.58a7.7,7.7,0,0,0,1.82-.22v2.41A14.81,14.81,0,0,1,224.87,97.19Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M239.12,96.95a18.67,18.67,0,0,1,.14-2.58l0,0a4.86,4.86,0,0,1-4.62,2.88c-2.38,0-3.89-1.34-3.89-3.56,0-3.19,3.19-5,8.2-5v-.9c0-1.74-.73-2.63-2.91-2.63a8.53,8.53,0,0,0-4.14,1.12l-.28-2.55a13.88,13.88,0,0,1,4.9-.92c4.26,0,5.43,1.85,5.43,4.7v5.68c0,1.2,0,2.63.08,3.81ZM234,80.4A1.69,1.69,0,0,1,234,77a1.69,1.69,0,1,1,0,3.39Zm5,10.25c-4.37,0-5.32,1.32-5.32,2.52a1.69,1.69,0,0,0,1.9,1.71c2,0,3.42-2,3.42-3.95Zm.56-10.25a1.69,1.69,0,1,1,1.68-1.71A1.7,1.7,0,0,1,239.48,80.4Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M251.63,97.19c-3,0-3.86-1.12-3.86-4.17V85.59h-2.66V83.31h2.66V79l3-.8v5.13h3.67v2.28h-3.64v6.53c0,2,.42,2.58,1.82,2.58a7.7,7.7,0,0,0,1.82-.22v2.41A14.81,14.81,0,0,1,251.63,97.19Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M282.58,96.95V87.78h-9.2v9.16h-3.14V76.53h3.14V85h9.2V76.53h3.12V96.95Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M299.59,96.95a18.36,18.36,0,0,1,.14-2.58l0,0a4.86,4.86,0,0,1-4.62,2.88c-2.38,0-3.89-1.34-3.89-3.56,0-3.19,3.19-5,8.2-5v-.9c0-1.74-.73-2.63-2.91-2.63a8.52,8.52,0,0,0-4.14,1.12l-.28-2.55a13.87,13.87,0,0,1,4.9-.92c4.26,0,5.43,1.85,5.43,4.7v5.68c0,1.2,0,2.63.08,3.81Zm-.2-6.3c-4.37,0-5.32,1.32-5.32,2.52a1.69,1.69,0,0,0,1.9,1.71c2,0,3.42-2,3.42-3.95Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M325,96.95V88.07c0-1.74-.42-2.83-2-2.83-1.79,0-3.58,2-3.58,5v6.66H316.5V88c0-1.57-.34-2.8-2-2.8-1.9,0-3.56,2.13-3.56,5v6.66h-3V83h2.86a18.43,18.43,0,0,1-.2,2.72l.06,0a5,5,0,0,1,4.7-3,3.56,3.56,0,0,1,3.87,3,5,5,0,0,1,4.65-3c2.66,0,4.14,1.43,4.14,4.59v9.6Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M338.18,97.17a18.79,18.79,0,0,1-5-.59V76.51h3v6.41a13.61,13.61,0,0,1-.25,2.66H336a4.64,4.64,0,0,1,4.42-2.83c3.3,0,5.12,2.35,5.12,6.55C345.57,94.12,342.79,97.17,338.18,97.17Zm1.48-11.93c-2.24,0-3.45,2.6-3.45,5v4.31a7.17,7.17,0,0,0,2.19.28c2.38,0,4-1.46,4-5.21C342.4,86.78,341.54,85.24,339.66,85.24Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M359.06,96.95a18.18,18.18,0,0,1,.2-2.72l0,0a5.08,5.08,0,0,1-4.84,3c-3.16,0-4.14-2-4.14-4.45V83h3v9c0,1.74.48,2.74,2.07,2.74,2.1,0,3.64-2.21,3.64-5V83h3V96.95Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M375.08,85.69c-2.77-.5-4.12,1.43-4.12,5.6v5.66h-3V83h2.86a18.58,18.58,0,0,1-.28,3.08h.06c.62-1.88,2-3.61,4.62-3.36Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M384.37,104.11c-3.64,0-5.91-1.4-5.91-4.09a4.05,4.05,0,0,1,2.24-3.5,2.29,2.29,0,0,1-1.37-2.07,2.61,2.61,0,0,1,1.6-2.38,4.23,4.23,0,0,1-2.07-3.92c0-2.94,2.24-5.4,6.22-5.4a10.1,10.1,0,0,1,2.29.28h4.71v2.35h-2.13a2.94,2.94,0,0,1,1,2.32c0,3-2.1,5.15-6,5.15a9.15,9.15,0,0,1-1.6-.14,1.15,1.15,0,0,0-.81,1c0,.7.62,1,2.29,1h2.38c3,0,4.73,1.43,4.73,4C391.88,101.73,388.86,104.11,384.37,104.11Zm2-6.94h-2.6a6.71,6.71,0,0,1-.76,0,2.71,2.71,0,0,0-1.54,2.32c0,1.48,1.4,2.32,3.42,2.32,2.6,0,4.06-1.12,4.06-2.63C388.91,98,388.1,97.17,386.34,97.17ZM384.94,85a2.85,2.85,0,0,0-3.16,2.91c0,1.82,1.12,2.88,3.14,2.88s3.11-1,3.11-2.86A2.76,2.76,0,0,0,384.94,85Z" + transform="translate(0.39 -0.66)" /> + <polygon className="uhhlogo--cls-2" points="0.42 0 96.39 0 96.39 95.97 0.42 95.97 0.42 0 0.42 0" /> + <polygon className="uhhlogo--cls-3" + points="62.11 56.88 63.48 56.88 62.8 55.7 63.48 54.51 62.11 54.51 61.43 53.32 60.74 54.51 59.37 54.51 60.06 55.7 59.37 56.88 60.74 56.88 61.43 58.07 62.11 56.88 62.11 56.88" /> + <polygon className="uhhlogo--cls-3" + points="83.57 56.88 84.94 56.88 84.25 55.7 84.94 54.51 83.57 54.51 82.88 53.32 82.19 54.51 80.83 54.51 81.51 55.7 80.83 56.88 82.19 56.88 82.88 58.07 83.57 56.88 83.57 56.88" /> + <path className="uhhlogo--cls-3" + d="M68,58.09v.26H66.5V60.1h1.69v11h-3.9V60.35h-6.5V71.06H55.67v1.82h32.2V71.06H85.74V60.35h-6.5V71.06h-3.9v-11H77V58.35h-1.5a3.89,3.89,0,0,0-3-3.93V52.53h1.41V51.21H72.54V49.6H71v1.61H69.59v1.32H71v1.9a3.76,3.76,0,0,0-3,3.67Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-3" + d="M71.77,80.39a4.3,4.3,0,0,0-4.3,4.3l-.08,7.2H53.88a62.94,62.94,0,0,0,3.75-17.13H85.9a63,63,0,0,0,3.75,17.13H76.14l-.08-7.2a4.3,4.3,0,0,0-4.3-4.3Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-3" + d="M41.81,32H38V21.2H26.71v2.49c0,5.42-3.2,8.66-9.46,8.66-6.43,0-9.46-3-9.46-8.55V7.94h3.89V23c0,3.87,1.35,6.13,5.61,6.13S22.9,26.89,22.9,23V7.94h3.81v9.95H38V7.94h3.85v9.95H53.14V7.94H57V32H53.14V21.2H41.81V32Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M3,126.42c-1.27,0-2.37-.05-3.4-.09V114.15c1,0,2.44-.09,3.95-.09,3.78,0,6.19,1.68,6.19,6S7,126.42,3,126.42ZM3.4,116c-.54,0-1,0-1.43.05v8.23a8.5,8.5,0,0,0,1.29.09c2.3,0,4-1.3,4-4.2C7.21,117.59,6.18,116,3.4,116Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M11.87,126.35V114.13h6.64v2H14.22v3h4.07V121H14.22v3.31h4.29v2Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M26.82,126.35l-3.4-5h-.09v5H21V114.13c1-.05,2.1-.07,3.51-.07,2.7,0,4.43.94,4.43,3.44a3.42,3.42,0,0,1-3.11,3.4c.34.45.69.92,1,1.34l2.93,4.11ZM24.25,116a6.68,6.68,0,0,0-.92.05v3.53c.16,0,.49,0,.85,0,1.41,0,2.28-.72,2.28-1.86S25.73,116,24.25,116Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M40.59,116.18v3.13h3.93v1.93H40.59v5.11H38.25V114.2h6.5v2Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M51.7,126.55c-3.71,0-5.53-2.36-5.53-6.12,0-4,2.68-6.43,5.94-6.43s5.53,1.94,5.53,6.1S55,126.55,51.7,126.55Zm.2-10.44c-1.67,0-3.22,1.33-3.22,4.07,0,2.57,1,4.25,3.19,4.25,1.58,0,3.28-1.22,3.28-4.14C55.14,117.58,54,116.11,51.9,116.11Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M65.58,126.35l-3.39-5H62.1v5H59.76V114.2c1-.05,2.09-.07,3.49-.07,2.68,0,4.41.94,4.41,3.42a3.4,3.4,0,0,1-3.1,3.38l1,1.33,2.92,4.09ZM63,116a6.6,6.6,0,0,0-.92.05v3.51c.16,0,.49,0,.85,0,1.4,0,2.27-.72,2.27-1.85S64.5,116,63,116Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M72.45,126.55a10,10,0,0,1-2.48-.29l.14-2.18a8.4,8.4,0,0,0,2.54.43c1.19,0,2.11-.49,2.11-1.6,0-2.32-5.1-1.26-5.1-5.26,0-2.16,1.71-3.66,4.63-3.66a13.35,13.35,0,0,1,2.2.22l-.13,2.05a8,8,0,0,0-2.18-.32c-1.35,0-2,.61-2,1.48,0,2.18,5.11,1.37,5.11,5.17C77.26,124.87,75.44,126.55,72.45,126.55Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M84.56,126.51c-4.25,0-5.62-2.83-5.62-5.85,0-3.85,2-6.55,6.09-6.55a10.1,10.1,0,0,1,2.57.32l-.25,2.12a8.66,8.66,0,0,0-2.45-.36c-2.27,0-3.39,1.71-3.39,4.07,0,2.65,1.1,4.12,3.55,4.12a6.42,6.42,0,0,0,2.36-.5L87.7,126A9.43,9.43,0,0,1,84.56,126.51Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M97.6,126.35v-5.28H92.45v5.28H90.11V114.2h2.34v4.86H97.6V114.2h2.34v12.15Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M107.75,126.55c-3.84,0-4.7-2.09-4.7-4.41V114.2h2.34V122c0,1.53.5,2.61,2.52,2.61,1.8,0,2.56-.76,2.56-2.83V114.2h2.32v7.44C112.79,125,111,126.55,107.75,126.55Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M122.87,126.35l-3.56-6.14A27.38,27.38,0,0,1,118,117.6c.07,1,.11,3,.11,4.41v4.34h-2.27V114.2h3l3.39,5.8c.56.94,1,1.94,1.49,2.86-.09-1.22-.13-3.38-.13-4.88V114.2h2.27v12.15Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M138,116.72a9,9,0,0,0-3.22-.61,3.9,3.9,0,0,0-4.12,4.23c0,2.57,1.4,4.09,3.87,4.09a5.2,5.2,0,0,0,1.55-.22V120h2.34v5.8a11.47,11.47,0,0,1-4.16.76c-3.85,0-6.14-2.27-6.14-6s2.59-6.54,6.81-6.54a12.4,12.4,0,0,1,3.44.52Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M151.69,127.85V113.74h1.67v14.11Z" transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M169.87,126.42c-1.26,0-2.36-.05-3.39-.09V114.21c1,0,2.43-.09,3.93-.09,3.76,0,6.16,1.67,6.16,5.94S173.83,126.42,169.87,126.42Zm.38-10.33c-.54,0-1,0-1.42.05v8.19a8.55,8.55,0,0,0,1.28.09c2.29,0,3.94-1.3,3.94-4.18C174.05,117.64,173,116.09,170.25,116.09Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M178.67,126.35V114.2h6.61v2H181v3h4.05v1.91H181v3.29h4.27v2Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M193.54,126.35l-3.39-5h-.09v5h-2.34V114.2c1-.05,2.09-.07,3.49-.07,2.68,0,4.41.94,4.41,3.42a3.4,3.4,0,0,1-3.1,3.38c.34.45.68.92,1,1.33l2.92,4.09ZM191,116a6.6,6.6,0,0,0-.92.05v3.51c.16,0,.49,0,.85,0,1.4,0,2.27-.72,2.27-1.85S192.46,116,191,116Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M204.92,126.35V114.2h2.34v10.1h3.94v2.05Z" transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M212.91,126.35V114.2h6.61v2h-4.27v3h4.05v1.91h-4.05v3.29h4.27v2Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M229.54,126.35v-5.28h-5.15v5.28h-2.34V114.2h2.34v4.86h5.15V114.2h2.34v12.15Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M240.85,126.35l-3.38-5h-.09v5H235V114.2c1-.05,2.09-.07,3.49-.07,2.68,0,4.41.94,4.41,3.42a3.4,3.4,0,0,1-3.1,3.38l1,1.33,2.92,4.09ZM238.29,116a6.6,6.6,0,0,0-.92.05v3.51c.16,0,.49,0,.85,0,1.4,0,2.27-.72,2.27-1.85S239.77,116,238.29,116Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M245.63,126.35V114.2h6.61v2H248v3H252v1.91H248v3.29h4.27v2Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M265.36,127.85V113.74H267v14.11Z" transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M283.21,126.42c-1.26,0-2.36-.05-3.38-.09V114.21c1,0,2.43-.09,3.93-.09,3.76,0,6.16,1.67,6.16,5.94S287.17,126.42,283.21,126.42Zm.38-10.33c-.54,0-1,0-1.42.05v8.19a8.56,8.56,0,0,0,1.28.09c2.29,0,3.94-1.3,3.94-4.18C287.39,117.64,286.36,116.09,283.59,116.09Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M292,126.35V114.2h6.61v2h-4.27v3h4.05v1.91h-4.05v3.29h4.27v2Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M306.88,126.35l-3.38-5h-.09v5h-2.34V114.2c1-.05,2.09-.07,3.49-.07,2.68,0,4.41.94,4.41,3.42a3.4,3.4,0,0,1-3.1,3.38c.34.45.69.92,1,1.33l2.92,4.09ZM304.33,116a6.61,6.61,0,0,0-.92.05v3.51c.16,0,.49,0,.85,0,1.4,0,2.27-.72,2.27-1.85S305.8,116,304.33,116Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M321.8,126.39c-.74,0-2,0-3.55,0V114.21c1-.05,2.61-.09,4.11-.09,2.63,0,4.09,1.06,4.09,3a3,3,0,0,1-1.93,2.72v0a2.68,2.68,0,0,1,2.16,2.72C326.68,124.37,325.48,126.39,321.8,126.39ZM322,116c-.49,0-1,0-1.37,0v3.17c.29,0,.58,0,1,0,1.6,0,2.43-.65,2.43-1.73C324,116.61,323.44,116,322,116Zm-.34,5c-.18,0-.77,0-1,0v3.4a10.71,10.71,0,0,0,1.28.07c1.53,0,2.3-.72,2.3-1.82S323.15,121,321.62,121Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M329.11,126.35V114.2h2.34v12.15Z" transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" d="M334.58,126.35V114.2h2.34v10.1h3.94v2.05Z" transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M346,126.42c-1.26,0-2.36-.05-3.38-.09V114.21c1,0,2.43-.09,3.92-.09,3.76,0,6.16,1.67,6.16,5.94S349.92,126.42,346,126.42Zm.38-10.33c-.54,0-1,0-1.42.05v8.19a8.56,8.56,0,0,0,1.28.09c2.29,0,3.94-1.3,3.94-4.18C350.13,117.64,349.11,116.09,346.34,116.09Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M359.55,126.55c-3.84,0-4.7-2.09-4.7-4.41V114.2h2.34V122c0,1.53.5,2.61,2.52,2.61,1.8,0,2.56-.76,2.56-2.83V114.2h2.32v7.44C364.59,125,362.75,126.55,359.55,126.55Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M374.67,126.35l-3.57-6.14a27.86,27.86,0,0,1-1.31-2.61c.07,1,.11,3,.11,4.41v4.34h-2.27V114.2h3l3.38,5.8c.56.94,1,1.94,1.49,2.86-.09-1.22-.12-3.38-.12-4.88V114.2h2.27v12.15Z" + transform="translate(0.39 -0.66)" /> + <path className="uhhlogo--cls-1" + d="M389.75,116.72a9,9,0,0,0-3.22-.61,3.9,3.9,0,0,0-4.12,4.23c0,2.57,1.4,4.09,3.87,4.09a5.21,5.21,0,0,0,1.55-.22V120h2.34v5.8a11.46,11.46,0,0,1-4.16.76c-3.85,0-6.14-2.27-6.14-6s2.59-6.54,6.81-6.54a12.42,12.42,0,0,1,3.44.52Z" + transform="translate(0.39 -0.66)" /> +</svg> \ No newline at end of file diff --git a/src/layouts/MainLayout.jsx b/src/layouts/MainLayout.jsx index 40fa6d1..b8f161e 100644 --- a/src/layouts/MainLayout.jsx +++ b/src/layouts/MainLayout.jsx @@ -1,5 +1,6 @@ import React from 'react'; import { Outlet } from 'react-router-dom'; +import Header from './partials/Header'; function MainLayout() { // ################################# @@ -15,6 +16,7 @@ function MainLayout() { // ################################# return ( <> + <Header /> <Outlet /> </> ); diff --git a/src/layouts/partials/Header.jsx b/src/layouts/partials/Header.jsx new file mode 100644 index 0000000..e35daaf --- /dev/null +++ b/src/layouts/partials/Header.jsx @@ -0,0 +1,63 @@ +import React from 'react'; +import UhhImg from '/src/assets/img/uhh_logo.svg?react'; +import PortalImg from '/src/assets/img/portal_logo.svg?react'; +import { Link } from 'react-router-dom'; +import { RiFilter2Line } from 'react-icons/ri'; +import Hamburger from 'hamburger-react'; + + + +function Header() { + // ################################# + // HOOKS + // ################################# + + // ################################# + // FUNCTIONS + // ################################# + + // ################################# + // OUTPUT + // ################################# + return ( + <header role="banner" className='row-start-1 col-span-full sm:flex justify-center'> + {/* mobile */} + <div className="flex justify-between items-center bg-UhhBlue text-UhhWhite px-4 py-2 sm:hidden"> + <a className="hidden h-16" href="https://www.uni-hamburg.de" target="_blank" title="UHH [external]"> + <UhhImg /> + </a> + <Link className="flex" to="/"> + <div className="h-8 pr-2"> + <PortalImg alt='Logo of ZBH Portal' /> + </div> + <h2>ZBH-Portal</h2> + </Link> + <span className="h-12 flex items-center gap-x-4"> + <div className="h-8 w-8"> + <RiFilter2Line className='text-3xl' /> + </div> + <div className="h-full w-8"> + <Hamburger label='show navigation' duration={0.3} /> + </div> + </span> + </div> + {/* desktop */} + <div className="hidden text-UhhWhite px-4 py-2 sm:flex justify-between container"> + <a className="inline-block h-20" href="https://www.uni-hamburg.de" target="_blank" title="UHH [external]"> + <UhhImg /> + </a> + <Link className="flex items-center" to="/"> + <div className="text-UhhBlue h-20 pr-2"> + <PortalImg /> + </div> + <h2 className="font-UhhBC"> + <div className="text-UhhGrey">ZBH</div> + <div className="text-UhhBlue">Portal</div> + </h2> + </Link> + </div> + </header> + ); +} + +export default React.memo(Header); \ No newline at end of file diff --git a/vite.config.js b/vite.config.js index 5a33944..6c26492 100644 --- a/vite.config.js +++ b/vite.config.js @@ -1,7 +1,8 @@ -import { defineConfig } from 'vite' -import react from '@vitejs/plugin-react' +import { defineConfig } from 'vite'; +import react from '@vitejs/plugin-react'; +import svgr from 'vite-plugin-svgr'; // https://vitejs.dev/config/ export default defineConfig({ - plugins: [react()], -}) + plugins: [react(), svgr()] +}); -- GitLab