From ccdc301e382ea214c48dd94bdcc05415aeb5602c Mon Sep 17 00:00:00 2001 From: YaelVays Date: Wed, 27 May 2026 11:34:13 +0300 Subject: [PATCH] add: YWeiss to kiteria-3 --- src/students/YWeiss/Card.tsx | 25 +++ src/students/YWeiss/JokePage.tsx | 65 ++++++++ src/students/YWeiss/styles.module.css | 220 ++++++++++++++++++++++++++ src/students/index.ts | 10 ++ 4 files changed, 320 insertions(+) create mode 100644 src/students/YWeiss/Card.tsx create mode 100644 src/students/YWeiss/JokePage.tsx create mode 100644 src/students/YWeiss/styles.module.css diff --git a/src/students/YWeiss/Card.tsx b/src/students/YWeiss/Card.tsx new file mode 100644 index 0000000..ac7a0fc --- /dev/null +++ b/src/students/YWeiss/Card.tsx @@ -0,0 +1,25 @@ +import styles from "./styles.module.css"; +import { CardProps } from "../../types"; + +export default function YWeissCard({ student, onClick }: CardProps) { + return ( +
+ +
+
+ + + +
+ system_error.log +
+ +
+
💻
+

{student.jokeTitle}

+

{student.name}

+
RUN CODE ▶
+
+
+ ); +} \ No newline at end of file diff --git a/src/students/YWeiss/JokePage.tsx b/src/students/YWeiss/JokePage.tsx new file mode 100644 index 0000000..52f6f9c --- /dev/null +++ b/src/students/YWeiss/JokePage.tsx @@ -0,0 +1,65 @@ +import styles from "./styles.module.css"; +import { PageProps } from "../../types"; + +export default function YWeissJokePage({ onBack }: PageProps) { + return ( +
+
+ +
+
+

⚡ ארבעת שלבי האבל והקוד ⚡

+
+

+ כל מתכנת עובר את מסלול הייסורים הבא בכל פעם שהוא כותב קוד חדש: +

+
+ +
+ +
+
01
+
🚀
+
+

שלב האופטימיות המוגזמת

+

"הקוד שלי מושלם, הוא רץ חלק, אין סיכוי שיש פה באגים".

+
+
+ +
+
02
+
🤯
+
+

שלב ההכחשה

+

"רגע, למה זה קרס? אצלי במחשב המקומי (Localhost) זה עבד מצוין, הבעיה בטוח בשרת".

+
+
+ +
+
03
+
😭
+
+

שלב הייאוש

+

"מחקתי הכל, כתבתי מחדש, וזה עדיין לא עובד. אני לא מבין כלום, אני מחליף מקצוע".

+
+
+ +
+
04
+
🫣
+
+

שלב הפחד הבלתי מוסבר

+

"הקוד פתאום עובד! הכל רץ חלק... ואני אין לי מושג ירוק למה זה עובד עכשיו. עדיף לא לגעת במקלדת יותר".

+
+
+ +
+ + + +
+
+ ); +} \ No newline at end of file diff --git a/src/students/YWeiss/styles.module.css b/src/students/YWeiss/styles.module.css new file mode 100644 index 0000000..ed700a1 --- /dev/null +++ b/src/students/YWeiss/styles.module.css @@ -0,0 +1,220 @@ +/* ── קו עיצובי כללי - ניאון וסייבר ── */ +@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap'); + +.card, .jokePage { + font-family: 'Fira Code', 'Segoe UI', monospace; + direction: rtl; +} + +.card { + background: #1e1e2e; + border: 2px solid #bd93f9; + border-radius: 12px; + overflow: hidden; + box-shadow: 0 8px 25px rgba(189, 147, 249, 0.15); + transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); + cursor: pointer; + padding: 0 !important; +} + +.card:hover { + transform: translateY(-8px) scale(1.02); + box-shadow: 0 15px 30px rgba(189, 147, 249, 0.3); + border-color: #ff79c6; +} + +.windowHeader { + background: #181825; + padding: 0.6rem 1rem; + display: flex; + align-items: center; + justify-content: space-between; + border-bottom: 1px solid #313244; +} + +.dots { + display: flex; + gap: 6px; +} + +.dots span { + width: 10px; + height: 10px; + border-radius: 50%; + display: inline-block; +} + +.dotRed { background: #ff5555; } +.dotYellow { background: #ffb86c; } +.dotGreen { background: #50fa7b; } + +.windowTitle { + color: #6272a4; + font-size: 0.75rem; + font-weight: bold; +} + +.cardBody { + padding: 1.5rem; + text-align: center; + display: flex; + flex-direction: column; + align-items: center; +} + +.codeIcon { + font-size: 2.5rem; + margin-bottom: 0.5rem; + animation: float 3s ease-in-out infinite; +} + +.title { + color: #f8f8f2; + font-size: 1.25rem; + font-weight: 700; + margin-bottom: 0.6rem; + line-height: 1.4; +} + +.name { + color: #8be9fd; + font-size: 0.9rem; + margin-bottom: 1.2rem; +} + +.actionBadge { + background: #50fa7b; + color: #282a36; + font-weight: bold; + font-size: 0.8rem; + padding: 0.4rem 1.2rem; + border-radius: 6px; + box-shadow: 0 4px 10px rgba(80, 250, 123, 0.3); +} + +.jokePage { + background: #181825; + height: 100vh; + display: flex; + justify-content: center; + align-items: center; + padding: 1rem; + overflow: hidden; +} + +.mainContainer { + max-width: 800px; + width: 100%; + display: flex; + flex-direction: column; + align-items: center; + gap: 0.8rem; +} + +.pageHeader { + text-align: center; +} + +.pageTitle { + color: #ff79c6; + font-size: 1.6rem; + font-weight: 800; + margin-bottom: 0.2rem; + text-shadow: 0 0 15px rgba(255, 121, 198, 0.4); +} + +.intro { + color: #f8f8f2; + font-size: 0.95rem; + opacity: 0.9; + margin-bottom: 0.5rem; +} + +.stepsGrid { + display: grid; + grid-template-columns: 1fr; + gap: 0.8rem; + width: 100%; +} + +.stepCard { + background: #1e1e2e; + border-radius: 8px; + padding: 0.8rem 1.2rem; + display: flex; + gap: 1.2rem; + align-items: center; + position: relative; + border: 1px solid #313244; + box-shadow: 0 4px 10px rgba(0,0,0,0.2); + transition: transform 0.2s; +} + +.stepCard:hover { + transform: scale(1.01); +} + +.stepNum { + position: absolute; + top: 0.4rem; + left: 1rem; + font-size: 1.8rem; + font-weight: 800; + opacity: 0.04; + color: #fff; +} + +.stepIcon { + font-size: 1.6rem; +} + +.stepContent h3 { + font-size: 0.95rem; + font-weight: 700; + margin-bottom: 0.1rem; +} + +.stepContent p { + font-size: 0.85rem; + line-height: 1.4; + color: #a6adc8; +} + +.step1 { border-right: 4px solid #50fa7b; } +.step1 h3 { color: #50fa7b; } + +.step2 { border-right: 4px solid #ffb86c; } +.step2 h3 { color: #ffb86c; } + +.step3 { border-right: 4px solid #ff5555; } +.step3 h3 { color: #ff5555; } + +.step4 { border-right: 4px solid #8be9fd; } +.step4 h3 { color: #8be9fd; } + +.backBtn { + background: linear-gradient(90deg, #bd93f9 0%, #ff79c6 100%); + color: #fff; + border: none; + border-radius: 6px; + padding: 0.6rem 2rem; + font-size: 0.85rem; + font-weight: bold; + cursor: pointer; + box-shadow: 0 5px 15px rgba(189, 147, 249, 0.3); + transition: all 0.2s; + font-family: inherit; + margin-top: 0.5rem; +} + +.backBtn:hover { + transform: translateY(-2px); + box-shadow: 0 8px 25px rgba(255, 121, 198, 0.6); + filter: brightness(1.1); +} + +@keyframes float { + 0% { transform: translateY(0px); } + 50% { transform: translateY(-6px); } + 100% { transform: translateY(0px); } +} \ No newline at end of file diff --git a/src/students/index.ts b/src/students/index.ts index 4ddb9fa..7c83394 100644 --- a/src/students/index.ts +++ b/src/students/index.ts @@ -10,6 +10,9 @@ import RachelPanetJokePage from "./RachelPanet/JokePage"; import EsterLewinJokePage from "./ester-lewin/JokerPage"; import EsterLewinCard from "./ester-lewin/Card"; +import YWeissCard from "./YWeiss/Card"; +import YWeissJokePage from "./YWeiss/JokePage"; + // ⚠️ סדר הרשימה חייב להיות לפי סדר האלף-בית העברי לפי שם המשפחה. // כל תלמידה מוסיפה את עצמה במקום הנכון ידנית. @@ -22,6 +25,13 @@ const students: Student[] = [ CardComponent: DanaDuviCard, JokePageComponent: DanaDuviJokePage, }, + { + id: "YWeiss", + name: "יעל וייס", + jokeTitle: "ארבעת השלבים של פיתוח חדש", + CardComponent: YWeissCard, + JokePageComponent: YWeissJokePage, + }, { id: "chani-chanzin", name: "חני חנזין",