Hacker News new | past | comments | ask | show | jobs | submit | vladocar's comments login

My point wasn't to replace the classic class grid, just to give basic HTML5 grid if necessary. You can always add any other CSS Framework for grid formatting. About <section> and other HTML5 tags.. you can always personalise the code to your standards.

The grid is based on this: parent element {display: flex; flex-flow: row wrap} child element {flex:1}

Replace the parent element (container) with any HTML element, replace the child element with your preferred semantic element.


Great reply, Vlad. Your code is really small and tight, and it's easy to modify, just as you say. That's one of the benefit of writing in the style that you did: modern, using all of modern CSS's native goodness. Which means its small, static, no build, and easy to modify. Very nice work.




This is spectacular, thank you. It's small enough to just inline into the webpage and provides a nice enough experience to just leave it alone for a very basic page.


I just pushed the version 1.0.2 to npm. Now you can do this:

screenshoteer --url https://news.ycombinator.com/item?id=18598672 --el ".fatitem"


Yes, it uses puppeteer(headless chrome).

For the .DS_Store I totally forgot to put .gitignore :)


The version from NPM is 0.3.2 but the GitHub docs are for 1.0.1? Looks like the --url option doesn't (yet) exist on NPM.


The one that's 0.3.2 is called "screenshooter", while this tool is called "screenshoteer".


Oh. Well, that would explain.


The name is inspired by the "puppeteer" => screenshot + puppe-teer = screenshoteer


That is super strange.. I never inserted 0.3.2. The current version is 1.0.1


There's another NPM package with an almost but not quite similar name to yours.


It also works with (a) tags: <a class="button btcolor pill" href="#"> Button Link</a> I need to add this in the examples.


It is a simple solution for very common problem: styling a CSS button. There are many CSS buttons libraries but they usually force you to use their style or size. That is why this is interesting and simple solution born with my necessity not to recode and reinvent the CSS button for every new project.


The "hard" part about styling buttons is making them look the same for <a>, <button>, <input>, which is solved like a million times.

Your solution only addresses <div>, which is a accessibility nightmare.


This is flexy: https://github.com/vladocar/flexy

Yes, just 1 button color if you need more colors just add .btcolor1 , .btcolor2 ...


I love your reference. I love it so much that I changed my github profile to: "Just another Full Stack Developer seeking the stars." :):)


Yes, I've used the word "browser reset" but is just "default browser style".

Here is the webkit style: https://trac.webkit.org/browser/trunk/Source/WebCore/css/htm...


Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: