Skip to content

Instantly share code, notes, and snippets.

View KonnorRogers's full-sized avatar

Konnor Rogers KonnorRogers

View GitHub Profile
@KonnorRogers
KonnorRogers / icon-proposal.md
Last active February 18, 2026 16:45
revamping `<wa-icon>`

Proposal for revamping icons

Current API:

function getIconUrl(name: string, family: string, variant: string) {}

// base "resolver"
{
@KonnorRogers
KonnorRogers / ceph-pad.xml
Created February 17, 2026 19:04
Ceph's notepad XML file
<?xml version="1.0" encoding="UTF-8" ?>
<!--
Dark mode default style for Notepad++.
This file is based on Zenburn them (zenburn.xml)
License: GPL2
-->
<NotepadPlus modelDate="20251214" modelFileLastModifiedDate="20251227">
<LexerStyles>
<LexerType name="actionscript" desc="ActionScript" ext="">
<WordsStyle name="DEFAULT" styleID="11" fgColor="DCDCCC" bgColor="3F3F3F" fontName="" fontStyle="0" fontSize="" />
<!-- https://fluxui.dev/docs/installation sidebar, pulled off of devTools for demonstration purposes. -->
<ui-sidebar class="[grid-area:sidebar] z-1 flex flex-col gap-4 [:where(&amp;)]:w-64 p-4 data-flux-sidebar-collapsed-desktop:w-14 data-flux-sidebar-collapsed-desktop:px-2 data-flux-sidebar-collapsed-desktop:cursor-e-resize rtl:data-flux-sidebar-collapsed-desktop:cursor-w-resize max-lg:data-flux-sidebar-cloak:hidden data-flux-sidebar-on-mobile:data-flux-sidebar-collapsed-mobile:-translate-x-full data-flux-sidebar-on-mobile:data-flux-sidebar-collapsed-mobile:rtl:translate-x-full z-20! data-flux-sidebar-on-mobile:start-0! data-flux-sidebar-on-mobile:fixed! data-flux-sidebar-on-mobile:top-0! data-flux-sidebar-on-mobile:min-h-dvh! data-flux-sidebar-on-mobile:max-h-dvh! max-h-dvh overflow-y-auto overscroll-contain max-lg:bg-white dark:bg-zinc-900 lg:w-54 lg:mr-16 max-lg:p-8 lg:pl-0 max-lg:w-64 py-12 gap-7 pr-20 max-lg:border-r border-transparent dark:border-white/10 print:hidden text-sm transition-transform" x-i
@KonnorRogers
KonnorRogers / main.rb
Created December 9, 2025 00:46
render target caching
def tick args
args.state.background ||= {
x: 0,
y: Grid.h / 2,
h: 224 * 2,
w: 1504 * 2,
path: "sprites/background.png"
}
background_sprite = args.state.background
@KonnorRogers
KonnorRogers / thoughts.md
Created November 21, 2025 17:36
server + client rendered lit

SSR -> Client Render

There's a few approaches.

We can take the React / Vue / et al approach:

Server

import { collectResult } from "@lit-labs/ssr/lib/render-result.js"
@KonnorRogers
KonnorRogers / app.js
Created November 4, 2025 00:56
Apple Problem Code for keyboard scrolling: https://apps.apple.com/us/iphone/arcade
const nb = [
'ArrowDown',
'ArrowUp'
]
class Xs {
static windowKeyUpHandler(e) {
nb.includes(e.key) && e.preventDefault()
}
}
@KonnorRogers
KonnorRogers / assets.js
Created October 20, 2025 04:57
Hanami file watcher for esbuild
// config/assets.js
import * as path from "node:path"
import * as url from 'node:url';
import * as assets from "hanami-assets";
import chokidar from 'chokidar';
// ESM polyfill for __dirname
const __dirname = url.fileURLToPath(new URL('.', import.meta.url));
@KonnorRogers
KonnorRogers / dialog.html
Created October 10, 2025 22:42
full screen dialog
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script data-fa-kit-code="38c11e3f20" type="module" src="https://early.webawesome.com/webawesome@3.0.0-beta.6/dist/webawesome.loader.js"></script>
<link rel="stylesheet" href="https://early.webawesome.com/webawesome@3.0.0-beta.6/dist/styles/webawesome.css">
@KonnorRogers
KonnorRogers / draggable-sucks.html
Last active October 10, 2025 20:46
draggable...fun times.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script data-fa-kit-code="38c11e3f20" type="module" src="https://early.webawesome.com/webawesome@3.0.0-beta.6/dist/webawesome.loader.js"></script>
<link rel="stylesheet" href="https://early.webawesome.com/webawesome@3.0.0-beta.6/dist/styles/webawesome.css">
@KonnorRogers
KonnorRogers / popover-button.js
Created September 29, 2025 16:14
popover custom elements?
class MyButton extends HTMLElement {
constructor () {
super()
this.addEventListener("click", handleClick)
}
handleClick = (e) => {
const popover = this.getAttribute("popover")
const popoverEl = this.rootNode().querySelector(`#${popover}`)
if (popver && popoverEl) {