Site Builder

Editing: light-prompts.html

writable 0666

<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Everything‑token bedtime‑story prompt</title>

<link rel="stylesheet"
        href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css">

<style>
    .token { color:#5c3bff; font-weight:600; cursor:pointer; }
    dialog { border:none; border-radius:10px; max-width:440px; padding:0; }
    dialog::backdrop { background:rgba(0,0,0,0.4); }
    .popup-body {
      background:#fff;
      padding:1.3rem 1.6rem;
      border-radius:12px;
      box-shadow:0 4px 26px rgba(0,0,0,0.2);
    }
    fieldset {
      border:1px solid #ccd;
      border-radius:8px;
      padding:.8rem 1rem;
      background:#fff;
      margin-bottom:1rem;
    }
    iframe {
      border:1px solid #ccd;
      width:100%;
      min-height:340px;
      margin-top:.6rem;
    }
    .ai-buttons {
      margin-top:1rem;
      display:flex;
      gap:0.5rem;
    }
  </style>
</head>
<body>

<h1>🔧 Everything‑token bedtime‑story prompt</h1>

<div id="prompt-app"
       data-prompt="Write a bedtime story titled [A-story_title-~Magical Night Adventure~] for a [D-child_gender-|girl|boy|~girl~] named [child_name~Melanie~].

Provide exactly [D-paragraphs-5~3~] paragraphs.

(If you need inspiration open the reference site below.) [I-reference-|https://en.wikipedia.org/wiki/Bedtime_story|https://www.gutenberg.org/|~Pick a site~]">
  </div>

<div class="ai-buttons">
    <button type="button" onclick="openPrompt('chatgpt')">ChatGPT</button>
    <button type="button" onclick="openPrompt('perplexity')">Perplexity</button>
    <button type="button" onclick="openPrompt('copilot')">Copilot</button>
  </div>

<script type="module">
    import Promptify from './promptify.js';
    document.addEventListener('DOMContentLoaded', () => {
      const app = document.getElementById('prompt-app');
      Promptify.init({ template: app.dataset.prompt, mount: app });
    });
  </script>

<script>
    window.openPrompt = function(engine) {
      const urls = {
        chatgpt:    'https://chat.openai.com/?prompt=',
        perplexity: 'https://www.perplexity.ai/search?q=',
        copilot:    'https://copilot.microsoft.com/?q='
      };
      const app = document.getElementById('prompt-app');
      const text = app.innerText.trim();
      window.open(urls[engine] + encodeURIComponent(text), '_blank');
    };
  </script>

</body>
</html>

Site Builder

Editing: light-prompts.html

Site Builder