Site Builder

Editing: amber.html

writable 0666

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>RF Safe • Modern Page with Amber Mode</title>

<style>
:root{
    /* Light / default theme */
    --bg-color: #ffffff;
    --text-color: #222222;
    --header-bg: #f8f9fa;
    --accent: #6a2be2;              /* purple accent (John’s favourite) */
    --link-color: var(--accent);
    --card-bg: #f2f3f5;
    --font-body: "Inter", system-ui, sans-serif;
    --font-heading: "Inter", system-ui, sans-serif;
}
/* Amber‑mode overrides defined once, applied by JS: body.amber-mode { … } */
body.amber-mode{
    --bg-color: #121212;            /* smoky CRT “glass” */
    --text-color: #ffbf60;          /* warm amber phosphor */
    --header-bg: #1a1a1a;
    --accent: #ffbf60;
    --link-color: #ffd27a;
    --card-bg: #1d1d1d;
    --font-body: "Courier New", Courier, monospace;
    --font-heading: "Courier New", Courier, monospace;
}

*{box-sizing:border-box; margin:0; padding:0;}
html,body{background:var(--bg-color); color:var(--text-color);
          font-family:var(--font-body); line-height:1.6; transition:all .35s ease;}
header{
    background:var(--header-bg); padding:1rem 2rem; display:flex;
    align-items:center; justify-content:space-between; border-bottom:1px solid #e0e0e0;
}
header h1{font-family:var(--font-heading); font-size:1.25rem;}
main{padding:2rem 1rem; max-width:880px; margin:auto;}
.hero{margin-bottom:2rem; text-align:center;}
.hero h2{font-family:var(--font-heading); font-size:2rem; margin-bottom:.5rem;}
.hero p{font-size:1.1rem;}

.toggle{
    display:flex; align-items:center; gap:.5rem; font-size:.9rem;
}
.toggle input{appearance:none; width:46px; height:24px; background:#ccc; border-radius:9999px;
    position:relative; outline:none; cursor:pointer; transition:background .3s;}
.toggle input::before{
    content:""; position:absolute; left:3px; top:3px; width:18px; height:18px; border-radius:50%;
    background:#fff; transition:transform .3s;
}
.toggle input:checked{background:#ffbf60;}
.toggle input:checked::before{transform:translateX(22px);}

article{background:var(--card-bg); padding:1.5rem 1.75rem; border-radius:8px; box-shadow:0 2px 4px rgba(0,0,0,.04);}
article h3{font-family:var(--font-heading); margin:1.2rem 0 .5rem;}
blockquote{
    border-left:4px solid var(--accent); padding-left:1rem; margin:1rem 0;
    font-style:italic; opacity:.9;
}
a{color:var(--link-color); text-decoration:none;}
a:hover{text-decoration:underline;}
footer{margin-top:3rem; padding:1rem; text-align:center; font-size:.85rem; opacity:.7;}

/* Optional subtle CRT scan‑lines effect, activated only in amber mode */
body.amber-mode::after{
    content:""; pointer-events:none; position:fixed; inset:0;
    background:linear-gradient(rgba(0,0,0,.15) 50%, transparent 50%);
    background-size:100% 2px; mix-blend-mode:overlay; opacity:.3;
}
</style>
</head>

<label class="toggle">
        <span>Amber Mode</span>
        <input type="checkbox" id="amberToggle" aria-label="Toggle amber mode">
    </label>
</header>

<main>
    
    <section class="hero">
        <h2>A Safer Wireless Future</h2>
        <p>Modern connectivity shouldn’t cost our health. Explore how RF&nbsp;Safe protects you today while advocating for tomorrow’s safer standards.</p>
    </section>

<article>
        <h3>Why We Can’t Wait to Update RF Regulations</h3>
        <p>It has been <strong>25 years</strong> since the FCC last revised its exposure limits. In that time, mobile traffic exploded by over 100 000 ×, yet research funding <em>fell</em>. The National Toxicology Program’s landmark study linked long‑term cell‑phone radiation to rare heart and brain tumors, but its budget was cut days after publishing.</p>

<blockquote>“Radiation standards that ignore non‑thermal biological effects belong in a museum, not on public policy.” — John Coates, RF Safe founder</blockquote>

<p>Shielding accessories buy us time, but the real fix is systemic: enforce <abbr title="Radiation Control for Health and Safety Act of 1968">Public Law 90‑602</abbr>, restore <abbr title="National Toxicology Program">NTP</abbr> funding, and modernize the FCC’s guidelines so technology serves people—not the other way around.</p>

<h3>What You Can Do Today</h3>
        <ul>
            <li>Keep phones away from the body when possible (use speaker‑phone or air‑tube headsets).</li>
            <li>Replace bedtime scrolling with download‑then‑airplane‑mode habits—your circadian rhythm will thank you.</li>
            <li>Support legislation that mandates <strong>Li‑Fi</strong> in schools and space‑based “direct‑to‑device” networks to move high‑power RF sources off our streets.</li>
        </ul>

<p>Change is coming. Until then, hit the switch above and give your retinas (and mitochondria) a rest in <em>classic amber mode</em>.</p>
    </article>
</main>

<script>
document.getElementById('amberToggle').addEventListener('change', e=>{
    document.body.classList.toggle('amber-mode', e.target.checked);
});
</script>
</body>
</html>

Site Builder

Editing: amber.html

Site Builder