Rivitรค tekstiRaakaLataa (3678 tavua)
๐Ÿ“… 2026-01-09T20:19:28.771Z
๐Ÿ‘๏ธ 31 katselukertaa
๐Ÿ”“ Julkinen


<!DOCTYPE html>
<html lang="he" dir="rtl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ืžืฉื™ืžื•ืช ืขื™ื“ืŸ</title>
    <link href="https://fonts.googleapis.com/css2?family=Assistant:wght@400;700&display=swap" rel="stylesheet">
    <style>
        body { font-family: 'Assistant', sans-serif; background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%); min-height: 100vh; padding: 15px; margin: 0; }
        .app-card { max-width: 500px; margin: auto; background: white; padding: 25px; border-radius: 25px; box-shadow: 0 15px 35px rgba(0,0,0,0.1); }
        h1 { text-align: center; color: #2c3e50; font-size: 1.8rem; margin-bottom: 20px; }
        .task-row { display: flex; align-items: center; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid #eee; }
        .task-info { flex: 1; padding-left: 10px; }
        .day { font-size: 0.8rem; color: #7f8c8d; font-weight: 700; }
        .subject { font-weight: 700; color: #34495e; display: block; margin-top: 2px; }
        .homework { color: #d35400; font-weight: 700; font-size: 0.95rem; margin-top: 3px; }
        input[type="checkbox"] { width: 28px; height: 28px; border-radius: 8px; cursor: pointer; accent-color: #3498db; }
        .footer { margin-top: 25px; padding: 15px; background: #fdfdfd; border-radius: 15px; border: 1px dashed #cbd5e0; }
        .star-item { margin-bottom: 8px; font-weight: 600; font-size: 0.9rem; color: #2c3e50; }
        .star { color: #e74c3c; margin-left: 5px; }
    </style>
</head>
<body>
<div class="app-card">
    <h1>ื”ืžืจื›ื– ืœืžื™ื“ื” ืฉืœ ืขื™ื“ืŸ ๐Ÿš€</h1>
    
    <div class="task-row">
        <div class="task-info">
            <span class="day">ืจืืฉื•ืŸ (04.01)</span>
            <span class="subject">ืขื‘ืจื™ืช</span>
            <div class="homework">ืœืงืจื•ื ืขืž' 24 ("ื”ืคื™ืœ ื•ื”ืคื™ืชื”")</div>
        </div>
        <input type="checkbox" id="v1">
    </div>

    <div class="task-row">
        <div class="task-info">
            <span class="day">ืฉื ื™ (05.01)</span>
            <span class="subject">ืžืชืžื˜ื™ืงื”</span>
            <div class="homework">ืกื™ื•ื ืขืž' 132 + ื“ืฃ ืคื™ืชื•ื— ื—ืฉื™ื‘ื”</div>
        </div>
        <input type="checkbox" id="v2">
    </div>

    <div class="task-row">
        <div class="task-info">
            <span class="day">ืจื‘ื™ืขื™ (07.01)</span>
            <span class="subject">ืขื‘ืจื™ืช + ืžื“ืขื™ื</span>
            <div class="homework">ืกื™ื•ื ืขืž' 26-27 | ืžื“ ื’ืฉื + ืขืž' 22</div>
        </div>
        <input type="checkbox" id="v3">
    </div>

    <div class="task-row">
        <div class="task-info">
            <span class="day">ื—ืžื™ืฉื™ (08.01)</span>
            <span class="subject">ื’ืื•ืžื˜ืจื™ื” + ืขื‘ืจื™ืช</span>
            <div class="homework">ืขืž' 136-138 | ื“ืคื™ ื—ื™ืจื™ืง ืžื•ื“ื‘ืงื™ื</div>
        </div>
        <input type="checkbox" id="v4">
    </div>

    <div class="footer">
        <div class="star-item"><span class="star">โ˜…</span> ื˜ืงืกื˜ ืงืจื™ืื” ืฉื‘ื•ืขื™</div>
        <div class="star-item"><span class="star">โ˜…</span> ื—ื•ื‘ืจืช ืชืจื’ื•ืœ ื‘ื—ืฉื‘ื•ืŸ ืœืกื•ืฃ ื”ื—ื•ื“ืฉ</div>
        <div class="star-item"><span class="star">โ˜…</span> ื—ืฉื‘ื•ืŸ ืขื“ ืขืžื•ื“ 139</div>
    </div>
</div>

<script>
    const checks = document.querySelectorAll('input');
    checks.forEach(c => {
        if(localStorage.getItem(c.id) === 'true') c.checked = true;
        c.onchange = () => localStorage.setItem(c.id, c.checked);
    });
</script>
</body>
</html>