@snugug@mas.to avatar

snugug

@snugug@mas.to

BBQ lead, Marquee de LaChromeOS, ChromeOS DevRel. Mostly food, sometimes design and development, especially for the web. 7008px tall.

This profile is from a federated server and may be incomplete. Browse more on the original instance.

snugug, to opensource
@snugug@mas.to avatar

Super excited to share that I just released our refactored ChromeOS.dev! It'll basically look the same as the other version, but it's easier to develop, write content for, and, most importantly, it's faster and more consistent than the previous version. We've also migrated over to @astro and @sanity_io.

I'll have a post about it after , but poke around with it in the mean time! And if you didn't know, it’s !

https://github.com/chromeos/chromeos.dev

snugug, to random
@snugug@mas.to avatar

@zachleat I don't remember if I submitted my talk to 11ty conference, is there an easy way for me to check? Or should I just submit again?

snugug,
@snugug@mas.to avatar

@zachleat hmm... ok! Glad you have it! I presume it's the right talk I submitted; I can't seem to find it and the form doesn't appear to show me my previous submissions. That's OK though! It's now in your capable hands!

snugug, to android
@snugug@mas.to avatar

Hey all! Do you love #Android and #ChromeOS? Our team is #hiring! We’re looking for a developer advocate (we call them Developer Relations Engineers) to join our team in Silicon Valley or NYC. You'll help developers optimize their Android apps for ChromeOS, teach them about large screen Android, work with us to build a happy and thriving ChromeOS developer ecosystem, and more!

Apply here: https://www.google.com/about/careers/applications/jobs/results/116566512862405318

#FediHire #fedihired #Google #job #jobalert #jobsearch

snugug, to random
@snugug@mas.to avatar

@zachleat I'm looking into using WebC as a simple web component compiler outside of 11ty but the docs seems to assume 11ty for the most part. Are there more non-11ty docs I'm missing? What about handling lifecycle events in JS with it?

snugug, to webdev
@snugug@mas.to avatar

y'all wanna see something cool? Currently available in ChromeOS dev or canary (maybe cross-platform too? Only checked on ChromeOS), double-click to install an isolated web app, just like a native app. What's an isolated web app? Come watch my talk PWAs: Past, Present, Future at Confoo this year!

https://confoo.ca/en/2024/session/pwas-past-present-future

A screen recording double-clicking on a .swbn file in a folder, which launches an installer that first verifies the installation bundle, then asks if you want to install it with the application name and version, and after you click install, it asks if you want to continue, given that the software can make changes to your device. After continuing, an installing progress bar starts and, when done, you can launch the application. Doing so launches it in its stand-alone window with a stand-alone icon, just like a native app or a PWA

tomayac, to random
@tomayac@toot.cafe avatar

Apple: Update on apps distributed in the European Union: https://developer.apple.com/support/dma-and-apps-in-the-eu. A lot to unpack here… 🇪🇺

snugug,
@snugug@mas.to avatar

@dotproto @tomayac as I was reading the high level stuff, I thought they may consider that as kinda a third party app store thing

sarajw, (edited ) to random
@sarajw@front-end.social avatar

Anyone know of good online tools that take in an RSS/Atom URL and spit out simple HTML?

I've found https://rss.bloople.net but it doesn't seem to like every feed I give it. Ditto https://nerdiedad.com/tools/rss-to-html. https://www.rssdog.com is a bit too opinionated and styles the output.

(I don't [yet...] have a server where I can host my own.)

snugug,
@snugug@mas.to avatar

@sarajw asyc script tags run in the order they're received. Try defer; they run in the order they are in in the DOM. IIRC type="module" is also defer

snugug,
@snugug@mas.to avatar

@sarajw I'll take a look after work.

snugug,
@snugug@mas.to avatar

@sarajw hey I'm looking at this and curious if you're still having the issue; i can't see where the error you're describing would be in the current code (no script tags to inject content into an article). Did you fix it with a web component?

snugug,
@snugug@mas.to avatar

@sarajw @darius ok! Figured it out!

  • The feeds coming in out of order is due to the async tag. Swapping to defer would have async downloaded but executed in DOM order
  • Not going into the article; loading up one of the JS files, at the bottom, the var script line and below, you'll see it's attaching items after the last script on the page, not the script tag that attached it. Because these are loading async, it's the last one on the page when executed, not the one that called for it.
snugug,
@snugug@mas.to avatar

@sarajw if it was run without async or defer, the last script tag on the page would be the caller because downloading, running, and executing the JS would block rendering of the HTML, so yah, under those circumstances it assumes the last one is where you wanna attach it to.

mia, to random
@mia@front-end.social avatar

What views do you need for a slide deck? there's the view that gets projected, maybe another view on a confidence monitor? another view for seeing the big picture while you work? are there others? one for reading the presentation later? for taking notes during?

which do you use, or wish for? what do you call them? what do you call the main one? what do you need to see in each?

snugug,
@snugug@mas.to avatar

@mia when I built my little slide deck thing, I included an article view for sharing after so it didn't need to be consumed as a deck

snugug, to CSS
@snugug@mas.to avatar

A for y'all: I don't understand why so many people want nesting in CSS. The most useful bits of Sass nesting are BEM style selector extensions and @-query nesting. The former you can't do in the current Nesting spec, the later is nice to have but not enough to not ship new actual functionality to browsers. Creating complex selectors/long selector chains was always a nesting anit-pattern, and doesn't go away with the new spec.

I'm also concerned about how this breaks CSS's A+ PE

snugug, to random
@snugug@mas.to avatar

I love how Apple News think that when I block a news channel that what I really mean is "keep showing me articles from this source, but tell me I've blocked it instead of showing the leading picture".

developit, to random
@developit@mastodon.social avatar

Anyone have recommendations for a quality but not super expensive Japanese knife?

Preferably Santoku or Gyuto, thinking around 160mm. I'm not an amazing cook and probably need something more on the forgiving side (maybe just stainless). Bonus points if it's pretty.

snugug,
@snugug@mas.to avatar

@developit Shun knives come in a variety of price points and are great (I just bought a new Chef knife from them). They need a little care but I've literally had my santoku from them since my 18th birthday.

snugug,
@snugug@mas.to avatar

@developit mine has a similar handle; if you use a pinch grip it's super comfortable. If you don't, you should!

sarajw, (edited ) to CSS
@sarajw@front-end.social avatar

Hey layout experts -

I have a lot of weird CSS going on, on my site, I know.

While trying to work out why I couldn't get the 'Sign my Guestbook' badge on the FIND page (https://sarajoy.dev/#find) to look like the post badges in the BLOG section (https://sarajoy.dev/#goblog), I discovered that pulling the display: grid off the ul containing the blog post index messes them all up!

If I add grid to the container containing the Guestbook badge, it's fixed.

EDIT thanks @css, @snugug & @MerriNet!

snugug,
@snugug@mas.to avatar

@sarajw I'll look at your HTML later today to give you a more specific answer, but grid (and flex) change how direct children are rendered, turning them into grid items and changing how they determine their intrinsic size based on how the grid is set uo

https://drafts.csswg.org/css-grid/#grid-items

snugug, to CSS
@snugug@mas.to avatar

Ok y'all: architecture question time: I'm building a dark mode toggle, can switch between light, dark, and auto. Because of this, it needs to be JS powered. Anyone have an opinion on how to accomplish first view without a potentially bad flash of wrong theme?

I was thinking I could jump through some hoops w/prefers color scheme and style queries to set dark mode quickly before JS kicks in, which is probably the 80% case here, but seems very complex. Otherwise Modernizr style selector pivot

snugug,
@snugug@mas.to avatar

@tomayac I didn't see an "auto" option with that, which I'd like. Am I missing something?

snugug,
@snugug@mas.to avatar

@tomayac it needs to be user toggleable too; that three way switch is weird to get right from an a11y and UX perspective for something that is often seen as a 2-way toggle

snugug,
@snugug@mas.to avatar

Thanks everyone for your feedback here! I wound up building a localstorage/data attribute solution that activates as early in site render as possible. I didn't go with a cookie based solution because it's an SSG site, but I may consider adapting that strategy for a service worker based solution later. Styling is compiled per-page ( @astro ) so having separate light and dark stylesheets didn't make sense. It's also mostly a handful of variables changing, so low overhead.

snugug,
@snugug@mas.to avatar

One final update to this: TIL that aria-checked can have three values: true, false, and mixed, which means neither checked nor unchecked. One of the few instances where built-in elements may not actually do what I want and I need to dive into ARIA, but the result may just be the three-way dark mode toggle I'm looking for!

snugug,
@snugug@mas.to avatar

@sarajw Not just through HTML:
https://css-tricks.com/indeterminate-checkboxes/

And at the point I need to manage it through JS anyway and I'm replacing the checkboxes and labels with an image, might as well build my own three-way checkbox out of a button.

snugug,
@snugug@mas.to avatar

@tomayac https://github.com/chromeos/chromeos.dev/blob/feature/dark-mode/astro/src/components/ThemeToggle.svelte

snugug,
@snugug@mas.to avatar

@tomayac interesting! It looks like your announcement banner has some color contrast issues in dark mode BTW

  • All
  • Subscribed
  • Moderated
  • Favorites
  • •
  • JUstTest
  • slotface
  • ngwrru68w68
  • everett
  • mdbf
  • modclub
  • rosin
  • khanakhh
  • DreamBathrooms
  • thenastyranch
  • magazineikmin
  • Youngstown
  • GTA5RPClips
  • InstantRegret
  • provamag3
  • kavyap
  • ethstaker
  • osvaldo12
  • normalnudes
  • tacticalgear
  • cisconetworking
  • cubers
  • Durango
  • Leos
  • anitta
  • tester
  • megavids
  • lostlight
  • All magazines
    •