courses:ast100:0
Differences
This shows you the differences between two versions of the page.
| Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
| courses:ast100:0 [2026/01/18 05:26] – [1.1 Particle age] asad | courses:ast100:0 [2026/02/01 09:01] (current) – asad | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ====== | + | ====== |
| + | Slides: https:// | ||
| The history of the universe is divided into seven distinct ages based on the increasing complexity of matter and life. It begins with the Particle age, spanning the first 300,000 years, where fundamental particles and the first atoms formed. This was followed by the Galactic age, lasting from 300,000 years to 4 billion years, during which the first large-scale structures and galaxies assembled. The Stellar age ensued from 4 billion to 9 billion years, marked by the peak of star formation and the creation of heavier elements. Following this, the Planetary age occurred between 9 billion and 11 billion years, seeing the birth of solar systems and solid worlds. The timeline then transitions into the Chemical age (11 to 13 billion years), where complex organic molecules began to synthesize, paving the way for the Biological age (13 to 14 billion years), representing the rise of complex life on water and land. Finally, the Cultural age occupies the most recent 300,000 years, defined by the emergence of humanity, technology, and complex culture. | The history of the universe is divided into seven distinct ages based on the increasing complexity of matter and life. It begins with the Particle age, spanning the first 300,000 years, where fundamental particles and the first atoms formed. This was followed by the Galactic age, lasting from 300,000 years to 4 billion years, during which the first large-scale structures and galaxies assembled. The Stellar age ensued from 4 billion to 9 billion years, marked by the peak of star formation and the creation of heavier elements. Following this, the Planetary age occurred between 9 billion and 11 billion years, seeing the birth of solar systems and solid worlds. The timeline then transitions into the Chemical age (11 to 13 billion years), where complex organic molecules began to synthesize, paving the way for the Biological age (13 to 14 billion years), representing the rise of complex life on water and land. Finally, the Cultural age occupies the most recent 300,000 years, defined by the emergence of humanity, technology, and complex culture. | ||
| Line 8: | Line 10: | ||
| The analogy between time and a river suggests that history is a directional flow that gains complexity and volume as it moves toward its destination. Just as a river begins at a narrow, high-energy mountain source and carves a single path through the landscape, the past is a defined sequence of events that becomes more " | The analogy between time and a river suggests that history is a directional flow that gains complexity and volume as it moves toward its destination. Just as a river begins at a narrow, high-energy mountain source and carves a single path through the landscape, the past is a defined sequence of events that becomes more " | ||
| - | ===== - Timeline ===== | + | ===== - Timelines ===== |
| + | < | ||
| + | <div id=" | ||
| + | <style scoped> | ||
| + | /* SCOPED CSS FOR DOKUWIKI | ||
| + | | ||
| + | | ||
| + | */ | ||
| + | |||
| + | # | ||
| + | /* Elegant Light Theme Variables */ | ||
| + | --bg-color: #ffffff; | ||
| + | --panel-bg: #f8f9fa; | ||
| + | --text-primary: | ||
| + | --text-secondary: | ||
| + | --accent-color: | ||
| + | --border-color: | ||
| + | --hover-color: | ||
| + | --line-color: | ||
| + | |||
| + | /* Typography & Layout */ | ||
| + | font-family: | ||
| + | background-color: | ||
| + | color: var(--text-primary); | ||
| + | line-height: | ||
| + | width: 100%; | ||
| + | display: block; | ||
| + | margin: 0; | ||
| + | padding: 10px 0; | ||
| + | } | ||
| + | |||
| + | /* Enforce box-sizing */ | ||
| + | # | ||
| + | box-sizing: border-box; | ||
| + | } | ||
| + | |||
| + | /* Accordion Section */ | ||
| + | # | ||
| + | border-bottom: | ||
| + | background-color: | ||
| + | transition: background-color 0.2s ease; | ||
| + | } | ||
| + | |||
| + | # | ||
| + | border-top: 1px solid var(--border-color); | ||
| + | } | ||
| + | |||
| + | /* Header Styling */ | ||
| + | # | ||
| + | padding: 20px 15px; | ||
| + | cursor: pointer; | ||
| + | display: flex; | ||
| + | justify-content: | ||
| + | align-items: | ||
| + | user-select: | ||
| + | position: relative; | ||
| + | } | ||
| + | |||
| + | # | ||
| + | background-color: | ||
| + | } | ||
| + | |||
| + | # | ||
| + | display: flex; | ||
| + | flex-direction: | ||
| + | } | ||
| + | |||
| + | # | ||
| + | font-size: 1.1rem; | ||
| + | font-weight: | ||
| + | text-transform: | ||
| + | letter-spacing: | ||
| + | color: var(--text-primary); | ||
| + | margin-bottom: | ||
| + | } | ||
| + | |||
| + | # | ||
| + | font-size: 0.95rem; | ||
| + | color: var(--text-secondary); | ||
| + | font-family: | ||
| + | font-style: italic; | ||
| + | } | ||
| + | |||
| + | # | ||
| + | font-size: 1.2rem; | ||
| + | color: var(--text-secondary); | ||
| + | transition: transform 0.3s ease; | ||
| + | margin-left: | ||
| + | } | ||
| + | |||
| + | /* Content Area */ | ||
| + | # | ||
| + | max-height: 0; | ||
| + | overflow: hidden; | ||
| + | transition: max-height 0.5s ease-out; | ||
| + | background-color: | ||
| + | } | ||
| + | |||
| + | /* Timeline | ||
| + | # | ||
| + | position: relative; | ||
| + | padding: 40px 20px 40px 40px; | ||
| + | max-width: 800px; | ||
| + | margin: 0 auto; | ||
| + | } | ||
| + | |||
| + | /* Vertical Line */ | ||
| + | # | ||
| + | content: ''; | ||
| + | position: absolute; | ||
| + | left: 19px; /* Aligns with the dot center */ | ||
| + | top: 45px; | ||
| + | bottom: 45px; | ||
| + | width: 2px; | ||
| + | background: var(--line-color); | ||
| + | } | ||
| + | |||
| + | # | ||
| + | position: relative; | ||
| + | padding-left: | ||
| + | margin-bottom: | ||
| + | } | ||
| + | |||
| + | # | ||
| + | margin-bottom: | ||
| + | } | ||
| + | |||
| + | /* Timeline Dot */ | ||
| + | # | ||
| + | position: absolute; | ||
| + | left: -26px; /* Adjust based on padding-left */ | ||
| + | top: 6px; | ||
| + | width: 12px; | ||
| + | height: 12px; | ||
| + | border-radius: | ||
| + | background-color: | ||
| + | border: 2px solid var(--accent-color); | ||
| + | z-index: 2; | ||
| + | } | ||
| + | |||
| + | # | ||
| + | display: inline-block; | ||
| + | font-size: 0.85rem; | ||
| + | font-weight: | ||
| + | color: var(--accent-color); | ||
| + | margin-bottom: | ||
| + | background: #e2e8f0; | ||
| + | padding: 2px 8px; | ||
| + | border-radius: | ||
| + | } | ||
| + | |||
| + | # | ||
| + | font-size: 1.15rem; | ||
| + | margin: 0 0 8px 0; | ||
| + | color: #1a202c; | ||
| + | font-weight: | ||
| + | line-height: | ||
| + | } | ||
| + | |||
| + | # | ||
| + | color: #4a5568; | ||
| + | font-size: 0.95rem; | ||
| + | margin: 0; | ||
| + | line-height: | ||
| + | } | ||
| + | |||
| + | /* Math Superscripts */ | ||
| + | # | ||
| + | font-size: 0.7em; | ||
| + | vertical-align: | ||
| + | line-height: | ||
| + | } | ||
| + | |||
| + | /* Animation States */ | ||
| + | # | ||
| + | transform: rotate(180deg); | ||
| + | } | ||
| + | |||
| + | # | ||
| + | max-height: 3000px; /* Large enough to fit content */ | ||
| + | border-bottom: | ||
| + | } | ||
| + | |||
| + | /* Mobile Optimization */ | ||
| + | @media (max-width: 600px) { | ||
| + | # | ||
| + | # | ||
| + | # | ||
| + | # | ||
| + | # | ||
| + | # | ||
| + | } | ||
| + | </ | ||
| + | |||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <span class=" | ||
| + | </ | ||
| + | <span class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | |||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <span class=" | ||
| + | </ | ||
| + | <span class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | |||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <span class=" | ||
| + | </ | ||
| + | <span class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | |||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <span class=" | ||
| + | </ | ||
| + | <span class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | |||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <span class=" | ||
| + | </ | ||
| + | <span class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | |||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <span class=" | ||
| + | </ | ||
| + | <span class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | |||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <span class=" | ||
| + | </ | ||
| + | <span class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | <div class=" | ||
| + | <span class=" | ||
| + | <h3 class=" | ||
| + | <p class=" | ||
| + | <div class=" | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
| + | |||
| + | < | ||
| + | (function() { | ||
| + | const wrapper | ||
| + | if (!wrapper) return; | ||
| + | |||
| + | const headers | ||
| - | ==== - Particle age ==== | + | headers.forEach(header |
| - | ^ Approximate Time ^ Event Name ^ Description ^ | + | |
| - | | $0$ | **The Big Bang** | The singularity event marking the origin of space, time, energy and matter | + | const content = header.nextElementSibling; |
| - | | $10^{-35}$ to $10^{-32}$ seconds | **Cosmic Inflation** | A brief, exponential expansion where the universe swells in size by a factor of roughly $10^{50}$. This process smoothed out initial irregularities. | | + | const icon = header.querySelector('.toggle-icon' |
| - | | $10^{-43}$ to $10^{-10}$ seconds | **Separation of Forces** | As the universe cooled, the single unified " | + | |
| - | | $10^{-35}$ to 1 second | **Particle Creation & Annihilation** | Energy converted into matter via "pair production" | + | |
| - | | 3 minutes to 15 minutes | **Primordial Nucleosynthesis** | The universe cooled sufficiently (below $10^9$ K) for protons and neutrons to fuse. This " | + | |
| - | | 50,000 years | **Matter Domination** | The " | + | |
| - | | 300,000 to 380,000 years | **Recombination & Decoupling** | Electrons combined with nuclei to form neutral atoms (recombination). This neutralized the charged fog, allowing photons to travel freely (decoupling), observable today as the Cosmic Microwave Background (CMB). | | + | |
| + | // Toggle class for animation | ||
| + | content.classList.toggle(' | ||
| + | icon.classList.toggle(' | ||
| + | }); | ||
| + | }); | ||
| + | })(); | ||
| + | </ | ||
| + | </ | ||
| + | </ | ||
courses/ast100/0.1768739192.txt.gz · Last modified: by asad
