another responsive thread.... those mobile rascals....

[drewactual]

hang on tight for this comment, but i promise it get's lighter...

not knowing enough about stuff makes for goofin stuff up, but it also allows a coder to think outside the box educated or well traveled coders find themselves.  we've all got habits.  some of them are bad.  well... most of them are bad.  that is where SMF and other opensource community driven applications shine- those laying the bones of these things have folks looking over their shoulder and making sure bad habits don't manifest themselves in the published products.  it's because of the manner SMF was devised (small team) and then how it's developed into what it is- a superbly clean operating engine- that i find some amazement it's lack of responsiveness.... but not all is lost.  it's not lost because we can make it do tricks...

i built my most recent site on the back of the bellicitta (sp?) theme.  it was a heckuva theme before i broke it several times, and then made it work the way i needed it to work... and in the end, I have a responsive theme. 

as it turns out, it was simple.  liberal use of the @media css declaration and redefining key elements made it work.  It works across the spectrum. 

if anyone here wants examples of it, I'll be happy to cough them up.  let there be no misunderstanding, there are some things you'll have to compromise to make it work.  as a friend of mine who makes a living writing songs once told me of lyrics "you have to be willing to kill your children" is the key to success... meaning, those beautiful scripts and functions, placement and interfaces may not be able to follow you where you need to go to find success.  box them up, instead, and put them in your tool kit.  you may find another place they'll work.

at any rate- here are some css examples of alterations to elements to give you all idea's of making your themes look righteous on smaller screens:

before	with @media
#main_content {       margin-top: 10px;       margin-left: 10px;       margin-bottom: 10px;       padding: 0 5px 5px 5px;       background: #eeeeee;       border: 1px solid #ccc;       width: 75%;       display: block;       float: left; }	@media only screen and (max-width: 650px) {     #main_content {         width:99%; padding:0; margin:auto; margin-top: 90px; display:block; max-width:99%; border:none; background:transparent;     } }

in that ^example, you see that many of the characteristics follow to the responsive @ declarations... and so i set out to change the ones that caused issue...

another:

before with @media @media only screen and (max-width: 650px) {     #forumposts .poster {         clear:both; width:100%; max-width:100%; margin:0; padding:0; display:block;     } } @media only screen and (max-width: 650px) {     .postarea {         clear:both; width:96%; max-width:96%; margin:auto; display: block;     } } @media only screen and (max-width: 650px) {     .post_wrapper {         border: 2px solid #cccccc; width:99%; max-width:99%;     } } @media only screen and (max-width: 650px) {     .post {         width: 96%; max-width:96%;     } } I didn't bother with including the original css declarations because you can likely find them for yourselves- i DID show the @media to show y'all one of the 'compromises' you'll have to be able to make... in this example, which is the post itself, the username and information is broken out of the left column beside the post and planted above it, with the post itself under it... it doesn't look bad, and the use of borders gives it integrity from other posts in the thread... so... I don't know how much of this is of interest here, but I thought i'd share all the same.  SMF and the community has done a lot for me and my purposes for many years, and i thought i'd give something back.  thoughts?

[Kindred]

You do realize that we have already done this work for you?

The responsive curve mod will make the curve theme. (The default that comes with smf 2.0.x) to be mostly responsive..., and there are dozens of other custom responsive themes available for smf 2.0.x as well

[drewactual]

i do realize that... but that work isn't mine.  it's not so much having a responsive theme available, as much as it is being able to do it myself- accomplishment... confidence... not being bound because you're capable of doing it yourself. 

pointing out the lack of difficulty is my intent.   

my point is it isn't that hard. 

[Gwenwyfar]

Css and html aren't known for being hard. It's actually very easy to make a huge tangled mess out of it. If you're interested in doing things by yourself maybe you should check out the guides and resource links on the Scripting Help section.

[drewactual]

you know, i realize css and html aren't hard... neither is php or friggin' cobol for that matter.... and i see the two respondents to this thread are knowledgeable and right handy with making this machine spin on its head if that's what they want it to do....

and then i read threads like "how can i make my header image span across the page", and realize there are others here who don't have skills the OP's have acquired.   

did it ever occur to you two this thread was intended for those w/o the experience?  or are you happy enough to beat on your chests of your prowess while inflating your post count?  THIS is why forums die.  it's supremely ironic that in a forum of forum authors/owners this type of thing exists. 

too friggin' funny.

drew out. 

[Gwenwyfar]

I don't mean to be rude, it's nice to see someone with such enthusiasm! But the facts are, the examples you gave are bad code for something that has already been done, which isn't very helpful to anyone... Maybe you could compile a resources guide of tutorials if your point is to try to get to the less knowledgeable folk, I'm sure many would find that useful

And, as a matter of fact, yes, php is harder than css and html. Anyone can write some basic html/css within minutes, some of it is not even that different from bbcode. You're trying to compare a programming language with a markup language. Very different beasts. And have in mind, something being easy to do poorly doesn't mean it's easy to do properly. Many programming languages aren't easy at either.