courses:ast100:4
Differences
This shows you the differences between two versions of the page.
| Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
| courses:ast100:4 [2026/03/18 07:24] – asad | courses:ast100:4 [2026/03/25 05:09] (current) – asad | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| ====== 4. Planetary Age ====== | ====== 4. Planetary Age ====== | ||
| - | ===== - Event highlights | + | ===== - Timeline |
| < | < | ||
| < | < | ||
| <meta charset=" | <meta charset=" | ||
| <meta name=" | <meta name=" | ||
| - | < | + | < |
| </ | </ | ||
| < | < | ||
| Line 13: | Line 14: | ||
| < | < | ||
| /* Container ID: # | /* Container ID: # | ||
| - | | + | |
| */ | */ | ||
| # | # | ||
| - | /* Elegant | + | /* Elegant Theme Variables */ |
| - | --bg-color: #ffffff; | + | --bg: #ffffff; |
| - | --panel-bg: #f8f9fa; | + | --text-main: #1a202c; |
| - | --text-primary: #2d3748; | + | --text-muted: #4a5568; |
| - | --text-secondary: #718096; | + | --border: #e2e8f0; |
| - | --accent-color: #4a5568; | + | --hover: #f8fafc; |
| - | --border-color: #e2e8f0; | + | --accent: #2b6cb0; |
| - | --line-color: #cbd5e0; | + | --transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1); |
| | | ||
| /* Typography & Layout */ | /* Typography & Layout */ | ||
| font-family: | font-family: | ||
| - | background-color: | + | background-color: |
| - | color: var(--text-primary); | + | max-width: |
| - | line-height: | + | margin: |
| - | width: 100%; | + | padding: |
| - | max-width: | + | |
| - | display: block; | + | |
| - | margin: | + | |
| - | padding: | + | |
| } | } | ||
| Line 42: | Line 39: | ||
| } | } | ||
| - | /* Timeline Styling | + | /* Table Architecture |
| - | # | + | # |
| - | | + | |
| - | | + | |
| - | | + | |
| + | border-radius: | ||
| + | box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.025); | ||
| + | overflow: hidden; | ||
| } | } | ||
| - | | + | # |
| - | | + | |
| - | | + | |
| - | position: absolute; | + | |
| - | left: 24px; | + | |
| - | top: 0; | + | |
| - | | + | |
| - | width: 2px; | + | |
| - | background: | + | |
| } | } | ||
| - | # | + | # |
| - | | + | |
| - | margin-bottom: | + | |
| } | } | ||
| - | # | + | |
| - | | + | |
| + | display: flex; | ||
| + | padding: 22px 30px; | ||
| + | cursor: pointer; | ||
| + | align-items: center; | ||
| + | | ||
| + | transition: var(--transition); | ||
| } | } | ||
| - | | + | # |
| - | | + | background: var(--hover); |
| - | position: absolute; | + | |
| - | left: -32px; | + | |
| - | top: 8px; | + | |
| - | width: 16px; | + | |
| - | height: 16px; | + | |
| - | border-radius: | + | |
| - | background-color: #fff; | + | |
| - | border: 3px solid var(--accent-color); | + | |
| - | z-index: 2; | + | |
| } | } | ||
| - | # | + | # |
| - | | + | |
| - | font-size: 0.85rem; | + | |
| font-weight: | font-weight: | ||
| - | | + | |
| - | margin-bottom: 10px; | + | |
| - | | + | |
| - | padding: 4px 12px; | + | |
| - | border-radius: 20px; | + | |
| - | text-transform: uppercase; | + | |
| letter-spacing: | letter-spacing: | ||
| } | } | ||
| - | # | + | # |
| - | font-size: 1.3rem; | + | flex: 1 1 auto; |
| - | | + | font-weight: 600; |
| - | color: | + | |
| - | | + | color: |
| - | line-height: | + | |
| + | line-height: | ||
| } | } | ||
| - | # | + | |
| - | color: #4a5568; | + | |
| + | flex: 0 0 32px; | ||
| + | display: flex; | ||
| + | align-items: | ||
| + | justify-content: | ||
| + | width: 32px; | ||
| + | height: 32px; | ||
| + | border-radius: | ||
| + | background: #edf2f7; | ||
| + | color: | ||
| + | transition: var(--transition); | ||
| + | } | ||
| + | |||
| + | | ||
| + | width: 16px; | ||
| + | height: 16px; | ||
| + | transition: var(--transition); | ||
| + | fill: none; | ||
| + | stroke: currentColor; | ||
| + | stroke-width: | ||
| + | stroke-linecap: | ||
| + | stroke-linejoin: | ||
| + | } | ||
| + | |||
| + | /* Active State */ | ||
| + | # | ||
| + | background: var(--hover); | ||
| + | } | ||
| + | |||
| + | # | ||
| + | transform: rotate(180deg); | ||
| + | background: var(--accent); | ||
| + | color: var(--bg); | ||
| + | } | ||
| + | |||
| + | /* Expanded Content */ | ||
| + | # | ||
| + | max-height: 0; | ||
| + | overflow: hidden; | ||
| + | transition: max-height 0.4s cubic-bezier(0.4, | ||
| + | background: var(--hover); | ||
| + | } | ||
| + | |||
| + | # | ||
| + | padding: 0 30px 30px 180px; /* Aligns with the title text (150 width + 30 padding) */ | ||
| font-size: 1.05rem; | font-size: 1.05rem; | ||
| - | | + | line-height: |
| - | | + | color: var(--text-muted); |
| + | text-align: justify; | ||
| } | } | ||
| /* Mobile Optimization */ | /* Mobile Optimization */ | ||
| - | @media (max-width: | + | @media (max-width: |
| - | # | + | # |
| - | # | + | flex-wrap: wrap; |
| - | #doku-cosmic-light .timeline::before { left: 19px; } | + | |
| - | # | + | |
| - | # | + | # |
| + | flex: 1 1 100%; | ||
| + | | ||
| + | font-size: 0.85rem; | ||
| + | | ||
| + | # | ||
| + | font-size: 1.05rem; | ||
| + | padding-right: 15px; | ||
| + | | ||
| + | # | ||
| + | padding: 0 20px 24px 20px; | ||
| + | | ||
| } | } | ||
| </ | </ | ||
| - | <div class=" | + | <div class=" |
| - | < | + | |
| - | <div class=" | + | < |
| - | <span class=" | + | <div class=" |
| - | <h3 class=" | + | <div class=" |
| - | <p class=" | + | <div class=" |
| - | | + | <div class=" |
| + | <div class=" | ||
| + | <svg viewBox=" | ||
| + | </div> | ||
| + | </div> | ||
| + | < | ||
| + | <div class=" | ||
| + | | ||
| + | | ||
| + | </ | ||
| </ | </ | ||
| - | < | + | < |
| - | <div class=" | + | <div class=" |
| - | <span class=" | + | <div class=" |
| - | <h3 class=" | + | <div class=" |
| - | <p class=" | + | <div class=" |
| - | | + | <div class=" |
| + | <svg viewBox=" | ||
| + | </div> | ||
| + | </div> | ||
| + | < | ||
| + | <div class=" | ||
| + | During this critical period of planetary formation, the young Sun entered a highly | ||
| + | | ||
| + | </ | ||
| </ | </ | ||
| - | < | + | < |
| - | <div class=" | + | <div class=" |
| - | <span class=" | + | <div class=" |
| - | <h3 class=" | + | <div class=" |
| - | <p class=" | + | <div class=" |
| - | | + | <div class=" |
| + | <svg viewBox=" | ||
| + | </div> | ||
| + | </div> | ||
| + | < | ||
| + | <div class=" | ||
| + | As the early Earth continued to accrete mass, the immense kinetic energy from constant impacts, combined with the heat released | ||
| + | | ||
| + | </ | ||
| </ | </ | ||
| - | < | + | < |
| - | <div class=" | + | <div class=" |
| - | <span class=" | + | <div class=" |
| - | <h3 class=" | + | <div class=" |
| - | <p class=" | + | <div class=" |
| - | | + | <div class=" |
| + | <svg viewBox=" | ||
| + | </div> | ||
| + | </div> | ||
| + | < | ||
| + | <div class=" | ||
| + | Amidst the chaotic environment of the early Solar System, the newly differentiated Earth experienced a cataclysmic collision that would forever alter its developmental trajectory. | ||
| + | | ||
| + | </ | ||
| </ | </ | ||
| - | < | + | < |
| - | <div class=" | + | <div class=" |
| - | <span class=" | + | <div class=" |
| - | <h3 class=" | + | <div class=" |
| - | <p class=" | + | <div class=" |
| - | | + | <div class=" |
| + | <svg viewBox=" | ||
| + | </div> | ||
| + | </div> | ||
| + | < | ||
| + | <div class=" | ||
| + | | ||
| + | | ||
| + | </ | ||
| </ | </ | ||
| - | < | + | < |
| - | <div class=" | + | <div class=" |
| - | <span class=" | + | <div class=" |
| - | <h3 class=" | + | <div class=" |
| - | <p class=" | + | <div class=" |
| - | | + | <div class=" |
| + | <svg viewBox=" | ||
| + | </div> | ||
| + | </div> | ||
| + | < | ||
| + | <div class=" | ||
| + | Despite the formation of early oceans, the inner Solar System remained an incredibly violent neighborhood. | ||
| + | | ||
| + | </ | ||
| </ | </ | ||
| - | < | + | < |
| - | <div class=" | + | <div class=" |
| - | <span class=" | + | <div class=" |
| - | <h3 class=" | + | <div class=" |
| - | <p class=" | + | <div class=" |
| - | | + | <div class=" |
| + | <svg viewBox=" | ||
| + | </div> | ||
| + | </div> | ||
| + | < | ||
| + | <div class=" | ||
| + | Eventually, the frequency of massive impacts subsided, allowing the Planetary Age to draw to a close through | ||
| + | | ||
| + | </ | ||
| </ | </ | ||
| + | |||
| </ | </ | ||
| + | |||
| + | < | ||
| + | function toggleRow(element) { | ||
| + | const row = element.parentElement; | ||
| + | const content = row.querySelector(' | ||
| + | const inner = row.querySelector(' | ||
| + | | ||
| + | // Toggle the active class for styling and rotation | ||
| + | row.classList.toggle(' | ||
| + | | ||
| + | // Calculate and set the max-height to smoothly animate the opening | ||
| + | if (row.classList.contains(' | ||
| + | content.style.maxHeight = inner.scrollHeight + " | ||
| + | } else { | ||
| + | content.style.maxHeight = " | ||
| + | } | ||
| + | } | ||
| + | | ||
| + | // Ensure heights are recalculated if the window is resized to prevent content clipping | ||
| + | window.addEventListener(' | ||
| + | document.querySelectorAll(' | ||
| + | const inner = content.querySelector(' | ||
| + | content.style.maxHeight = inner.scrollHeight + " | ||
| + | }); | ||
| + | }); | ||
| + | </ | ||
| </ | </ | ||
| Line 182: | Line 307: | ||
| </ | </ | ||
| - | ===== - Event details | + | ===== - Telescope |
| + | {{youtube> | ||
| + | \\ | ||
| + | The Kepler Space Telescope, the definitive instrument for the Planetary Age in the AST 100 curriculum, revolutionized our understanding of the cosmos by transitioning exoplanet study from theory to statistical reality. Launched in 2009, Kepler utilized a high-resolution photometer to monitor over 150,000 stars simultaneously in a fixed field of view within the Cygnus and Lyra constellations. By detecting the minute, periodic dimming of starlight caused by a planet crossing in front of its host star—a technique known as the transit method—Kepler proved that planets are ubiquitous throughout our galaxy. | ||
| + | |||
| + | Technologically, | ||
| + | |||
| + | In the broader context of cosmic history, Kepler’s legacy provides the essential bridge between the Stellar Age and the Chemical Age. By identifying the frequency of planetary systems, it shifted the scientific focus from how stars form to how frequently they produce environments capable of hosting complex chemistry. Although the primary mission ended in 2018, its vast archive of data continues to be mined by researchers and " | ||
courses/ast100/4.1773840264.txt.gz · Last modified: by asad
