examples/starter.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8'>
    <script src='https://www.w3.org/Tools/respec/respec-w3c' async class='remove'></script>
    <script class='remove'>
      // All config options at https://respec.org/docs/
      var respecConfig = {
        // Working Groups ids at https://respec.org/w3c/groups/
        group: "webapps", 
        specStatus: "unofficial",
        editors: [{
          name: "Your Name",
          url: "http://your-site.com",
        }],
        github: {
          branch: "main",
          repoURL: "user/my-awesome-api", 
        },
        // See https://respec.org/docs/#xref for usage.
        xref: "web-platform",
      };
    </script>
  </head>
  <body>
    <h1 id="title">My Awesome API</h1>
    <section id='abstract'>
      <p>
        This is required.
      </p>
    </section>
    <section id='sotd'>
      <p>
        This is required.
      </p>
    </section>
    <section data-dfn-for="Foo">
      <h2>Start your spec!</h2>
      <pre class="idl">
      [Exposed=Window]
      interface Foo {
        attribute DOMString bar;
        undefined doTheFoo();
      };
      </pre>
      <section>
        <h2><dfn>bar</dfn> attribute</h2>
        <p>When getting, the {{Foo/bar}} attribute returns you a 🍹.</p>
      </section>
      <section>
        <h2><dfn>doTheFoo()</dfn> method</h2>
        <p>When called, {{Foo/doTheFoo()}} MUST behave as follows:</p>
        <ol class="algorithm">
          <li>If <var>thing</var>....</li>
          <li>Let <var>someProp</var>... of the [[DOM]] spec.</li>
        </ol>
      </section>
    </section>
    <section id='conformance'>
      <!-- This section is filled automatically by ReSpec. -->
    </section>
  </body>
</html>