search

AgeManning / EthereumMiningCalculator

Advanced statistics for mining ethereum and other cryptocurrencies.
https://thecalc.io
16 stars 11 forks source link

This should fix #57 (mobile footer problem) #61

Closed mathvdh closed 8 years ago

mathvdh commented 8 years ago

For me it fixes it (and I don't think it break anything else).

But I only tested it on chrome with the "mobile" simulator (or whatever it's called).

So please test more :)

mathvdh commented 8 years ago

I thought I'd contribute back :) (for what it's worth)

AgeManning commented 8 years ago

Awesome! Love more contributors. Thanks for the help. Will leave this one for @paulhauner

paulhauner commented 8 years ago

Thanks for contributing!

This looks great in mobile mode, but for me on Chrome(OSX) the footer is no longer 'sticky'. For example, the footer has white space beneath it on the homepage on a large-enough resolution.

Happy to merge it in if you can fix that :)

mathvdh commented 8 years ago

Mmm I can't reproduce that (I'm on a macbook pro retina and I don't have my 4k screen here).

Nevertheless when I make the window bigger than my screen it doesn't do it either .. ?

Weird .. do you have a screenshot ?

Cheers

paulhauner commented 8 years ago

Odd, I'm also on a MBP Retina - however I have my Scaling set to 'More Space'. Maybe that's it?

Chrome Version 51.0.2704.103 (64-bit)

Screenshot: Screenshot

mathvdh commented 8 years ago

Ok I got it ... It's when the natural size of the content is smaller than the screen size ... which was not the case with my scaling but is the case with yours (I just tested it ..)

Let me fix that :)

mathvdh commented 8 years ago

Fuck, I hate CSS :)

I can't come up with a clean way of doing it ..

Can I use media queries ?? Then it should be quite clean

(Will just set a different height on the footer based on when it goes to 2 lines , 3 lines ..) ?

Any idea otherwise ?

mathvdh commented 8 years ago

Or you can go with something like that : https://gist.github.com/seyDoggy/e919a429b2459aedf509

(Basically using display:table on the body and display:table-row ..)

But I think it's ugly and sucks.

And finally you could go with display:flex and this stuff but I think that would imply changing a lot of stuff in current page ...

??

mathvdh commented 8 years ago

Ok I've added a solution using media queries and it should be fine now

(If you are fine with a solution based on media queries obviously)

Let me know ...

mathvdh commented 8 years ago

OK I've added one more media queries for really small screen like iphone 5

Should be OK now.

BTW we can use the media-queries at bottom of style file for fixing other things too if you'd like ..

Cheers

mathvdh commented 8 years ago

BTW This makes me thing why this npm-debug.log was there in the first place ..

Initially when I was doing npm start .. It was working ..

Now I have an error ..

module.js:440
    throw err;
    ^

Error: Cannot find module '../lib/cli'
    at Function.Module._resolveFilename (module.js:438:15)
    at Function.Module._load (module.js:386:25)
    at Module.require (module.js:466:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/mathvdh/Dropbox/DCY/99 - Backup/WORK/Projects/2016/ethereum/ethereum-mining-calculator/EthereumMiningCalculator/node_modules/.bin/grunt:12:15)
    at Module._compile (module.js:541:32)
    at Object.Module._extensions..js (module.js:550:10)
    at Module.load (module.js:456:32)
    at tryModuleLoad (module.js:415:12)
    at Function.Module._load (module.js:407:3)

If I launch grunt directly it works thou ...

Any idea why ?

paulhauner commented 8 years ago

Nice work!! Merging now :)

paulhauner commented 8 years ago

@mathvdh does it help if you delete node_modules/ and do $ npm install? Sounds like grunt is being funny.

mathvdh commented 8 years ago

Hi, I will try tonight and let you know .. Still at work for now :)