WIP: Sass and design clean-up

[rmdort]

Branch: https://github.com/rmdort/hackerspace.sg/tree/sass-support

Goals

• Add SASS
• Better Typography
• Better design
• Reponsive
• CSS and JS clean-up

Contributions welcome :)

[kaihendry]

Thanks! I quickly tested it and the menu seems to disappear when resizing down.
Video exhibiting the problem: http://r2d2.webconverger.org/2014-01-17/sass.html

Oh crap, I just realised I was testing your master. The wrong branch.

[laktek]

WOW

   so sassy

such type

    much amaze

[kaihendry]

Ok, I tested it. I could see the double column stuff. Couldn't quite see difference in typography. The menu seems a bit wrong, should be horizontal at least on desktop?

http://r2d2.webconverger.org/2014-01-17/menu.html

[rmdort]

Yep.. Still a WIP. I will be on it this weekend :)

[kaihendry]

I think @miccheng has recently added less style sheets.

[miccheng]

Oops...

[kaihendry]

Any design ideas how to incorporate the Web cam http://cam.hackerspace.sg/lastfetched.webp into the header? Or not at all? 😸

[miccheng]

Add:

background-repeat: no-repeat;
background-size: cover;

On Tuesday, November 11, 2014, Kai Hendry notifications@github.com wrote:

Any design ideas how to incorporate the Web cam
http://cam.hackerspace.sg/lastfetched.webp into the header? Or not at
all? [image: 😸]

—
Reply to this email directly or view it on GitHub
#23 (comment)
.

Regards,

Michael Cheng CM
Mobile: +65 9185 5166
LinkedIn: http://sg.linkedin.com/in/miccheng

[kaihendry]

That only shows the top of the cam image in the header. Urgh.

[valentine]

background-size: 25% or 33% worked to show the entire image, but I went with 8% for now because my sense of aesthetics died.

We should have some server-side face detection and cropping. Anyone?

[miccheng]

How big is your screen resolution?
On Tue, 11 Nov 2014 at 4:07 pm Kai Hendry notifications@github.com wrote:

That only shows the top of the cam image in the header. Urgh.

https://camo.githubusercontent.com/b12830b1216c9d9b41ee79e2eb5c02b9ff4d452d/687474703a2f2f732e6e6174616c69616e2e6f72672f323031342d31312d31312f746f702e706e67

—
Reply to this email directly or view it on GitHub
#23 (comment)
.

[kaihendry]

1366 x 768 ... ?

[miccheng]

#112 Have a look at my fix.