search

OakvilleTSA / OakvilleTSA.github.io

Oakville TSA's GitHub Pages
https://OakvilleTSA.github.io
2 stars 1 forks source link

A non-framework alternative #19

Open tomdng opened 6 years ago

tomdng commented 6 years ago

Since MDL has been getting on my nerves, offering nothing that we couldn't do other than a javascript powered navigation drawer, I have made a prototype page that doesn't use any of the framework. Most of the material design shadows can be achieved using the box-shadow CSS property, and there's not much else we should adopt from MDL since Google is planning on refreshing it's design language anyways.

image Current prototype. There will be an image banner as the background, which takes up the entire screen, until you scroll down, where you will find other content. This works regardless of browser size.

In fact, Android P hardly uses any sort of shadows, opting for a completely flat design, so with our vanilla CSS all we have to do is remove the box-shadow property, which is a lot easier than hacking around a framework. For now, the prototype is using minimal shadows that don't draw attention to themselves, so we should be fine for a while.

image Android P UI

With the prototype html/css, please sort the css properties alphabetically for the alt.css file, and please add comments for anything that isn't self-explanatory for easier readability.

What do you think about the design of the prototype? I'm personally a fan of simple navbars (unless the page itself has a very specific theme that requires a different navbar color. I also want to keep the fonts as sans-serif fonts (Roboto, Helvetica, etc.), unless again, the page has some sort of inherent theme. That's just my taste, however, so I want to see what other design tweaks/designs you two want to see.

garrettsummerfi3ld commented 6 years ago

I would type out a longer and more detailed comment but I am on mobile.

BUT I am down with the move to this.

garrettsummerfi3ld commented 6 years ago

Written out and more of my opinion outside of what is there from my last comment.

I feel that MDL is something that is an evil in its own way when even Google can't settle on and as well as other products for its design language and takes forever to merge into anything. MDL also has the weird and quirky acts that is dumb and honestly quite finicky to work with.

As trying to keep up with what we want, it sucks because Google keeps changing everything and MDL might get shafted with what we are wanting do have the site look, operate, and perform.

Using our own can help minimize everything being terrible and not rely on other broken and cannot be modified stylesheets that we do not own and attempt to use with our workflow unless we fork MDL and use it to modify.

Lets see and we start switching over to our new stylesheets.

Also @translucentleaf this preview is really dope, keep up the work.