James0x57

8 ms·

31.
by James0x57 6y ago
YEP! Absolutely nailed it. That's what's up! I've been calling it Space Toggle. It does all kinds of stuff beyond toggle though - the whole world of conditional logic is possible. You can combine them in any way, &&,
32.
by James0x57 6y ago
I know the docs need a little love but I think this has potential to be a game changer for writing responsive CSS. It has named breakpoints, lets you write DRY selectors, doesn't rely on JS or any sort of build step, and if you're
33.
Show HN: A completely different way to write responsive, vanilla, CSS(propjockey.github.io)
248 points by James0x57 6y ago|45 comments
34.
by James0x57 7y ago
What about that "Cybergirl" that introduced Elon? She called him her "creator". Just an actress (Grimes) on video with weird almost-flailing gestures or was it an animated AI from a secret Elon project made in the likene
35.
by James0x57 7y ago
I gave this a lot of thought. I used to be a stickler for valid markup. augmented-ui had a data- prefix as an option up to right before initial release. Here are my reasons for not including it (yet): 1) data- isn't a great fit for it.
36.
by James0x57 7y ago
...probably pretty important since bigger sites would likely use CSS files from a CDN. I'll make sure to mention and test around that, it hadn't crossed my mind yet. Thank you!
37.
by James0x57 7y ago
It has to live on dom element. BUT I wrote a separate plugin that does exactly what you're thinking: https://github.com/propjockey/aug-attr-spliced.js It allows you to specify .mydiv { --augmented-ui: tl-clip
38.
by James0x57 7y ago
Logical Equivalence: This photo album was made with construction paper and the hole here isn't big enough for the picture in it, so construction paper must be broken. I just didn't make it properly responsive there yet. aug
39.
by James0x57 7y ago
It's more odd to defend IE 11 though. :P Calling ancient is a half-joke meant to purport that augmented-ui is from the future.
40.
by James0x57 7y ago
hahaha awesome I was making this "ad" for it over the weekend and got a pretty good laugh from it too. Especially at the "Wow!" text on the right haha: https://i.imgur.com/vbdEOXo.png
41.
by James0x57 7y ago
heck yeah! Awesome. ^^ Link me when it's ready? @James0x57 on twitter, reddit, github, etc
42.
by James0x57 7y ago
When a single tab spikes my laptop's power usage from 14.9W to 35W+ there is something terribly wrong with the design. The animations are using WebAssembly which runs directly on CPU and results in tons of dom updates every fra
43.
by James0x57 7y ago
Thank you! I'd love to see what you do with it! - The looping animations are from a JS animation library that I wrote so that means lots of dom updates every animation frame, which is expensive. Also, the animation lib uses WebAssembly
44.
by James0x57 7y ago
Thank you very much for checking it out and providing feedback! If you mean the main site, that uses an animation library that uses WebAssembly. It's faster than plain js but does lean on cpu directly. Lots and lots of dom updates to r
45.
by James0x57 7y ago
mmmmm yeahhh, not gonna argue that, I think you're probably right on all points. haha The reason I made it though is because of my love of the Cyberpunk genre specifically. Deus Ex, Tron Legacy, Cyberpunk 2077, and so many more shows,
46.
by James0x57 7y ago
I land on css-tricks constantly. That's loaded with neat ideas. For me, learning is always easiest when I'm learning what I need right now Soo my personal suggestion would be: just keep making things and don't let what you
47.
by James0x57 7y ago
Border image property with svg was one of the first approaches I tried and tried. It got about half way to about half the options and required more setup than just a single CSS file. I got slightly further to what I wanted with border-mask,
48.
by James0x57 7y ago
There are 8 positions, top-left, top, top-right, right, bottom-right, and so on. Each position can have an aug equipped so the left side could have 3. If you mean like stacked, I suppose you could add extra dom elements inside and augment e
49.
by James0x57 7y ago
oh my gosh man this is so cool I legit almost teared up a bit. It looks awesome even without it but I cannot wait to see where you land using augmented-ui. This is the first time I've got to see someone use it for a big project ^__^ I
50.
by James0x57 7y ago
wow that is remarkably similar to the ui I sketched out of an idea I had a couple years ago. But yep, that would be fairly easy to do with augmented-ui. The only "tricks" would be the parts that extend out would just be layered on
51.
by James0x57 7y ago
Sure. Each aug is a clip-path partial. That is, a series of points meant to be put inside a clip-path: polygon(...here...); stored in custom properties. All augs, by position, store their partial in the same internal variable. (--aug-_TlPat
52.
by James0x57 7y ago
I'll work on it. The site was secondary to the project and I cut a lot of corners making it as fast as I could, putting all the real effort and focus in the project itself
53.
by James0x57 7y ago
Ohh you give me too much credit. I'm not much of a designer. That's all the generic font-family: sans-serif; lol
54.
by James0x57 7y ago
I started trying to figure out different ways to do this because I was watching a 12 hour playthrough of Deus Ex Human Revolution on youtube. Took about 5 days until I realized I could do everything I wanted with clip-path. Really hope we g
55.
by James0x57 7y ago
Fixed! Thank you very much!
56.
by James0x57 7y ago
That's a really good opportunity for quality designers (not me lol). It's only been 10 days since v1.0.0 released so I'm sure nobody's done that yet. But yeah, great idea, it could make them some money, hope it happens!
57.
by James0x57 7y ago
Thanks! ^_^
58.
by James0x57 7y ago
ahh that's so cool! Have fun! I'd love to see what you build if you make it public at all!
59.
by James0x57 7y ago
Normally making designs like this on the web is really tedious and a bit challenging. You'd have to do things like add a new element to the dom, rotate it 45deg, position it perfectly, draw just one border and make the background match
60.
Show HN: Cyberpunk web design made easy, really easy(augmented-ui.com)
775 points by James0x57 7y ago|108 comments

More ›