Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[4.0] New Frontend (Aurora) Template #14864

Merged
merged 28 commits into from Mar 26, 2017

Conversation

@C-Lodder
Copy link
Member

C-Lodder commented Mar 23, 2017

Summary of Changes

So long Protostar and welcome Aurora, the new J4 template based on BS4.

As it currently stands, there are still more views to migrated over to BS4.

Aurora now uses proper naming conventions for module positions, such as sidebar-left, top-a, etc.. unlike the old position-7 which nobody had any clue about.

With the sample data, I've tried to make the homepage look like a proper demo site, by displaying a full stack of modules, each using different "Module Style" and "Moulde Class Suffix", to show new users what it has to offer out the box.

The banner image used if just for demo purposes until the design team provide something a bit more concrete.

Screenshot

aurora

C-Lodder added some commits Feb 23, 2017

@MATsxm

This comment has been minimized.

Copy link
Member

MATsxm commented Mar 23, 2017

Best news of the...... (can't remember)
Really excited about it...
of course, if the design Team needs some total copyleft photos... just ask for them

@ciar4n

This comment has been minimized.

Copy link
Member

ciar4n commented Mar 23, 2017

@MATsxm On the subject of copyright images... can https://unsplash.com/ be used (CC0) ?

@wilsonge

This comment has been minimized.

Copy link
Contributor

wilsonge commented Mar 23, 2017

CC0 is compatible with GPL

@MATsxm

This comment has been minimized.

Copy link
Member

MATsxm commented Mar 23, 2017

@ciar4n @wilsonge it is but it is nearly a question without answers as legal requirements may vary according to the copyright in the country of the photographer, which is very often forgotten.
but... let's say "yes"
this is why I always prefer a writen agrement (things are specificaly fixed) than a "general license"

@C-Lodder

This comment has been minimized.

Copy link
Member Author

C-Lodder commented Mar 23, 2017

When a photographer uploads their photo to a site, they are agreeing to the license stated by the site. And the site specifically says

you can copy, modify, distribute and use the photos for free, including commercial purposes, without asking permission from or providing attribution to the photographer or Unsplash

Either way, it's no big issue, it's only a banner. I'm sure the design team can come up with something that fits the bill

@wilsonge

This comment has been minimized.

Copy link
Contributor

wilsonge commented Mar 23, 2017

I'm sure @MATsxm can take a lovely photo for us that he can donate to the project ;)

// Container
$container = $params->get('fluidContainer') ? 'container-fluid' : 'container';
$doc->setMetaData('viewport', 'width=device-width, initial-scale=1');

This comment has been minimized.

@ghost

ghost Mar 23, 2017

Can't we use $this instead of $doc here?

This comment has been minimized.

@C-Lodder

C-Lodder Mar 23, 2017

Author Member

done, thanks

@C-Lodder

This comment has been minimized.

Copy link
Member Author

C-Lodder commented Mar 23, 2017

@brianteeman - yes, a11y will be done afterwards, once the entire template is finished. I'd preferably like to get a beta of this merged so it's just there with the rest of core for people to use and test on the fly

@@ -9,10 +9,7 @@
defined('_JEXEC') or die;
/** @var JDocumentHtml $this */

This comment has been minimized.

@wilsonge

wilsonge Mar 26, 2017

Contributor

Can you add that comment back please :)

This comment has been minimized.

@C-Lodder

C-Lodder Mar 26, 2017

Author Member

will do

C-Lodder added some commits Mar 26, 2017

@wilsonge wilsonge merged commit 4da1d9e into joomla:4.0-dev Mar 26, 2017

1 of 3 checks passed

continuous-integration/appveyor/pr AppVeyor build failed
Details
continuous-integration/travis-ci/pr The Travis CI build is in progress
Details
continuous-integration/drone/pr the build was successful
Details

@C-Lodder C-Lodder deleted the C-Lodder:aurora branch Mar 26, 2017

@N6REJ

This comment has been minimized.

Copy link
Contributor

N6REJ commented Mar 27, 2017

my suggestion for chrome / module sizing is a variant of what we currently have..
Select 'bootstrap" chrome, select columns ( both currently exist ) & finally select column size which behaves completely differently from bs2 or bs3 ( https://v4-alpha.getbootstrap.com/layout/grid/#grid-options )
You'll also note the column names are different then before.

@born2webdesign

This comment has been minimized.

Copy link

born2webdesign commented Apr 25, 2017

About the mentioned module positions, e.g. sidebar-left—they might still be a good idea (for things independent of html[dir]), but, for the sake of rtl-languages, I think the default wording for sidebars should be e.g. sidebar-start and sidebar-end? (In CSS, text-align-start and text-align-end are a thing now.)

As module positions are mainly exposed to developers/implementors, I think this would actually prevent confusion (rather than add to it).

@brianteeman

This comment has been minimized.

Copy link
Contributor

brianteeman commented Apr 25, 2017

@born2webdesign i agree that the positions should have semantic meaning and I already commented on that earlier today regarding an ID but in this case an RTL language would not change anything. An RTL template is not a mirror of an LTR template so right is still right etc

@wilsonge wilsonge added this to the Joomla 4.0 milestone Apr 25, 2017

@born2webdesign

This comment has been minimized.

Copy link

born2webdesign commented Apr 25, 2017

@brianteeman True, RTL doesn't have to be a mirror of LTR—that's why I agree there could also be *-left and *-right. But a sidebar menu, e.g., should probably change sides when switching from RTL to LTR—thus an additional *-start and *-end would be helpful.

@brianteeman

This comment has been minimized.

Copy link
Contributor

brianteeman commented Apr 25, 2017

In an admin template the ui should indeed be reversed/mirrored so you would be 100% correct there but we are talking about a frontend template here so left would still be left

@born2webdesign

This comment has been minimized.

Copy link

born2webdesign commented Apr 25, 2017

I was talking about the frontend, as well. See my example from above—it is not uncommon for a module to be displayed on the left in ltr and on the right in rtl. And with distinct positions (sidebar-left and sidebar-start) we could have (e.g.) .sidebar-left {float:left} but .sidebar-start {float:left} [dir="rtl"] .sidebar-start {float:right}

@brianteeman

This comment has been minimized.

Copy link
Contributor

brianteeman commented Apr 25, 2017

in that scenario the correct way would be using the module assignment option already available. as this is a frontend template you can always create the positions and css as you want in your own template

@born2webdesign

This comment has been minimized.

Copy link

born2webdesign commented Apr 25, 2017

you can always create the positions and css as you want in your own template

Sure, but if we are introducing sensible module positions, it would be nice to harmonise those with my own template's positions (that came out wrong, I meant changing my own template positions).
You are of course right if you are saying I could assign a translated module to the "opposite" module position …

@C-Lodder

This comment has been minimized.

Copy link
Member Author

C-Lodder commented Apr 25, 2017

I could just use sidebar-a and sidebar-b. Some of the top Joomla and WP template providers use these naming conventions

@born2webdesign

This comment has been minimized.

Copy link

born2webdesign commented Apr 25, 2017

My previous concern (changing sides (or not) for ltr-rtl) is mostly taken care of by assigning modules to the appropriate positions (as brought up by Brian).
But changing templates without having to reassign all modules might be nice, too (sidebar-a on the left in the old template, on the right in the new one)—then again, if we moved the old template's sidebar to the new template's header … To work around that we would have to stick with super generic names … perhaps sidebar-a, sidebar-b and similar are a good compromise? I'm not sure.

@brianteeman

This comment has been minimized.

Copy link
Contributor

brianteeman commented Apr 26, 2017

But changing templates without having to reassign all modules might be nice,

Yes it would be nice but sadly template developers like to reinvent the wheel.

@C-Lodder

This comment has been minimized.

Copy link
Member Author

C-Lodder commented Apr 26, 2017

It's not reinventing the wheel at all. It's using proper naming conventions that SHOULD have been done in the first place, rather that position-7 which could be anywhere.

The new positions mean the user no longer needs to get a template preview open to know where to assign modules.

If the user has Protostar as their default template, then we can simply migrate the module positions over to the Aurora positions, so the the upgrade from 3.x to 4.0 is smooth.

@brianteeman

This comment has been minimized.

Copy link
Contributor

brianteeman commented Apr 26, 2017

I was referring to 3pd template developers not core. ;)

The reason that template positions have a "translation" was so that position-7 would never change in the code but the developer could give it a meaningful name in their own template - no one used it though

@born2webdesign

This comment has been minimized.

Copy link

born2webdesign commented Apr 26, 2017

Maybe we should stick with the generic but flexible position names but promote their translations more/make them more prominent?
Really, the current system seems very well-thought-out to me—thinking about it again ;)—and @brianteeman you are right, I hardly ever used the names/translations, rather invented my own positions. So, if we could fix this behaviour (reinventing positions) by exposing those names more/pushing for their use, perhaps that would make the current system perfect?!

@brianteeman

This comment has been minimized.

Copy link
Contributor

brianteeman commented Apr 26, 2017

Really not sure what more we can do to encourage their use. Remember they also allow a position to be called left and gauche (french) so that in itself should be a reason to use them as it means the position is easy to understand in languages other than english

@born2webdesign

This comment has been minimized.

Copy link

born2webdesign commented Apr 26, 2017

First, we could give them even more descriptive names ("Left Sidebar", "Left Content" instead of just "Left").
Then, in the promotion, instead of "Here are the all-new positions for Aurora: …." it could be "Here are the new position names for Aurora: … "Left Sidebar" (position-8) … Remember, you can give the same positions new names (and translations) in your template so, after changing your template, you shouldn't ever have to reassign positions for existing modules!".

@studio42

This comment has been minimized.

Copy link

studio42 commented Feb 16, 2018

I have read a little the story.
brianteeman, do not do the error to force to add old BS2 in a new template. It's the best way to have conflict as in Joomla3 and before.
I load boostrap in Joomla 3 using JHtml::_('bootstrap.framework') and overide always in front for eg. in MYTEMPLATE/js/ui and MYTEMPLATE/css/ui to overide medias, if alyout need changes, then this should be overide too, but i think that you should simply force all component to use Jquery+boostrap 4 or nothing in admin or we have 4 year problems as mootools in Joomla 3.
Is same as doing it compatible php4 , jquery 1.6 ...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.