In my last post I recreated an image in SVG to prove how easy it is compared to CSS.
Article No Longer Available
All t...
For further actions, you may consider blocking this person and/or reporting abuse
Can you share your monstrous script?
Thanks!
if i wanted to attempt this which i wouldn't cause...waste of time. i would've used a single div(just to flex) and applied a whole bunch of gradients on the
background-imageproperty (something like this: github.com/danBamikiya/movie-finde...) [that styling is generated] and if I want to go further and animate (like an eye wink or something) I'll apply ananimationproperty that animates thebackground-positionandbackground-sizeSomeone beat us both too it!
dev.to/posandu/comment/1i9jk
That's WILD! He inlined it!
I guess the next war is a 0 div war. Only styling the html element.
The real pros don’t use any CSS, HTML, images, JS at all! (Firefox only) 😉
Is 0kb of *HTML* in your future? 🔮 A website without JS...HTML...CSS or IMAGES!?⁉😱
InHuOfficial ・ May 7 ・ 3 min read
In fact if you like abusing the web you might like that whole series! 🤣
I have dropped a comment on SO, if you create a fiddle or give a bit more detail on the problem I can help you further on SO (I have a busy day today so if I am slow to respond my apologies).
SVG because that makes sense
Single div next?
LMFAO - the only way I can think to do that is to cheat with a gradient per pixel. I am sure @afif can do something very impressive with a single div and conic-gradients though!
Anyway single div is for noobs, the no div challenges are the ones the pros do! 😋🤣
This is insane 🔥🔥🔥
@afif and @alvaromontoro , you both happy now, I did the CSS thing...can we be friends again please? 😋
The sheer length of that GIF made me laugh! It seems my post had the desired affect! 🤣
by the way, you don't have to use all those pseudo elements (I know you copied my code structure 😒). Applying the clip-path to the main element is enough. I used pseudo element to reduce the need of the html code and because I have to apply a filter to the parent element
Yeah I did just grab the code structure, it was only when I was half way through I realised it was not necessary (I did think it was needed and then my brain finally worked after about 2 hours!), but I had already hard coded it into about 15 different places and I couldn't be arsed to remove it...so I just left it 🤣
Serves me right for copying without thinking! I also realised I didn't need loads of other properties as I was using
vwunits, so I could have just used them throughout and work as if the whole screen was the canvas....would have made the calculations a lot easier as I could have divided by 10 instead of 9.77 when calculating the positions as percentages!Hence why this is not a tutorial...I made many many blunders! lol!
I don’t know why I don’t ask you to just look at stuff I am working on with CSS…would save me loads of faffing as you spot stuff so quickly ❤️!
why 🤣
Must one have a purpose behind everything? 😜🤣
So now my brain's thinking... if we use Illustrator to trace the CSS art image, then reapply your script, and iterate that several times... 😈
Oh dear...I can only imagine what monstrosity would come out of that! 🤣
And here I am struggling to center a div 😁
Don’t worry, without cheats I also struggle to centre a div! 🤣😜
wooooooooooowww!!
Even I have done that with python+Html+css within 22 sec😂😂
I would love to see the script you used to convert the paths, perhaps I made it too complicated if you can do it so easily as it took me ages to convert curves to polygons!
Is there some simple approximation you can use that I missed that doesn't involve calculating the curve first?
How did you do it so quickly?
👍😂😂
Too good!!! 🤩🤩🤩 Hats off brother