maxim.dolgolyov/Learn_System
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(geom7): убрана верхняя граница max-width — SVG растягиваются на всю ширину контейнера

Browse Source 
Когда я добавил max-width:Wpx, SVG в одиночных карточках перестали
заполнять контейнер: в карточке шириной 800px SVG ограничивался
своим intrinsic размером (например 320px для §6), и казался мелким.

Правильная responsive-стратегия — width:100% БЕЗ верхней границы.
viewBox + preserveAspectRatio сами правильно отмасштабируют содержимое.
Теперь в одиночных карточках SVG занимает всю ширину, в flex-сетке —
свою долю.

Cache-bust ?v=6.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Maxim Dolgolyov
2026-05-29 08:38:45 +03:00
parent cf88cb88dc
commit 1b704b98e5
3 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/js/geom7_svg.js
+1 -1
View File
@@ -36,7 +36,7 @@ G.svgBox = function(w, h, opts){
+'</pattern></defs>' +'</pattern></defs>'
+'<rect width="'+w+'" height="'+h+'" fill="url(#g7-grid-'+(opts.id||'def')+')"/>'; +'<rect width="'+w+'" height="'+h+'" fill="url(#g7-grid-'+(opts.id||'def')+')"/>';
} }
return { open:'<svg viewBox="0 0 '+w+' '+h+'" preserveAspectRatio="xMidYMid meet" style="width:100%;max-width:'+(opts.maxWidth||(w+'px'))+';height:auto;display:block;margin:'+(opts.margin||'0 auto')+';background:'+bg+';border-radius:10px;border:1px solid #e2e8f0">'+gridSvg, close:'</svg>' }; return { open:'<svg viewBox="0 0 '+w+' '+h+'" preserveAspectRatio="xMidYMid meet" style="width:100%;height:auto;display:block;margin:'+(opts.margin||'0 auto')+';background:'+bg+';border-radius:10px;border:1px solid #e2e8f0">'+gridSvg, close:'</svg>' };
}; };
/* === Точка === */ /* === Точка === */
frontend/textbooks/geometry_7_ch1.html
+1 -1
View File
@@ -13,7 +13,7 @@
onload="renderMathInElement(document.body,{delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false},{left:'\\[',right:'\\]',display:true},{left:'\\(',right:'\\)',display:false}],throwOnError:false})"></script> onload="renderMathInElement(document.body,{delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false},{left:'\\[',right:'\\]',display:true},{left:'\\(',right:'\\)',display:false}],throwOnError:false})"></script>
<script src="/js/api.js" defer></script> <script src="/js/api.js" defer></script>
<script src="/js/xp.js" defer></script> <script src="/js/xp.js" defer></script>
<script src="/js/geom7_svg.js?v=5" defer></script> <script src="/js/geom7_svg.js?v=6" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800;900&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800;900&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet">
<style> <style>
:root{ :root{
frontend/textbooks/geometry_7_ch2.html
+1 -1
View File
@@ -13,7 +13,7 @@
onload="renderMathInElement(document.body,{delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false},{left:'\\[',right:'\\]',display:true},{left:'\\(',right:'\\)',display:false}],throwOnError:false})"></script> onload="renderMathInElement(document.body,{delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false},{left:'\\[',right:'\\]',display:true},{left:'\\(',right:'\\)',display:false}],throwOnError:false})"></script>
<script src="/js/api.js" defer></script> <script src="/js/api.js" defer></script>
<script src="/js/xp.js" defer></script> <script src="/js/xp.js" defer></script>
<script src="/js/geom7_svg.js?v=5" defer></script> <script src="/js/geom7_svg.js?v=6" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800;900&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800;900&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet">
<style> <style>
:root{ :root{