angielskizkaroliną » christmas-2

<!doctype html><html lang="pl"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Alfabet i Wymowa - Angielski</title> <script src="/_sdk/element_sdk.js"></script> <style> body { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); min-height: 100%; height: 100%; width: 100%; }

html { height: 100%; width: 100%; }

.main-wrapper { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; padding: 30px 20px; overflow-y: auto; }

.header { text-align: center; margin-bottom: 30px; }

.main-title { font-size: 48px; color: #ffffff; margin: 0 0 10px 0; font-weight: 700; text-shadow: 2px 2px 4px rgba(0,0,0,0.2); }

.subtitle { font-size: 22px; color: #f0e6ff; margin: 0; }

.content-container { background: white; border-radius: 25px; padding: 40px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); max-width: 1100px; width: 100%; }

.menu-buttons { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; margin-bottom: 40px; }

.menu-btn { padding: 25px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; border: none; border-radius: 15px; font-size: 20px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3); }

.menu-btn:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(102, 126, 234, 0.4); }

.menu-btn.active { background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); }

.section { display: none; }

.section.active { display: block; }

.greeting-card { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 40px; border-radius: 20px; margin: 20px 0; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); transition: all 0.3s ease; }

.greeting-card:hover { transform: translateY(-5px); box-shadow: 0 12px 35px rgba(0, 0, 0, 0.2); }

.greeting-english { font-size: 42px; font-weight: 700; margin-bottom: 15px; }

.greeting-pronunciation { font-size: 28px; font-style: italic; opacity: 0.9; margin-bottom: 15px; }

.greeting-polish { font-size: 24px; opacity: 0.85; margin-bottom: 20px; }

.greeting-usage { font-size: 18px; background: rgba(255, 255, 255, 0.2); padding: 15px; border-radius: 10px; line-height: 1.6; }

.instruction-box { background: #fff5e6; border-left: 5px solid #f6ad55; padding: 25px; border-radius: 10px; margin: 20px 0; }

.instruction-text { font-size: 20px; color: #744210; margin: 0; line-height: 1.6; }

.dialog-card { background: white; border: 3px solid #e2e8f0; border-radius: 20px; padding: 35px; margin: 25px 0; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); }

.dialog-title { font-size: 28px; color: #667eea; font-weight: 700; margin-bottom: 25px; text-align: center; }

.dialog-line { margin: 20px 0; padding: 20px; border-radius: 12px; font-size: 18px; line-height: 1.6; }

.dialog-person-a { background: #e6f3ff; border-left: 5px solid #667eea; }

.dialog-person-b { background: #fff0f5; border-left: 5px solid #f093fb; }

.dialog-speaker { font-weight: 700; color: #2d3748; margin-bottom: 8px; font-size: 20px; }

.dialog-english { color: #2d3748; font-weight: 600; margin-bottom: 5px; }

.dialog-polish { color: #718096; font-style: italic; }

.quiz-container { margin: 30px 0; }

.quiz-question { font-size: 28px; color: #2d3748; margin-bottom: 30px; font-weight: 600; text-align: center; background: #f7fafc; padding: 30px; border-radius: 15px; }

.quiz-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin: 30px 0; }

.quiz-option { padding: 30px; background: #f7fafc; border: 3px solid #e2e8f0; border-radius: 15px; cursor: pointer; transition: all 0.3s ease; font-size: 22px; font-weight: 600; text-align: center; }

.quiz-option:hover { border-color: #667eea; background: #f0e6ff; transform: scale(1.05); }

.quiz-option.correct { background: #c6f6d5; border-color: #48bb78; }

.quiz-option.incorrect { background: #fed7d7; border-color: #e53e3e; }

.feedback-message { text-align: center; padding: 20px; border-radius: 12px; font-size: 22px; font-weight: 600; margin: 20px 0; }

.feedback-correct { background: #c6f6d5; color: #22543d; }

.feedback-incorrect { background: #fed7d7; color: #742a2a; }

.btn-large { padding: 20px 40px; background: #667eea; color: white; border: none; border-radius: 12px; font-size: 22px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; margin: 10px; }

.btn-large:hover { background: #5568d3; transform: translateY(-3px); }

.btn-secondary { background: #e2e8f0; color: #2d3748; }

.btn-secondary:hover { background: #cbd5e0; }

.progress-info { text-align: center; font-size: 24px; color: #4a5568; margin: 20px 0; font-weight: 600; }

.vocabulary-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 25px; margin: 30px 0; }

.vocab-card { background: white; border: 3px solid #e2e8f0; border-radius: 20px; padding: 30px; text-align: center; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); cursor: pointer; }

.vocab-card:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); border-color: #667eea; }

.vocab-emoji { font-size: 64px; margin-bottom: 20px; }

.vocab-english { font-size: 32px; font-weight: 700; color: #667eea; margin-bottom: 10px; }

.vocab-pronunciation { font-size: 22px; color: #718096; font-style: italic; margin-bottom: 10px; }

.vocab-polish { font-size: 20px; color: #4a5568; }

.recording-controls { margin-top: 15px; display: flex; justify-content: center; }

.play-native-btn { padding: 12px 20px; background: #48bb78; color: white; border: none; border-radius: 10px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; margin-left: 10px; }

.play-native-btn:hover { background: #38a169; transform: scale(1.05); }

.exercise-card { background: white; border: 3px solid #e2e8f0; border-radius: 20px; padding: 40px; margin: 30px 0; }

.exercise-title { font-size: 28px; color: #2d3748; font-weight: 700; margin-bottom: 25px; text-align: center; }

.exercise-scenario { background: #f7fafc; padding: 25px; border-radius: 12px; margin-bottom: 25px; font-size: 20px; color: #4a5568; line-height: 1.8; }

.date-example-box { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 30px; border-radius: 15px; margin: 20px 0; text-align: center; }

.date-number { font-size: 72px; font-weight: 700; margin-bottom: 15px; }

.date-text { font-size: 32px; font-weight: 600; margin-bottom: 10px; }

.date-pronunciation { font-size: 24px; font-style: italic; opacity: 0.9; }

@media (max-width: 768px) { .main-title { font-size: 36px; }

.subtitle { font-size: 18px; }

.content-container { padding: 25px; }

.menu-buttons { grid-template-columns: 1fr; }

.greeting-english { font-size: 32px; }

.vocabulary-grid { grid-template-columns: 1fr; } } </style> <style>@view-transition { navigation: auto; }</style> <script src="/_sdk/data_sdk.js" type="text/javascript"></script> <script src="https://cdn.tailwindcss.com" type="text/javascript"></script> </head> <body> <main class="main-wrapper"> <header class="header"> <h1 class="main-title" id="mainTitle">🔤 Alfabet i Wymowa</h1> <p class="subtitle" id="mainSubtitle">Learn the English Alphabet - Naucz się angielskiego alfabetu!</p> </header> <div class="content-container"> <nav class="menu-buttons"><button class="menu-btn active" data-section="presentation">📊 Prezentacja</button> <button class="menu-btn" data-section="dialogs">💬 Dialogi</button> <button class="menu-btn" data-section="vocabulary">📚 Słówka</button> <button class="menu-btn" data-section="exercises">✍️ Ćwiczenia</button> <button class="menu-btn" data-section="quiz">🎯 Quiz</button> </nav> <section class="section active" id="presentation"> <h2 style="font-size: 32px; color: #2d3748; margin-bottom: 20px;">Prezentacja - Alfabet i Wymowa</h2> <div class="instruction-box"> <p class="instruction-text">💡 Poznaj angielski alfabet i naucz się prawidłowej wymowy! 🔊 Kliknij "Posłuchaj" aby usłyszeć każdą literę!</p> </div> <div class="greeting-card"> <div class="greeting-english"> 🔤 Angielski Alfabet </div> <div class="greeting-pronunciation"> The English Alphabet </div> <div class="greeting-usage"> Angielski alfabet składa się z <strong>26 liter</strong>. Każda litera ma swoją unikalną wymowę, którą musisz poznać!<br><br><strong>Samogłoski (Vowels):</strong> A, E, I, O, U<br><strong>Spółgłoski (Consonants):</strong> Pozostałe 21 liter </div> </div> <h3 style="font-size: 28px; color: #2d3748; margin: 30px 0 20px 0;">🎯 Alfabet z Wymową - Posłuchaj!</h3> <div class="vocabulary-grid"> <div class="vocab-card" data-word="letter-a"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> A a </div> <div class="vocab-pronunciation"> [ej] </div> <div class="vocab-polish"> jak w "hej" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('a')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-b"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> B b </div> <div class="vocab-pronunciation"> [bi:] </div> <div class="vocab-polish"> jak "bi" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('b')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-c"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> C c </div> <div class="vocab-pronunciation"> [si:] </div> <div class="vocab-polish"> jak "si" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('c')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-d"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> D d </div> <div class="vocab-pronunciation"> [di:] </div> <div class="vocab-polish"> jak "di" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('d')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-e"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> E e </div> <div class="vocab-pronunciation"> [i:] </div> <div class="vocab-polish"> jak "i" długie </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('e')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-f"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> F f </div> <div class="vocab-pronunciation"> [ef] </div> <div class="vocab-polish"> jak "ef" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('f')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-g"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> G g </div> <div class="vocab-pronunciation"> [dżi:] </div> <div class="vocab-polish"> jak "dżi" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('g')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-h"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> H h </div> <div class="vocab-pronunciation"> [ejcz] </div> <div class="vocab-polish"> jak "ejcz" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('h')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-i"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> I i </div> <div class="vocab-pronunciation"> [aj] </div> <div class="vocab-polish"> jak "aj" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('i')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-j"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> J j </div> <div class="vocab-pronunciation"> [dżej] </div> <div class="vocab-polish"> jak "dżej" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('j')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-k"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> K k </div> <div class="vocab-pronunciation"> [kej] </div> <div class="vocab-polish"> jak "kej" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('k')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-l"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> L l </div> <div class="vocab-pronunciation"> [el] </div> <div class="vocab-polish"> jak "el" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('l')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-m"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> M m </div> <div class="vocab-pronunciation"> [em] </div> <div class="vocab-polish"> jak "em" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('m')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-n"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> N n </div> <div class="vocab-pronunciation"> [en] </div> <div class="vocab-polish"> jak "en" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('n')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-o"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> O o </div> <div class="vocab-pronunciation"> [ou] </div> <div class="vocab-polish"> jak "ou" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('o')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-p"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> P p </div> <div class="vocab-pronunciation"> [pi:] </div> <div class="vocab-polish"> jak "pi" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('p')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-q"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> Q q </div> <div class="vocab-pronunciation"> [kju:] </div> <div class="vocab-polish"> jak "kju" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('q')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-r"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> R r </div> <div class="vocab-pronunciation"> [ar] </div> <div class="vocab-polish"> jak "ar" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('r')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-s"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> S s </div> <div class="vocab-pronunciation"> [es] </div> <div class="vocab-polish"> jak "es" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('s')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-t"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> T t </div> <div class="vocab-pronunciation"> [ti:] </div> <div class="vocab-polish"> jak "ti" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('t')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-u"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> U u </div> <div class="vocab-pronunciation"> [ju:] </div> <div class="vocab-polish"> jak "ju" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('u')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-v"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> V v </div> <div class="vocab-pronunciation"> [vi:] </div> <div class="vocab-polish"> jak "vi" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('v')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-w"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> W w </div> <div class="vocab-pronunciation"> [dablju:] </div> <div class="vocab-polish"> jak "dablju" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('w')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-x"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> X x </div> <div class="vocab-pronunciation"> [eks] </div> <div class="vocab-polish"> jak "eks" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('x')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-y"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> Y y </div> <div class="vocab-pronunciation"> [łaj] </div> <div class="vocab-polish"> jak "łaj" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('y')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="letter-z"> <div class="vocab-emoji"> 🔤 </div> <div class="vocab-english"> Z z </div> <div class="vocab-pronunciation"> [zi:] (US) / [zed] (UK) </div> <div class="vocab-polish"> jak "zi" lub "zed" </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('z')">🔊 Posłuchaj</button> </div> </div> </div> <div class="greeting-card"> <div class="greeting-english"> 📅 Dni Tygodnia </div> <div class="greeting-pronunciation"> Days of the week </div> <div class="greeting-usage"><strong>Monday</strong> [mandej] - Poniedziałek<br><strong>Tuesday</strong> [tjuzdej] - Wtorek<br><strong>Wednesday</strong> [łenzdej] - Środa<br><strong>Thursday</strong> [terzdej] - Czwartek<br><strong>Friday</strong> [frajdej] - Piątek<br><strong>Saturday</strong> [saterdej] - Sobota<br><strong>Sunday</strong> [sandej] - Niedziela </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);"> <div class="greeting-english"> 🗓️ Miesiące </div> <div class="greeting-pronunciation"> Months of the year </div> <div class="greeting-usage"><strong>January</strong> [dżenjueri] - Styczeń<br><strong>February</strong> [februeri] - Luty<br><strong>March</strong> [marcz] - Marzec<br><strong>April</strong> [ejpril] - Kwiecień<br><strong>May</strong> [mej] - Maj<br><strong>June</strong> [dżun] - Czerwiec<br><strong>July</strong> [dżulaj] - Lipiec<br><strong>August</strong> [ogast] - Sierpień<br><strong>September</strong> [september] - Wrzesień<br><strong>October</strong> [oktober] - Październik<br><strong>November</strong> [nowember] - Listopad<br><strong>December</strong> [disember] - Grudzień </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);"> <div class="greeting-english"> 📅 Podstawowe Zwroty </div> <div class="greeting-pronunciation"> Basic phrases </div> <div class="greeting-usage"><strong>Today</strong> [tudej] - Dziś, dzisiaj<br><strong>Tomorrow</strong> [tumoro] - Jutro<br><strong>Yesterday</strong> [jesterdej] - Wczoraj<br><strong>The day after tomorrow</strong> - Pojutrze<br><strong>The day before yesterday</strong> - Przedwczoraj<br><strong>This week</strong> - W tym tygodniu<br><strong>Next week</strong> - W przyszłym tygodniu<br><strong>Last week</strong> - W zeszłym tygodniu </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%);"> <div class="greeting-english"> 🔢 Daty - Liczby Porządkowe </div> <div class="greeting-pronunciation"> Ordinal numbers for dates </div> <div class="greeting-usage"><strong>1st</strong> - first [ferst] - pierwszy<br><strong>2nd</strong> - second [sekond] - drugi<br><strong>3rd</strong> - third [terd] - trzeci<br><strong>4th</strong> - fourth [fors] - czwarty<br><strong>5th</strong> - fifth [fifs] - piąty<br><strong>10th</strong> - tenth [tens] - dziesiąty<br><strong>20th</strong> - twentieth [tłentjes] - dwudziesty<br><strong>21st</strong> - twenty-first - dwudziesty pierwszy<br><strong>30th</strong> - thirtieth [tertjes] - trzydziesty<br><strong>31st</strong> - thirty-first - trzydziesty pierwszy </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);"> <div class="greeting-english"> 📝 Jak Pisać Daty? </div> <div class="greeting-pronunciation"> How to write dates </div> <div class="greeting-usage"><strong>🇺🇸 Amerykański sposób:</strong><br> Month / Day / Year<br> 12/25/2024 = December 25th, 2024<br><br><strong>🇬🇧 Brytyjski sposób:</strong><br> Day / Month / Year<br> 25/12/2024 = 25th December 2024<br><br><strong>Przykłady:</strong><br> • January 1st, 2024 (US)<br> • 1st January 2024 (UK) </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);"> <div class="greeting-english"> 🗣️ Jak Mówić Daty? </div> <div class="greeting-pronunciation"> How to say dates </div> <div class="greeting-usage"><strong>Pytanie:</strong> What's the date today?<br><strong>Odpowiedź:</strong> It's the 15th of March.<br><br><strong>Przykłady:</strong><br> • March 5th → "March the fifth" lub "the fifth of March"<br> • July 21st → "July the twenty-first"<br> • December 31st → "December the thirty-first"<br><br><strong>Uwaga:</strong> Mówimy "the" przed liczbą porządkową! </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #30cfd0 0%, #330867 100%);"> <div class="greeting-english"> 📆 Pytania o Dzień </div> <div class="greeting-pronunciation"> Asking about days </div> <div class="greeting-usage"><strong>What day is it today?</strong><br> [łot dej iz it tudej?]<br> Jaki jest dziś dzień?<br><br><strong>Odpowiedź:</strong><br> It's Monday. / Today is Monday.<br><br><strong>What day is tomorrow?</strong><br> Jaki dzień jest jutro?<br> Tomorrow is Tuesday. </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%);"> <div class="greeting-english"> 🗓️ Pytania o Datę </div> <div class="greeting-pronunciation"> Asking about dates </div> <div class="greeting-usage"><strong>What's the date today?</strong><br> [łots de dejt tudej?]<br> Która jest dziś data?<br><br><strong>Odpowiedź:</strong><br> It's March 15th. / It's the 15th of March.<br><br><strong>When is your birthday?</strong><br> Kiedy są twoje urodziny?<br> My birthday is on July 10th. </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);"> <div class="greeting-english"> ⏰ Przyimki Czasu </div> <div class="greeting-pronunciation"> Prepositions of time </div> <div class="greeting-usage"><strong>ON</strong> - dla dni i dat:<br> • on Monday (w poniedziałek)<br> • on March 5th (5 marca)<br> • on my birthday (w moje urodziny)<br><br><strong>IN</strong> - dla miesięcy, lat, pór roku:<br> • in January (w styczniu)<br> • in 2024 (w 2024 roku)<br> • in summer (latem) </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);"> <div class="greeting-english"> 🎯 Przydatne Zwroty </div> <div class="greeting-pronunciation"> Useful phrases </div> <div class="greeting-usage"><strong>This Monday</strong> - W ten poniedziałek<br><strong>Next Friday</strong> - W przyszły piątek<br><strong>Last Tuesday</strong> - W zeszły wtorek<br><strong>Every day</strong> - Codziennie<br><strong>Every week</strong> - Co tydzień<br><strong>Every month</strong> - Co miesiąc<br><strong>Twice a week</strong> - Dwa razy w tygodniu<br><strong>Once a month</strong> - Raz w miesiącu </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%);"> <div class="greeting-english"> 🔢 Przykłady Dat z Liczbami </div> <div class="greeting-pronunciation"> Date examples with numbers </div> <div class="greeting-usage"><strong>1st</strong> - January 1st (New Year's Day)<br><strong>14th</strong> - February 14th (Valentine's Day)<br><strong>25th</strong> - December 25th (Christmas)<br><strong>31st</strong> - October 31st (Halloween)<br><br><strong>Jak czytać:</strong><br> • 01/15 → January fifteenth<br> • 03/22 → March twenty-second<br> • 12/31 → December thirty-first </div> </div> <div class="greeting-card" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);"> <div class="greeting-english"> 💡 Wskazówki </div> <div class="greeting-pronunciation"> Tips for learning </div> <div class="greeting-usage"> 1️⃣ <strong>Dni tygodnia:</strong> Zawsze pisane WIELKĄ literą!<br> 2️⃣ <strong>Miesiące:</strong> Również zawsze WIELKĄ literą!<br> 3️⃣ <strong>Daty:</strong> Używamy liczb porządkowych (1st, 2nd, 3rd...)<br> 4️⃣ <strong>Przyimek ON:</strong> Dla konkretnych dni i dat<br> 5️⃣ <strong>Ćwicz codziennie:</strong> Mów dzisiejszą datę po angielsku! </div> </div> </section> <section class="section" id="dialogs"> <h2 style="font-size: 32px; color: #2d3748; margin-bottom: 20px;">Dialogi Praktyczne</h2> <div class="instruction-box"> <p class="instruction-text">💬 Przeczytaj dialogi i naucz się używać dat w rozmowach! Kliknij 🔊 aby usłyszeć każdą kwestię!</p> </div> <div class="dialog-card"> <div class="dialog-title"> Dialog 1: Pytanie o Dzień </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 Tom: </div> <div class="dialog-english"> What day is it today? <button class="play-native-btn" onclick="playDialogAudio('What day is it today?', 'male')">🔊</button> </div> <div class="dialog-polish"> Jaki jest dziś dzień? </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Sarah: </div> <div class="dialog-english"> It's Wednesday. <button class="play-native-btn" onclick="playDialogAudio('It is Wednesday.', 'female')">🔊</button> </div> <div class="dialog-polish"> Jest środa. </div> </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 Tom: </div> <div class="dialog-english"> Oh, so tomorrow is Thursday! <button class="play-native-btn" onclick="playDialogAudio('Oh, so tomorrow is Thursday!', 'male')">🔊</button> </div> <div class="dialog-polish"> Och, więc jutro jest czwartek! </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Sarah: </div> <div class="dialog-english"> Yes, and Friday is the day after tomorrow. <button class="play-native-btn" onclick="playDialogAudio('Yes, and Friday is the day after tomorrow.', 'female')">🔊</button> </div> <div class="dialog-polish"> Tak, a piątek jest pojutrze. </div> </div> </div> <div class="dialog-card"> <div class="dialog-title"> Dialog 2: Pytanie o Datę </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 Mike: </div> <div class="dialog-english"> What's the date today? <button class="play-native-btn" onclick="playDialogAudio('What is the date today?', 'male')">🔊</button> </div> <div class="dialog-polish"> Która jest dziś data? </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Emma: </div> <div class="dialog-english"> It's March 15th, 2024. <button class="play-native-btn" onclick="playDialogAudio('It is March fifteenth, twenty twenty four.', 'female')">🔊</button> </div> <div class="dialog-polish"> Jest 15 marca 2024. </div> </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 Mike: </div> <div class="dialog-english"> Really? My birthday is next week, on March 22nd! <button class="play-native-btn" onclick="playDialogAudio('Really? My birthday is next week, on March twenty second!', 'male')">🔊</button> </div> <div class="dialog-polish"> Naprawdę? Moje urodziny są w przyszłym tygodniu, 22 marca! </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Emma: </div> <div class="dialog-english"> Happy early birthday! <button class="play-native-btn" onclick="playDialogAudio('Happy early birthday!', 'female')">🔊</button> </div> <div class="dialog-polish"> Wszystkiego najlepszego z wyprzedzeniem! </div> </div> </div> <div class="dialog-card"> <div class="dialog-title"> Dialog 3: Planowanie Spotkania </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 John: </div> <div class="dialog-english"> When is our meeting? <button class="play-native-btn" onclick="playDialogAudio('When is our meeting?', 'male')">🔊</button> </div> <div class="dialog-polish"> Kiedy jest nasze spotkanie? </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Lisa: </div> <div class="dialog-english"> It's on Monday, April 10th. <button class="play-native-btn" onclick="playDialogAudio('It is on Monday, April tenth.', 'female')">🔊</button> </div> <div class="dialog-polish"> Jest w poniedziałek, 10 kwietnia. </div> </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 John: </div> <div class="dialog-english"> Can we change it to Tuesday, April 11th? <button class="play-native-btn" onclick="playDialogAudio('Can we change it to Tuesday, April eleventh?', 'male')">🔊</button> </div> <div class="dialog-polish"> Czy możemy zmienić to na wtorek, 11 kwietnia? </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Lisa: </div> <div class="dialog-english"> Sure, no problem! <button class="play-native-btn" onclick="playDialogAudio('Sure, no problem!', 'female')">🔊</button> </div> <div class="dialog-polish"> Jasne, nie ma problemu! </div> </div> </div> <div class="dialog-card"> <div class="dialog-title"> Dialog 4: Wakacje </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 David: </div> <div class="dialog-english"> When are you going on vacation? <button class="play-native-btn" onclick="playDialogAudio('When are you going on vacation?', 'male')">🔊</button> </div> <div class="dialog-polish"> Kiedy jedziesz na wakacje? </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Anna: </div> <div class="dialog-english"> In July. From July 1st to July 15th. <button class="play-native-btn" onclick="playDialogAudio('In July. From July first to July fifteenth.', 'female')">🔊</button> </div> <div class="dialog-polish"> W lipcu. Od 1 do 15 lipca. </div> </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 David: </div> <div class="dialog-english"> That's two weeks! Where are you going? <button class="play-native-btn" onclick="playDialogAudio('That is two weeks! Where are you going?', 'male')">🔊</button> </div> <div class="dialog-polish"> To dwa tygodnie! Dokąd jedziesz? </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Anna: </div> <div class="dialog-english"> To Spain! I'm so excited! <button class="play-native-btn" onclick="playDialogAudio('To Spain! I am so excited!', 'female')">🔊</button> </div> <div class="dialog-polish"> Do Hiszpanii! Jestem taka podekscytowana! </div> </div> </div> <div class="dialog-card"> <div class="dialog-title"> Dialog 5: Urodziny </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 Peter: </div> <div class="dialog-english"> When is your birthday? <button class="play-native-btn" onclick="playDialogAudio('When is your birthday?', 'male')">🔊</button> </div> <div class="dialog-polish"> Kiedy są twoje urodziny? </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Kate: </div> <div class="dialog-english"> My birthday is on December 25th. Same as Christmas! <button class="play-native-btn" onclick="playDialogAudio('My birthday is on December twenty fifth. Same as Christmas!', 'female')">🔊</button> </div> <div class="dialog-polish"> Moje urodziny są 25 grudnia. Tak samo jak Boże Narodzenie! </div> </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 Peter: </div> <div class="dialog-english"> Wow! That's special! Mine is on February 14th. <button class="play-native-btn" onclick="playDialogAudio('Wow! That is special! Mine is on February fourteenth.', 'male')">🔊</button> </div> <div class="dialog-polish"> Wow! To wyjątkowe! Moje są 14 lutego. </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Kate: </div> <div class="dialog-english"> Valentine's Day! That's romantic! <button class="play-native-btn" onclick="playDialogAudio('Valentine Day! That is romantic!', 'female')">🔊</button> </div> <div class="dialog-polish"> Walentynki! To romantyczne! </div> </div> </div> <div class="dialog-card"> <div class="dialog-title"> Dialog 6: Plany na Weekend </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 Alex: </div> <div class="dialog-english"> What are you doing this Saturday? <button class="play-native-btn" onclick="playDialogAudio('What are you doing this Saturday?', 'male')">🔊</button> </div> <div class="dialog-polish"> Co robisz w tę sobotę? </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Maria: </div> <div class="dialog-english"> I'm going to the cinema on Saturday evening. <button class="play-native-btn" onclick="playDialogAudio('I am going to the cinema on Saturday evening.', 'female')">🔊</button> </div> <div class="dialog-polish"> Idę do kina w sobotę wieczorem. </div> </div> <div class="dialog-line dialog-person-a"> <div class="dialog-speaker"> 👨 Alex: </div> <div class="dialog-english"> And on Sunday? <button class="play-native-btn" onclick="playDialogAudio('And on Sunday?', 'male')">🔊</button> </div> <div class="dialog-polish"> A w niedzielę? </div> </div> <div class="dialog-line dialog-person-b"> <div class="dialog-speaker"> 👩 Maria: </div> <div class="dialog-english"> On Sunday, I'm visiting my grandparents. <button class="play-native-btn" onclick="playDialogAudio('On Sunday, I am visiting my grandparents.', 'female')">🔊</button> </div> <div class="dialog-polish"> W niedzielę odwiedzam moich dziadków. </div> </div> </div> </section> <section class="section" id="vocabulary"> <h2 style="font-size: 32px; color: #2d3748; margin-bottom: 20px;">Słówka do Zapamiętania</h2> <div class="instruction-box"> <p class="instruction-text">🔊 Kliknij "Posłuchaj" aby usłyszeć prawidłową wymowę każdego słowa!</p> </div> <div class="vocabulary-grid"> <div class="vocab-card" data-word="monday"> <div class="vocab-emoji"> 📅 </div> <div class="vocab-english"> Monday </div> <div class="vocab-pronunciation"> [mandej] </div> <div class="vocab-polish"> Poniedziałek </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('monday')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="tuesday"> <div class="vocab-emoji"> 📅 </div> <div class="vocab-english"> Tuesday </div> <div class="vocab-pronunciation"> [tjuzdej] </div> <div class="vocab-polish"> Wtorek </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('tuesday')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="wednesday"> <div class="vocab-emoji"> 📅 </div> <div class="vocab-english"> Wednesday </div> <div class="vocab-pronunciation"> [łenzdej] </div> <div class="vocab-polish"> Środa </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('wednesday')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="thursday"> <div class="vocab-emoji"> 📅 </div> <div class="vocab-english"> Thursday </div> <div class="vocab-pronunciation"> [terzdej] </div> <div class="vocab-polish"> Czwartek </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('thursday')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="friday"> <div class="vocab-emoji"> 📅 </div> <div class="vocab-english"> Friday </div> <div class="vocab-pronunciation"> [frajdej] </div> <div class="vocab-polish"> Piątek </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('friday')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="saturday"> <div class="vocab-emoji"> 📅 </div> <div class="vocab-english"> Saturday </div> <div class="vocab-pronunciation"> [saterdej] </div> <div class="vocab-polish"> Sobota </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('saturday')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="sunday"> <div class="vocab-emoji"> 📅 </div> <div class="vocab-english"> Sunday </div> <div class="vocab-pronunciation"> [sandej] </div> <div class="vocab-polish"> Niedziela </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('sunday')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="january"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> January </div> <div class="vocab-pronunciation"> [dżenjueri] </div> <div class="vocab-polish"> Styczeń </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('january')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="february"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> February </div> <div class="vocab-pronunciation"> [februeri] </div> <div class="vocab-polish"> Luty </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('february')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="march"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> March </div> <div class="vocab-pronunciation"> [marcz] </div> <div class="vocab-polish"> Marzec </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('march')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="april"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> April </div> <div class="vocab-pronunciation"> [ejpril] </div> <div class="vocab-polish"> Kwiecień </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('april')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="may"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> May </div> <div class="vocab-pronunciation"> [mej] </div> <div class="vocab-polish"> Maj </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('may')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="june"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> June </div> <div class="vocab-pronunciation"> [dżun] </div> <div class="vocab-polish"> Czerwiec </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('june')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="july"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> July </div> <div class="vocab-pronunciation"> [dżulaj] </div> <div class="vocab-polish"> Lipiec </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('july')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="august"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> August </div> <div class="vocab-pronunciation"> [ogast] </div> <div class="vocab-polish"> Sierpień </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('august')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="september"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> September </div> <div class="vocab-pronunciation"> [september] </div> <div class="vocab-polish"> Wrzesień </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('september')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="october"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> October </div> <div class="vocab-pronunciation"> [oktober] </div> <div class="vocab-polish"> Październik </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('october')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="november"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> November </div> <div class="vocab-pronunciation"> [nowember] </div> <div class="vocab-polish"> Listopad </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('november')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="december"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> December </div> <div class="vocab-pronunciation"> [disember] </div> <div class="vocab-polish"> Grudzień </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('december')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="today"> <div class="vocab-emoji"> ☀️ </div> <div class="vocab-english"> Today </div> <div class="vocab-pronunciation"> [tudej] </div> <div class="vocab-polish"> Dziś, dzisiaj </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('today')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="tomorrow"> <div class="vocab-emoji"> 🌅 </div> <div class="vocab-english"> Tomorrow </div> <div class="vocab-pronunciation"> [tumoro] </div> <div class="vocab-polish"> Jutro </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('tomorrow')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="yesterday"> <div class="vocab-emoji"> 🌆 </div> <div class="vocab-english"> Yesterday </div> <div class="vocab-pronunciation"> [jesterdej] </div> <div class="vocab-polish"> Wczoraj </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('yesterday')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="week"> <div class="vocab-emoji"> 📆 </div> <div class="vocab-english"> Week </div> <div class="vocab-pronunciation"> [łik] </div> <div class="vocab-polish"> Tydzień </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('week')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="month"> <div class="vocab-emoji"> 🗓️ </div> <div class="vocab-english"> Month </div> <div class="vocab-pronunciation"> [mans] </div> <div class="vocab-polish"> Miesiąc </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('month')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="year"> <div class="vocab-emoji"> 📅 </div> <div class="vocab-english"> Year </div> <div class="vocab-pronunciation"> [jir] </div> <div class="vocab-polish"> Rok </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('year')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="date"> <div class="vocab-emoji"> 📝 </div> <div class="vocab-english"> Date </div> <div class="vocab-pronunciation"> [dejt] </div> <div class="vocab-polish"> Data </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('date')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="birthday"> <div class="vocab-emoji"> 🎂 </div> <div class="vocab-english"> Birthday </div> <div class="vocab-pronunciation"> [bersdej] </div> <div class="vocab-polish"> Urodziny </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('birthday')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="first"> <div class="vocab-emoji"> 🔢 </div> <div class="vocab-english"> First (1st) </div> <div class="vocab-pronunciation"> [ferst] </div> <div class="vocab-polish"> Pierwszy </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('first')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="second"> <div class="vocab-emoji"> 🔢 </div> <div class="vocab-english"> Second (2nd) </div> <div class="vocab-pronunciation"> [sekond] </div> <div class="vocab-polish"> Drugi </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('second')">🔊 Posłuchaj</button> </div> </div> <div class="vocab-card" data-word="third"> <div class="vocab-emoji"> 🔢 </div> <div class="vocab-english"> Third (3rd) </div> <div class="vocab-pronunciation"> [terd] </div> <div class="vocab-polish"> Trzeci </div> <div class="recording-controls"><button class="play-native-btn" onclick="playNativeAudio('third')">🔊 Posłuchaj</button> </div> </div> </div> </section> <section class="section" id="exercises"> <h2 style="font-size: 32px; color: #2d3748; margin-bottom: 20px;">Ćwiczenia Praktyczne</h2> <div class="instruction-box"> <p class="instruction-text">💡 Rozwiąż zadania i sprawdź swoją wiedzę o datach!</p> </div> <div class="exercise-card"> <div class="exercise-title"> Ćwiczenie 1: Dni Tygodnia </div> <div class="exercise-scenario"><strong>Zadanie:</strong> Który dzień jest <strong>po czwartku</strong>? </div> <div class="quiz-options" id="exercise1Options"></div> <div id="exercise1Feedback"></div> </div> <div class="exercise-card"> <div class="exercise-title"> Ćwiczenie 2: Miesiące </div> <div class="exercise-scenario"><strong>Zadanie:</strong> Który miesiąc jest <strong>przed lipcem</strong>? </div> <div class="quiz-options" id="exercise2Options"></div> <div id="exercise2Feedback"></div> </div> <div class="exercise-card"> <div class="exercise-title"> Ćwiczenie 3: Pisanie Dat </div> <div class="exercise-scenario"><strong>Zadanie:</strong> Jak napisać datę <strong>15 marca 2024</strong> po amerykańsku? </div> <div class="quiz-options" id="exercise3Options"></div> <div id="exercise3Feedback"></div> </div> <div class="exercise-card"> <div class="exercise-title"> Ćwiczenie 4: Liczby Porządkowe </div> <div class="exercise-scenario"><strong>Zadanie:</strong> Jak powiedzieć <strong>21</strong> jako liczbę porządkową? <div class="date-example-box"> <div class="date-number"> 21 </div> <div class="date-text"> ? ? ? </div> </div> </div> <div class="quiz-options" id="exercise4Options"></div> <div id="exercise4Feedback"></div> </div> <div class="exercise-card"> <div class="exercise-title"> Ćwiczenie 5: Przyimki </div> <div class="exercise-scenario"><strong>Zadanie:</strong> Który przyimek jest poprawny?<br> "My birthday is ___ December 25th." </div> <div class="quiz-options" id="exercise5Options"></div> <div id="exercise5Feedback"></div> </div> <div class="exercise-card"> <div class="exercise-title"> Ćwiczenie 6: Czytanie Dat </div> <div class="exercise-scenario"><strong>Zadanie:</strong> Jak przeczytać datę <strong>03/05/2024</strong> po amerykańsku? <div class="date-example-box"> <div class="date-number"> 03/05/2024 </div> <div class="date-text"> Jak to przeczytać? </div> </div> </div> <div class="quiz-options" id="exercise6Options"></div> <div id="exercise6Feedback"></div> </div> <div style="text-align: center; margin-top: 30px;"><button class="btn-large" id="resetExercises">🔄 Resetuj Ćwiczenia</button> </div> </section> <section class="section" id="quiz"> <h2 style="font-size: 32px; color: #2d3748; margin-bottom: 20px;">Quiz - Sprawdź Swoją Wiedzę!</h2> <div class="instruction-box"> <p class="instruction-text">🎯 Odpowiedz na pytania i sprawdź, jak dobrze znasz daty!</p> </div> <div class="quiz-container"> <div class="quiz-question" id="quizQuestion"> Który dzień jest po poniedziałku? </div> <div class="quiz-options" id="quizOptions"></div> <div id="quizFeedback"></div> </div> <div style="text-align: center; margin-top: 30px;"><button class="btn-large" id="nextQuiz">Następne Pytanie →</button> </div> <div class="progress-info" id="quizScore"> Wynik: 0 / 10 </div> </section> </div> </main> <script> const defaultConfig = { main_title: "🔤 Alfabet i Wymowa", subtitle: "Learn the English Alphabet - Naucz się angielskiego alfabetu!", background_color: "#667eea", surface_color: "#ffffff", text_color: "#2d3748", primary_action_color: "#667eea", secondary_action_color: "#f093fb", font_family: "Segoe UI", font_size: 16 };

// Quiz questions const quizQuestions = [ { question: 'Który dzień jest po poniedziałku?', options: ['Monday', 'Tuesday', 'Wednesday', 'Sunday'], correct: 1 }, { question: 'Jak powiedzieć "jutro" po angielsku?', options: ['Yesterday', 'Today', 'Tomorrow', 'Next day'], correct: 2 }, { question: 'Który miesiąc jest pierwszy w roku?', options: ['December', 'February', 'January', 'March'], correct: 2 }, { question: 'Jak napisać "pierwszy" jako liczbę porządkową?', options: ['1th', '1st', '1nd', '1rd'], correct: 1 }, { question: 'Który przyimek używamy z dniami tygodnia?', options: ['in', 'at', 'on', 'by'], correct: 2 }, { question: 'Co oznacza "the day after tomorrow"?', options: ['Wczoraj', 'Jutro', 'Pojutrze', 'Przedwczoraj'], correct: 2 }, { question: 'Jak powiedzieć "25 grudnia" po angielsku?', options: ['December 25th', '25 December', 'The 25th of December', 'Wszystkie poprawne'], correct: 3 }, { question: 'Który dzień jest przed niedzielą?', options: ['Friday', 'Monday', 'Saturday', 'Thursday'], correct: 2 }, { question: 'Jak zapytać o datę?', options: ["What's the date?", "Which date is it?", "How is the date?", "When is date?"], correct: 0 }, { question: 'Co oznacza "last week"?', options: ['W przyszłym tygodniu', 'W tym tygodniu', 'W zeszłym tygodniu', 'Co tydzień'], correct: 2 } ];

// Exercises const exercises = [ { id: 'exercise1', options: ['Wednesday', 'Friday', 'Saturday', 'Tuesday'], correct: 1 }, { id: 'exercise2', options: ['August', 'June', 'May', 'April'], correct: 1 }, { id: 'exercise3', options: ['03/15/2024', '15/03/2024', '2024/03/15', '15-03-2024'], correct: 0 }, { id: 'exercise4', options: ['Twenty-one', 'Twenty-first', 'Twenty-oneth', 'Twentieth-one'], correct: 1 }, { id: 'exercise5', options: ['in', 'at', 'on', 'by'], correct: 2 }, { id: 'exercise6', options: ['March fifth', 'May third', 'Third of May', 'Fifth of March'], correct: 0 } ];

let currentQuizIndex = 0; let quizScore = 0;

// Initialize exercises function initExercises() { exercises.forEach((exercise) => { const optionsContainer = document.getElementById(`${exercise.id}Options`); optionsContainer.innerHTML = ''; exercise.options.forEach((option, optIndex) => { const optionEl = document.createElement('div'); optionEl.className = 'quiz-option'; optionEl.textContent = option; optionEl.addEventListener('click', () => checkExerciseAnswer(exercise.id, optIndex, exercise.correct)); optionsContainer.appendChild(optionEl); }); }); }

// Quiz functionality function showQuizQuestion() { if (currentQuizIndex >= quizQuestions.length) { document.getElementById('quizQuestion').textContent = `🎉 Gratulacje! Twój wynik: ${quizScore}/${quizQuestions.length}`; document.getElementById('quizOptions').innerHTML = ''; document.getElementById('quizFeedback').innerHTML = ''; document.getElementById('nextQuiz').textContent = '🔄 Rozpocznij Quiz Od Nowa'; return; }

const q = quizQuestions[currentQuizIndex]; document.getElementById('quizQuestion').textContent = q.question; document.getElementById('quizFeedback').innerHTML = ''; const optionsContainer = document.getElementById('quizOptions'); optionsContainer.innerHTML = ''; q.options.forEach((option, index) => { const optionEl = document.createElement('div'); optionEl.className = 'quiz-option'; optionEl.textContent = option; optionEl.addEventListener('click', () => checkQuizAnswer(index)); optionsContainer.appendChild(optionEl); }); }

// Menu navigation document.querySelectorAll('.menu-btn').forEach(btn => { btn.addEventListener('click', function() { document.querySelectorAll('.menu-btn').forEach(b => b.classList.remove('active')); this.classList.add('active'); document.querySelectorAll('.section').forEach(section => { section.classList.remove('active'); }); const sectionId = this.dataset.section; document.getElementById(sectionId).classList.add('active'); if (sectionId === 'exercises') { initExercises(); } if (sectionId === 'quiz') { showQuizQuestion(); } }); });

// Initialize initExercises();

// Native Audio Playback using Web Speech API function playNativeAudio(word) { const utterance = new SpeechSynthesisUtterance(word); utterance.lang = 'en-US'; utterance.rate = 0.75; utterance.pitch = 1.0; const voices = window.speechSynthesis.getVoices(); const englishVoice = voices.find(voice => voice.lang.startsWith('en')); if (englishVoice) { utterance.voice = englishVoice; } window.speechSynthesis.speak(utterance); }

// Dialog Audio with gender selection function playDialogAudio(text, gender) { const utterance = new SpeechSynthesisUtterance(text); utterance.lang = 'en-US'; utterance.rate = 0.8; const voices = window.speechSynthesis.getVoices(); if (gender === 'female') { utterance.pitch = 1.2; const femaleVoice = voices.find(voice => voice.lang.startsWith('en') && (voice.name.includes('Female') || voice.name.includes('Samantha') || voice.name.includes('Victoria') || voice.name.includes('Karen') || voice.name.includes('Moira') || voice.name.includes('Tessa') || voice.name.includes('Fiona')) ); if (femaleVoice) { utterance.voice = femaleVoice; } } else { utterance.pitch = 0.9; const maleVoice = voices.find(voice => voice.lang.startsWith('en') && (voice.name.includes('Male') || voice.name.includes('Daniel') || voice.name.includes('Alex') || voice.name.includes('Fred') || voice.name.includes('Tom') || voice.name.includes('James')) ); if (maleVoice) { utterance.voice = maleVoice; } } window.speechSynthesis.speak(utterance); }

// Load voices when they become available if (window.speechSynthesis.onvoiceschanged !== undefined) { window.speechSynthesis.onvoiceschanged = () => { window.speechSynthesis.getVoices(); }; }

// Make functions global window.playNativeAudio = playNativeAudio; window.playDialogAudio = playDialogAudio;

// Element SDK async function onConfigChange(config) { const baseSize = config.font_size || defaultConfig.font_size; const customFont = config.font_family || defaultConfig.font_family; const baseFontStack = 'Segoe UI, Tahoma, Geneva, Verdana, sans-serif'; document.body.style.background = `linear-gradient(135deg, ${config.background_color || defaultConfig.background_color} 0%, ${config.secondary_action_color || defaultConfig.secondary_action_color} 100%)`; document.getElementById('mainTitle').textContent = config.main_title || defaultConfig.main_title; document.getElementById('mainTitle').style.fontFamily = `${customFont}, ${baseFontStack}`; document.getElementById('mainTitle').style.fontSize = `${baseSize * 3}px`; document.getElementById('mainSubtitle').textContent = config.subtitle || defaultConfig.subtitle; document.getElementById('mainSubtitle').style.fontFamily = `${customFont}, ${baseFontStack}`; document.getElementById('mainSubtitle').style.fontSize = `${baseSize * 1.375}px`; document.querySelectorAll('.content-container').forEach(el => { el.style.background = config.surface_color || defaultConfig.surface_color; }); document.querySelectorAll('.btn-large').forEach(btn => { if (!btn.classList.contains('btn-secondary')) { btn.style.background = config.primary_action_color || defaultConfig.primary_action_color; } btn.style.fontFamily = `${customFont}, ${baseFontStack}`; btn.style.fontSize = `${baseSize * 1.375}px`; }); }

if (window.elementSdk) { window.elementSdk.init({ defaultConfig, onConfigChange, mapToCapabilities: (config) => ({ recolorables: [ { get: () => config.background_color || defaultConfig.background_color, set: (value) => { config.background_color = value; window.elementSdk.setConfig({ background_color: value }); } }, { get: () => config.surface_color || defaultConfig.surface_color, set: (value) => { config.surface_color = value; window.elementSdk.setConfig({ surface_color: value }); } }, { get: () => config.text_color || defaultConfig.text_color, set: (value) => { config.text_color = value; window.elementSdk.setConfig({ text_color: value }); } }, { get: () => config.primary_action_color || defaultConfig.primary_action_color, set: (value) => { config.primary_action_color = value; window.elementSdk.setConfig({ primary_action_color: value }); } }, { get: () => config.secondary_action_color || defaultConfig.secondary_action_color, set: (value) => { config.secondary_action_color = value; window.elementSdk.setConfig({ secondary_action_color: value }); } } ], borderables: [], fontEditable: { get: () => config.font_family || defaultConfig.font_family, set: (value) => { config.font_family = value; window.elementSdk.setConfig({ font_family: value }); } }, fontSizeable: { get: () => config.font_size || defaultConfig.font_size, set: (value) => { config.font_size = value; window.elementSdk.setConfig({ font_size: value }); } } }), mapToEditPanelValues: (config) => new Map([ ["main_title", config.main_title || defaultConfig.main_title], ["subtitle", config.subtitle || defaultConfig.subtitle] ]) }); } </script> <script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'9a9f1694473270c2',t:'MTc2NTA1ODc2My4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script></body></html>

Co mówią ludzie?

Jestem bardzo podekscytowana tym kursem! Myślę, że adwentowy kalendarz z nagraniami wideo i fiszkami to świetny pomysł na świąteczny czas.

Anna

Ten kurs brzmi fantastycznie! Uwielbiam uczyć się nowych rzeczy, a zadania PDF będą idealne do pracy w moim tempie.

Marta

Zgadzam się, że taki kurs może być bardzo inspirujący. Chciałabym, aby był dostępny także dla młodszych kobiet! To świetna okazja na rozwijanie umiejętności i kreatywności.

Karolina

Ewa Zielińska: "To bardzo ciekawa oferta! Czekam na więcej informacji, bo chciałabym wziąć udział i stworzyć coś wyjątkowego na święta.

Ewa

Nasze usługi są dostępne.

Kurs Adwentowy

More

Kompleksowy kurs online dla kobiet, interaktywna kalendarz adwentowy, aktywności.

Lekcje Wideo

Więcej

Zbiór nagrań wideo z instrukcjami i inspiracjami na święta.

Zadania PDF

Więcej

Zasoby do pobrania, w tym zadania PDF i fiszki, angażujące.