<script lang="ts">
    import Content from "$lib/viewport/content.svelte";
    import Banner2 from "$lib/banner2.svelte";
    import TableOfContents from "$lib/components/table-of-contents.svelte";
    import SubtitledImage from "$lib/components/subtitled-image.svelte";
    import ImageGallery from "$lib/lists/image-gallery.svelte";

    export let data;

    // let a = load(0);    
</script>

<svelte:head>
    <title>Art Feed | denizk0461</title>
</svelte:head>

<Content>
    <Banner2
        title="Art Feed"
        banner="banner.webp"
        bannerAlt="Mirror picture of me, pixelated beyond recognition"
        subtitle="subtitle missing"
        date="2026-04-06"
        pixelated
    />


    {#each data.contents as post}
        <svelte:component this={post} />
    {/each}

    <p>Welcome to my (new) art feed! It is heavily inspired by <a href="https://deathsurplus.com/">DeathSurplus' art blog</a> – definitely go check out his page!</p>

    <p>This page is intended to offer a shared space for all my projects without the need to create strictly-separated pages for each hobby. Some other pages on this website have been merged into this one; namely the "Small Projects" and "Drawing Gallery" pages, so don't be surprised if content from those pages shows up here.</p>

    <p>I'll add some more of my past projects, new projects, and an option to filter by project type <i>soon™</i>. Maybe I'll also split the content into pages, if I ever figure out how to do that.</p>

    <p>I <b>MAY</b> merge this with the <a href="/projects">Projects</a> page, I've not yet decided.</p>

    <TableOfContents />

    

    <h2>3DS USB-C mod</h2>
    <p class="subtitle">DIY charging port mod</p>
    <p class="subtitle">October 2024</p>

    <SubtitledImage
        image="electronics/3ds-usb-c/showcase.mp4"
        subtitle="it charges via USB-C! also do you like my A Hat in Time theme?"
        video
    />

    <p>
        I modded my New 3DS XL (SNES Edition) to give it a USB-C port to charge!
    </p>

    <ImageGallery
        images={[
            {
                src: "electronics/3ds-usb-c/finished.webp",
                alt: "A back view at a New Nintendo 3DS XL with a USB-C port added between the charging port and the right shoulder buttons.",
                desc: ["the USB-C port in all its glory"],
            },
            {
                src: "electronics/3ds-usb-c/hole.webp",
                alt: "At the top is a view at a USB-C-shaped hole cut into the back half of a New 3DS XL. At the bottom is a look at the same hole from the inside of the case. There are rough cutouts where the stylus slides in.",
                desc: [
                    "a closer look at the holes I cut, and how they affect the stylus slot",
                ],
            },
        ]}
    />

    <p>
        I used a small USB-C breakout I had lying around that is wired straight
        into the charging pads of the original charging port, which is left
        completely intact. The breakout board also has a 5.1kΩ resistor between
        ground and one of the CC pins (which I had to manually find because it's
        unlabelled) to allow for using C-to-C cables.
    </p>

    <p>
        What I wrecked in turn was the wrist strap loop, which I completely cut
        out to create the hole for the port. The stylus port also got cut down
        to make space, but my stylus is kind of broken and doesn't stay put when
        I put it into the system, so I didn't really care about that.
    </p>

    <p>
        It works well! The hole isn't the prettiest but it was pretty simple to
        pull off, and extremely cheap as well. In turn I got a 3DS that I can
        charge using any USB-C cable and I no longer need to lug around the
        proprietary 3DS charger!
    </p>

    
</Content>

<style>
    .subtitle {
        font-family: var(--font-mono);
        margin: 0;
        font-size: 1rem;
        line-height: 1.4rem;
        font-style: italic;
        font-weight: 700;
        color: var(--color-highlight-alt);
    }

    .subtitle::before {
        content: "<!-- ";
    }

    .subtitle::after {
        content: " -->";
    }
</style>
