ravel

ravel.html

<details>
    <summary>welcome to ravel!</summary>
    <details>
        <summary>ravel is a tool for making unfolding texts out of the html details tag.</summary>
        <details>
            <summary>write text in the "Write" tab, left</summary>
            <div>(click on any piece of text to edit it)</div>
            <details>
                <summary>while writing, press enter to make a new node of editable text</summary>
                <div>it will be nested under the node you were writing in</div>
                <div>you can drag and drop nodes to reorder them</div>
            </details>
            <details>
                <summary>hit the [x] to delete a node, and the [+] to make a new node</summary>
                <details>
                    <summary>be careful! if the node you're deleting has nested nodes, it will delete them too</summary>
                    <div>(with a warning, of course)</div>
                </details>
            </details>
            <details>
                <summary>changes are saved (you can leave this page and come back to your work later)</summary>
                <div>but to be safe, you should probably work in a separate document</div>
            </details>
        </details>
        <details>
            <summary>preview text in the "View" tag, center</summary>
            <div>you can interact with it here, and collapse and expand details</div>
        </details>
        <details>
            <summary>grab your code out of the "Code" tab, right</summary>
            <details>
                <summary>you can put this code on any website that supports html!</summary>
                <div>there are a few options for indentation - or style it further with css!</div>
            </details>
        </details>
        <details>
            <summary>ravel is developed by Everest Pipkin</summary>
            <details>
                <summary>it is still in beta, and may be buggy or unstable</summary>
                <div>check back in soon for changes and updates!</div>
            </details>
        </details>
    </details>
</details>