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

My company is looking for a front-end developer. (front-end engineers welcome) Actual HTML/CSS/JS, potentially some framework use, or CMS work (PHP/WordPress, Liquid/Shopify).

Office in Cincinnati, OH, or fully remote (US preferred for timezone overlap), junior-ish level.

You'd be working with me! I have fun statuses on Slack every day.

Interested? Know somebody? More info: https://mojopsg.com/careers/front-end-developer/
(you can email, or message me here)

anatudor Bot , to random
@anatudor@mastodon.social avatar

You may have seen some of my demos using this on already. Here's the how behind it.

Pure effect in 3 declarations:

✨ background layering a pattern and a map
✨ blend mode multiplication of the two layers
✨ contrast bump up to push all greys to either black or white

A simple step by step visual guide on how to create a pure CSS halftone effect with just 3 declarations! Step 1: Set a grey to white gradient background. Give it a small background-size (by default, this repeats to cover the entire element). This is the pattern part. background: radial-gradient(closest-side, #777, #fff) 0/ 1em 1em Step 2: Add another grey to white gradient layer covering the entire element. This is the map part. Where the map is darker, it will make the pattern thicker. The background declaration is now: background: linear-gradient(90deg, #888, #fff), radial-gradient(closest-side, #777, #fff) 0/ 1em 1em; Step 3: multiply the two background layers. The pattern is now darker where the map is darker than where the map is lighter. This blend mode literally multiplies corresponding channel values for each pair of corresponding pixels from the two layers. Let's say corresponding pixels have rgb(50%,50%,50%) and rgb(20%,20%,20%). The channel values of the resulting pixels are all .5*.2 = .1 (the decimal representation of 50% is .5 and that of 20% is .2), that is, the resulting pixel has rgb(10%,10%,10%). background-blend-mode: multiply; Step 4: contrast() with values >1 pushes darker greys (that is, darker than a 50% grey, which is dead in the middle between black and white) towards black and lighter greys towards white. This creates the halftone pattern. filter: contrast(21)

angelikatyborska , to random
@angelikatyborska@mas.to avatar

Based on my experiences in various frontend codebases that were written without a frontend expert on the team (including my own old projects 💩), I compiled a list of 9 most common signs of frontend code quality issues that affect users https://angelika.me/2024/04/13/9-signs-your-frontend-code-has-quality-issues/

davidbisset , to random
@davidbisset@phpc.social avatar

It's not easy being a young on the dating scene.

tixie , to random
@tixie@guerilla.studio avatar

“CSS is the only language that gets blamed when the author is bad”

https://joshcollinsworth.com/blog/devaluing-frontend

ALT
  • Reply
  • Loading...
  • skinnylatte , to random
    @skinnylatte@hachyderm.io avatar

    One of the reasons why I haven’t done a lot of front end work in the last decade or so is I knew so many annoying ‘front end isn’t real coding’ bros back in the day. This month I’ve been learning so much and css is so good and I feel so powerful that I can build cool sites

    Fuck those guys. Back then and always

    iriepixel , to random
    @iriepixel@mastodon.social avatar

    This is my second try to move to Mastodon or at least to try to convince myself to use it instead of X. Do you have any recommendations for whom I should follow? I'm interested in

    rud___boy , to random
    @rud___boy@hachyderm.io avatar

    Hello there, I'm Rudah, a developer from 🇧🇷 🇧🇷

    I'm usually hacking, tinkering and ricing my computers, nerding out with my friends about anything I'm currently obsessed with, often video-games, and despairing about how I have so little time to enjoy my ever-changing assortment of interests.

    The thing I enjoy the most is building and maintaining meaningful relationships with cool people! Second to that is bad memes.

  • All
  • Subscribed
  • Moderated
  • Favorites
  • random
  • test
  • worldmews
  • mews
  • All magazines