pdinklag / MinecraftStats

A Minecraft player statistics browser for the web - supports 1.13 and later!
https://discord.gg/brH5PGG8By
Other
227 stars 53 forks source link

Responsive Layout #9

Closed pdinklag closed 6 years ago

pdinklag commented 7 years ago

The application should get a responsive layout that works well on mobile devices. The new layout should also fix the layouting problems that occasionally appear in desktop browsers.

bmarwell commented 7 years ago

I'm not saying 3rd-party css is generally a good idea, but please try https://stats.mc.bmarwell.de if my modifications fix your desktop browser problems and how it looks on your mobile device.

bmarwell commented 7 years ago

Kannst du mir mal die Probleme auf dem Desktop beschreiben? Ich denke, so etwas wie normalize.css ist pflicht. Darüber hinaus könnte man Skeleton (was nun wirklich sehr klein ist) auch gut einbinden. Es ist wirklich nicht "over-sized", und man kann auch Teile des CSS entfernen, sofern sie nicht gebraucht werden.

pdinklag commented 7 years ago

I think you misunderstood - I have desktop layout issues with my current version of mcstats, not with yours. 😄

Anyway, I just looked at your altered design and for me it looks a bit too "griddy", also the layout at the top is a bit broken ("make shortcut" button and the background behind the header). Still, the rest of the layout looks good on mobile, so I'll have a look at that. As I mentioned, no promises as to "when".

Thank you for the hints!

(oh, and even though I'm German too, I prefer to keep it English here 😉 )

bmarwell commented 7 years ago

We can keep it English here, I'm fine with that.

I didn't misunderstand you. I wasn't referring to my version. I just didn't see any rendering issues with your stock version.

Please elaborate which grids you don't like and why. To my understanding, grids are the no1 prerequisite for responsive layouts as they will line break to rows with only one column.

I am happy to offer my site for tests. And yes, I know of the broken top background. I was just lazy at some point. ;-)

About the when: I'd be happy to send pull requests.

MattCSmith commented 7 years ago

Hey, I have been playing with the design of this. I have so far managed to convert most of it over to bootstrap. The majority of my modification have been done to the index page, with the general idea to make it to match my current website.

Feel free to check it out @ https://planb-mc.com/testy/ (Id be happy to share anything you would like to see)

One thing I would like to try to implement, would be to have tabs on the index page. So stats could be broken up into groups. Perhaps

[General Stats] [Food Stats] [Mob Stats] [Tools & Armour]

bmarwell commented 7 years ago

Hi @Chow86, I really like your clean design. I also like the idea of tabs. We just need to make sure they are linkable (i.e. have their own URI).

So we already have a bootstrap and a skeleton conversion. ;-)

bmarwell commented 7 years ago

So, any progress?

pdinklag commented 7 years ago

Nope, no progress. I can't tell when I'll be working on any of this.

https://planb-mc.com/testy/

Looks cool! 👍

So we already have a bootstrap and a skeleton conversion. ;-)

That's good, so let me carefully ask this: if you have working conversions to your favorite frameworks already, is this any urgent? 😉

As I mentioned before, I'm not really interested in using any frameworks for this, so whatever I would do to make it more responsive would be plain HTML and CSS, and thus not compatible to the frameworks mentioned here.

bmarwell commented 7 years ago

if you have working conversions to your favorite frameworks already, is this any urgent? :wink:

Yes, because it's a hazzle to keep the code in sync with yours (whenever you add more stats etc.).

Perhaps we can implement something inbetween (not a [full] framework, but still use foreign code): If we could include normalize.css, it'd help a lot to keep browsers (somewhat) in sync. A git submodule would be a very loose coupling.

All other things could be done with your own css styles.

bmarwell commented 7 years ago

@Chow86 what do you think about forking this repo?

Alfro commented 7 years ago

Hi everyone!

I actually forked this project as well, and added some bootstrap classes. I got it to be more or less responsive, but there is still work to be done.

@pdinklag I can open a PR if you like, as long as you are okay with my changes. :)

Also, I am very interested in your opinion regarding using a framework vs plain PHP. I am thinking to migrate this to symfony, because I feel using a framework makes adding new features faster (like i18n), and also potentially keeps the code more organized.

I would love to hear your opinion on this, and why you think it's a good idea or not. (Should this go in a new issue? :P)

bmarwell commented 7 years ago

From @pdinklag

As I mentioned before, I'm not really interested in using any frameworks for this, so whatever I would do to make it more responsive would be plain HTML and CSS, and thus not compatible to the frameworks mentioned here.

(emphasized by me).

So, I'd go with your fork, @Alfro. I'd also be happy to contribute.

pdinklag commented 7 years ago

Yes, because it's a hazzle to keep the code in sync with yours (whenever you add more stats etc.).

Not really, unless the data collection and model have been changed as well. Whatever framework you use should be merely for presentation of the data.

Of course, I'm willing to adapt any changes that separate model and view/control layers more cleanly so it's easier to use the model for different presentation.

But I can only emphasize that I have no interest in moving to any framework, especially any I don't know; I have neither time nor interest to get into one (properly). My experience is that anytime you put time into learning a framework and use it (especially in the world of web design), it outdates within a short time. Then of course, there are many frameworks for everything, and no matter what you pick, for somebody it's the wrong choice. I tend to stick with plain PHP/HTML/CSS because that's what I know how to use, what everybody understands and what will be remotely up to date even in years to come.

I'm aware that frameworks address common design, safety and security issues and have plenty of advantages, but only if you know how to use them well and are willing to put time into maintaining your project in regard to framework updates. The latter is not the case for me.

In my view, if you prefer to use a framework for the front-end, that's the kind of thing forking is for. Nevertheless, I welcome suggestions to adapt the core layer of this project for easing any framework integration.

pdinklag commented 6 years ago

To address all the changes in 1.13, I'm writing a version 2 now and I thought why not rebuild the client.

While the server side will be written in a more extensible Python module rather than PHP, the client will also become PHP-less and work based on AJAX loaders instead, since all data will be present in JSON format. I had the time to study Bootstrap a bit and it poses much less conventions than I feared, so the client will be developed against Bootstrap 4.

pdinklag commented 6 years ago

The V2 web app has been responsively implemented against Bootstrap.