mirror of
https://github.com/nexu-io/open-design.git
synced 2026-06-01 03:14:35 +07:00
b5eb8c1647
* feat: general-purpose skills with @-mention composition and user import
Lift skills from "one mode-bound skill per project" to a generic capability
the user can compose per turn:
- Daemon: scan multiple skill roots (user-skills under runtime data, then
the bundled `skills/`); user-imported skills can shadow built-ins by id.
- New `POST /api/skills/import` and `DELETE /api/skills/:id` endpoints,
with CONFLICT/BAD_REQUEST/NOT_FOUND error codes and built-in delete
protection.
- ChatRequest gains `skillIds: string[]`; the chat run concatenates each
picked skill's body (and merges craftRequires) into the system prompt
for that turn only — the project's persistent `skillId` is untouched.
- Web composer: `@` popover now lists skills alongside project files;
picks render as removable chips above the textarea and ride along with
the request as `skillIds`.
- Settings → Library: import form (name/description/triggers/body),
per-card delete for user skills, "user" origin badge.
* chore(web): drop welcome pet teaser + add ds→prompt-template mapping util
- SettingsDialog: remove the inline pet adoption teaser from the welcome
panel so the first-run modal stays focused on configuration.
- New `inferPromptTemplateCategoriesForDs(ds)` helper that maps a design
system's authored metadata to prompt-template gallery categories.
Imported by the design-system gallery wiring on a sibling branch; no
callers in this branch yet.
* feat: split skills/design-templates and add finalize-design API
Phase 0 of the skills/design-templates refactor (specs/current/
skills-and-design-templates.md):
- Move ~104 rendering catalogue entries from skills/ to design-templates/
and keep skills/ for the small set of functional skills that *do work*
on user input (utilities, briefs, packagers).
- Add design-templates/AGENTS.md and skills/AGENTS.md describing the
contract, and a brand-agnostic craft/ surface for opt-in craft rules.
- Daemon: add DESIGN_TEMPLATES_DIR / USER_DESIGN_TEMPLATES_DIR roots and
an /api/design-templates surface mirroring /api/skills. Asset/example
routes still span both registries so existing srcdoc URLs keep
resolving across the rename.
- Web: split LibrarySection into SkillsSection + DesignSystemsSection,
rename the EntryView "Examples" tab to "Templates", and update locales
+ the New-project picker accordingly.
Adds the finalize-design endpoint:
- New apps/daemon/src/finalize-design.ts and packages/contracts/src/api/
finalize.ts — one-shot synthesis of a project's transcript + active
design system + current artifact into <projectDir>/DESIGN.md via the
Anthropic Messages API. Per-project .finalize.lock mirrors the
transcript-export hygiene from PR #493; provider credentials are not
persisted by the daemon.
Other supporting changes:
- README + AGENTS.md updates to document the new directory split and
craft/ surface, plus i18n strings across 13 locales.
- Test refactors and new coverage (finalize-design, runs, sidecar
server, plus refreshed daemon integration tests).
- .gitignore: scope the *.exe ignore to /OpenDesign.exe so legitimate
vendor binaries are no longer hidden.
* fix(merge): move clinical-case-report to design-templates/
Origin/main added the clinical-case-report skill under skills/ before
the skills/design-templates split landed. Its od.mode is prototype, so
per specs/current/skills-and-design-templates.md it is a design template
and belongs alongside the other rendering catalogue entries — not under
the slimmed-down functional skills/ root. Moving it keeps the EntryView
Templates tab consistent with origin/main's intent.
* feat(skills): curated design/creative catalogue + collapsible Settings rows
Seed ~100 curated design/creative skill stubs under skills/ sourced from
awesome-claude-skills (ComposioHQ) and awesome-agent-skills (VoltAgent).
Each stub carries an od.category tag so the new filter pill row in
Settings -> Skills can group them. The seed script
(scripts/seed-curated-design-skills.ts, pnpm seed:curated-design-skills)
is idempotent: it only creates folders that don't already exist, so
hand-edited stubs are never overwritten.
- Daemon: parse and surface od.category on SkillInfo with a strict slug
normaliser; mirror the field on SkillSummary in @open-design/contracts.
Category is purely a UI hint — system-prompt composition is unchanged.
- Web: rewrite SkillsSection from a left-list / right-detail grid into a
vertical stack of collapsible rows mirroring the External MCP panel
(header always visible with name + mode/source/category pills + per-row
enable toggle; SKILL.md preview, file tree and inline edit form expand
on demand). Add a Category filter row above the list. Reorder Settings
nav so Skills + External MCP sit above the Composio/MCP cluster. Update
composer placeholder/hint across 17 locales to advertise '@ files or
skills · / for commands'.
- Docs: extend skills/AGENTS.md with the curated catalogue rules
(idempotency, category vocabulary, no upstream vendoring).
Co-authored-by: Cursor <cursoragent@cursor.com>
* test(skills): teach localized-content + system-prompt tests about the skills/design-templates split
mrcfps blocking review on PR #955: the skills/design-templates split
(b5993385) moved ~110 SKILL.md entries out of `skills/` and into
`design-templates/`, but two repo-level tests still hard-coded the
single-root layout, so CI gates went red on the merged branch:
- `e2e/tests/localized-content.test.ts` only scanned `<repo>/skills`
while the locale `skillCopy` map keeps id-keyed entries spanning
both roots (ExamplesTab/Templates uses one lookup regardless of
origin). Teach the helper to read both `skills/` and
`design-templates/`, deduplicating ids so the union matches the
localized claim.
- `apps/daemon/tests/prompts/system.test.ts` read
`skills/live-artifact/SKILL.md`, which now lives under
`design-templates/live-artifact/`. Update the absolute path so
composeSystemPrompt's coverage of the live-artifact preamble is
exercised again.
Also enroll the curated design/creative catalogue (PR #955, ~91
stubs sourced from awesome-claude-skills / awesome-agent-skills) in
the DE / FR / RU `_SKILL_IDS_WITH_EN_FALLBACK` lists. The stubs are
English-only by design (frontmatter advertises an upstream URL); the
fallback list is exactly the place to acknowledge "we know this id
exists, English copy is fine here" so the localized-content coverage
gate passes without forcing a translation task per locale.
Co-authored-by: Cursor <cursoragent@cursor.com>
* fix(skills): always quote frontmatter name so importUserSkill round-trips numeric / boolean ids
mrcfps PR #955 review: `buildSkillMarkdown` emitted `name:
${escapeYamlString(name)}` without quotes, so YAML coerced names
like `123`, `true`, `false`, or `null` into non-string scalars on
re-parse. listSkills() then read `data.name` as a number/boolean
and the import flow's follow-up `findSkillById(skills, result.id)`
missed it, falling into `/api/skills/import`'s "imported skill
could not be re-read" 500 path for those ids.
Switch the emitter to a quoted scalar (`name: "..."`) — the
double-escape already in `escapeYamlString` makes the quoted form
safe — and add a round-trip test covering `123`, `true`, `false`,
`null`, and `0` to lock in the contract.
Co-authored-by: Cursor <cursoragent@cursor.com>
* fix(web): drop staged-skill chips when the matching @<id> token leaves the draft
mrcfps PR #955 review: `submit()` always forwarded every id in
`stagedSkills`, but that state was only mutated on picker click and
chip removal. Hand-deleting an `@<id>` token from the textarea left
the chip staged, so the request still carried `skillIds: [<id>]` and
the daemon composed a skill the prompt no longer referenced.
Sync the chips with the draft inside `handleChange()` by pruning
`stagedSkills` whenever the new value no longer contains the
`@<id>` token (using the same whitespace boundary as
`removeStagedSkill`'s strip regex). Comment explains why this
prune does not run for `staged` file attachments — users frequently
add files via the upload button without leaving an `@<path>` token,
so a symmetric prune there would erase legitimate uploads.
Co-authored-by: Cursor <cursoragent@cursor.com>
* fix(daemon): stage @-composed skills' side files alongside the active skill
codex PR #955 review: composing a per-turn `@`-picked skill into the
system prompt appended its body (with the `withSkillRootPreamble`
guidance pointing at relative paths under `<cwd>/.od-skills/<folder>/`)
but never staged the actual folder. `startChatRun` only copied
`activeSkillDir`, so when the project's primary skill was different
(or absent) the composed skill's references/, examples/, and scripts/
files lived only at their absolute repo path — agents that honour
the cwd-relative form (or that don't get `--add-dir`, e.g. Codex with
allowlisted gpt-image projects) couldn't reach them.
Thread the composed skills' dirs out of `composeDaemonSystemPrompt`
as `extraSkillDirs` and stage each one through the same
`stageActiveSkill` API used for the primary skill. Dedupe by folder
basename so a project whose primary skill is also `@`-composed isn't
copied twice. Each preamble already advertises its own folder, so the
prompt and the staged tree stay aligned without further changes.
Co-authored-by: Cursor <cursoragent@cursor.com>
* fix(web): respect the Library disable toggle in the project @-mention picker
codex PR #955 review: only `EntryView` received `enabledSkills`
(filtered against `config.disabledSkills`); active projects still
got `skills={skills}` raw, so a skill the user disabled in Settings
kept appearing in the project's `@`-mention popover and could ride
along to the daemon via `skillIds`. That broke the Library toggle
for any project opened on the post-split branch.
Compute a functional-skills-only enabled subset
(`enabledFunctionalSkills`) and pass it into `<ProjectView>` instead.
Templates stay separate — design-templates are filtered through their
own `enabledDesignTemplates` memo for the Templates gallery — so
ProjectView's chat composer still only sees skills, never templates,
matching the pre-split prop surface.
Co-authored-by: Cursor <cursoragent@cursor.com>
* test(e2e): mock /api/design-templates for example-use-prompt flow
The Templates tab in EntryView fetches from /api/design-templates after
the skills/design-templates split (specs/current/skills-and-design-templates.md).
The example-use-prompt Playwright scenario only mocked /api/skills, so the
gallery card never appeared and the test timed out waiting on
example-card-warm-utility-example. Serve the same fixture summary on both
endpoints so the templates gallery renders the card the test clicks.
Co-authored-by: Cursor <cursoragent@cursor.com>
* test(tools-pack): create design-templates fixture for resources test
The packaging resources copy now bundles the new design-templates tree
alongside skills (see resources.ts BUNDLED_RESOURCE_TREES). The
copyBundledResourceTrees fixture only created skills, design-systems,
craft, etc., so the recursive copy crashed with ENOENT on
design-templates before it could check the prompt-templates assertion.
Add the missing fixture directory so the test exercises the same set
of resource trees the packaged build does.
Co-authored-by: Cursor <cursoragent@cursor.com>
* fix(skills): clone built-in side files into the shadow on first edit
mrcfps PR #955 review: editing a built-in skill wrote a USER_SKILLS_DIR
shadow folder that contained only a new SKILL.md. The next listSkills()
pass surfaced the shadow as the active dir, but every side-file resolver
(/api/skills/:id/files, /example, /assets/*, the system-prompt preamble,
and the per-turn cwd staging) reads through skill.dir. With nothing but
SKILL.md in the shadow, the bundled assets/, references/, scripts/, and
examples/ disappeared the moment the user hit save — a built-in like
last30days or live-artifact would break immediately after edit instead
of just having its body overridden.
Teach updateUserSkill() to take a `sourceDir` and clone every entry
except SKILL.md / dotfiles into the shadow on the very first edit. The
shadow stays self-contained, so all the resolvers keep working without
fallback bookkeeping. Subsequent edits detect the existing shadow and
skip the clone, so user tweaks under the side tree survive a re-save.
Wire `sourceDir: skill.dir` from server.ts's PUT /api/skills/:id handler
and add two regression tests:
- 'clones built-in side files into the shadow on the first edit' walks
the file tree after save and asserts assets/template.html, references/
notes.md, and scripts/helper.sh all round-trip from the built-in.
- 'preserves user-edited side files on subsequent edits' edits the
staged assets/template.html, re-saves, and confirms the user content
is still there.
Co-authored-by: Cursor <cursoragent@cursor.com>
* test(e2e): rename home tab from Examples to Templates
The Examples tab was renamed to Templates in EntryView (b5993385's
skills/design-templates split — entry.tabExamples became entry.tabTemplates
and the tab value moved from 'examples' to 'templates'), but
entry-chrome-flows still asserted the old label and testId. Update both.
* fix(skills+web): preserve template body in API mode and dir-based skill delete
Two follow-ups from PR #955 review:
1. ProjectView only received `enabledFunctionalSkills`, but
`composedSystemPrompt()` still resolved `project.skillId` through that
prop and `fetchSkill()`. Projects created from the new
`/api/design-templates` surface keep a template id in `project.skillId`,
so opening one in API mode dropped the template body from the system
prompt and the upstream request ran without the project's primary
template instructions. Now ProjectView takes a separate
`designTemplates` prop (the unfiltered template list, so a
later-disabled template still loads for projects already created from
it) and `composedSystemPrompt()` plus the metadata / `isDeck` lookups
fall back to that list, with `fetchDesignTemplate()` as the body-fetch
fallback to `fetchSkill()`. The chat composer's `@`-picker keeps
receiving only the enabled functional skills.
2. `DELETE /api/skills/:id` used `deleteUserSkill(USER_SKILLS_DIR, skill.id)`
which re-slugified the frontmatter id and removed
`<userSkillsDir>/<slug>/`. That matched the import shape but missed the
install shape — `installFromTarget` writes the folder at
`sanitizeRepoName(url)` (GitHub) or `path.basename(realpath)` (local
symlink), neither of which is guaranteed to equal the slugified
frontmatter `name`. A duplicate `app.delete('/api/skills/:id', ...)`
handler at the install routes never fired because Express resolved the
earlier registration first, leaving the install/uninstall path without
working teardown. The handler now removes `skill.dir` (the absolute
path listSkills already discovered) under a USER_SKILLS_DIR safety
check, using `lstat` + `unlinkSync` so symlinked local installs unlink
cleanly without recursing into the user's source tree. The dead
duplicate handler is removed; `deleteUserSkill` is dropped from the
server.ts import set (still exported and unit-tested in skills.ts).
Regression coverage in `apps/daemon/tests/skills-delete-route.test.ts`
pins both shapes plus the symlink-preserves-source case.
* test(daemon): point hyperframes system-prompt test at design-templates
The merge with main brought in a hyperframes system-prompt test that
reads `skills/hyperframes/SKILL.md`, but this branch's split moved
`hyperframes` into `design-templates/` (same migration as `live-artifact`
already handled above in this file). CI was failing with ENOENT on the
old path.
---------
Co-authored-by: Cursor <cursoragent@cursor.com>
469 lines
85 KiB
HTML
469 lines
85 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Daisy Days — Presentation Template</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Fredoka+One&family=Quicksand:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
<style>
|
|
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
|
|
:root{
|
|
--cream:#F5F0E6;--turquoise:#7ECDC0;--soft-pink:#F7C8D4;--butter:#FDE68A;
|
|
--mint:#A8E6CF;--lavender:#D4A5E8;--peach:#FFCBA4;--sky:#A8D8F0;--coral:#F8635F;
|
|
--text-dark:#2D2D2D;--text-muted:#6B6B6B;
|
|
--border:#2D2D2D;--border-width:3px;--radius:20px;--radius-lg:28px;
|
|
--shadow:6px 6px 0 var(--border);--shadow-sm:4px 4px 0 var(--border);
|
|
--font-display:'Fredoka One',cursive;--font-body:'Quicksand',sans-serif;
|
|
}
|
|
html,body{width:100%;height:100%;overflow:hidden;font-family:var(--font-body);color:var(--text-dark);background:var(--cream)}
|
|
|
|
/* ---- Slide system ---- */
|
|
.slides-container{width:100vw;height:100vh;overflow-y:scroll;scroll-snap-type:y mandatory;scroll-behavior:smooth}
|
|
.slide{width:100vw;height:100vh;min-height:100vh;scroll-snap-align:start;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:40px 60px}
|
|
|
|
/* ---- Typography ---- */
|
|
h1,h2,h3,h4{font-family:var(--font-display);font-weight:400;letter-spacing:.02em}
|
|
h1{font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.1}
|
|
h2{font-size:clamp(1.8rem,3.5vw,3rem);line-height:1.15}
|
|
h3{font-size:clamp(1.3rem,2vw,1.8rem);line-height:1.2}
|
|
h4{font-size:clamp(1rem,1.5vw,1.3rem);line-height:1.3}
|
|
p{font-size:clamp(.95rem,1.3vw,1.15rem);line-height:1.6}
|
|
|
|
/* ---- Utilities ---- */
|
|
.card{background:#fff;border:var(--border-width) solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
|
|
.badge{display:inline-block;padding:8px 20px;border-radius:50px;border:var(--border-width) solid var(--border);font-family:var(--font-display);font-size:.85rem;background:var(--butter)}
|
|
|
|
/* ---- Decorations ---- */
|
|
.deco{position:absolute;pointer-events:none;z-index:1}
|
|
.deco svg{width:100%;height:100%;display:block}
|
|
|
|
/* ---- Nav ---- */
|
|
.nav-dots{position:fixed;right:20px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px;z-index:100}
|
|
.nav-dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--border);background:#fff;cursor:pointer;transition:all .2s}
|
|
.nav-dot.active{background:var(--butter);transform:scale(1.2)}
|
|
.slide-counter{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#fff;border:var(--border-width) solid var(--border);border-radius:50px;padding:6px 20px;font-family:var(--font-display);font-size:.8rem;z-index:100;box-shadow:var(--shadow-sm)}
|
|
|
|
/* ========================================
|
|
SLIDE 1 — Title
|
|
======================================== */
|
|
.slide-title{background:var(--cream)}
|
|
.slide-title .title-box{text-align:center;z-index:2;position:relative}
|
|
.slide-title h1{color:var(--text-dark);margin-bottom:12px;font-size:clamp(3.2rem,7vw,6.5rem)}
|
|
.slide-title .subtitle{font-family:var(--font-body);font-weight:600;font-size:clamp(1rem,1.8vw,1.4rem);color:var(--text-muted);margin-top:16px}
|
|
|
|
.slide-title .deco-daisy-tl{top:-30px;left:-30px;width:220px;height:220px}
|
|
.slide-title .deco-daisy-tr{top:20px;right:-20px;width:180px;height:180px}
|
|
.slide-title .deco-daisy-bl{bottom:-40px;left:20px;width:200px;height:200px}
|
|
.slide-title .deco-daisy-br{bottom:10px;right:-30px;width:210px;height:210px}
|
|
.slide-title .deco-star-1{top:12%;left:6%;width:90px;height:90px}
|
|
.slide-title .deco-star-2{bottom:18%;left:10%;width:70px;height:70px}
|
|
.slide-title .deco-star-3{top:18%;right:8%;width:80px;height:80px}
|
|
|
|
/* ========================================
|
|
SLIDE 2 — Welcome
|
|
======================================== */
|
|
.slide-welcome{background:var(--cream)}
|
|
.welcome-frame{width:100%;max-width:880px;position:relative;z-index:2}
|
|
.welcome-header{background:var(--mint);border:var(--border-width) solid var(--border);border-bottom:none;border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:18px 32px;text-align:center}
|
|
.welcome-header h2{font-size:clamp(1.4rem,2.5vw,2rem);color:var(--text-dark)}
|
|
.welcome-body{background:#fff;border:var(--border-width) solid var(--border);border-radius:0 0 var(--radius-lg) var(--radius-lg);padding:36px 48px;box-shadow:var(--shadow)}
|
|
.welcome-list{list-style:none;display:flex;flex-direction:column;gap:18px}
|
|
.welcome-list li{font-size:clamp(.95rem,1.4vw,1.15rem);font-weight:600;padding-left:36px;position:relative;line-height:1.5}
|
|
.welcome-list li::before{content:"";position:absolute;left:0;top:4px;width:20px;height:20px;background:var(--butter);border:2px solid var(--border);border-radius:50%}
|
|
|
|
.slide-welcome .deco-sun{top:6%;left:4%;width:140px;height:140px}
|
|
.slide-welcome .deco-rainbow{bottom:4%;right:3%;width:180px;height:130px}
|
|
.slide-welcome .deco-star-1{top:14%;right:7%;width:75px;height:75px}
|
|
.slide-welcome .deco-star-2{bottom:16%;left:6%;width:60px;height:60px}
|
|
|
|
/* ========================================
|
|
SLIDE 3 — Weekly
|
|
======================================== */
|
|
.slide-weekly{background:var(--turquoise);padding:30px 40px}
|
|
.slide-weekly h2{text-align:center;color:#fff;text-shadow:3px 3px 0 var(--border);margin-bottom:28px;font-size:clamp(1.8rem,3.5vw,3rem);position:relative;z-index:2}
|
|
.weekly-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;width:100%;max-width:1100px;z-index:2;position:relative}
|
|
.day-card{background:#fff;border:var(--border-width) solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
|
|
.day-header{padding:10px 8px;text-align:center;font-family:var(--font-display);font-size:clamp(.85rem,1.3vw,1.1rem);border-bottom:var(--border-width) solid var(--border)}
|
|
.day-header.pink{background:var(--soft-pink)}.day-header.green{background:var(--mint)}.day-header.coral{background:var(--coral);color:#fff}.day-header.yellow{background:var(--butter)}.day-header.lavender{background:var(--lavender)}
|
|
.day-body{padding:14px 16px}
|
|
.day-body ul{list-style:none;display:flex;flex-direction:column;gap:8px}
|
|
.day-body li{font-size:clamp(.8rem,1.1vw,.95rem);font-weight:600;padding-left:14px;position:relative;line-height:1.4}
|
|
.day-body li::before{content:"-";position:absolute;left:0;color:var(--text-muted)}
|
|
|
|
.slide-weekly .deco-daisy-tl{top:-20px;left:-25px;width:160px;height:160px}
|
|
.slide-weekly .deco-daisy-br{bottom:-25px;right:-20px;width:170px;height:170px}
|
|
.slide-weekly .deco-star-1{bottom:10%;left:3%;width:80px;height:80px}
|
|
.slide-weekly .deco-star-2{bottom:5%;left:10%;width:50px;height:50px}
|
|
|
|
/* ========================================
|
|
SLIDE 4 — Timeline
|
|
======================================== */
|
|
.slide-timeline{background:var(--soft-pink)}
|
|
.slide-timeline h2{text-align:center;color:#fff;text-shadow:3px 3px 0 rgba(0,0,0,.2);margin-bottom:32px;z-index:2;position:relative}
|
|
.timeline-wrap{display:flex;flex-direction:column;gap:18px;width:100%;max-width:700px;z-index:2;position:relative}
|
|
.timeline-row{display:flex;align-items:center;gap:20px}
|
|
.timeline-dot{width:48px;height:48px;border-radius:50%;border:var(--border-width) solid var(--border);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:1.1rem;color:#fff}
|
|
.timeline-dot.d1{background:var(--coral)}.timeline-dot.d2{background:var(--mint)}.timeline-dot.d3{background:var(--sky)}.timeline-dot.d4{background:var(--lavender)}.timeline-dot.d5{background:var(--butter);color:var(--text-dark)}
|
|
.timeline-card{flex:1;background:#fff;border:var(--border-width) solid var(--border);border-radius:var(--radius);padding:16px 24px;box-shadow:var(--shadow-sm)}
|
|
.timeline-card h4{margin-bottom:4px;font-size:1.1rem}.timeline-card p{font-size:.9rem;color:var(--text-muted);font-weight:500}
|
|
|
|
.slide-timeline .deco-cloud{top:6%;right:5%;width:160px;height:160px}
|
|
.slide-timeline .deco-cloud-2{bottom:10%;left:3%;width:130px;height:130px}
|
|
.slide-timeline .deco-star-1{top:14%;left:6%;width:70px;height:70px}
|
|
.slide-timeline .deco-daisy{bottom:5%;right:5%;width:120px;height:120px}
|
|
|
|
/* ========================================
|
|
SLIDE 5 — Bar Chart
|
|
======================================== */
|
|
.slide-chart-bar{background:var(--butter)}
|
|
.slide-chart-bar h2{text-align:center;margin-bottom:36px;z-index:2;position:relative}
|
|
.chart-container{background:#fff;border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);padding:32px 40px;box-shadow:var(--shadow);width:100%;max-width:800px;z-index:2;position:relative}
|
|
.chart-svg{width:100%;height:auto}
|
|
.chart-legend{display:flex;justify-content:center;gap:24px;margin-top:16px;flex-wrap:wrap}
|
|
.legend-item{display:flex;align-items:center;gap:8px;font-weight:600;font-size:.9rem}
|
|
.legend-swatch{width:18px;height:18px;border:2px solid var(--border);border-radius:4px}
|
|
|
|
.slide-chart-bar .deco-star-1{top:6%;left:5%;width:80px;height:80px}
|
|
.slide-chart-bar .deco-star-2{top:12%;right:7%;width:60px;height:60px}
|
|
.slide-chart-bar .deco-daisy{bottom:5%;left:4%;width:140px;height:140px}
|
|
.slide-chart-bar .deco-cloud{bottom:7%;right:5%;width:150px;height:150px}
|
|
|
|
/* ========================================
|
|
SLIDE 6 — Info Cards
|
|
======================================== */
|
|
.slide-cards{background:var(--cream)}
|
|
.slide-cards h2{text-align:center;margin-bottom:32px;z-index:2;position:relative}
|
|
.cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;width:100%;max-width:800px;z-index:2;position:relative}
|
|
.info-card{background:#fff;border:var(--border-width) solid var(--border);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:10px}
|
|
.info-card .card-icon{width:44px;height:44px;border-radius:50%;border:var(--border-width) solid var(--border);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:1.2rem;margin-bottom:4px}
|
|
.info-card .card-icon.i1{background:var(--soft-pink)}.info-card .card-icon.i2{background:var(--mint)}.info-card .card-icon.i3{background:var(--sky)}.info-card .card-icon.i4{background:var(--lavender)}
|
|
.info-card h4{font-size:1.15rem}.info-card p{font-size:.88rem;color:var(--text-muted);font-weight:500;line-height:1.5}
|
|
|
|
.slide-cards .deco-rainbow{top:4%;right:3%;width:160px;height:116px}
|
|
.slide-cards .deco-daisy-tl{top:-15px;left:-15px;width:140px;height:140px}
|
|
.slide-cards .deco-star-1{bottom:10%;left:4%;width:70px;height:70px}
|
|
.slide-cards .deco-sun{bottom:4%;right:4%;width:120px;height:120px}
|
|
|
|
/* ========================================
|
|
SLIDE 7 — Quote
|
|
======================================== */
|
|
.slide-quote{background:var(--lavender)}
|
|
.quote-box{background:#fff;border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);padding:48px 56px;box-shadow:var(--shadow);max-width:750px;width:100%;text-align:center;z-index:2;position:relative}
|
|
.quote-mark{font-family:var(--font-display);font-size:4rem;line-height:1;color:var(--soft-pink);margin-bottom:8px}
|
|
.quote-text{font-family:var(--font-display);font-size:clamp(1.3rem,2.5vw,2rem);line-height:1.35;color:var(--text-dark);margin-bottom:20px}
|
|
.quote-author{font-weight:700;font-size:1rem;color:var(--text-muted)}
|
|
|
|
.slide-quote .deco-daisy-tl{top:4%;left:4%;width:150px;height:150px}
|
|
.slide-quote .deco-daisy-br{bottom:4%;right:4%;width:160px;height:160px}
|
|
.slide-quote .deco-star-1{top:10%;right:12%;width:75px;height:75px}
|
|
.slide-quote .deco-star-2{bottom:16%;left:8%;width:60px;height:60px}
|
|
.slide-quote .deco-rainbow{top:6%;right:3%;width:140px;height:102px}
|
|
|
|
/* ========================================
|
|
SLIDE 8 — Team
|
|
======================================== */
|
|
.slide-team{background:var(--mint)}
|
|
.slide-team h2{text-align:center;color:#fff;text-shadow:3px 3px 0 rgba(0,0,0,.15);margin-bottom:36px;z-index:2;position:relative}
|
|
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;width:100%;max-width:900px;z-index:2;position:relative}
|
|
.team-member{display:flex;flex-direction:column;align-items:center;gap:12px}
|
|
.team-avatar{width:100px;height:100px;border-radius:50%;border:var(--border-width) solid var(--border);background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);overflow:hidden}
|
|
.team-avatar svg{width:70%;height:70%}
|
|
.team-name{font-family:var(--font-display);font-size:1rem;text-align:center}
|
|
.team-role{font-size:.8rem;font-weight:600;color:var(--text-muted);text-align:center}
|
|
|
|
.slide-team .deco-daisy-tl{top:-10px;left:-10px;width:150px;height:150px}
|
|
.slide-team .deco-daisy-tr{top:10px;right:-15px;width:140px;height:140px}
|
|
.slide-team .deco-star-1{bottom:10%;left:5%;width:70px;height:70px}
|
|
.slide-team .deco-star-2{bottom:6%;right:6%;width:55px;height:55px}
|
|
|
|
/* ========================================
|
|
SLIDE 9 — Process
|
|
======================================== */
|
|
.slide-process{background:var(--peach)}
|
|
.slide-process h2{text-align:center;margin-bottom:40px;z-index:2;position:relative}
|
|
.process-flow{display:flex;align-items:flex-start;justify-content:center;gap:16px;width:100%;max-width:950px;z-index:2;position:relative}
|
|
.process-step{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
|
|
.process-arrow{font-family:var(--font-display);font-size:2rem;color:var(--border);margin-top:30px;flex-shrink:0}
|
|
.step-circle{width:90px;height:90px;border-radius:50%;border:var(--border-width) solid var(--border);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:2rem;color:#fff;box-shadow:var(--shadow-sm);flex-shrink:0}
|
|
.step-circle.s1{background:var(--coral)}.step-circle.s2{background:var(--turquoise)}.step-circle.s3{background:var(--lavender)}
|
|
.step-title{font-family:var(--font-display);font-size:1.1rem}
|
|
.step-desc{font-size:.85rem;font-weight:600;color:var(--text-muted);line-height:1.45;max-width:200px}
|
|
|
|
.slide-process .deco-cloud{top:6%;left:4%;width:150px;height:150px}
|
|
.slide-process .deco-cloud-2{top:10%;right:5%;width:120px;height:120px}
|
|
.slide-process .deco-star-1{bottom:10%;left:7%;width:70px;height:70px}
|
|
.slide-process .deco-daisy{bottom:4%;right:4%;width:150px;height:150px}
|
|
|
|
/* ========================================
|
|
SLIDE 10 — Donut Chart
|
|
======================================== */
|
|
.slide-donut{background:var(--sky)}
|
|
.donut-wrap{display:flex;align-items:center;gap:48px;width:100%;max-width:850px;z-index:2;position:relative}
|
|
.donut-chart-box{flex-shrink:0;width:280px;height:280px}
|
|
.donut-chart-box svg{width:100%;height:100%}
|
|
.donut-legend-side{display:flex;flex-direction:column;gap:14px}
|
|
.donut-legend-side h3{margin-bottom:8px}
|
|
.d-legend-item{display:flex;align-items:center;gap:12px;font-weight:600;font-size:.95rem}
|
|
.d-legend-swatch{width:22px;height:22px;border:2px solid var(--border);border-radius:5px;flex-shrink:0}
|
|
|
|
.slide-donut .deco-daisy-tl{top:-10px;left:-10px;width:160px;height:160px}
|
|
.slide-donut .deco-daisy-br{bottom:-10px;right:-10px;width:170px;height:170px}
|
|
.slide-donut .deco-star-1{top:10%;right:7%;width:75px;height:75px}
|
|
.slide-donut .deco-star-2{bottom:14%;left:5%;width:60px;height:60px}
|
|
|
|
/* ========================================
|
|
Responsive
|
|
======================================== */
|
|
@media(max-width:768px){
|
|
.slide{padding:24px 20px}
|
|
.weekly-grid{grid-template-columns:repeat(3,1fr)}
|
|
.team-grid{grid-template-columns:repeat(2,1fr)}
|
|
.cards-grid{grid-template-columns:1fr}
|
|
.process-flow{flex-direction:column;align-items:center}
|
|
.process-arrow{transform:rotate(90deg);margin:0}
|
|
.donut-wrap{flex-direction:column;align-items:center}
|
|
.donut-chart-box{width:200px;height:200px}
|
|
.nav-dots{display:none}
|
|
.deco{opacity:.6}
|
|
}
|
|
@media(max-width:480px){
|
|
.weekly-grid{grid-template-columns:repeat(2,1fr)}
|
|
.deco{opacity:.4}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="slides-container" id="slideContainer">
|
|
|
|
<!-- ====== SLIDE 1: Title ====== -->
|
|
<section class="slide slide-title" id="slide-1">
|
|
<div class="deco deco-daisy-tl"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-daisy-tr"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-daisy-bl"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-daisy-br"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-star-1"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#FBB0C7" stroke="#000" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-star-2"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#FDE366" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-star-3"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#A8E6CF" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
|
|
<div class="title-box">
|
|
<h1>Daisy Days</h1>
|
|
<p class="subtitle">A cheerful presentation template for bright moments</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ====== SLIDE 2: Welcome ====== -->
|
|
<section class="slide slide-welcome" id="slide-2">
|
|
<div class="deco deco-sun"><svg viewBox="0 0 120 120"><circle cx="60" cy="60" r="26" fill="#FFCD57" stroke="#2D2D2D" stroke-width="2.8"/><g stroke="#2D2D2D" stroke-width="2.8" stroke-linecap="round"><line x1="60" y1="10" x2="60" y2="24"/><line x1="60" y1="96" x2="60" y2="110"/><line x1="10" y1="60" x2="24" y2="60"/><line x1="96" y1="60" x2="110" y2="60"/><line x1="24.5" y1="24.5" x2="34" y2="34"/><line x1="86" y1="86" x2="95.5" y2="95.5"/><line x1="24.5" y1="95.5" x2="34" y2="86"/><line x1="86" y1="34" x2="95.5" y2="24.5"/></g><circle cx="51" cy="55" r="3" fill="#2D2D2D"/><circle cx="69" cy="55" r="3" fill="#2D2D2D"/><path d="M 50 68 Q 60 76 70 68" fill="none" stroke="#2D2D2D" stroke-width="2.8" stroke-linecap="round"/></svg></div>
|
|
<div class="deco deco-rainbow"><svg viewBox="0 0 140 101.4" xmlns="http://www.w3.org/2000/svg"><style>.rb1{fill:#F8635F;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}.rb2{fill:#FDE366;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}.rb3{fill:#8DE3B7;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}.rb4{fill:#85C5FE;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}</style><path class="rb1" d="M130 95c0-35-25.5-63.5-60-63.5S10 60 10 95"/><path class="rb2" d="M115 95c0-26.2-19-48.5-45-48.5S25 68.8 25 95"/><path class="rb3" d="M100 95c0-17.5-12.8-33.5-30-33.5S40 77.5 40 95"/><path class="rb4" d="M85 95c0-8.8-6.3-18.5-15-18.5S55 86.2 55 95"/></svg></div>
|
|
<div class="deco deco-star-1"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#FBB0C7" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-star-2"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#D4A5E8" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
|
|
<div class="welcome-frame">
|
|
<div class="welcome-header"><h2>Welcome to Today</h2></div>
|
|
<div class="welcome-body">
|
|
<ul class="welcome-list">
|
|
<li>Review the materials on your desk</li>
|
|
<li>Prepare your notes and supplies</li>
|
|
<li>Take a moment to settle in comfortably</li>
|
|
<li>Reach out if you need any assistance</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ====== SLIDE 3: Weekly ====== -->
|
|
<section class="slide slide-weekly" id="slide-3">
|
|
<div class="deco deco-daisy-tl"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-daisy-br"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-star-1"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#FDE366" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-star-2"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#FFFFFF" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
|
|
<h2>A Look at the Week</h2>
|
|
<div class="weekly-grid">
|
|
<div class="day-card"><div class="day-header pink">Monday</div><div class="day-body"><ul><li>Reading</li><li>Writing</li><li>Numbers</li><li>Science</li><li>Art Studio</li></ul></div></div>
|
|
<div class="day-card"><div class="day-header green">Tuesday</div><div class="day-body"><ul><li>Reading</li><li>Numbers</li><li>History</li><li>Crafts</li><li>Games</li></ul></div></div>
|
|
<div class="day-card"><div class="day-header coral">Wednesday</div><div class="day-body"><ul><li>Reading</li><li>Numbers</li><li>Science</li><li>Music</li><li>Library</li></ul></div></div>
|
|
<div class="day-card"><div class="day-header yellow">Thursday</div><div class="day-body"><ul><li>Reading</li><li>Numbers</li><li>Projects</li><li>Skills</li><li>Art Studio</li></ul></div></div>
|
|
<div class="day-card"><div class="day-header lavender">Friday</div><div class="day-body"><ul><li>Reading</li><li>Numbers</li><li>Review</li><li>Nature</li><li>Garden</li></ul></div></div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ====== SLIDE 4: Timeline ====== -->
|
|
<section class="slide slide-timeline" id="slide-4">
|
|
<div class="deco deco-cloud"><svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg"><style>.cl0{fill:#C6E3F6;}.cl1{fill:none;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cl2{fill:#fff;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cl2" d="m106.8 57.3c-.3 0 0 0 0 0 1.7 0 2.8.1 3.8.3.2-1 .3-2 .3-3.1 0-7.2-6.3-16.3-15.5-16.3-2 0-3.9.4-6.2 1.1-2.2-6.2-9.3-16-23.8-16-10 0-18.8 5.8-23 15-1.9-.7-4.1-1.1-6.7-1.1-10.1 0-19.2 8.3-19.2 19.6 0 1.3.2 2.6.4 4.3-7.6 1.5-14.2 8.2-14.2 17.7 0 8.4 6.4 18.9 17.4 18.9 2.2 0 3.8-.1 5.5-.7l27.3 2.6 48.1-4.7c1.9.5 3.8.8 6.2.8 11.3 0 18.2-9 18.2-19.7 0-7.8-6.4-17.4-15-18.4l-3.6-.3z"/><path class="cl0" d="m123.7 70.6c-1.4 6.3-6.6 14.5-17.8 14.6-1 0-1.9-.1-2.8-.2l-1.6.9c-2.9 2.8-6.9 5.3-12.5 5.3-2.1 0-4.4-.3-6.4-1.1-.5-.2-1.2-.1-1.6.2-2.1 1.6-7.4 5.2-14.8 5.2-5.1 0-10.5-1.9-15.2-5.5-.8-1.1-2.3-1.1-2.4.6-2 4-14.5 7.7-23-3.8-.5-1.2-2.1-1.4-2.3.6-8.8 1-16.3-2.3-19.6-10.6-1.4 5.3 1.5 20.3 16 20.2 2.2 0 4.2-.1 5.9-.6l28.3 4.2c3-1.5 4.2 4.3 12.6 4 6.1-.2 11.1-2 14.2-5.6 2 .6 3.9 1.6 7.7 1.6 5 0 9.5-1.5 12.5-5.6l3.5.4c1 .2 2 .2 3 .2 11.2 0 19.2-10 17.2-21.6l-.9-3.4z"/><path class="cl0" d="m31.7 65.4c1.7-4.3 5.9-7.8 12.7-7.8 1.7 0 3.5.3 5.1.8l-2.6 5c-1.3-.8-2.8-2.4-7-2-3.2.2-6.3 2.2-8.2 4z"/><path class="cl0" d="m82.5 58.7 2.1 4.9c1.3-.7 3-1.5 6-1.5s5.9 1.5 7.5 3.5c-1-4-5.2-7.5-11-7.5l-4.6.6z"/><path class="cl0" d="m90.1 39.4.5 5.7c1.9-1.4 6-4.7 8.5-5.5-3-1.5-6.6-1-9-.2z"/><path class="cl1" d="m23.4 50.9c1.5-2.9 5-7.3 11.2-7.8"/><path class="cl1" d="m50.4 35.8c2.5-2.9 8-7.1 16.5-6.7"/><path class="cl1" d="m71 29.8 1.3.3"/><path class="cl1" d="m68.7 58.1c3.2.5 6.4 2.4 9 5.2"/><path class="cl1" d="m112.6 63.7c2.8 1.2 6.3 4.9 7 9.3"/></svg></div>
|
|
<div class="deco deco-cloud-2"><svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg"><style>.cl0{fill:#C6E3F6;}.cl1{fill:none;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cl2{fill:#fff;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cl2" d="m106.8 57.3c-.3 0 0 0 0 0 1.7 0 2.8.1 3.8.3.2-1 .3-2 .3-3.1 0-7.2-6.3-16.3-15.5-16.3-2 0-3.9.4-6.2 1.1-2.2-6.2-9.3-16-23.8-16-10 0-18.8 5.8-23 15-1.9-.7-4.1-1.1-6.7-1.1-10.1 0-19.2 8.3-19.2 19.6 0 1.3.2 2.6.4 4.3-7.6 1.5-14.2 8.2-14.2 17.7 0 8.4 6.4 18.9 17.4 18.9 2.2 0 3.8-.1 5.5-.7l27.3 2.6 48.1-4.7c1.9.5 3.8.8 6.2.8 11.3 0 18.2-9 18.2-19.7 0-7.8-6.4-17.4-15-18.4l-3.6-.3z"/><path class="cl0" d="m123.7 70.6c-1.4 6.3-6.6 14.5-17.8 14.6-1 0-1.9-.1-2.8-.2l-1.6.9c-2.9 2.8-6.9 5.3-12.5 5.3-2.1 0-4.4-.3-6.4-1.1-.5-.2-1.2-.1-1.6.2-2.1 1.6-7.4 5.2-14.8 5.2-5.1 0-10.5-1.9-15.2-5.5-.8-1.1-2.3-1.1-2.4.6-2 4-14.5 7.7-23-3.8-.5-1.2-2.1-1.4-2.3.6-8.8 1-16.3-2.3-19.6-10.6-1.4 5.3 1.5 20.3 16 20.2 2.2 0 4.2-.1 5.9-.6l28.3 4.2c3-1.5 4.2 4.3 12.6 4 6.1-.2 11.1-2 14.2-5.6 2 .6 3.9 1.6 7.7 1.6 5 0 9.5-1.5 12.5-5.6l3.5.4c1 .2 2 .2 3 .2 11.2 0 19.2-10 17.2-21.6l-.9-3.4z"/><path class="cl0" d="m31.7 65.4c1.7-4.3 5.9-7.8 12.7-7.8 1.7 0 3.5.3 5.1.8l-2.6 5c-1.3-.8-2.8-2.4-7-2-3.2.2-6.3 2.2-8.2 4z"/><path class="cl0" d="m82.5 58.7 2.1 4.9c1.3-.7 3-1.5 6-1.5s5.9 1.5 7.5 3.5c-1-4-5.2-7.5-11-7.5l-4.6.6z"/><path class="cl0" d="m90.1 39.4.5 5.7c1.9-1.4 6-4.7 8.5-5.5-3-1.5-6.6-1-9-.2z"/><path class="cl1" d="m23.4 50.9c1.5-2.9 5-7.3 11.2-7.8"/><path class="cl1" d="m50.4 35.8c2.5-2.9 8-7.1 16.5-6.7"/><path class="cl1" d="m71 29.8 1.3.3"/><path class="cl1" d="m68.7 58.1c3.2.5 6.4 2.4 9 5.2"/><path class="cl1" d="m112.6 63.7c2.8 1.2 6.3 4.9 7 9.3"/></svg></div>
|
|
<div class="deco deco-star-1"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#FDE366" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-daisy"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
|
|
<h2>Today's Schedule</h2>
|
|
<div class="timeline-wrap">
|
|
<div class="timeline-row"><div class="timeline-dot d1">1</div><div class="timeline-card"><h4>Morning Gathering</h4><p>Welcome circle and daily intentions</p></div></div>
|
|
<div class="timeline-row"><div class="timeline-dot d2">2</div><div class="timeline-card"><h4>Learning Block</h4><p>Core concepts and guided practice</p></div></div>
|
|
<div class="timeline-row"><div class="timeline-dot d3">3</div><div class="timeline-card"><h4>Creative Time</h4><p>Hands-on projects and exploration</p></div></div>
|
|
<div class="timeline-row"><div class="timeline-dot d4">4</div><div class="timeline-card"><h4>Break</h4><p>Refreshments and outdoor play</p></div></div>
|
|
<div class="timeline-row"><div class="timeline-dot d5">5</div><div class="timeline-card"><h4>Reflection</h4><p>Share learnings and closing circle</p></div></div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ====== SLIDE 5: Bar Chart ====== -->
|
|
<section class="slide slide-chart-bar" id="slide-5">
|
|
<div class="deco deco-star-1"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#F7C8D4" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-star-2"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#A8E6CF" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-daisy"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-cloud"><svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg"><style>.cl0{fill:#C6E3F6;}.cl1{fill:none;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cl2{fill:#fff;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cl2" d="m106.8 57.3c-.3 0 0 0 0 0 1.7 0 2.8.1 3.8.3.2-1 .3-2 .3-3.1 0-7.2-6.3-16.3-15.5-16.3-2 0-3.9.4-6.2 1.1-2.2-6.2-9.3-16-23.8-16-10 0-18.8 5.8-23 15-1.9-.7-4.1-1.1-6.7-1.1-10.1 0-19.2 8.3-19.2 19.6 0 1.3.2 2.6.4 4.3-7.6 1.5-14.2 8.2-14.2 17.7 0 8.4 6.4 18.9 17.4 18.9 2.2 0 3.8-.1 5.5-.7l27.3 2.6 48.1-4.7c1.9.5 3.8.8 6.2.8 11.3 0 18.2-9 18.2-19.7 0-7.8-6.4-17.4-15-18.4l-3.6-.3z"/><path class="cl0" d="m123.7 70.6c-1.4 6.3-6.6 14.5-17.8 14.6-1 0-1.9-.1-2.8-.2l-1.6.9c-2.9 2.8-6.9 5.3-12.5 5.3-2.1 0-4.4-.3-6.4-1.1-.5-.2-1.2-.1-1.6.2-2.1 1.6-7.4 5.2-14.8 5.2-5.1 0-10.5-1.9-15.2-5.5-.8-1.1-2.3-1.1-2.4.6-2 4-14.5 7.7-23-3.8-.5-1.2-2.1-1.4-2.3.6-8.8 1-16.3-2.3-19.6-10.6-1.4 5.3 1.5 20.3 16 20.2 2.2 0 4.2-.1 5.9-.6l28.3 4.2c3-1.5 4.2 4.3 12.6 4 6.1-.2 11.1-2 14.2-5.6 2 .6 3.9 1.6 7.7 1.6 5 0 9.5-1.5 12.5-5.6l3.5.4c1 .2 2 .2 3 .2 11.2 0 19.2-10 17.2-21.6l-.9-3.4z"/><path class="cl0" d="m31.7 65.4c1.7-4.3 5.9-7.8 12.7-7.8 1.7 0 3.5.3 5.1.8l-2.6 5c-1.3-.8-2.8-2.4-7-2-3.2.2-6.3 2.2-8.2 4z"/><path class="cl0" d="m82.5 58.7 2.1 4.9c1.3-.7 3-1.5 6-1.5s5.9 1.5 7.5 3.5c-1-4-5.2-7.5-11-7.5l-4.6.6z"/><path class="cl0" d="m90.1 39.4.5 5.7c1.9-1.4 6-4.7 8.5-5.5-3-1.5-6.6-1-9-.2z"/><path class="cl1" d="m23.4 50.9c1.5-2.9 5-7.3 11.2-7.8"/><path class="cl1" d="m50.4 35.8c2.5-2.9 8-7.1 16.5-6.7"/><path class="cl1" d="m71 29.8 1.3.3"/><path class="cl1" d="m68.7 58.1c3.2.5 6.4 2.4 9 5.2"/><path class="cl1" d="m112.6 63.7c2.8 1.2 6.3 4.9 7 9.3"/></svg></div>
|
|
|
|
<h2>Activity Breakdown</h2>
|
|
<div class="chart-container">
|
|
<svg class="chart-svg" viewBox="0 0 700 300" xmlns="http://www.w3.org/2000/svg">
|
|
<line x1="70" y1="250" x2="660" y2="250" stroke="#2D2D2D" stroke-width="2"/><line x1="70" y1="20" x2="70" y2="250" stroke="#2D2D2D" stroke-width="2"/>
|
|
<line x1="70" y1="200" x2="660" y2="200" stroke="#E0E0E0" stroke-width="1"/><line x1="70" y1="150" x2="660" y2="150" stroke="#E0E0E0" stroke-width="1"/><line x1="70" y1="100" x2="660" y2="100" stroke="#E0E0E0" stroke-width="1"/><line x1="70" y1="50" x2="660" y2="50" stroke="#E0E0E0" stroke-width="1"/>
|
|
<text x="60" y="255" text-anchor="end" font-family="Quicksand" font-size="11" fill="#6B6B6B" font-weight="600">0</text><text x="60" y="205" text-anchor="end" font-family="Quicksand" font-size="11" fill="#6B6B6B" font-weight="600">25</text><text x="60" y="155" text-anchor="end" font-family="Quicksand" font-size="11" fill="#6B6B6B" font-weight="600">50</text><text x="60" y="105" text-anchor="end" font-family="Quicksand" font-size="11" fill="#6B6B6B" font-weight="600">75</text><text x="60" y="55" text-anchor="end" font-family="Quicksand" font-size="11" fill="#6B6B6B" font-weight="600">100</text>
|
|
<rect x="95" y="90" width="65" height="160" rx="8" fill="#F8635F" stroke="#2D2D2D" stroke-width="2"/><rect x="195" y="130" width="65" height="120" rx="8" fill="#8DE3B7" stroke="#2D2D2D" stroke-width="2"/><rect x="295" y="60" width="65" height="190" rx="8" fill="#85C5FE" stroke="#2D2D2D" stroke-width="2"/><rect x="395" y="110" width="65" height="140" rx="8" fill="#FDE366" stroke="#2D2D2D" stroke-width="2"/><rect x="495" y="150" width="65" height="100" rx="8" fill="#D4A5E8" stroke="#2D2D2D" stroke-width="2"/><rect x="595" y="80" width="65" height="170" rx="8" fill="#F7C8D4" stroke="#2D2D2D" stroke-width="2"/>
|
|
<text x="127" y="82" text-anchor="middle" font-family="Fredoka One" font-size="13" fill="#2D2D2D">80</text><text x="227" y="122" text-anchor="middle" font-family="Fredoka One" font-size="13" fill="#2D2D2D">60</text><text x="327" y="52" text-anchor="middle" font-family="Fredoka One" font-size="13" fill="#2D2D2D">95</text><text x="427" y="102" text-anchor="middle" font-family="Fredoka One" font-size="13" fill="#2D2D2D">70</text><text x="527" y="142" text-anchor="middle" font-family="Fredoka One" font-size="13" fill="#2D2D2D">50</text><text x="627" y="72" text-anchor="middle" font-family="Fredoka One" font-size="13" fill="#2D2D2D">85</text>
|
|
<text x="127" y="270" text-anchor="middle" font-family="Quicksand" font-size="11" fill="#2D2D2D" font-weight="700">Reading</text><text x="227" y="270" text-anchor="middle" font-family="Quicksand" font-size="11" fill="#2D2D2D" font-weight="700">Writing</text><text x="327" y="270" text-anchor="middle" font-family="Quicksand" font-size="11" fill="#2D2D2D" font-weight="700">Science</text><text x="427" y="270" text-anchor="middle" font-family="Quicksand" font-size="11" fill="#2D2D2D" font-weight="700">Art</text><text x="527" y="270" text-anchor="middle" font-family="Quicksand" font-size="11" fill="#2D2D2D" font-weight="700">Music</text><text x="627" y="270" text-anchor="middle" font-family="Quicksand" font-size="11" fill="#2D2D2D" font-weight="700">Games</text>
|
|
</svg>
|
|
<div class="chart-legend">
|
|
<div class="legend-item"><span class="legend-swatch" style="background:#F8635F"></span>Reading</div>
|
|
<div class="legend-item"><span class="legend-swatch" style="background:#8DE3B7"></span>Writing</div>
|
|
<div class="legend-item"><span class="legend-swatch" style="background:#85C5FE"></span>Science</div>
|
|
<div class="legend-item"><span class="legend-swatch" style="background:#FDE366"></span>Art</div>
|
|
<div class="legend-item"><span class="legend-swatch" style="background:#D4A5E8"></span>Music</div>
|
|
<div class="legend-item"><span class="legend-swatch" style="background:#F7C8D4"></span>Games</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- ====== SLIDE 6: Info Cards ====== -->
|
|
<section class="slide slide-cards" id="slide-6">
|
|
<div class="deco deco-rainbow"><svg viewBox="0 0 140 101.4" xmlns="http://www.w3.org/2000/svg"><style>.rb1{fill:#F8635F;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}.rb2{fill:#FDE366;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}.rb3{fill:#8DE3B7;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}.rb4{fill:#85C5FE;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}</style><path class="rb1" d="M130 95c0-35-25.5-63.5-60-63.5S10 60 10 95"/><path class="rb2" d="M115 95c0-26.2-19-48.5-45-48.5S25 68.8 25 95"/><path class="rb3" d="M100 95c0-17.5-12.8-33.5-30-33.5S40 77.5 40 95"/><path class="rb4" d="M85 95c0-8.8-6.3-18.5-15-18.5S55 86.2 55 95"/></svg></div>
|
|
<div class="deco deco-daisy-tl"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-star-1"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#D4A5E8" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-sun"><svg viewBox="0 0 120 120"><circle cx="60" cy="60" r="26" fill="#FFCD57" stroke="#2D2D2D" stroke-width="2.8"/><g stroke="#2D2D2D" stroke-width="2.8" stroke-linecap="round"><line x1="60" y1="10" x2="60" y2="24"/><line x1="60" y1="96" x2="60" y2="110"/><line x1="10" y1="60" x2="24" y2="60"/><line x1="96" y1="60" x2="110" y2="60"/><line x1="24.5" y1="24.5" x2="34" y2="34"/><line x1="86" y1="86" x2="95.5" y2="95.5"/><line x1="24.5" y1="95.5" x2="34" y2="86"/><line x1="86" y1="34" x2="95.5" y2="24.5"/></g><circle cx="51" cy="55" r="3" fill="#2D2D2D"/><circle cx="69" cy="55" r="3" fill="#2D2D2D"/><path d="M 50 68 Q 60 76 70 68" fill="none" stroke="#2D2D2D" stroke-width="2.8" stroke-linecap="round"/></svg></div>
|
|
|
|
<h2>Key Focus Areas</h2>
|
|
<div class="cards-grid">
|
|
<div class="info-card"><div class="card-icon i1">A</div><h4>Creative Expression</h4><p>Explore imagination through hands-on activities and open-ended projects that inspire original thinking.</p></div>
|
|
<div class="info-card"><div class="card-icon i2">B</div><h4>Critical Thinking</h4><p>Develop problem-solving skills with guided challenges that encourage analysis and reasoning.</p></div>
|
|
<div class="info-card"><div class="card-icon i3">C</div><h4>Collaboration</h4><p>Build teamwork through group activities that foster communication and shared discovery.</p></div>
|
|
<div class="info-card"><div class="card-icon i4">D</div><h4>Curiosity & Wonder</h4><p>Nurture a love of learning with explorations that spark questions and joyful discovery.</p></div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ====== SLIDE 7: Quote ====== -->
|
|
<section class="slide slide-quote" id="slide-7">
|
|
<div class="deco deco-daisy-tl"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-daisy-br"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-star-1" style="top:8%;right:18%;"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#FDE366" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-star-2"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#F7C8D4" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-rainbow" style="top:6%;right:3%;"><svg viewBox="0 0 140 101.4" xmlns="http://www.w3.org/2000/svg"><style>.rb1{fill:#F8635F;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}.rb2{fill:#FDE366;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}.rb3{fill:#8DE3B7;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}.rb4{fill:#85C5FE;stroke:#1E1E1C;stroke-width:1.6;stroke-miterlimit:10;}</style><path class="rb1" d="M130 95c0-35-25.5-63.5-60-63.5S10 60 10 95"/><path class="rb2" d="M115 95c0-26.2-19-48.5-45-48.5S25 68.8 25 95"/><path class="rb3" d="M100 95c0-17.5-12.8-33.5-30-33.5S40 77.5 40 95"/><path class="rb4" d="M85 95c0-8.8-6.3-18.5-15-18.5S55 86.2 55 95"/></svg></div>
|
|
|
|
<div class="quote-box">
|
|
<div class="quote-mark">“</div>
|
|
<p class="quote-text">Every day is a fresh beginning. Every moment is a new chance to learn, grow, and discover something wonderful.</p>
|
|
<p class="quote-author">- A Wise Educator</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ====== SLIDE 8: Team ====== -->
|
|
<section class="slide slide-team" id="slide-8">
|
|
<div class="deco deco-daisy-tl"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-daisy-tr"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-star-1"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#fff" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-star-2"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#FDE366" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
|
|
<h2>Our Team</h2>
|
|
<div class="team-grid">
|
|
<div class="team-member"><div class="team-avatar"><svg viewBox="0 0 100 100"><circle cx="50" cy="36" r="18" fill="#F7C8D4" stroke="#2D2D2D" stroke-width="2.5"/><ellipse cx="50" cy="82" rx="28" ry="22" fill="#85C5FE" stroke="#2D2D2D" stroke-width="2.5"/><circle cx="44" cy="34" r="2" fill="#2D2D2D"/><circle cx="56" cy="34" r="2" fill="#2D2D2D"/><path d="M 45 42 Q 50 46 55 42" fill="none" stroke="#2D2D2D" stroke-width="2" stroke-linecap="round"/></svg></div><div class="team-name">Alex Rivera</div><div class="team-role">Lead Guide</div></div>
|
|
<div class="team-member"><div class="team-avatar"><svg viewBox="0 0 100 100"><circle cx="50" cy="36" r="18" fill="#FFCD57" stroke="#2D2D2D" stroke-width="2.5"/><ellipse cx="50" cy="82" rx="28" ry="22" fill="#A8E6CF" stroke="#2D2D2D" stroke-width="2.5"/><circle cx="44" cy="34" r="2" fill="#2D2D2D"/><circle cx="56" cy="34" r="2" fill="#2D2D2D"/><path d="M 45 42 Q 50 46 55 42" fill="none" stroke="#2D2D2D" stroke-width="2" stroke-linecap="round"/></svg></div><div class="team-name">Sam Chen</div><div class="team-role">Co-Teacher</div></div>
|
|
<div class="team-member"><div class="team-avatar"><svg viewBox="0 0 100 100"><circle cx="50" cy="36" r="18" fill="#D4A5E8" stroke="#2D2D2D" stroke-width="2.5"/><ellipse cx="50" cy="82" rx="28" ry="22" fill="#F7C8D4" stroke="#2D2D2D" stroke-width="2.5"/><circle cx="44" cy="34" r="2" fill="#2D2D2D"/><circle cx="56" cy="34" r="2" fill="#2D2D2D"/><path d="M 45 42 Q 50 46 55 42" fill="none" stroke="#2D2D2D" stroke-width="2" stroke-linecap="round"/></svg></div><div class="team-name">Jordan Park</div><div class="team-role">Specialist</div></div>
|
|
<div class="team-member"><div class="team-avatar"><svg viewBox="0 0 100 100"><circle cx="50" cy="36" r="18" fill="#8DE3B7" stroke="#2D2D2D" stroke-width="2.5"/><ellipse cx="50" cy="82" rx="28" ry="22" fill="#FDE366" stroke="#2D2D2D" stroke-width="2.5"/><circle cx="44" cy="34" r="2" fill="#2D2D2D"/><circle cx="56" cy="34" r="2" fill="#2D2D2D"/><path d="M 45 42 Q 50 46 55 42" fill="none" stroke="#2D2D2D" stroke-width="2" stroke-linecap="round"/></svg></div><div class="team-name">Taylor Kim</div><div class="team-role">Assistant</div></div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ====== SLIDE 9: Process ====== -->
|
|
<section class="slide slide-process" id="slide-9">
|
|
<div class="deco deco-cloud"><svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg"><style>.cl0{fill:#C6E3F6;}.cl1{fill:none;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cl2{fill:#fff;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cl2" d="m106.8 57.3c-.3 0 0 0 0 0 1.7 0 2.8.1 3.8.3.2-1 .3-2 .3-3.1 0-7.2-6.3-16.3-15.5-16.3-2 0-3.9.4-6.2 1.1-2.2-6.2-9.3-16-23.8-16-10 0-18.8 5.8-23 15-1.9-.7-4.1-1.1-6.7-1.1-10.1 0-19.2 8.3-19.2 19.6 0 1.3.2 2.6.4 4.3-7.6 1.5-14.2 8.2-14.2 17.7 0 8.4 6.4 18.9 17.4 18.9 2.2 0 3.8-.1 5.5-.7l27.3 2.6 48.1-4.7c1.9.5 3.8.8 6.2.8 11.3 0 18.2-9 18.2-19.7 0-7.8-6.4-17.4-15-18.4l-3.6-.3z"/><path class="cl0" d="m123.7 70.6c-1.4 6.3-6.6 14.5-17.8 14.6-1 0-1.9-.1-2.8-.2l-1.6.9c-2.9 2.8-6.9 5.3-12.5 5.3-2.1 0-4.4-.3-6.4-1.1-.5-.2-1.2-.1-1.6.2-2.1 1.6-7.4 5.2-14.8 5.2-5.1 0-10.5-1.9-15.2-5.5-.8-1.1-2.3-1.1-2.4.6-2 4-14.5 7.7-23-3.8-.5-1.2-2.1-1.4-2.3.6-8.8 1-16.3-2.3-19.6-10.6-1.4 5.3 1.5 20.3 16 20.2 2.2 0 4.2-.1 5.9-.6l28.3 4.2c3-1.5 4.2 4.3 12.6 4 6.1-.2 11.1-2 14.2-5.6 2 .6 3.9 1.6 7.7 1.6 5 0 9.5-1.5 12.5-5.6l3.5.4c1 .2 2 .2 3 .2 11.2 0 19.2-10 17.2-21.6l-.9-3.4z"/><path class="cl0" d="m31.7 65.4c1.7-4.3 5.9-7.8 12.7-7.8 1.7 0 3.5.3 5.1.8l-2.6 5c-1.3-.8-2.8-2.4-7-2-3.2.2-6.3 2.2-8.2 4z"/><path class="cl0" d="m82.5 58.7 2.1 4.9c1.3-.7 3-1.5 6-1.5s5.9 1.5 7.5 3.5c-1-4-5.2-7.5-11-7.5l-4.6.6z"/><path class="cl0" d="m90.1 39.4.5 5.7c1.9-1.4 6-4.7 8.5-5.5-3-1.5-6.6-1-9-.2z"/><path class="cl1" d="m23.4 50.9c1.5-2.9 5-7.3 11.2-7.8"/><path class="cl1" d="m50.4 35.8c2.5-2.9 8-7.1 16.5-6.7"/><path class="cl1" d="m71 29.8 1.3.3"/><path class="cl1" d="m68.7 58.1c3.2.5 6.4 2.4 9 5.2"/><path class="cl1" d="m112.6 63.7c2.8 1.2 6.3 4.9 7 9.3"/></svg></div>
|
|
<div class="deco deco-cloud-2"><svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg"><style>.cl0{fill:#C6E3F6;}.cl1{fill:none;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cl2{fill:#fff;stroke:#000;stroke-width:2.1405;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cl2" d="m106.8 57.3c-.3 0 0 0 0 0 1.7 0 2.8.1 3.8.3.2-1 .3-2 .3-3.1 0-7.2-6.3-16.3-15.5-16.3-2 0-3.9.4-6.2 1.1-2.2-6.2-9.3-16-23.8-16-10 0-18.8 5.8-23 15-1.9-.7-4.1-1.1-6.7-1.1-10.1 0-19.2 8.3-19.2 19.6 0 1.3.2 2.6.4 4.3-7.6 1.5-14.2 8.2-14.2 17.7 0 8.4 6.4 18.9 17.4 18.9 2.2 0 3.8-.1 5.5-.7l27.3 2.6 48.1-4.7c1.9.5 3.8.8 6.2.8 11.3 0 18.2-9 18.2-19.7 0-7.8-6.4-17.4-15-18.4l-3.6-.3z"/><path class="cl0" d="m123.7 70.6c-1.4 6.3-6.6 14.5-17.8 14.6-1 0-1.9-.1-2.8-.2l-1.6.9c-2.9 2.8-6.9 5.3-12.5 5.3-2.1 0-4.4-.3-6.4-1.1-.5-.2-1.2-.1-1.6.2-2.1 1.6-7.4 5.2-14.8 5.2-5.1 0-10.5-1.9-15.2-5.5-.8-1.1-2.3-1.1-2.4.6-2 4-14.5 7.7-23-3.8-.5-1.2-2.1-1.4-2.3.6-8.8 1-16.3-2.3-19.6-10.6-1.4 5.3 1.5 20.3 16 20.2 2.2 0 4.2-.1 5.9-.6l28.3 4.2c3-1.5 4.2 4.3 12.6 4 6.1-.2 11.1-2 14.2-5.6 2 .6 3.9 1.6 7.7 1.6 5 0 9.5-1.5 12.5-5.6l3.5.4c1 .2 2 .2 3 .2 11.2 0 19.2-10 17.2-21.6l-.9-3.4z"/><path class="cl0" d="m31.7 65.4c1.7-4.3 5.9-7.8 12.7-7.8 1.7 0 3.5.3 5.1.8l-2.6 5c-1.3-.8-2.8-2.4-7-2-3.2.2-6.3 2.2-8.2 4z"/><path class="cl0" d="m82.5 58.7 2.1 4.9c1.3-.7 3-1.5 6-1.5s5.9 1.5 7.5 3.5c-1-4-5.2-7.5-11-7.5l-4.6.6z"/><path class="cl0" d="m90.1 39.4.5 5.7c1.9-1.4 6-4.7 8.5-5.5-3-1.5-6.6-1-9-.2z"/><path class="cl1" d="m23.4 50.9c1.5-2.9 5-7.3 11.2-7.8"/><path class="cl1" d="m50.4 35.8c2.5-2.9 8-7.1 16.5-6.7"/><path class="cl1" d="m71 29.8 1.3.3"/><path class="cl1" d="m68.7 58.1c3.2.5 6.4 2.4 9 5.2"/><path class="cl1" d="m112.6 63.7c2.8 1.2 6.3 4.9 7 9.3"/></svg></div>
|
|
<div class="deco deco-star-1"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#F7C8D4" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-daisy"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
|
|
<h2>How It Works</h2>
|
|
<div class="process-flow">
|
|
<div class="process-step"><div class="step-circle s1">1</div><div class="step-title">Discover</div><div class="step-desc">Explore new topics through guided introductions and engaging materials</div></div>
|
|
<div class="process-arrow">→</div>
|
|
<div class="process-step"><div class="step-circle s2">2</div><div class="step-title">Practice</div><div class="step-desc">Apply concepts with hands-on activities and collaborative exercises</div></div>
|
|
<div class="process-arrow">→</div>
|
|
<div class="process-step"><div class="step-circle s3">3</div><div class="step-title">Reflect</div><div class="step-desc">Share insights and celebrate progress with the community</div></div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ====== SLIDE 10: Donut Chart ====== -->
|
|
<section class="slide slide-donut" id="slide-10">
|
|
<div class="deco deco-daisy-tl"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-daisy-br"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><!-- SVG created with Arrow, by QuiverAI (https://quiver.ai) --><style type="text/css">.cls-0 {fill:#FFFFFF;}.cls-1 {fill:#FCDF6C;}.cls-2 {fill:none;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}.cls-3 {fill:#FFFFFF;stroke:#232323;stroke-width:2.0745;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path class="cls-3" d="m66.6 53.8-5.9-13.8c-2.2-5.9-4.6-17.9-1.7-26.2 1.7-4.9 6.7-11.4 15.4-11.4 8.7-0.2 13.4 4.6 15.7 8.6 4.8 8.1 2.5 20.3-0.1 27.7l-6.8 15.1"/><path class="cls-3" d="m92.1 115.2c1.3 5.8 1.9 13.8-0.2 19.9-1.9 5.1-6.4 12.5-16.9 12.5-8.4 0-14.9-5.3-16.8-13.1-1.7-7-0.6-15.2 1.7-22l6.7-16.4"/><path class="cls-3" d="m96 66.4 14.7-5.8c5.9-2.4 16.2-8.3 19.8-17 2.8-6.4 2.1-14.2-4.3-19.7-2.8-2.5-6.2-4.2-10.2-5-9.3-0.6-15.8 5.5-20.3 10.9-2.7 3.4-5.1 7.4-6.8 11l-5.7 12.8"/><path class="cls-3" d="m54 84-14.7 5.5c-5.7 2.1-12.3 6.6-15.9 10.9-1.9 2.3-4 5.7-4.9 8.9-2.1 8.5 2.8 18 11.7 21.8 4.9 1.3 9.3 0.9 13.6-1.2 7.6-3.6 13.8-12.1 16.9-18.5l5.9-13.6"/><path class="cls-3" d="m96.2 83.8 14.5 5.5c5.9 2.1 15.7 8.3 19.5 16.2 2.6 5.1 3.2 12.1-1.9 18.7-2.7 3.3-7 6.9-13.2 6.9-8.5 0-14.1-5-18.3-9.7-2.6-3.2-5.4-7.6-7.3-11.5l-6.1-14.2"/><path class="cls-3" d="m54 66.1-14.3-5.5c-5.7-2.1-15.9-3.4-23.1-2.1-6.2 1.2-11.9 5.9-13.4 12.1-1.7 7.6 1.7 17.2 11.9 20.2 7 2.1 16.8 1.1 23.6-1.1l15.5-5.9"/><path class="cls-3" d="m116.4 58.9c4.2-0.9 9.2-1.5 14.1-0.9 5.1 0.5 9.7 2.6 12.9 6.4 6.2 7 5.1 17.3-1.5 22.8-2.3 2.1-5.5 3.8-9.5 4.4-6.8 1.1-14.1 0.3-21.3-1.9"/><path class="cls-3" d="m60.7 40c-3.3-6.4-10.5-17.1-18.8-20.5-7.2-3.1-15.5-1.5-20.4 4.9-2.1 2.8-3.7 6.2-3.7 10-0.2 8.5 5.8 15.4 13.7 20.7 3.2 2.1 7 4.2 10.6 5.5"/><path class="cls-1" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/><path class="cls-2" d="m75.1 52.1c-10.9 0-22.6 8.9-22.6 23 0 9.3 7 22.1 22.6 22.1 11.7 0 22.5-8.7 22.5-21.9 0-11.1-9.3-23.2-22.5-23.2z"/></svg></div>
|
|
<div class="deco deco-star-1"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#FDE366" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
<div class="deco deco-star-2"><svg viewBox="0 0 100 98.6" xmlns="http://www.w3.org/2000/svg"><path fill="#fff" stroke="#2D2D2D" stroke-width="2.4166" stroke-miterlimit="10" d="m57.7 7.8 8.3 19.1c.5 1.3 1.5 2.1 2.8 2.3l21.5 2.2c6.4.8 9.4 8.3 5.3 13.7l-16.2 15.2c-1 .9-1.5 2.5-1.2 4.2l4.3 21.1c.9 6.2-4.9 11.6-12 8.7l-18.1-10.2c-1.4-.8-3.3-.8-4.8 0l-17.8 10.2c-6 2.9-13.2-.6-12.7-8l4.5-21.3c.3-1.7-.1-3.5-1.3-4.5l-15.2-13.5c-4.5-4.3-3.6-13.6 4.2-15.6l21.5-2.2c1.3-.1 2.3-.9 2.9-2.3l8.7-19.1c2.7-6 11.5-7.7 15.3 0z"/></svg></div>
|
|
|
|
<div class="donut-wrap">
|
|
<div class="donut-chart-box">
|
|
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="100" cy="100" r="80" fill="none" stroke="#E8E8E8" stroke-width="30"/>
|
|
<circle cx="100" cy="100" r="80" fill="none" stroke="#F8635F" stroke-width="30" stroke-dasharray="125.6 377" stroke-dashoffset="0" transform="rotate(-90 100 100)"/>
|
|
<circle cx="100" cy="100" r="80" fill="none" stroke="#8DE3B7" stroke-width="30" stroke-dasharray="100 377" stroke-dashoffset="-125.6" transform="rotate(-90 100 100)"/>
|
|
<circle cx="100" cy="100" r="80" fill="none" stroke="#85C5FE" stroke-width="30" stroke-dasharray="75.4 377" stroke-dashoffset="-225.6" transform="rotate(-90 100 100)"/>
|
|
<circle cx="100" cy="100" r="80" fill="none" stroke="#FDE366" stroke-width="30" stroke-dasharray="50.2 377" stroke-dashoffset="-301" transform="rotate(-90 100 100)"/>
|
|
<circle cx="100" cy="100" r="80" fill="none" stroke="#D4A5E8" stroke-width="30" stroke-dasharray="25.1 377" stroke-dashoffset="-351.2" transform="rotate(-90 100 100)"/>
|
|
<circle cx="100" cy="100" r="55" fill="#fff" stroke="#2D2D2D" stroke-width="2.5"/>
|
|
<text x="100" y="95" text-anchor="middle" font-family="Fredoka One" font-size="14" fill="#2D2D2D">Total</text>
|
|
<text x="100" y="115" text-anchor="middle" font-family="Fredoka One" font-size="20" fill="#2D2D2D">100%</text>
|
|
<circle cx="100" cy="100" r="80" fill="none" stroke="#2D2D2D" stroke-width="2"/>
|
|
</svg>
|
|
</div>
|
|
<div class="donut-legend-side">
|
|
<h3>Topic Distribution</h3>
|
|
<div class="d-legend-item"><span class="d-legend-swatch" style="background:#F8635F"></span>Literacy - 33%</div>
|
|
<div class="d-legend-item"><span class="d-legend-swatch" style="background:#8DE3B7"></span>Numeracy - 27%</div>
|
|
<div class="d-legend-item"><span class="d-legend-swatch" style="background:#85C5FE"></span>Science - 20%</div>
|
|
<div class="d-legend-item"><span class="d-legend-swatch" style="background:#FDE366"></span>Arts - 13%</div>
|
|
<div class="d-legend-item"><span class="d-legend-swatch" style="background:#D4A5E8"></span>Movement - 7%</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</div>
|
|
|
|
<div class="nav-dots" id="navDots">
|
|
<div class="nav-dot active" data-slide="1"></div>
|
|
<div class="nav-dot" data-slide="2"></div>
|
|
<div class="nav-dot" data-slide="3"></div>
|
|
<div class="nav-dot" data-slide="4"></div>
|
|
<div class="nav-dot" data-slide="5"></div>
|
|
<div class="nav-dot" data-slide="6"></div>
|
|
<div class="nav-dot" data-slide="7"></div>
|
|
<div class="nav-dot" data-slide="8"></div>
|
|
<div class="nav-dot" data-slide="9"></div>
|
|
<div class="nav-dot" data-slide="10"></div>
|
|
</div>
|
|
|
|
<div class="slide-counter" id="slideCounter">1 / 10</div>
|
|
|
|
<script>
|
|
const container=document.getElementById('slideContainer');
|
|
const dots=document.querySelectorAll('.nav-dot');
|
|
const counter=document.getElementById('slideCounter');
|
|
const slides=document.querySelectorAll('.slide');
|
|
function goToSlide(n){const slide=document.getElementById('slide-'+n);if(slide)slide.scrollIntoView({behavior:'smooth'});}
|
|
dots.forEach(dot=>{dot.addEventListener('click',()=>{goToSlide(dot.dataset.slide);});});
|
|
document.addEventListener('keydown',e=>{if(e.target.tagName==='INPUT'||e.target.tagName==='TEXTAREA')return;let current=1;dots.forEach((d,i)=>{if(d.classList.contains('active'))current=i+1;});
|
|
if(e.key==='ArrowDown'||e.key==='ArrowRight'||e.key===' '||e.key==='PageDown'){e.preventDefault();if(current<10)goToSlide(current+1);}
|
|
else if(e.key==='ArrowUp'||e.key==='ArrowLeft'||e.key==='PageUp'){e.preventDefault();if(current>1)goToSlide(current-1);}
|
|
else if(e.key==='Home'){e.preventDefault();goToSlide(1);}
|
|
else if(e.key==='End'){e.preventDefault();goToSlide(10);}});
|
|
const observer=new IntersectionObserver(entries=>{entries.forEach(entry=>{if(entry.isIntersecting){const id=entry.target.id.replace('slide-','');dots.forEach(d=>d.classList.toggle('active',d.dataset.slide===id));counter.textContent=id+' / 10';}});},{root:container,threshold:.5});
|
|
slides.forEach(s=>observer.observe(s));
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|