Files
Learn_System/frontend/textbooks/chemistry_7_ch4.html
T
Maxim Dolgolyov c33b4ab4f6 feat(chemistry7): Phase 0 — фундамент учебника «Химия 7» (hub + 4 главы)
- миграция 046_chemistry7_hub.sql: родитель chemistry-7 (26§) + 4 ребёнка
- chemistry_7_hub.html: emerald-палитра, 4 главы, финал курса (8 боссов,
  ачивка «Химик 7 класса»)
- chemistry_7_ch1..ch4.html: каркасы глав на общем движке chem8_engine.js
  + chem8-textbook.css; PARAS по реальной программе, заглушки-builder'ы
- chem7_svg.js: неймспейс Chem7 (надстройка над Chem8), стабы виджетов
- chemistry7-page.test.js: jsdom-каркас (6 тестов, все проходят)

Содержание § наполняется в фазах 1–4. См. plans/textbooks-7/PLAN_CHEMISTRY_7.md

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-05-30 18:13:37 +03:00

117 lines
7.7 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Химия 7 · Глава 4 · «Вода»</title>
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css">
<link rel="stylesheet" href="/css/chem8-textbook.css">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js"></script>
<script src="/js/api.js" defer></script>
<script src="/js/xp.js" defer></script>
<script src="/js/biochem-core.js" defer></script>
<script src="/js/chem8_svg.js" defer></script>
<script src="/js/chem7_svg.js" defer></script>
<script src="/js/chem8_engine.js" defer></script>
</head>
<body>
<header class="hdr">
<div class="hdr-row">
<div>
<h1>Химия 7 · Глава 4</h1>
<div class="hdr-sub">Вода: состав и свойства, основания и индикаторы, нейтрализация, охрана природы</div>
</div>
<div class="hdr-side">
<a href="/textbook/chemistry-7" class="hdr-btn"><svg class="ic" viewBox="0 0 24 24"><polyline points="15 18 9 12 15 6"/></svg> К главам</a>
<button id="theme-btn" class="hdr-btn"><svg class="ic" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg><span id="theme-lab">Тёмная</span></button>
</div>
</div>
</header>
<main class="main">
<div class="col-main">
<section class="hero">
<h2>Вода — самое важное вещество на Земле</h2>
<p>Вода знакома каждому, но в химии она удивительна. В этой главе вы изучите состав и свойства воды, познакомитесь с основаниями и индикаторами, узнаете о реакции нейтрализации и о том, как беречь воду и окружающую среду.</p>
<div class="hero-row">
<button class="btn-primary" onclick="goTo('p23')"><svg class="ic" viewBox="0 0 24 24"><polygon points="6 4 20 12 6 20 6 4" fill="currentColor" stroke="none"/></svg> Начать § 23</button>
<div class="hero-progress">
<span class="hp-label">Прогресс главы</span>
<div class="hp-bar"><div id="hero-hp-fill" class="hp-fill"></div></div>
<span id="hero-hp-text" class="hp-text">0%</span>
</div>
<div id="hero-xp-badge" class="hero-xp-badge"></div>
</div>
</section>
<section class="psel">
<div class="psel-title">Параграфы главы</div>
<div id="psel-grid" class="psel-grid"></div>
</section>
<section id="sec-p23" class="sec"><div class="sec-header"><span class="sec-num">§ 23</span><h2 class="sec-h">Состав, физические и химические свойства воды</h2></div><div id="p23-body"></div></section>
<section id="sec-p24" class="sec"><div class="sec-header"><span class="sec-num">§ 24</span><h2 class="sec-h">Основания как сложные вещества</h2></div><div id="p24-body"></div></section>
<section id="sec-lo5" class="sec"><div class="sec-header"><span class="sec-num">Лаб. 5</span><h2 class="sec-h">Лабораторный опыт: действие щелочей на индикаторы</h2></div><div id="lo5-body"></div></section>
<section id="sec-p25" class="sec"><div class="sec-header"><span class="sec-num">§ 25</span><h2 class="sec-h">Реакция нейтрализации</h2></div><div id="p25-body"></div></section>
<section id="sec-pr4" class="sec"><div class="sec-header"><span class="sec-num">ПР 4</span><h2 class="sec-h">Практическая работа: реакция нейтрализации</h2></div><div id="pr4-body"></div></section>
<section id="sec-p26" class="sec"><div class="sec-header"><span class="sec-num">§ 26</span><h2 class="sec-h">Охрана окружающей среды</h2></div><div id="p26-body"></div></section>
<section id="sec-final4" class="sec"><div class="sec-header"><span class="sec-num">&#9733;</span><h2 class="sec-h">Финал главы</h2></div><div id="final4-body"></div></section>
</div>
<aside class="col-side"><div id="sidebar-content"></div></aside>
</main>
<footer class="foot">Интерактивный учебник «Химия — 7 класс» · Глава 4 · «Вода» · LearnSpace</footer>
<div id="ach-popup" class="ach-popup"><svg viewBox="0 0 24 24"><polygon points="12 2 22 20 2 20"/></svg><span id="ach-text">Достижение!</span></div>
<script>
'use strict';
window.CHEM8_CFG = { slug:'chemistry-7-ch4', themeKey:'chemistry7_theme', xpKey:'chemistry7_xp',
progKey:'chemistry7_ch4_progress', achKey:'chemistry7_ch4_ach', hubHref:'/textbook/chemistry-7' };
window.PARAS = [
{id:'p23', num:'§ 23', name:'Состав и свойства воды', sub:'$H_2O$'},
{id:'p24', num:'§ 24', name:'Основания', sub:'Me + OH'},
{id:'lo5', num:'Лаб. 5', name:'Щёлочи и индикаторы', sub:'опыт'},
{id:'p25', num:'§ 25', name:'Реакция нейтрализации', sub:'кислота + основание'},
{id:'pr4', num:'ПР 4', name:'Практическая работа', sub:'нейтрализация'},
{id:'p26', num:'§ 26', name:'Охрана окружающей среды', sub:'вода · экология'},
{id:'final4', num:'★', name:'Финал главы', sub:'босс · ачивка', final:true}
];
window.ACH_LABELS = { start:'Начало главы 4!', final4_tasks:'Глава 4 пройдена!' };
window.SIDEBARS = { p23:{ title:'Глава 4 · Химия 7', rows:[['Раздел','Вода'],['§§','2326'],['Лаб/ПР','ЛО 5 · ПР 4']] } };
window.TIPS = [{ sec:'p23', html:'Глава наполняется содержанием по фазам. Сейчас доступны навигация по параграфам и отметка о прочтении (+10 XP).' }];
/* Phase 0: заглушки-builder'ы из PARAS (теория и интерактивы добавляются в фазах 1–4). */
(function(){
var P = window.PARAS, B = {};
function ph(p, prev, next){
return function(){
var el = document.getElementById(p.id + '-body'); if (!el) return;
el.innerHTML =
'<div class="para-hero"><div class="ph-label">' + p.num + ' · Химия 7</div><h2>' + p.name + '</h2>'
+ '<div class="ph-desc">Содержание этого ' + (p.final ? 'раздела' : 'параграфа') + ' готовится.</div></div>'
+ makeCard('theory', p.name, p.num,
'<p>Скоро здесь появятся теория, наглядные SVG-схемы, молекулярные модели и интерактивные тренажёры по теме «' + p.name + '». Пока доступна навигация по главе' + (p.final ? '.' : ' и отметка о прочтении.') + '</p>')
+ secNav(prev, next) + (p.final ? '' : readButton(p.id));
if (!p.final) wireReadBtn(p.id);
};
}
for (var i = 0; i < P.length; i++) {
B[P[i].id] = ph(P[i], i > 0 ? P[i-1].id : null, i < P.length-1 ? P[i+1].id : null);
}
window.BUILDERS = B;
})();
</script>
</body>
</html>