News:

Bored?  Looking to kill some time?  Want to chat with other SMF users?  Join us in IRC chat or Discord

Main Menu

Maybe in our world there lives a happy little responsive Curve2 over there

Started by Antes, April 02, 2014, 03:47:58 PM

Previous topic - Next topic

Dragooon

Quote from: Arantor on May 23, 2014, 02:42:38 PM
Has anyone here other than me actually attempted to integrate Bootstrap into 2.1's theme? Slapping Bootstrap in doesn't magically make it responsive. You still have to rewrite the theme to play with Bootstrap in the first place.
I have, 0/10, would not recommend.

Quote from: Alex@ on May 23, 2014, 02:42:21 PM
So You want to limit how a theme will Work on a 27" screen, just to make it Work the same way on a 5"?!
Nope.

Arantor

Yeah, I came to much the same conclusion but I'm not enough of a themer to do a fat lot else and don't like the jQuery Mobile route much either.

Dragooon

Quote from: Arantor on May 23, 2014, 02:47:56 PM
Yeah, I came to much the same conclusion but I'm not enough of a themer to do a fat lot else and don't like the jQuery Mobile route much either.
Bootstrap is nice if you're starting from ground as it already handles a lot of things for you and has a defined structure, but in SMF's case it'll require re-doing a lot of templates to properly fit bootstrap which is more work than creating your own responsive stylesheet.

[yub] Lazo

Quote from: Dragooon on May 23, 2014, 02:51:29 PM
Bootstrap is nice if you're starting from ground as it already handles a lot of things for you and has a defined structure, but in SMF's case it'll require re-doing a lot of templates to properly fit bootstrap which is more work than creating your own responsive stylesheet.
YUP! I fully agree. I also tryed it out, it's just to much work, and it still is not what you would call a good solution(for SMF).

Dynamic forum signatures v1.2

Bloc

Quote from: Dragooon on May 23, 2014, 02:04:26 PM
QuoteWell, as already pointed out a highres 5" and lowres 5" should look just the same(because the physical size is the same, though the quality will be different - better for high-res of course) - but in order to accomplish that you have to stop the stylesheet for switching to 20" optimised styles even if the resolution is the same as the 20" screen.
Please please actually try a responsive design and read up on them before throwing your claims that the responsive design will switch to the 20" optimised style even if the device is 5". That's complete and utter nonsense, you can very well make the 5" high res device return the value as if it's a low res standard 5" device which is actually the backbone of proper responsive design.

Also, there's a difference between mobile-first and responsive designs. I don't know anyone said anything about mobile-first designs here. SMF 2.1 is not having the mobile design first and then being blown up to support desktops, it's the other way around
Then please explain. If I use ONLY media queries that search for certain widths..how can it filter out that its still a 5" device even if the width is above 1200px? By using other media query keywords to learn that?  Which ones? And how to combine those? I don't care about auto-zooming or what else mobile browsers do of tricks to make it look better, my simple need is a way to make responsive design look the way I intend to on ALL devices - not what the browser decides is the best. Thats not good design, I  might as well use Tapatalk then.

I am not "throwing out" stuff btw, I am voicing MY concerns and needs. If its possible, great, fine, super. But so far I haven't seen a good solution to it, so stop saying its possible and rather enlighten us ( or me it seems :P )


..I am not even sure what I am debating this still lol, since I suspect we have similar goals. I should stop, as of right now.

Dragooon

QuoteThen please explain. If I use ONLY media queries that search for certain widths..how can it filter out that its still a 5" device even if the width is above 1200px? By using other media query keywords to learn that?  Which ones? And how to combine those? I don't care about auto-zooming or what else mobile browsers do of tricks to make it look better, my simple need is a way to make responsive design look the way I intend to on ALL devices - not what the browser decides is the best. Thats not good design, I  might as well use Tapatalk then.
Use device-width. Seriously. That's it, use device-width.
@media (max-device-width: 320px) {
}


The above will apply even if your device has 1120 x 640 resolution (a la retina iPhone), because the browser downscales the device-width to the relevant old-fashioned width to suite the actual needs. It is not a trick, it's a proper documented css3 feature. If you want a live example, pick up a phone and go to http://getbootstrap.com.

Dragooon

Quote from: [yub] Lazo on May 23, 2014, 05:03:53 PM
Quote from: Dragooon on May 23, 2014, 02:51:29 PM
Bootstrap is nice if you're starting from ground as it already handles a lot of things for you and has a defined structure, but in SMF's case it'll require re-doing a lot of templates to properly fit bootstrap which is more work than creating your own responsive stylesheet.
YUP! I fully agree. I also tryed it out, it's just to much work, and it still is not what you would call a good solution(for SMF).
It's a wonderful solution if someone has the patience to rewrite all the templates from scratch, but I don't think anyone does.

Tekkla

Quote from: Arantor on May 23, 2014, 02:42:38 PMHas anyone here other than me actually attempted to integrate Bootstrap into 2.1's theme? Slapping Bootstrap in doesn't magically make it responsive.
Not only tried. With the current state of Antes theme it works quite well. There are some points where Curve and Bootstrap do not live in good harmony but it wouldn't be a big deal to change this.

Of course, as discussed a few weeks ago, including BS bloats the forums css without profit for the forum itself. Maybe it would be a good idea to make Curve RWD theme a little bit more compatible to Bootstrap so modder can use it without theme glitches if they want.

Arantor

Well... it's not beyond the bounds of feasibility, but I have better things to be doing than completing such a rewrite (since I started)

Tekkla

Quote from: Arantor on May 23, 2014, 05:22:09 PM
Well... it's not beyond the bounds of feasibility, but I have better things to be doing than completing such a rewrite (since I started)
Coexistance in harmony would be a better solution. There are only a few things to change in Curve to reach this. A complete rewrite is like pain in the ass.

Arantor

That's because you have to do a complete rewrite to ACTUALLY make it work properly, otherwise smashing tables and stuff into Bootstrap is a total waste of time and energy.

Antes

There is a difference between adapting and rewriting. Yes we can use bootstrap 3.x on SMF2.2 (for example) with small patches on it, but will it look good? I don't think so - that's the point Arantor showing. If you want to use that type of things you need to do complete rewrite to theme. Otherwise you end up patching it like a rewrite (on long run).

Tekkla

Have you ever tried to include Bootstrap after index.responsive.css?

Dragooon

Quote from: Tekkla on May 23, 2014, 05:47:46 PM
Have you ever tried to include Bootstrap after index.responsive.css?
What purpose would that serve?

Arantor


Dragooon


Arantor

If, however, you add it FIRST, things are decidedly less broken. Still very broken but it doesn't hurt nearly so much to try to fix. At least, that was what I found.

Tekkla

No mass style breakage. You can see some differences in padding and margins. And you can see differences in how SMF and BS are using html elements. Mostly in heading usage.

http://tekkla.de/pics/with_bootstrap.jpg
http://tekkla.de/pics/without_bootstrap.jpg


It's only the boardindex, but the rest of the forum isn't much more broken than this.





Arantor

Which 2.1 alpha is this based on? Is that current, or is that - say - from 3 months ago when I forked and started doing an integration (knowing full well that there's been a ton of work rewriting the templates since then)

Antes

Quote from: Tekkla on May 23, 2014, 05:47:46 PM
Have you ever tried to include Bootstrap after index.responsive.css?
Nope

Quote from: Dragooon on May 23, 2014, 05:48:19 PM
Quote from: Tekkla on May 23, 2014, 05:47:46 PM
Have you ever tried to include Bootstrap after index.responsive.css?
What purpose would that serve?
Nothing :D

Quote from: Arantor on May 23, 2014, 05:49:22 PM
Mass style breakage and no responsive benefits whatsoever?
lol :P

Quote from: Tekkla on May 23, 2014, 06:13:54 PM
No mass style breakage. You can see some differences in padding and margins. And you can see differences in how SMF and BS are using html elements. Mostly in heading usage.

http://tekkla.de/pics/with_bootstrap.jpg
http://tekkla.de/pics/without_bootstrap.jpg


It's only the boardindex, but the rest of the forum isn't much more broken than this.

Because bootstrap only changed the general elements such as h3 / img etc... that picture (with bootstrap) 95% or even more only using index.css

Advertisement: