Some minor full editor improvements

Discuss requests for comments/changes posted in the Issue Tracker for the development of phpBB's style.
Forum rules
Please do not post support questions regarding installing, updating, or upgrading phpBB or modifying styles of released phpBB versions. If you need support for phpBB please visit the Support Forums on phpbb.com.

If you have questions regarding creating styles please post in Styles Support & Discussion to receive proper guidance from our staff and community.
User avatar
Louis7777
Registered User
Posts: 394
Joined: Fri Apr 04, 2014 12:32 am

Some minor full editor improvements

Post by Louis7777 »

Just throwing some little ideas for discussion. The intention here is to make the full editor look tidier and more intuitive to use.

We've already agreed that a dropdown box for the smilies would be welcome so I'll skip that one.

So here's a list:

  1. Resizing the text area lags. Fix it by using more specific CSS transitions? (https://tracker.phpbb.com/browse/PHPBB3-15173)
  2. Remove the "Topic review" internal link. One does not need to scroll that much to find it.
  3. EXPAND VIEW and COLLAPSE VIEW links are basically buttons, so make them look like ones. Maybe use icons instead?
  4. Remove the little "Top" back-to-top link. There are existing extensions to accomplish that and they look more elegant.
  5. Remove support for flash and the "[ flash ] is ON / OFF" text. People can create a custom BBCode if they want it.
  6. Maybe it would be possible to remove some JS for tab switching and do it purely with CSS3? https://codepen.io/oknoblich/pen/tfjFl
  7. Perhaps add a small loading spinner (CSS animation) within the "Submit" button, after it has been clicked?

Your thoughts. :)
Last edited by Louis7777 on Tue Apr 18, 2017 10:07 pm, edited 1 time in total.

User avatar
Vinny
Style Customisations
Style Customisations
Posts: 129
Joined: Thu May 20, 2010 4:01 am
Location: Brazil
Contact:

Re: Some minor full editor improvements

Post by Vinny »

Remove the "Topic review" internal link. One does not need to scroll that much to find it.
+1
EXPAND VIEW and COLLAPSE VIEW links are basically buttons, so make them look like ones. Maybe use icons instead?
Which icons do you suggest?
Remove the little "Top" back-to-top link. There are existing extensions to accomplish that and they look more elegant.
-1
Remove support for flash and the "[ flash ] is ON / OFF" text. People can create a custom BBCode if they want it.
Many browsers are dropping flash support, I think we should do the same. However, this should be handled in a own RFC/ticket.
Perhaps add a small loading spinner (CSS animation) within the "Submit" button, after it has been clicked?
-1


Maybe we could treat this as re-design instead of some minor improvements.

User avatar
Louis7777
Registered User
Posts: 394
Joined: Fri Apr 04, 2014 12:32 am

Re: Some minor full editor improvements

Post by Louis7777 »

Vinny wrote: Thu Mar 30, 2017 6:28 am Which icons do you suggest?
"Plus" and "minus" icons along with the existing text I guess. What's more important is to make it look like a button.

User avatar
Jacob
Registered User
Posts: 102
Joined: Wed Jan 04, 2012 1:41 pm

Re: Some minor full editor improvements

Post by Jacob »

Louis7777 wrote: Thu Mar 30, 2017 5:50 amRemove the little "Top" back-to-top link. There are existing extensions to accomplish that and they look more elegant.
Over my cold dead hands!

User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 968
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

Re: Some minor full editor improvements

Post by hanakin »

a lot of this will be handled in the new theme however I have little interest/time in fixing a lot of this in prosilver myself, but if you or someone else put together some prs we are more than happy to look them over.
Donations welcome via Paypal Image

BondGamer
Registered User
Posts: 113
Joined: Mon Dec 15, 2003 8:20 pm
Contact:

Re: Some minor full editor improvements

Post by BondGamer »

I posted some ideas to improve the style for mobile editing, but no one was interested in discussing it on the main forum. phpBB is 10 years out of date when it comes to posting on smartphones. I don't understand why this has not been a priority. All the improvements to making viewing a forum responsive but nothing for posting???

Here is some code I did:

Code: Select all

@media (max-height: 414px){
	.format-buttons{
	  display: block;
		float: right;
		width: 15%;
		margin-top: 0px;

	}
	.message-box {
	    height: 150px;
		width: 84%;
	}
	.message-box textarea{
		height: 150px;
	}
	.smiley-box {
		display: none;
	}
	.bbcode-status {
		display: none;
	}
}

@media (max-width: 700px) {
	.message-box {
		height: 230px;
		float: none;
		width: auto;
	}
	.message-box textarea{
		height: 230px;
		font-size: 16px;
	
	}
	.smiley-box {
		display: none;
	}
}
After using it for a few days, I realize it is not ideal to have the button appear at the top of the text area. Sometimes when you select text, the copy/paste phone UI will appear above the text and block the buttons. So I moved the bbCode bar to the bottom of the text area on vertical screens.
IMG_1963.JPG
Landscape example (current on left, New on right)
IMG_1964.JPG

User avatar
DavidIQ
Customisations Team Leader
Customisations Team Leader
Posts: 1904
Joined: Thu Mar 02, 2006 4:29 pm
Location: Earth
Contact:

Re: Some minor full editor improvements

Post by DavidIQ »

BondGamer wrote: Thu Apr 06, 2017 12:33 pm phpBB is 10 years out of date when it comes to posting on smartphones.
:| Smartphones had not started to have any real widespread adoption until the iPhone was introduced in 2007 and at that point the entire web was a few years away from supporting such devices properly (Twitter Bootstrap, for instance, originally came out in 2011). Even then it was still some time away from being widely adopted so 10 years is a bit of an exaggeration. :P

In any case while I agree that it is probably a good suggestion for a change (I have had this problem myself) you end up with a different problem I think: the keyboard ends up covering the entirety of the buttons on some devices since not all keyboards are the same with some even including a row of keys for numbers at the top. This is especially problematic for Android as the keyboard can be different across manufacturers. I'm not sure that covering all of the buttons is a better solution from only covering some of the buttons occasionally. Any thoughts on handling that?
Image

BondGamer
Registered User
Posts: 113
Joined: Mon Dec 15, 2003 8:20 pm
Contact:

Re: Some minor full editor improvements

Post by BondGamer »

With my out of date comment I was trying to emphasize how phpBB has been slow to adapt to new web technologies. We basically just got some Ajax functionality which was long overdue. A large portion of web viewing is now done on mobile devices. It is ridiculous how bad trying to post in phpBB is on the latest version.

Someone with experience designing for mobile would have to chime in about the different layouts.

While typing this reply the textarea is wider than my screen so I have to manually scroll over if I need to see the text. This is dreadful.

User avatar
DavidIQ
Customisations Team Leader
Customisations Team Leader
Posts: 1904
Joined: Thu Mar 02, 2006 4:29 pm
Location: Earth
Contact:

Re: Some minor full editor improvements

Post by DavidIQ »

BondGamer wrote: Thu Apr 06, 2017 1:25 pm While typing this reply the textarea is wider than my screen so I have to manually scroll over if I need to see the text. This is dreadful.
You'll have to specify what device you're using. I just replied using a Galaxy S6 and took a look over on an iPad and don't see that problem at all. Both on landscape and portrait the submit button is on the center of the screen with no need for scrolling and the text area is the proper width.
Image

BondGamer
Registered User
Posts: 113
Joined: Mon Dec 15, 2003 8:20 pm
Contact:

Re: Some minor full editor improvements

Post by BondGamer »

IPhone 7

Part of the issue might be unless you have font size 16 or bigger in the text area (or select box) then iOS will zoom in the page. This is one of the code changes I had above.

Post Reply