index.html

---
layout: default
---
<section id="home">
    <header>
        <nav>
            <a href="{{ site.links.github }}">GitHub</a>
            <a href="{{ site.links.discord }}">Discord</a>
            <a href="{{ site.links.twitter }}">Twitter</a>
            <a href="/blog">Blog</a>
        </nav>
    </header>
    <div class="front-container">
        <img src="/assets/icon.png" alt="{{ site.title }} icon" class="icon hhidden" />
        <div class="title">
            <h1>{{ site.title }}</h1>
            <h2>The Linux shell for iOS.</h2>
            <div class="actions">
                <a class="get" href="{{ site.links.appstore }}">
                    <img src="/assets/appstore.svg" alt="Apple App Store icon" />
                    <p>Get on the App Store</p>
                </a>
            </div>
            <div class="actions">
                <a class="get" href="/altstore">
                    <img src="/assets/altstore.png" alt="AltStore icon" />
                    <p>Get {{ site.title }} on AltStore</p>
                </a>
            </div>
        </div>
        <picture>
            <source type="image/webp" media="(prefers-color-scheme: dark)" srcset="/assets/front-iphone-dark.webp">
            <source type="image/webp" srcset="/assets/front-iphone.webp">
            <source type="image/png" media="(prefers-color-scheme: dark)" srcset="/assets/front-iphone-dark.png">
            <source type="image/png" srcset="/assets/front-iphone.png">
            <img class="iphone" src="/assets/front-iphone.png" alt="{{ site.title }} running on an iPhone">
        </picture>
    </div>
</section>

<section id="info" class="alt-section">
    <h1><strong>Wait, what's {{ site.title }}?</strong></h1>
    <p>
        {{ site.title }} is a project to get a Linux shell environment running locally on your iOS device, using a usermode x86 emulator.
    </p>
    <div class="tidbits">
        <div class="tidbit large">
            <h2>iPadOS? You bet.</h2>
            <p>{{ site.title }} also runs on iPad, bringing a terminal to larger displays as well.</p>
            <div class="growth"></div>
            <picture>
                <source type="image/webp" media="(prefers-color-scheme: dark)" srcset="/assets/front-ipad-dark.webp">
                <source type="image/webp" srcset="/assets/front-ipad.webp">
                <source type="image/png" media="(prefers-color-scheme: dark)" srcset="/assets/front-ipad-dark.png">
                <source type="image/png" srcset="/assets/front-ipad.png">
                <img class="ipad" src="/assets/front-ipad.png" alt="{{ site.title }} running on an iPad">
            </picture>
            <div class="growth"></div>
        </div>
        <div class="tidbit">
            <h2>BusyBox</h2>
            <p>You can edit files with sed and cat, move them around, and more!</p>
            <picture>
                <source type="image/webp" media="(prefers-color-scheme: dark)" srcset="/assets/iphone-busybox-dark.webp">
                <source type="image/webp" srcset="/assets/iphone-busybox.webp">
                <source type="image/png" media="(prefers-color-scheme: dark)" srcset="/assets/iphone-busybox-dark.png">
                <source type="image/png" srcset="/assets/iphone-busybox.png">
                <img src="/assets/iphone-busybox.png" alt="Starting BusyBox on an iPhone">
            </picture>
        </div>
        <div class="tidbit">
            <h2>Keyboard CTRL</h2>
            <p>{{ site.title }}'s keyboard addition makes navigation easier.</p>
            <picture>
                <source type="image/webp" srcset="/assets/iphone-keyboard.webp">
                <source type="image/png" srcset="/assets/iphone-keyboard.png">
                <img src="/assets/iphone-keyboard.png" alt="The {{ site.title }} keyboard addition as seen on an iPhone">
            </picture>
        </div>
    </div>
</section>

<section id="get">
    <h1><strong>Sounds cool, can I get that?</strong></h1>
    <p>Of course, let's get started!</p>
    <div class="getcontainer">
        <div>
            <div class="actions">
                <a class="get" href="{{ site.links.appstore }}">
                    <img src="/assets/appstore.svg" alt="Apple App Store icon" />
                    <p>Get on the App Store</p>
                </a>
            </div>
            <a href="{{ site.links.testflight }}">
                <p class="mini-dl">Join the TestFlight Beta</p>
            </a>
        </div>
        <div class="midline"></div>
        <div>
            <div class="actions">
                <a class="get" href="/altstore">
                    <img src="/assets/altstore.png" alt="AltStore icon" />
                    <p>Get {{ site.title }} on AltStore</p>
                </a>
            </div>
            <a href="{{ site.links.github }}" class="">
                <p class="mini-dl">Build {{ site.title }} from source</p>
            </a>
        </div>
    </div>
    <div class="bottomtext">
        <p>You can <a href="{{ site.links.patreon }}">become a patron</a> if you would like support {{ site.title }}. Donations are very much appreciated, but will never be required; the app will always be completely free.</p>
    </div>
</section>

<section class="feed">
    <div class="version">
        {%- assign prerelease = site.github.releases | where: "prerelease", true | first -%}
        <h2>New in <strong>{{ site.github.latest_release.name }}</strong></h2>
        <div class="changelog"><p>{{ site.github.latest_release.body }}</p></div>
        <p>Latest pre-release: <a href="{{ prerelease.html_url }}">{{ prerelease.name }}</a></p>
    </div>
    <div class="posts">
        <h2><strong>Latest blog posts</strong></h2>
        {% for post in site.posts limit:3 %}
            <p>{{ post.date | date: "%Y-%m-%d" }} <a href="{{ post.url }}">{{ post.title }}</a></p>
        {% endfor %}
        <p><a href="/blog">View all</a></p>
    </div>
</section>

<footer>
    <p>{{ site.title }}, &copy; 2017–{{ 'now' | date: "%Y" }} | <a href="mailto:{{ site.email }}">{{ site.email }}</a></p>
</footer>