<div class="gh-flow gh-done">
    <main class="flex flex-row h-100">
        <div class="gh-done-sidebar">
            <div class="flex flex-column h-100">
                <div class="gh-nav-body">
                    <div class="gh-done-panel">
                        <div class="gh-stack">
                            <header>
                                <h1>All done!</h1>
                                <p>Your brand new publication is set up and ready to go.</p>
                            </header>
                            <h4>What do you want to do first?</h4>
                            <section>
                                <LinkTo class="gh-done-yellow" @route="lexical-editor.new" @model="post">
                                    <span>{{svg-jar "posts"}}</span>
                                    <h6>Write your first post</h6>
                                    <p>Test out the editor and get a feel for creating content inside Ghost.</p>
                                </LinkTo>
                                <LinkTo class="gh-done-green" @route="settings-x">
                                    <span>{{svg-jar "paint-palette"}}</span>
                                    <h6>Customize your site</h6>
                                    <p>Review your settings and tweak the design to make your site just right.</p>
                                </LinkTo>
                                <LinkTo class="gh-done-blue" @route="members.import">
                                    <span>{{svg-jar "members"}}</span>
                                    <h6>Import members</h6>
                                    <p>Move your audience over to Ghost with our migration tools and guides.</p>
                                </LinkTo>
                                <LinkTo class="gh-done-pink" @route="dashboard">
                                   <span>{{svg-jar "house"}}</span>
                                    <h6>Explore Ghost admin</h6>
                                    <p>View the dashboard, click around, and explore Ghost for yourself.</p>
                                </LinkTo>
                            </section>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="gh-done-preview">
            <GhBrowserPreview>
                <GhHtmlIframe class="site-frame" @html={{this.themeManagement.previewHtml}} />
            </GhBrowserPreview>
        </div>
    </main>
</div>