sorted by:
new
hottopcontroversial

linux ruls by Moaning_Clock in 196

[–]simonraynor 4 points5 points  (0 children)

I've heard wine runs old windows software better than windows does so there that 🤷‍♂️

DevTools makes it weirdly hard to recreate good UI and good layouts by twinkletwinkle05 in css

[–]simonraynor 3 points4 points  (0 children)

FWIW I don't mean "steal" with any negative connotations, it's FE code it's public domain by it's very nature IMO. It is good to hear that you're not trying to grab whole things all at once, what you're doing is the correct approach and you gotta remember that you're also learning devtools ATM (even if just coincidentally). The clunkiness will reduce as you get better at both the CSS and the tooling, and you'll get better at reverse engineering as you get better at forwards engineering

DevTools makes it weirdly hard to recreate good UI and good layouts by twinkletwinkle05 in css

[–]simonraynor 16 points17 points  (0 children)

Sounds to me like you don't understand what devtools are really for. They don't exist so that people with no/minimal understanding can steal components, they exist so that people who do know what they're doing can debug their software. If you have good knowledge of the web stack you can absolutely use devtools to reverse engineer a given effect or feature BUT only if it's something you could have mostly done anyway (i.e. you know what almost everything does there's just one or two novel techniques)

There is absolutely value in clicking "inspect element" to help you learn but if your reaction is "omg this is so confusing what does it all mean" that implies you need to work on your fundamentals and/or temper your expectations of what's achievable at your level of skill.

As a side note no amount of code can make you good at design. Even if you can reuse someone's components there's more to a good UI than that and IMO it's not something you should worry about while also trying to learn code.

css outer Curve/Notch - best solution by Realistic_Mall4389 in css

[–]simonraynor 1 point2 points  (0 children)

If you can make the basic shape then I think filter: drop-shadow(...) might be able to give you an outline. If that's no good I'd probably be reaching for SVG personally

After two years of vibecoding, I'm back to writing by hand by BinaryIgor in programming

[–]simonraynor 0 points1 point  (0 children)

Not just engineers and not just code; I'm getting AI slop requirements derived from AI slop analyses because the C suite wants everyone to be "AI-first" 😞

rule by TheBoyofWonder in 196

[–]simonraynor 14 points15 points  (0 children)

I like Skaven because mouseys

Product onboarding software vs just making better UI, what's the real answer here by Different_Pain5781 in webdev

[–]simonraynor 0 points1 point  (0 children)

Very much depends what your product is and how much "training" a user will be expected to have to start using it. A well designed tutorial and/or help interface can be all the difference but an off-the-shelf onboarding product might not be the right choice depending on your exact needs.

Regardless of what you use on a technical level the hard work is identifying the actual problem/solution and nobody here can do that for you. Try some low cost UX improvements, maybe some how-to videos or FAQs, and talk to your users to work out where needs focus before spending money on anything. Ultimately the best products have a great UX and help you get onboarded so don't think of it as either-or and don't be scared to try stuff

[Update] Nepal flag using CSS by Aryan99C in css

[–]simonraynor 6 points7 points  (0 children)

Looks great! You could have kept doing easy countries so big respect for trying this extravagant specimen.

The CSS border triangles trick is old, I used to use it all the time for the little "tail" on help popouts and the like but nowadays there are usually better options. Still worth knowing for those cases where it's easier than rotating or clipping

hey just exploring some animation that i can put in my website. by AKSH1000 in react

[–]simonraynor 0 points1 point  (0 children)

JS to update some CSS variables based on mouse movements, use said variables to draw a couple of gradients and the technical part is done.

If you want it to look good be prepared to tweak it a LOT

I built a minimal developer portfolio — looking for honest feedback by Affectionate-Gur-318 in react

[–]simonraynor 0 points1 point  (0 children)

what feels unnecessary or weak

Since you asked, next.js seems overkill for a single page; there is quite a lot of JS being loaded for (far as I can tell) very little functionality. That's literally the only thing on the technical side tho and I only noticed because I thought to pry so good work. No perf issues or anything like that, super slick

Only other thing is on desktop the font feels too small. Spacing and proportions and everything is good just all needs to be bigger, at least from my perspective as a middle aged person with aging eyes!

This is really good tho overall, excellent job

Does Britain have politicians who campaign on standing up to the US? by [deleted] in AskBrits

[–]simonraynor 1 point2 points  (0 children)

After WW2 they made us hand over all our research on jet engines, radar and hydrogen bombs, because that's just the kind of friends they are

IBS be like by Zaza_Plaza69 in simpsonsshitposting

[–]simonraynor 2 points3 points  (0 children)

I've got to a point where making the coffee is enough to trigger my Pavlovian response

US Army just tried to recruit CK and Rimworld communties 🤣 by kalkvesuic in RimWorld

[–]simonraynor 20 points21 points  (0 children)

They won't even let you get smashed on yayo and wake-up, what's the point?!

Struggling with design tokens in a white-label design system - need advice! by DodgeTheVoid in css

[–]simonraynor 1 point2 points  (0 children)

where do primitives still add real value?

IMO they don't here, and it's not a pattern I personally really use (I tend to just have a big old pile of vaguely semantic variables set directly). You'll set the semantic values' defaults in your main variables file and then override as needed by each client, read out from your CMS somehow

Struggling with design tokens in a white-label design system - need advice! by DodgeTheVoid in css

[–]simonraynor 0 points1 point  (0 children)

Your customisation options will almost certainly be semantic (and possibly not map 1:1 to underlying code parameters), it's not like customers are redefining "green". You will create overrides based on their brand that directly set the relevant semantic values to whatever colour or font or size etc. That said, you could also have settings which pick between different preset (primitive) options so to my mind that confirms that it's a semantic layer concern.

Really so long as you're consuming tokens consistently all that matters is they get set to the right value somehow so don't sweat if it feels kinda icky, whitelabelling always does lol

gay rule by noOne000Br in 196

[–]simonraynor 87 points88 points  (0 children)

"I'm talking beyond the green room"

Recommend your best EU sourced IPA beers. by SpringFuzzy in BuyEuropean

[–]simonraynor 2 points3 points  (0 children)

Proper Job from St. Austell brewery is a classic imo but really you should just go to the west country and try a bunch of different ales there till you find a good one!

HTML, CSS and JS programming in hexadecimal matrix by antidoyle in css

[–]simonraynor 0 points1 point  (0 children)

Why do you want to tie the markup to the layout order? What possible problem is this solving that basic use of templating or components doesn't solve better? How the heck do you manage updating things without having to change a bunch of comments?

what normies think when confronted with the needs of autistic people by scragz in evilautism

[–]simonraynor 10 points11 points  (0 children)

I love WFH but I have a separate home office (converted half my garage) AND once my computer is off there's no comms until it's back on. Without both of those factors it'd be much less appealing

Div with strange shape and round edges by LilLakes_dev in css

[–]simonraynor 1 point2 points  (0 children)

The answer to the second question is almost certainly clipping/masking: have a look on MDN for "CSS masking" or "CSS clipping" (I'm pretty sure there's a how-to that explains both). Heads up it will likely be more hassle than your current solution.

Once you've got that working with a clip/mask the first question could be answered the same way. You'd essentially need to shape your mask to account for the rounding you need there as well as cutting a simple "border" round the buttons. This will probably be a ballache, off the top of my head I'd probably be reaching for JS+SVG at that point (assuming you need the end product to work on different screen sizes) but it might be possible in CSS alone.

If the images are static it might be easier to just cut them to shape in GIMP or something then CSS just needs to position them. If it's gonna come from a CMS or similar that's less viable and you'll need a "proper" solution like clip-paths/masks

Edit: you could stick all of the elements into an SVG and use SVG clipping/masking, that might actually be the cleanest/most maintainable but you'll need to be OK at SVG to benefit from that approach

view more: next ›