A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.
One-line version to paste in your DevTools
Use $$ if your browser aliases it:
~ 108 byte version
| import Image | |
| import photos | |
| import console | |
| import ImageOps | |
| # Pick screenshots to combine | |
| screenshot1 = photos.pick_image(show_albums=True) | |
| screenshot2 = photos.pick_image(show_albums=True) | |
| screenshot3 = photos.pick_image(show_albums=True) |
| // Variables used by Scriptable. | |
| // These must be at the very top of the file. Do not edit. | |
| // icon-color: blue; icon-glyph: laptop-code; | |
| // share-sheet-inputs: url; | |
| /******************************************* | |
| * * | |
| * /\ * | |
| * / \ _ __ _ __ * | |
| * / /\ \ | '_ \| '_ \ * | |
| * / ____ \| |_) | |_) | * |
| let spotifyCredentials | |
| let widget = await createWidget() | |
| Script.setWidget(widget) | |
| Script.complete() | |
| async function createWidget() { | |
| let widget = new ListWidget() | |
| let spotifyIcon = await getImage("spotify-icon.png") | |
| widget.backgroundColor = new Color("1e2040") |
For ease of maintainability this project has moved from this gist to its own repository. You can go and visit it there.
| // your DB Bahn Developer API token | |
| // https://developer.deutschebahn.com/store/apis/info?name=Flinkster_API_NG&version=v1&provider=DBOpenData | |
| const bahnApiToken = "xxx" | |
| // the longitude and latitude of your desired station | |
| const latitude = "50.95209" | |
| const longitude = "6.91907" | |
| // optional: the area uid of your desired station (for 100% accurate results) | |
| const areaUid = "" |
| const STEAM_STORE_URL = "https://store.steampowered.com" | |
| const steamId = args.widgetParameter ?? "76561198008818777" | |
| try { | |
| const wishListGames = await fetchWishListById(steamId) | |
| const widget = await createWidget(wishListGames) | |
| renderWidget(widget) | |
| } catch(error) { | |
| const widget = await createErrorWidget(error) | |
| renderWidget(widget) | |
| } |
| ### Points and display type | |
| PPI is points per inch below, not pixels per inch. Not all models are listed, just the first model with a new display size. Diamond, RGB Stripe and Pentile RGB refer to the subpixel patterns. | |
| iPhone 1 = 320×480 at 163PPI sRGB IPS LCD RGB Stripe | |
| iPhone 4 = 320×480 at 163PPI sRGB IPS LCD RGB Stripe | |
| iPhone 5 = 320×568 at 163PPI sRGB IPS LCD RGB Stripe | |
| iPhone 6 = 375×667 at 163PPI sRGB IPS LCD RGB Stripe | |
| iPhone 6 Plus = 414×736 at 153.5PPI sRGB IPS LCD RGB Stripe | |
| iPhone 7 = 375×667 at 163PPI P3 IPS LCD RGB Stripe |