Lightnews — Scholar-powered news

Richard @choir241.bsky.social · 14h

Getting back into drawing was nice ☺️ But I don’t think I’m doing this everyday like before lol Just here and there when I feel like drawing ^^

Pencil sketch drawing of anime girl wearing frilly dress

6

Richard @choir241.bsky.social · 16h

It's spooky season, and that means Huntober with #100devs🎃 Ready to lock-in with the community and excited what @leonnoel.bsky.social has in store for the #100devs community 🔥

A virtual meeting interface on Discord shows one speaker in a video call at the top center, gestures animatedly. Below, a grid of 343 audience avatars. Chat messages read: "coolest char ever," "Can't keep things pent up," and "the one thing."

8

Richard @choir241.bsky.social · 19h

And started to work on the conference component card for displaying the condensed conference information to the user after they click on the button/state svg graphic.

1

Richard @choir241.bsky.social · 19h

But I'm going to keep trying to keep looking for alternative solutions that also look good design-wise. Also went ahead and added in on-hover effects to visually indicate to the user that the state is clickable.

1 1

Richard @choir241.bsky.social · 19h

Unfortunately couldn't find an alternate USA map react library that also offers these accessible options with the package. Honestly want to keep the butons displayed for alternative clickable options while also not confusing users exploring the site with their keyboard.

1

Richard @choir241.bsky.social · 19h

1/4 🧵
Only displaying the buttons here to show the alternative solution I decided to go with for accessibilty users - giving them tabbable and keyboard friendly explorable elements while also being screen reader friendly.

#buildinpublic

1 3

Richard @choir241.bsky.social · 21h

Haha we have extra, come on down 😁

1

Richard @choir241.bsky.social · 22h

Sometimes it be pizza time 🍕

1 3

Richard @choir241.bsky.social · 1d

The state color fills are just placeholders at the moment to remind me which ones are the highlights - the states I've personally attended for a tech conference, and the rest of the states.

#buildinpublic

1 3

Richard @choir241.bsky.social · 1d

I struggled to find a USA map react library that provided tabbable elements for accessibility users, so my theoritical plan right now is to render button elements for each state, and clicking them will be functionally the same as clicking the state svg as a whole.

1 1

Richard @choir241.bsky.social · 1d

It was interesting to do some research on niche elements of an already familiar topic like the <map> & <area> tags, it reminded me of when I dived into the useActionState hook.

I was surprised by how difficult it was to find a dependency that was up-to-date and updated recently.

1 1

Richard @choir241.bsky.social · 1d

1/4 🧵
At first, I considered using the map and area HTML tags to handle the USA map rendering and interactions with the states, but figured I could spend my time more wisely and optimally by finding an existing customizable and interactable USA map library.

Map of the United States with select states highlighted in colors like blue, purple, and orange. Header reads "ConfExplorer."

1 5

Richard @choir241.bsky.social · 2d

Congratulations bestie!!!!!! 🥳🥳

1 1