https://kosmik.my/nebula/en/tags/1920s/Recent content in 1920s on Kosmik.myHugo -- gohugo.ioen© 2026 Kosmik.myTue, 25 Aug 2026 21:05:59 +0000https://kosmik.my/nebula/en/lunar-standstills/1920/Sat, 03 Jan 2026 00:00:00 +0800https://kosmik.my/nebula/en/lunar-standstills/1920/<style> .ls-tbl{display:table;width:100%;overflow:visible} .ls-tbl td{vertical-align:top} .ls-moon{display:inline-flex;align-items:center;gap:.55em;text-align:left;vertical-align:middle} .ls-moon>svg{flex:0 0 auto;display:block} .ls-moon-info{display:flex;flex-direction:column;line-height:1.3;min-width:0} .ls-moon-name{font-weight:600;white-space:nowrap} .ls-moon-pct{font-size:.82em;opacity:.82} .ls-moon-age{font-size:.78em;opacity:.68;white-space:normal} .ls-moon-age-lbl{font-weight:600;opacity:.85} @media(max-width:640px){ .ls-tbl thead{display:none} .ls-tbl,.ls-tbl tbody,.ls-tbl tr{display:block} .ls-tbl tr{padding:.3em 0} .ls-tbl tbody tr{border-top-width:1px;border-top-color:var(--tw-prose-td-borders)} .ls-tbl tbody tr:first-child{border-top-color:var(--tw-prose-th-borders)} .ls-tbl tbody tr:last-child{border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)} .ls-tbl td{display:flex;justify-content:space-between;align-items:baseline;padding:3px 0;text-align:right;white-space:normal} .ls-tbl td::before{content:attr(data-label);flex-shrink:0;text-align:left;font-weight:600;padding-right:.75em;white-space:nowrap;color:var(--tw-prose-headings,currentColor);opacity:.8} .ls-moon{align-items:center;flex-direction:row-reverse} .ls-moon-info{align-items:flex-end;text-align:right} } /* Chart SVG shared styles — repetitive stroke/font attributes live here so each marker/grid/legend element carries only its unique values. */ .ls-c{cursor:pointer} .ls-mk{stroke:#fff;stroke-opacity:.5;stroke-width:1.2;opacity:.9} .ls-mt{font:bold 10px system-ui;fill:#fff;text-anchor:middle;dominant-baseline:middle;pointer-events:none} .ls-g0{stroke:#fff;stroke-opacity:.55;stroke-width:1.2} .ls-g1{stroke:#fff;stroke-opacity:.2;stroke-width:.6} .ls-gl{font:10px system-ui;fill:#fff;fill-opacity:.45;text-anchor:end;dominant-baseline:middle} .ls-tk{stroke:#fff;stroke-opacity:.3} .ls-tl{font:9px system-ui;fill:#fff;fill-opacity:.45;text-anchor:middle} .ls-lg{opacity:.85} .ls-lg2{opacity:.75} .ls-lt{font:9px system-ui;fill:#fff;fill-opacity:.6;dominant-baseline:middle} .ls-ax{stroke:#fff;stroke-opacity:.4} .ls-al{font:10px system-ui;fill:#fff;fill-opacity:.45;text-anchor:middle;dominant-baseline:middle} .ls-th{font:9px system-ui;fill:#fff;fill-opacity:.28;text-anchor:end} </style> <script>//<![CDATA[ (function(){ // ── Tooltip helpers — tooltip data lives in the SVG's data-tooltipmap // JSON attribute; clicking a marker renders its tooltip group on demand, // clicking anywhere else removes it. Works for inline charts and for // lightbox clones (attributes survive cloneNode) via one delegated listener. window.lsRemoveTip=function(svg){ var ex=svg.querySelector('[data-active-tip]'); if(ex)ex.parentNode.removeChild(ex); }; window.lsMoonPath=function(pa,ill){ var e=((pa%360)+360)%360; var waxing=e<180; var gibbous=ill>0.5; var r=46,c=50; var rx=r*Math.abs(2*ill-1); var top=c+' '+(c-r),bot=c+' '+(c+r); var s='<circle cx="50" cy="50" r="46" fill="#3b4358"/>'; if(ill>=0.995){ s+='<circle cx="50" cy="50" r="46" fill="#f2ecd0"/>'; }else if(ill>0.005){ var limb,term; if(waxing){ limb='M '+top+' A '+r+' '+r+' 0 0 1 '+bot; term=gibbous?'A '+rx+' '+r+' 0 0 1 '+top:'A '+rx+' '+r+' 0 0 0 '+top; }else{ limb='M '+top+' A '+r+' '+r+' 0 0 0 '+bot; term=gibbous?'A '+rx+' '+r+' 0 0 0 '+top:'A '+rx+' '+r+' 0 0 1 '+top; } s+='<path d="'+limb+' '+term+' Z" fill="#f2ecd0"/>'; } s+='<circle cx="50" cy="50" r="46" fill="none" stroke="#828b9c" stroke-width="2"/>'; return s; }; window.lsShowTip=function(svg,key){ lsRemoveTip(svg); var map; try{map=JSON.parse(svg.getAttribute('data-tooltipmap'));}catch(e){return;} var d=map[key]; if(!d)return; var ns='http://www.w3.org/2000/svg'; var g=document.createElementNS(ns,'g'); g.setAttribute('data-active-tip',key); g.setAttribute('pointer-events','none'); var rect=document.createElementNS(ns,'rect'); rect.setAttribute('x',d.x);rect.setAttribute('y',d.y); rect.setAttribute('width',d.w);rect.setAttribute('height',d.h); rect.setAttribute('rx','5'); rect.setAttribute('fill','black');rect.setAttribute('fill-opacity','0.62'); rect.setAttribute('stroke',d.a);rect.setAttribute('stroke-width','1.2');rect.setAttribute('stroke-opacity','0.85'); g.appendChild(rect); if(typeof d.p==='number'&&typeof d.i==='number'){ var sz=Math.floor(d.h/2),m=5; var mpg=document.createElementNS(ns,'g'); mpg.setAttribute('transform','translate('+(d.x+d.w-sz-m)+','+(d.y+m)+') scale('+(sz/100)+')'); if(d.n){mpg.setAttribute('role','img');mpg.setAttribute('aria-label',d.n);} mpg.innerHTML=lsMoonPath(d.p,d.i); g.appendChild(mpg); } var lines=d.l.split('\n'); for(var i=0;i<lines.length;i++){ var t=document.createElementNS(ns,'text'); t.setAttribute('x',d.x+10);t.setAttribute('y',d.y+14+i*17); t.setAttribute('font-size','10'); t.setAttribute('fill',i===0?d.a:'white'); t.setAttribute('fill-opacity','0.95'); t.setAttribute('font-weight',i===0?'bold':'normal'); t.textContent=lines[i]; g.appendChild(t); } svg.appendChild(g); }; // ── Delegated clicks: marker shows its tooltip, background removes it ─ document.addEventListener('click',function(e){ var el=e.target.closest?e.target.closest('[data-tipkey]'):null; if(el){ var svg=el.closest('svg[data-tooltipmap]'); if(svg){e.stopPropagation();lsShowTip(svg,el.getAttribute('data-tipkey'));} return; } var svg2=e.target.closest?e.target.closest('svg[data-tooltipmap]'):null; if(svg2)lsRemoveTip(svg2); }); // ── Lightbox — runs only once per page ─────────────────────────── if(window._lsLbInit)return; window._lsLbInit=true; // Overlay — flex column so topBar stays fixed-height and holder fills the rest. // overflow:hidden on the overlay prevents any body scroll bleed-through. var ov=document.createElement('div'); ov.style.cssText='display:none;position:fixed;inset:0;z-index:9000;background:#0d1117;flex-direction:column;overflow:hidden;'; // ── Header row ──────────────────────────────────────────────────── // lSpacer mirrors closeBtn's min-width so the titleGroup stays centred. var topBar=document.createElement('div'); topBar.style.cssText='flex-shrink:0;background:#0d1117;display:flex;align-items:center;gap:10px;padding:8px 14px;'; var lSpacer=document.createElement('div'); lSpacer.style.cssText='flex-shrink:0;min-width:88px;'; topBar.appendChild(lSpacer); var titleGroup=document.createElement('div'); titleGroup.style.cssText='flex:1;text-align:center;overflow:hidden;pointer-events:none;'; var titleEl=document.createElement('div'); titleEl.style.cssText='color:#e6edf3;font-size:15px;font-family:system-ui,sans-serif;font-weight:600;line-height:1.3;'; var hintEl=document.createElement('div'); hintEl.style.cssText='color:rgba(230,237,243,0.35);font-size:11px;font-family:system-ui,sans-serif;margin-top:2px;line-height:1.4;'; hintEl.textContent='Scroll or pinch to zoom · Drag to pan · Double-click to reset'; titleGroup.appendChild(titleEl); titleGroup.appendChild(hintEl); topBar.appendChild(titleGroup); var closeBtn=document.createElement('button'); closeBtn.textContent='✕ Close'; closeBtn.style.cssText='padding:10px 24px;font-size:14px;font-family:system-ui,sans-serif;cursor:pointer;border:1px solid rgba(255,255,255,0.45);border-radius:6px;background:rgba(255,255,255,0.10);color:#e6edf3;flex-shrink:0;touch-action:manipulation;min-height:44px;min-width:88px;'; topBar.appendChild(closeBtn); // ── Chart area — fills every pixel below the header ─────────────── // min-height:0 is required: flex children default to min-height:auto // which prevents them shrinking below their content size. var holder=document.createElement('div'); holder.style.cssText='flex:1;min-height:0;overflow:hidden;'; ov.appendChild(topBar); ov.appendChild(holder); document.body.appendChild(ov); var _savedBodyOverflow=''; function closeLb(){ov.style.display='none';holder.innerHTML='';document.body.style.overflow=_savedBodyOverflow;} closeBtn.addEventListener('click',closeLb); ov.addEventListener('click',function(e){if(e.target===ov)closeLb();}); document.addEventListener('keydown',function(e){if(e.key==='Escape'&&ov.style.display!=='none')closeLb();}); // ── Shared pan-state for lightbox mouse drag ────────────────────── var _lb={panFn:null,endFn:null}; ov.addEventListener('mousemove',function(e){if(_lb.panFn)_lb.panFn(e);}); ov.addEventListener('mouseup',function(){if(_lb.endFn)_lb.endFn();}); ov.addEventListener('mouseleave',function(){if(_lb.endFn)_lb.endFn();}); // ── Zoom / pan initialiser (called for each new lightbox SVG) ───── function initZoom(svg,W,H){ var vb={x:0,y:0,w:W,h:H}; var isPanning=false,panStart=null,panStartVB=null; var pinchDist=0,pinchMidX=0,pinchMidY=0,pinchStartVB=null; // Tap-detection state — a touch that barely moved within 350 ms is a tap. // initZoom calls e.preventDefault() in touchstart (needed to suppress the // browser's own pan/zoom), which stops the browser from synthesising a click // event from touch. We synthesise it ourselves in touchend so that marker // onclick handlers and the SVG background onclick both work on touchscreens. // _lastTap* tracks the previous tap for double-tap-to-reset detection // (Chromium on touch does not fire dblclick from touch events). var _tapEl=null,_tapT=0,_tapX=0,_tapY=0; var _lastTapT=0,_lastTapX=0,_lastTapY=0; function setVB(){svg.setAttribute('viewBox',vb.x+' '+vb.y+' '+vb.w+' '+vb.h);} // ── Rendering helpers ───────────────────────────────────────────── // The SVG uses preserveAspectRatio="xMidYMid meet", so the chart content // is letter-boxed inside the SVG element. Using the SVG element dimensions // directly (r.width / r.height) for pan calculations produces wildly // different sensitivities for x vs y on portrait phones (4-5× mismatch). // The correct divisor for both axes is the render scale: // renderScale = min(elementW/vbW, elementH/vbH) // which gives a uniform 1-screen-pixel = 1/renderScale chart-units feel. // The same correction is needed for zoom cursor anchoring. function renderScale(r,w,h){return Math.min(r.width/w,r.height/h);} function contentOff(r,w,h,rs){ return{ox:(r.width-w*rs)/2,oy:(r.height-h*rs)/2}; } svg.addEventListener('wheel',function(e){ e.preventDefault();e.stopPropagation(); var r=svg.getBoundingClientRect(); var ratio=e.deltaY>0?1.12:1/1.12; var rs=renderScale(r,vb.w,vb.h); var off=contentOff(r,vb.w,vb.h,rs); var nx=(e.clientX-r.left-off.ox)/(vb.w*rs); var ny=(e.clientY-r.top-off.oy)/(vb.h*rs); var fx=vb.x+nx*vb.w,fy=vb.y+ny*vb.h; vb.w*=ratio;vb.h*=ratio; vb.x=fx-nx*vb.w;vb.y=fy-ny*vb.h; setVB(); },{passive:false}); svg.addEventListener('mousedown',function(e){ if(e.button!==0)return; e.preventDefault(); isPanning=true; panStart={x:e.clientX,y:e.clientY}; panStartVB={x:vb.x,y:vb.y,w:vb.w,h:vb.h}; svg.style.cursor='grabbing'; _lb.panFn=function(ev){ if(!isPanning)return; var r=svg.getBoundingClientRect(); var rs=renderScale(r,panStartVB.w,panStartVB.h); vb.x=panStartVB.x-(ev.clientX-panStart.x)/rs; vb.y=panStartVB.y-(ev.clientY-panStart.y)/rs; setVB(); }; _lb.endFn=function(){isPanning=false;svg.style.cursor='grab';_lb.panFn=null;_lb.endFn=null;}; }); svg.addEventListener('touchstart',function(e){ e.preventDefault(); if(e.touches.length===1){ isPanning=true; panStart={x:e.touches[0].clientX,y:e.touches[0].clientY}; panStartVB={x:vb.x,y:vb.y,w:vb.w,h:vb.h}; // Record tap candidate — cleared on significant move or multi-touch _tapEl=e.target; _tapT=Date.now(); _tapX=e.touches[0].clientX; _tapY=e.touches[0].clientY; }else if(e.touches.length>=2){ isPanning=false;panStart=null; _tapEl=null; pinchDist=Math.hypot(e.touches[0].clientX-e.touches[1].clientX,e.touches[0].clientY-e.touches[1].clientY); pinchMidX=(e.touches[0].clientX+e.touches[1].clientX)/2; pinchMidY=(e.touches[0].clientY+e.touches[1].clientY)/2; pinchStartVB={x:vb.x,y:vb.y,w:vb.w,h:vb.h}; } },{passive:false}); svg.addEventListener('touchmove',function(e){ e.preventDefault();e.stopPropagation(); // Cancel tap if finger moved more than 8 px — this is a pan, not a tap if(_tapEl&&e.touches.length===1){ var dx=Math.abs(e.touches[0].clientX-_tapX); var dy=Math.abs(e.touches[0].clientY-_tapY); if(dx>8||dy>8)_tapEl=null; } var r=svg.getBoundingClientRect(); if(e.touches.length===1&&isPanning&&panStart){ var rs=renderScale(r,panStartVB.w,panStartVB.h); vb.x=panStartVB.x-(e.touches[0].clientX-panStart.x)/rs; vb.y=panStartVB.y-(e.touches[0].clientY-panStart.y)/rs; setVB(); }else if(e.touches.length>=2&&pinchDist>0&&pinchStartVB){ var dist=Math.hypot(e.touches[0].clientX-e.touches[1].clientX,e.touches[0].clientY-e.touches[1].clientY); var midX=(e.touches[0].clientX+e.touches[1].clientX)/2; var midY=(e.touches[0].clientY+e.touches[1].clientY)/2; var scale=pinchDist/dist; var lvb=pinchStartVB; var rs=renderScale(r,lvb.w,lvb.h); var off=contentOff(r,lvb.w,lvb.h,rs); var cw=lvb.w*rs,ch=lvb.h*rs; var nx=(midX-r.left-off.ox)/cw,ny=(midY-r.top-off.oy)/ch; var origNx=(pinchMidX-r.left-off.ox)/cw,origNy=(pinchMidY-r.top-off.oy)/ch; var fx=lvb.x+origNx*lvb.w,fy=lvb.y+origNy*lvb.h; vb.w=lvb.w*scale;vb.h=lvb.h*scale; vb.x=fx-nx*vb.w;vb.y=fy-ny*vb.h; setVB(); } },{passive:false}); svg.addEventListener('touchend',function(e){ // Synthesise a click on a short tap so marker handlers fire on touchscreens. // For double-tap: Chromium on touch does not fire dblclick from touch events. // We detect two taps within 350 ms / 30 px and reset the view instead. if(_tapEl&&e.touches.length===0&&e.changedTouches.length===1){ var now=Date.now(); var dt=now-_tapT; if(dt<350){ var tdx=Math.abs(e.changedTouches[0].clientX-_lastTapX); var tdy=Math.abs(e.changedTouches[0].clientY-_lastTapY); if(now-_lastTapT<350&&tdx<30&&tdy<30){ // Double-tap detected — reset view (mirrors dblclick handler). // Clear _lastTapT so a third tap starts a new double-tap window. _lastTapT=0; vb={x:0,y:0,w:W,h:H};setVB(); }else{ // Single tap — fire click for tooltip toggle, record for next double-tap check. _lastTapT=now; _lastTapX=e.changedTouches[0].clientX; _lastTapY=e.changedTouches[0].clientY; _tapEl.dispatchEvent(new MouseEvent('click',{bubbles:true,cancelable:true,view:window})); } } } _tapEl=null; if(e.touches.length===0){isPanning=false;panStart=null;} if(e.touches.length<2){pinchDist=0;pinchStartVB=null;} }); svg.addEventListener('dblclick',function(){vb={x:0,y:0,w:W,h:H};setVB();}); } // ── Open lightbox ───────────────────────────────────────────────── window.lsOpenLightbox=function(svgId,svgW,svgH,chartTitle){ var W=svgW||900,H=svgH||390; titleEl.textContent=chartTitle||''; var orig=document.getElementById(svgId); if(!orig)return; var clone=orig.cloneNode(true); clone.querySelectorAll('script').forEach(function(s){s.parentNode.removeChild(s);}); clone.removeAttribute('id'); // width+height 100% fills the holder completely; the SVG's viewBox (managed by // initZoom) controls which part of the chart coordinate space is visible. // Changing the viewBox never changes the SVG element's screen size, so zoom and // pan always use the full screen area below the header — no clipping. // max-width is reset because the original inline style carries max-width:900px // which would cap the SVG at its inline-chart width regardless of screen size. clone.style.maxWidth='none'; clone.style.width='100%'; clone.style.height='100%'; clone.style.touchAction='none'; clone.style.cursor='grab'; holder.innerHTML=''; holder.appendChild(clone); _savedBodyOverflow=document.body.style.overflow||''; document.body.style.overflow='hidden'; ov.style.display='flex'; initZoom(clone,W,H); }; })(); //]]></script> <h2 class="relative group">1920s <div id="1920s" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#1920s" aria-label="Anchor">#</a> </span> </h2> <h3 class="relative group">Standstill Extremes <div id="standstill-extremes" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#standstill-extremes" aria-label="Anchor">#</a> </span> </h3> <p><strong>Northern Hemisphere</strong></p>