vuminh224/hackathon
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

commit

Browse Source
This commit is contained in:
tuanvu
2026-01-11 19:23:49 +01:00
parent ecbddd3a58
commit 40917f52d4
6 changed files with 309 additions and 177 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
front_end/package-lock.json generated
View File

@@ -74,6 +74,7 @@
"resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.5.tgz",
"integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/code-frame": "^7.27.1",
"@babel/generator": "^7.28.5",
@@ -723,6 +724,7 @@
"resolved": "https://registry.npmjs.org/@babel/plugin-syntax-flow/-/plugin-syntax-flow-7.27.1.tgz",
"integrity": "sha512-p9OkPbZ5G7UT1MofwYFigGebnrzGJacoBSQM0/6bi/PUMVE+qlWDD/OalvQKbwgQzU6dl0xAv6r4X7Jme0RYxA==",
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/helper-plugin-utils": "^7.27.1"
},
@@ -1606,6 +1608,7 @@
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.27.1.tgz",
"integrity": "sha512-2KH4LWGSrJIkVf5tSiBFYuXDAoWRq2MMwgivCf+93dd0GQi8RXLjKA/0EvRnVV5G0hrHczsquXuD01L8s6dmBw==",
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/helper-annotate-as-pure": "^7.27.1",
"@babel/helper-module-imports": "^7.27.1",
@@ -2987,6 +2990,7 @@
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
"license": "MIT",
"peer": true,
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/popperjs"
@@ -3465,6 +3469,7 @@
"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",
@@ -3850,6 +3855,7 @@
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.7.tgz",
"integrity": "sha512-MWtvHrGZLFttgeEj28VXHxpmwYbor/ATPYbBfSFZEIRK0ecCFLl2Qo55z52Hss+UV9CRN7trSeq1zbgx7YDWWg==",
"license": "MIT",
"peer": true,
"dependencies": {
"csstype": "^3.2.2"
}
@@ -3859,6 +3865,7 @@
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.2.3.tgz",
"integrity": "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==",
"license": "MIT",
"peer": true,
"peerDependencies": {
"@types/react": "^19.2.0"
}
@@ -3988,6 +3995,7 @@
"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.62.0.tgz",
"integrity": "sha512-TiZzBSJja/LbhNPvk6yc0JrX9XqhQ0hdh6M2svYfsHGejaKFIAGd9MQ+ERIMzLGlN/kZoYIgdxFV0PuljTKXag==",
"license": "MIT",
"peer": true,
"dependencies": {
"@eslint-community/regexpp": "^4.4.0",
"@typescript-eslint/scope-manager": "5.62.0",
@@ -4041,6 +4049,7 @@
"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.62.0.tgz",
"integrity": "sha512-VlJEV0fOQ7BExOsHYAGrgbEiZoi8D+Bl2+f6V2RrXerRSylnp+ZBHmPvaIa8cz0Ajx7WO7Z5RqfgYg7ED1nRhA==",
"license": "BSD-2-Clause",
"peer": true,
"dependencies": {
"@typescript-eslint/scope-manager": "5.62.0",
"@typescript-eslint/types": "5.62.0",
@@ -4410,6 +4419,7 @@
"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
"integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
"license": "MIT",
"peer": true,
"bin": {
"acorn": "bin/acorn"
},
@@ -4508,6 +4518,7 @@
"resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
"integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
"license": "MIT",
"peer": true,
"dependencies": {
"fast-deep-equal": "^3.1.1",
"fast-json-stable-stringify": "^2.0.0",
@@ -5447,6 +5458,7 @@
}
],
"license": "MIT",
"peer": true,
"dependencies": {
"baseline-browser-mapping": "^2.9.0",
"caniuse-lite": "^1.0.30001759",
@@ -7302,6 +7314,7 @@
"integrity": "sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==",
"deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
"license": "MIT",
"peer": true,
"dependencies": {
"@eslint-community/eslint-utils": "^4.2.0",
"@eslint-community/regexpp": "^4.6.1",
@@ -10066,6 +10079,7 @@
"resolved": "https://registry.npmjs.org/jest/-/jest-27.5.1.tgz",
"integrity": "sha512-Yn0mADZB89zTtjkPJEXwrac3LHudkQMR+Paqa8uxJHCBr9agxztUifWCyiYrjhMPBoUVBjyny0I7XH6ozDr7QQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"@jest/core": "^27.5.1",
"import-local": "^3.0.2",
@@ -10963,6 +10977,7 @@
"resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz",
"integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==",
"license": "MIT",
"peer": true,
"bin": {
"jiti": "bin/jiti.js"
}
@@ -11166,6 +11181,7 @@
"resolved": "https://registry.npmjs.org/keycloak-js/-/keycloak-js-26.2.2.tgz",
"integrity": "sha512-ug7pNZ1xNkd7PPkerOJCEU2VnUhS7CYStDOCFJgqCNQ64h53ppxaKrh4iXH0xM8hFu5b1W6e6lsyYWqBMvaQFg==",
"license": "Apache-2.0",
"peer": true,
"workspaces": [
"test"
]
@@ -12325,6 +12341,7 @@
}
],
"license": "MIT",
"peer": true,
"dependencies": {
"nanoid": "^3.3.11",
"picocolors": "^1.1.1",
@@ -13459,6 +13476,7 @@
"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz",
"integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==",
"license": "MIT",
"peer": true,
"dependencies": {
"cssesc": "^3.0.0",
"util-deprecate": "^1.0.2"
@@ -13837,6 +13855,7 @@
"resolved": "https://registry.npmjs.org/react/-/react-19.2.3.tgz",
"integrity": "sha512-Ku/hhYbVjOQnXDZFv2+RibmLFGwFdeeKHFcOTlrt7xplBnya5OGn/hIRDsqDiSUcfORsDC7MPxwork8jBwsIWA==",
"license": "MIT",
"peer": true,
"engines": {
"node": ">=0.10.0"
}
@@ -13999,6 +14018,7 @@
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.3.tgz",
"integrity": "sha512-yELu4WmLPw5Mr/lmeEpox5rw3RETacE++JgHqQzd2dg+YbJuat3jH4ingc+WPZhxaoFzdv9y33G+F7Nl5O0GBg==",
"license": "MIT",
"peer": true,
"dependencies": {
"scheduler": "^0.27.0"
},
@@ -14035,6 +14055,7 @@
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz",
"integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==",
"license": "MIT",
"peer": true,
"engines": {
"node": ">=0.10.0"
}
@@ -14497,6 +14518,7 @@
"resolved": "https://registry.npmjs.org/rollup/-/rollup-2.79.2.tgz",
"integrity": "sha512-fS6iqSPZDs3dr/y7Od6y5nha8dW1YnbgtsyotCVvoFGKbERG++CVRFv1meyGDE1SNItQA8BrnCw7ScdAhRJ3XQ==",
"license": "MIT",
"peer": true,
"bin": {
"rollup": "dist/bin/rollup"
},
@@ -14739,6 +14761,7 @@
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
"integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
"license": "MIT",
"peer": true,
"dependencies": {
"fast-deep-equal": "^3.1.3",
"fast-uri": "^3.0.1",
@@ -15985,23 +16008,6 @@
}
}
},
"node_modules/tailwindcss/node_modules/yaml": {
"version": "2.8.2",
"resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.2.tgz",
"integrity": "sha512-mplynKqc1C2hTVYxd0PU2xQAc22TI1vShAYGksCCfxbn/dFwnHTNi1bvYsBTkhdUNtGIf5xNOg938rrSSYvS9A==",
"license": "ISC",
"optional": true,
"peer": true,
"bin": {
"yaml": "bin.mjs"
},
"engines": {
"node": ">= 14.6"
},
"funding": {
"url": "https://github.com/sponsors/eemeli"
}
},
"node_modules/tapable": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/tapable/-/tapable-2.3.0.tgz",
@@ -16219,6 +16225,7 @@
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
"license": "MIT",
"peer": true,
"engines": {
"node": ">=12"
},
@@ -16387,6 +16394,7 @@
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
"integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
"license": "(MIT OR CC0-1.0)",
"peer": true,
"engines": {
"node": ">=10"
},
@@ -16495,6 +16503,7 @@
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz",
"integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
"license": "Apache-2.0",
"peer": true,
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@@ -16833,6 +16842,7 @@
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.104.1.tgz",
"integrity": "sha512-Qphch25abbMNtekmEGJmeRUhLDbe+QfiWTiqpKYkpCOWY64v9eyl+KRRLmqOFA2AvKPpc9DC6+u2n76tQLBoaA==",
"license": "MIT",
"peer": true,
"dependencies": {
"@types/eslint-scope": "^3.7.7",
"@types/estree": "^1.0.8",
@@ -16904,6 +16914,7 @@
"resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.15.2.tgz",
"integrity": "sha512-0XavAZbNJ5sDrCbkpWL8mia0o5WPOd2YGtxrEiZkBK9FjLppIUK2TgxK6qGD2P3hUXTJNNPVibrerKcx5WkR1g==",
"license": "MIT",
"peer": true,
"dependencies": {
"@types/bonjour": "^3.5.9",
"@types/connect-history-api-fallback": "^1.3.5",
@@ -17317,6 +17328,7 @@
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
"integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
"license": "MIT",
"peer": true,
"dependencies": {
"fast-deep-equal": "^3.1.3",
"fast-uri": "^3.0.1",

159
front_end/src/App.css
View File

@@ -1,40 +1,52 @@
/* Variables de thème */
[data-theme='dark'] {
--tint0: #000000;
--tint1: #0b0c0e;
--tint2: #16181d;
--tint3: #21252b;
--tint4: #2c313a;
--tint5: #373d48;
--text: #FFFFFF;
--tint0: #0a0e27;
--tint1: #1a1f3a;
--tint2: #232d4a;
--tint3: #2e3a59;
--tint4: #3d4a6f;
--tint5: #4a5a85;
--text: #f0f4f8;
--text2: #000000;
--disable: #02291d;
--green-primary: #10b981;
--green-secondary: #059669;
--green-dark: #047857;
--green-A-primary: #10b98120;
--green-A-secondary: #05966920;
--green-A-dark: #04785720;
--green-A-primary: #10b98130;
--green-A-secondary: #05966930;
--green-A-dark: #04785730;
--themeButtonColor: #00AAFF;
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
--shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5);
--blue-accent: #3b82f6;
--purple-accent: #a78bfa;
--cyan-accent: #06b6d4;
}
[data-theme='light'] {
--tint0: #ffffff;
--tint1: #f4f1f1;
--tint2: #e8e4e3;
--tint3: #ddd6d5;
--tint4: #d2c8c6;
--tint5: #c6bab8;
--text: #000000;
--tint0: #f8fafc;
--tint1: #f1f5f9;
--tint2: #e2e8f0;
--tint3: #cbd5e1;
--tint4: #b0bac4;
--tint5: #94a3b8;
--text: #0f172a;
--text2: #FFFFFF;
--disable: #02291d;
--green-primary: #00ce89;
--green-secondary: #00a571;
--green-dark: #00825d;
--green-A-primary: #00ce8920;
--green-A-secondary: #00a57120;
--green-A-dark: #00825d20;
--themeButtonColor : #FFAA00;
--green-primary: #10b981;
--green-secondary: #059669;
--green-dark: #047857;
--green-A-primary: #10b98125;
--green-A-secondary: #05966925;
--green-A-dark: #04785725;
--themeButtonColor: #f59e0b;
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
--shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.15);
--blue-accent: #3b82f6;
--purple-accent: #a855f7;
--cyan-accent: #06b6d4;
}
/* Reset et base */
@@ -46,14 +58,15 @@
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
background-color: var(--tint0);
background: linear-gradient(135deg, var(--tint0) 0%, var(--tint1) 100%);
color: var(--text);
transition: background-color 0.3s ease, color 0.3s ease;
transition: background 0.4s ease, color 0.4s ease;
font-weight: 400;
line-height: 1.6;
}
.padding {
@@ -73,8 +86,21 @@ code {
.App {
display: grid;
padding: 10px;
gap:10px;
padding: 20px;
gap: 24px;
max-width: 1400px;
margin: 0 auto;
}
.App h1 {
font-size: clamp(2rem, 5vw, 3.5rem);
font-weight: 700;
background: linear-gradient(135deg, var(--green-primary) 0%, var(--cyan-accent) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
margin-bottom: 8px;
letter-spacing: -0.5px;
}
/* Container principal */
@@ -88,11 +114,18 @@ code {
}
.composant-container {
background-color: var(--tint2);
border-radius: 30px;
padding: 10px;
border: 2px solid var(--tint4);
box-shadow: 0 4px 6px rgba(16, 185, 129, 0.1);
background: linear-gradient(135deg, var(--tint2) 0%, var(--tint3) 100%);
border-radius: 24px;
padding: 24px;
border: 1px solid var(--tint4);
box-shadow: var(--shadow-lg);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.composant-container:hover {
border-color: var(--green-primary);
box-shadow: 0 12px 40px var(--green-A-primary);
transform: translateY(-2px);
}
/* Header / Navigation */
@@ -134,18 +167,18 @@ code {
/* Cards et containers */
.card {
background-color: var(--tint1);
background: linear-gradient(135deg, var(--tint1) 0%, var(--tint2) 100%);
border-radius: 20px;
padding: 20px;
border: 2px solid var(--green-A-secondary);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
transition: all 0.3s ease;
padding: 24px;
border: 1px solid var(--tint4);
box-shadow: var(--shadow-md);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.card:hover {
border-color: var(--green-primary);
box-shadow: 0 6px 16px var(--green-A-primary);
transform: translateY(-2px);
box-shadow: 0 8px 24px var(--green-A-primary);
transform: translateY(-4px);
}
.card-header {
@@ -171,20 +204,21 @@ input[type="time"],
input[type="search"],
input[type="datetime-local"],
textarea {
background-color: var(--tint3);
background-color: var(--tint2);
color: var(--text);
border: 2px solid var(--tint5);
border-radius: 8px;
padding: 10px 14px;
transition: all 0.3s ease;
border: 1px solid var(--tint4);
border-radius: 12px;
padding: 12px 14px;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
font-size: 15px;
font-family: inherit;
}
input:focus,
textarea:focus {
outline: none;
border-color: var(--green-primary);
background-color: var(--tint3);
background-color: var(--tint1);
box-shadow: 0 0 0 3px var(--green-A-primary);
}
@@ -227,23 +261,29 @@ select option {
/* Buttons */
button {
color: var(--text);
background-color: var(--tint3);
border: 2px solid var(--tint5);
border-radius: 8px;
padding: 5px 10px;
background: linear-gradient(135deg, var(--tint3) 0%, var(--tint4) 100%);
border: 1px solid var(--tint4);
border-radius: 12px;
padding: 10px 16px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
font-weight: 600;
font-size: 14px;
display: inline-block;
width: auto;
box-shadow: var(--shadow-sm);
}
button:hover {
background-color: var(--tint4);
background: linear-gradient(135deg, var(--green-primary) 0%, var(--green-secondary) 100%);
border-color: var(--green-primary);
color: white;
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
box-shadow: 0 6px 20px var(--green-A-primary);
}
button:active {
transform: translateY(0);
}
button:active {
@@ -430,7 +470,8 @@ td {
/* Lists */
ul, ol {
ul,
ol {
color: var(--text);
padding-left: 20px;
}
@@ -547,6 +588,7 @@ input[type="radio"] {
from {
opacity: 0;
}
to {
opacity: 1;
}
@@ -557,6 +599,7 @@ input[type="radio"] {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);

14
front_end/src/components/style/createSession.css
View File

@@ -1,5 +1,13 @@
.createActivite {
background: var(--tint1);
padding: 15px;
border-radius: 15px;
background: linear-gradient(135deg, var(--tint2) 0%, var(--tint3) 100%);
padding: 20px;
border-radius: 16px;
border: 1px solid var(--tint4);
box-shadow: var(--shadow-md);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.createActivite:hover {
border-color: var(--green-primary);
box-shadow: 0 8px 24px var(--green-A-primary);
}

62
front_end/src/components/style/edt.css
View File

@@ -1,17 +1,24 @@
.edt {
background-color: var(--tint2);
border-radius: 30px;
padding: 10px;
border: 2px solid var(--tint4);
box-shadow: 0 4px 6px rgba(16, 185, 129, 0.1);
background: linear-gradient(135deg, var(--tint2) 0%, var(--tint3) 100%);
border-radius: 24px;
padding: 20px;
border: 1px solid var(--tint4);
box-shadow: var(--shadow-lg);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.edt:hover {
border-color: var(--green-primary);
box-shadow: 0 12px 40px var(--green-A-primary);
}
.edt_header {
justify-content: center;
display: grid;
grid-template-columns: repeat(3, 0.5fr);
padding-bottom: 10px;
gap: 5%;
padding-bottom: 16px;
gap: 12px;
margin-bottom: 12px;
}
.edt_colonnes {
@@ -32,28 +39,35 @@
}
.edt_colonne {
background-color: var(--tint3);
border-radius: 20px;
transition: all 0.3s ease;
background: linear-gradient(135deg, var(--tint3) 0%, var(--tint4) 100%);
border-radius: 16px;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
height: 100%;
border: 1px solid var(--tint4);
padding: 12px;
}
.edt_day_header {
font-size: clamp(5px, 1vw, 18px);
padding: 8px;
border-radius: 20px;
padding: 12px;
border-radius: 12px;
height: fit-content;
text-align: center;
font-size: 1em;
background: linear-gradient(135deg, var(--green-A-primary), var(--green-A-dark));
font-weight: 600;
background: linear-gradient(135deg, var(--green-primary) 0%, var(--green-secondary) 100%);
font-weight: 700;
font-size: large;
color: white;
box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.today {
background: linear-gradient(135deg, var(--green-primary), var(--green-dark));
background: linear-gradient(135deg, var(--green-primary) 0%, var(--cyan-accent) 100%);
color: #FFFFFF;
box-shadow: 0 6px 20px var(--green-A-primary);
transform: scale(1.02);
}
.edt_day_content {
@@ -68,24 +82,24 @@
.edt_session {
font-size: clamp(1px, 8cqi, 18px);
gap: 8px;
background-color: var(--tint4);
background: linear-gradient(135deg, var(--tint4) 0%, var(--tint5) 100%);
border-radius: 12px;
padding: 5%;
padding: 12px;
min-width: 0;
border-left: 3px solid var(--green-primary); /* Accent vert à gauche */
transition: all 0.3s ease;
border-left: 4px solid var(--green-primary);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
cursor: pointer;
box-shadow: var(--shadow-sm);
}
.edt_session:hover {
background-color: var(--tint2);
border-left-width: 5px;
transform: translateX(3px);
box-shadow: -2px 2px 8px var(--green-A-primary);
background: linear-gradient(135deg, var(--green-A-primary), var(--green-A-secondary));
border-left-width: 6px;
transform: translateX(4px);
box-shadow: 0 8px 16px var(--green-A-primary);
}
.edt_session:active {
background-color: var(--tint5);
transform: translateX(1px);
}

70
front_end/src/components/style/objectList.css
View File

@@ -1,65 +1,85 @@
.list_object{
display: grid;
gap:10px;
background-color: var(--tint1);
padding: 10px;
border-radius: 20px;
gap: 12px;
background: linear-gradient(135deg, var(--tint2) 0%, var(--tint3) 100%);
padding: 16px;
border-radius: 16px;
border: 1px solid var(--tint4);
box-shadow: var(--shadow-md);
}
.list_object_modal{
display: grid;
gap:10px;
background-color: var(--tint1);
padding: 10px;
border-radius: 20px;
max-height: 200px;
gap: 12px;
background: linear-gradient(135deg, var(--tint2) 0%, var(--tint3) 100%);
padding: 16px;
border-radius: 16px;
max-height: 280px;
overflow-y: auto;
border: 1px solid var(--tint4);
}
.object {
font-size: clamp(1px, 8cqi, 18px);
gap: 8px;
background-color: var(--tint3);
background: linear-gradient(135deg, var(--tint3) 0%, var(--tint4) 100%);
border-radius: 12px;
padding: 10px;
padding: 12px;
min-width: 0;
border: 2px solid;
border-color: var(--tint3);
border: 1px solid var(--tint4);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: var(--shadow-sm);
}
.object:hover {
background-color: var(--tint2);
background: linear-gradient(135deg, var(--green-A-primary), var(--green-A-secondary));
border-color: var(--green-primary);
transform: translateY(-2px);
box-shadow: 0 8px 16px var(--green-A-primary);
}
.object:active {
background-color: var(--tint4);
background: linear-gradient(135deg, var(--tint4) 0%, var(--tint5) 100%);
transform: translateY(0);
}
.object_header{
display: flex;
gap: 5px;
gap: 8px;
align-items: center;
font-weight: 600;
}
.object_small{
font-size: 0.75em;
opacity: 0.8;
}
.object_modal{
background-color: var(--tint2);
padding: 10px;
border-radius: 20px;
background: linear-gradient(135deg, var(--tint2) 0%, var(--tint3) 100%);
padding: 14px;
border-radius: 12px;
position: relative;
border: 1px solid var(--tint4);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.object_modal:hover {
border-color: var(--green-primary);
box-shadow: 0 4px 12px var(--green-A-primary);
}
.session_modal_activite_list{
display: grid;
padding: 10px;
background-color: var(--tint3);
border-radius: 10px;
gap: 5px;
padding: 12px;
background: linear-gradient(135deg, var(--tint3) 0%, var(--tint4) 100%);
border-radius: 12px;
gap: 8px;
border: 1px solid var(--tint4);
}
.activiteList{
display: flex;
gap: 10px;
gap: 12px;
flex-wrap: wrap;
}

73
front_end/src/components/style/topBar.css
View File

@@ -2,17 +2,36 @@
display: flex;
justify-content: space-between;
align-items: center;
padding:15px;
background: var(--tint2);
border-radius: 30px;
height: 60px;
border: 3px solid var(--tint5);
padding: 16px 24px;
background: linear-gradient(135deg, var(--tint2) 0%, var(--tint3) 100%);
border-radius: 20px;
height: auto;
min-height: 70px;
border: 1px solid var(--tint4);
box-shadow: var(--shadow-md);
backdrop-filter: blur(10px);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.topBar:hover {
border-color: var(--green-primary);
box-shadow: 0 8px 32px var(--green-A-primary);
}
.toBarLeft {
display: flex;
gap: 10px;
gap: 16px;
align-items: center;
font-weight: 600;
}
.toBarLeft h2 {
background: linear-gradient(135deg, var(--green-primary) 0%, var(--cyan-accent) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
margin: 0;
font-size: 1.5rem;
}
@@ -30,16 +49,19 @@
.login {
position: absolute;
right: 0;
top: 1;
top: calc(100% + 8px);
display: grid;
gap:15px;
gap: 12px;
width: fit-content;
white-space: nowrap;
align-items: left;
background: var(--tint2) ;
padding: 10px;
border-radius: 15px;
border: 3px solid var(--tint5);
background: linear-gradient(135deg, var(--tint2) 0%, var(--tint3) 100%);
padding: 16px;
border-radius: 16px;
border: 1px solid var(--tint4);
box-shadow: var(--shadow-lg);
z-index: 1000;
backdrop-filter: blur(10px);
}
.loginButton {
@@ -50,20 +72,33 @@
.ButtonTheme {
height: 40px;
width: 40px;
height: 44px;
width: 44px;
color: var(--text);
background-color: var(--tint3);
border-radius: 15px;
font-size: 16px;
border-color: var(--tint5);
background: linear-gradient(135deg, var(--tint3) 0%, var(--tint4) 100%);
border: 1px solid var(--tint4);
border-radius: 12px;
font-size: 18px;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.ButtonTheme:hover {
border-color: var(--themeButtonColor);
color: var(--themeButtonColor);
box-shadow: 0 4px 12px rgba(0, 170, 255, 0.3);
transform: scale(1.05) rotateZ(-180deg);
}
.logo {
height: 30px;
height: 40px;
filter: drop-shadow(0 2px 8px rgba(16, 185, 129, 0.3));
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.logo:hover {
transform: scale(1.1) rotateY(10deg);
}