you are viewing a single comment's thread.

view the rest of the comments →

[–]magnora7[S] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (17 children)

I think I solved all the bugs you brought up for the <600px viewport width, check em out.

The expando thing is a separate issue, I'll come back to that another time.

The comment input width thing is like my moby dick white whale.... it's getting ridiculous. Your javascript hunch looks correct. I know we can just take out the width definition entirely, and it would work great in my tests. But the code says not to do that in the comments, but maybe that's obsolete....

Option 1:

var body_width = Math.max(body.children(".md").width(), 500);

Change this line to simply

var body_width = body.children(".md").width();

This should remove that 495px restriction?

OPTION 2:

Delete one of the following lines to remove the width restriction entirely (best option):

//restore original (?) css width/height. I can't explain why, but //this is important.

textarea.css('width', '');

Delete these lines and/or also delete these 3 lines:

var new_width = Math.max(body_width - 5, textarea.width());

textarea.width(new_width);

edit.width(new_width);

What do you think? Can you test out option 2 for me real quick before I try it on the production server?

[–][deleted] 2 insightful - 1 fun2 insightful - 0 fun3 insightful - 1 fun -  (1 child)

Option 2!

Yeah comment out everything with and height related, including var body_width and var body_height

[–]magnora7[S] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (0 children)

Okay! I'm going to go for it.

[–][deleted] 2 insightful - 1 fun2 insightful - 0 fun3 insightful - 1 fun -  (14 children)

I think I solved all the bugs you brought up for the <600px viewport width, check em out.

Amazing! It honestly looks great and polished and professional.

[–]magnora7[S] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (9 children)

Awesome :) So glad to hear that man. I'm really happy with how it turned out, thanks for the pointers for the <600px mode.

The javascript is about to execute...

[–][deleted] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (8 children)

nice!! mobile looks good, desktop needs .usertext-edit textarea width: 99% (or maybe 98%).

[–]magnora7[S] 2 insightful - 1 fun2 insightful - 0 fun3 insightful - 1 fun -  (7 children)

sweet!

desktop needs 'width: 99%' (or maybe 98%).

how do you mean exactly?

[–][deleted] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (6 children)

Actually I see this style:

@media only screen and (max-width: 600px)
.usertext-edit, .usertext-edit textarea, .formtabs-content {
    width: 98%;
}

Let's make that 98% the default style, so it applies to desktop too. Desktop has extra space to the right of the textarea.

[–]magnora7[S] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (4 children)

Ah okay actually just usertext-edit textarea was good just by itself, I turned it from 90% to 97%, so we should be good there

[–][deleted] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (3 children)

Yes, nice!

[–]magnora7[S] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (2 children)

Cool, I think I solved everything you brought up then, except the expandos, which is another project. Sweet deal! Thanks man. Now I need a break, I've been at this since like 9am basically nonstop haha

[–][deleted] 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (1 child)

Yeah we'll probably need to modify html to pull off the expando width change.

Have a good break! I'm gonna go for chat. I keep accidentally getting drunk and tired. Hahaa

[–]magnora7[S] 2 insightful - 1 fun2 insightful - 0 fun3 insightful - 1 fun -  (0 children)

Unfortunately that doesn't work when the sidebar is present, .formtabs-content has to be at about 60% wide to fit properly in the 600px-1200px wide range. Usertext-edit is already set to 90%.

[–]magnora7[S] 2 insightful - 1 fun2 insightful - 0 fun3 insightful - 1 fun -  (3 children)

Holy shit it worked! Awesome. Maybe I'll put the height stuff back in though, it's making very short boxes for post edits

edit: nope, putting height back in broke it, i'll try adjusting height in css instead now that we're free from the css shackles of that javascript lol

[–][deleted] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (2 children)

yeah try a min-height

[–]magnora7[S] 3 insightful - 1 fun3 insightful - 0 fun4 insightful - 1 fun -  (0 children)

But most importantly the width clipping issue is solved, that feels good to have that done. Thanks for the help.

[–]magnora7[S] 2 insightful - 1 fun2 insightful - 0 fun3 insightful - 1 fun -  (0 children)

Ah it doesn't work unfortunately, it affects all text boxes on the whole site, and we don't want every text box being super tall, so I think I'm going to leave it at 150px tall for now