Bartik fluid width subtheme

Great idea. Not possible right now.

This issue was raised and closed on the Bartik queue recently. #845732: add a fluid subtheme I believe it'd also come up before.

I said over there:

Hm, there are a lot of possibilities here, especially given the about-to-happen trend of Responsive web design
http://www.alistapart.com/articles/responsive-web-design/
but at this point in the game, it's too late.

Perhaps someone wants to make a fluid design / responsive design for contrib.

I'm going to leave this as a Drupal issue, and move it to D8, rather than close it (or mark as a dup), so people can see what the current thinking is.

I'm going to echo xmacinfo here -- is it *really* that hard?

I'm by no means a css pro, I just muddle along, but to my mind all you need to do is set up the negative margins type of layout that Garland has. Garland's switching between fluid and fixed is pretty basic IICR.

Here's why I think this is needed:

Start adding things like admin views tables and they'll get unusable pretty fast.

Looking at Garland, it's a setting rather than a whole other theme.

Garland uses a negative margins technique to get a combination of fixed sidebars + fluid content column. To do the same in Bartik I think we pretty much just need an extra DIV wrapper on the central content column.

Garland is using a theme setting to switch between fluid and fixed width. A preprocess function then adds a fluid-width class to the body.

That's the easy part. I personally don't like fluid layouts, so I never really make them myself. However, here's a patch proposal anyway, just to see if this works (I'm really getting into this patch thing =)) I see jens point, my patch is just a beginning. It would need to be checked with one, two and no sidebars and RTL (and whatever else that I'm forgetting).

Also I don't know how Garland sets the default for fluid width. I'm no good at PHP beyond copying/pasting the right parts. I'm pretty sure I got everything from Garland needed for the theme settings, but there's no default in Bartik.

Here's a patch and a theme-settings.php (download and rename to theme-settings.php), sorry I couldn't figure out how to add a file in a patch.

Here's what I checked and what's currently working:
- fluid width with one sidebar
- fluid width with two sidebars
- fixed width setting: everything looks the same as before

Patch looks good in general. Not tested on RTL though.

- there needs to be a default for the new setting. We need something like this in the .info file:

settings[bartik_width] = fluid

I've added that, but doing a grep on garland_width shows it in system.install too and I've no idea what how it all works.

- this seems to break the layout of the color preview

- I'm not sure about using '.section' for the squeezing -- conceptually, I think 'section' is something that may be repeated several times in a column, and also it's a generic class that's reused all over the page and it feels a bit wrong having it handle something like this. At the risk of tag soup, I would add a dedicated 'squeeze' wrapper. But let's see what the css pros say about this.

- the right hand margin is too big. sidebar-first is flush with the left hand edge; sidebar-second should mirror this.

- what should happen to the footer and triptych groups of regions?

Here's the patch from above rerolled and with that setting in the .info, an Id string in the new file, and the whitespace change in themes/bartik/css/style.css removed.

@joachim:
It probably won't work in RTL since there are RTL specific stylesheets I didn't touch.

Thanks to finding the part that sets the default. However, I don't think the standard should be set to fluid. Maybe later, but not until this is working correctly. Attached patch changes this setting to fixed.

Also what exactly is it that "seems to break the layout of the color preview"? The preview seems to be looking the same with or without the patch.

@xmacinfo:
I actually read that part about manually adding files, but I have to admit I didn't understand the instructions. joachim seems to have tried to add the file, I see it in the patch, but the file is not in the bartik folder after patching.

I tried it adding the file through a patch again using the instructions and some IRC help and got it to work. To apply use patch -p0 < 846542.patch in your D7 root folder.

> Also what exactly is it that "seems to break the layout of the color preview"? The preview seems to be looking the same with or without the patch.

The lorem ipsum in the preview was unbelievably long and thin -- though could have been prior to patch, didn't check.

Yup, it's caused by the patch.

Also:

+/* Unset container width when we are using the "fluid width" option. */
+body.fluid-width #header div.section,
+body.fluid-width #navigation div.section,
+body.fluid-width #featured div.section,
+body.fluid-width #messages,
+body.fluid-width #main,
+body.fluid-width #triptych,
+body.fluid-width #footer-columns,
+body.fluid-width #footer {
+  width: auto;
+  max-width: 1270px;
+}

Firstly, is it a good idea having a max-width?
And if it is, would this not be a lot more elegant put on #page, which wraps around all these?

#12: Does this happen using the latest patch? I don't have this, tried with both Seven and Bartik as an admin theme. Am I right that you're talking about the color scheme preview at admin/appearance/settings/bartik? Maybe I'm looking in the wrong spot :)

#13: The max-width is taken from Garland. I don't know about using #page, can you give it a try?

Guys,as Jen says its way to late for this and its come up several times over the months - there's just no way we can do both in the time allowed, this should have been raised and worked on right from the start, like 6 months ago with a view to theme that supported both options - that didnt happen then and has to be a D8 feature request, which would work a lot more easier since we won't need to support IE6 (RTL hell for fluid widths, min/max width etc). Some could easily do this in contrib and have it really up to speed by D8 (as a subtheme).

Please do consider putting this into Contrib. I'm happy to support a Bartik-fluid project in contrib. I don't want you to get discouraged thinking putting a fluid-width theme into D7 core is possible, only to get shot down later. This effort is a good one, and it can happen, and be used, and be popular..... in contrib.

If you want to shift your focus to contrib, then move this issue to the Bartik queue! And organize the effort over there.

This doesn't even need to be a subtheme; if anything it's best not as a subtheme.

Hence it can't really be a separate contrib thing.

Couldn't this get into D7 at a later time, after release, like in Drupal 7.4 or does that not make sense? If not, I guess we can make this a sub-theme.

I don't know what kind of changes are allowed after D7 has officially launched. I'm curious myself, and expect to learn this fall. My understanding now is that only bug fixes go in, not feature changes.

I do think that if a fluid-width version of Bartik goes into core, it should go in as a setting setting, not as a child theme. That's how Minnelli is now — a setting in Garland. Bartik should follow the same pattern.

If people are trying to get this done asap to see if there's a chance to get it into core, I suggest doing it right away. There's a big push to get Drupal out in AUGUST. The comments above that expect Drupal to be released in November suggest you have more time than you actually do. I still think it's too late, but if you want to try anyway, I'd push to have it done and perfect before the end of July.

"Drupal 7.0, which won't be ready for another 4 to 6 months" << that is not true. Just saying.

If you think Drupal 7 is shipping in January, and it ships in September, you are going to have a lot less time to do this thing you want to do than you think. Just saying.

Confusing as it was, Garland always had Marinelli for fixed layout. If someone would have named it "Garland with fixed width" I might have understood and used it...
So a subtheme should be the way to go.

As a subtheme is not affecting the main theme, it can be worked on quite independently. So let's stop discussing and someone provide a basic version.

> So a subtheme should be the way to go.

But Marinelli doesn't exist any more. In Garland D7 it's just a setting, which I think makes a lot more sense.

Unless we want to revert that in Garland, we should keep consistency across core.

Anyway, the patch above is *nearly* there. There's just a few things to iron out which are sadly beyond my CSS skills. Can we get testing and fixing instead of debating?

oh, sorry, did not see that patch. Yes, reading the entire thread indeed still gets you an advandtage... :D
Also did not notice Garland does this via a setting now.

As from looking at the patch (did not test it yet) let's seperate the "fluid" settings out more in the stylesheet. Maybe create a "fluid.css"? Or at least a
/* ---------- Fluid Layout Styles ----------- */

The patch above is nowhere near "just about there". For starters - nothing for the extra regions, they are fixed width, but these must now be fluid.

A competent themer versed in RTL fluid layouts could knock most of this out in a couple of hours, problem is we're all too busy already on other issues (I don't even have time to work on Bartik at all) - Seven, Garland, Bartik, Toolbar, Overlay and a host of others need work on existing issue, and therein lies the issue - regardless of when D7 will ship we already have too much to do NOW, without adding to it with these feature requests.

Yeah the patch is just a start, there is much more left to do and I don't have spare time either. My suggestion is to ask webchick whether this can get in at any time later, without pushing it to be in D7s first release, but also not waiting for D8.

I think what needs working on now is past my competencies in CSS, but I'll test patches.

> Specially if we want users to switch away from Garland.

Yup. I am counting on Bartik on being my new admin theme in D7 :)

Sidebars do not need to be fluid IMHO. This was a feature in Corolla that never really worked for my eyes designwise.
You put stuff in sidebars that is often designed to just fit in there, so how about making just the content area fluid.

> Sidebars do not need to be fluid IMHO

Agreed.

But the footer and triptych need to do *something* when the content gets wider.

Bumping to D8, its just too late for this, we're definitely into "bug fixes only" mode now and there are a lot of bugs...

Zero work in 4 weeks, no testing, no one is interested, no testable code - Dries just told us Drupal 7 will likely ship Oct 15. Around seven weeks ago the maintainer told you it was already too late - now its way way too late.

Clearly you have no understanding of the work involved in actually bringing this to life - its just not going to happen in D7.

I support jensimmons's recommendation that this be handled in contrib for the 7.x cycle. Looks like aschiwi has given this a great start!

Folks need to realize that theme code is not somehow magically free. It's still code. Code that needs to be developed, tested, maintained, bug fixed, and so on throughout the entire life of the Drupal 7 cycle. I'm pretty sure Dries and I have made it clear (and if not, I'll restate once more) that major development efforts in Drupal 7 are finished as of several months ago, and we are squarely into bug-fixing and release mode now. This holds true regardless if Drupal 7 comes out in September or January or May 2012. Tending towards a longer release cycle is only more argument for re-doubling the focus of those with front-end development skills on those issues that directly lead to Drupal 7 coming out faster.

Also, Bartik is NOT an admin theme. If you are using Bartik as an admin theme, then you are doing it wrong.

OK, lets move this forward with the contrib theme idea, I've claimed the namespace "antonelli" http://drupal.org/project/antonelli

jensimmons - do you want co-maintainer status?

If someone else wants to step up and co-maintain let me know - peeps with a strong history of managing popular Drupal projects would be good.

We can probably close this issue and move all discussions to the Antonelli issue queue.

Cool. And great project name :) I would love to help but haven't maintained anything yet, I will help where I can though. Any plans on how to approach this? I would create a sub theme with "some" styling. I like the idea of using as little as possible code from Bartik, i.e. not duplicating page.tpl.php (because changes in Bartik will have to be changed in Antonelli as well). Maybe we can find a way to just add a body class through a theming function, if you guys agree this is a good way to do the fluid layout. Surely we can discuss this in the Antonelli issue queue though.

I think its basically going to be a CSS only subtheme - other than that I haven't thought about it very much. Really don't want to be overriding template files at all - keep it light sort of thing. Glad you want to help out, will need plenty of testing in the real world ;)

Yup. IIRC the only reason for code in the patch was to add a setting, which in turns add a body class.

If you have a subtheme, enabling that subtheme is effectively the 'setting' and you don't need the body class as you just act all the time.

Yep we can do away with the theme setting and just override layout.css/layout-rtl.css.

I've made a few commits so when the packing script runs it will be available (its in CVS now).

Went with the layout from the patches above - a squeeze layout with fixed sidebars, the squeeze on .section is working fine, although I've used the child selector (I really don't care for IE6).

Added some layout for the extra regions - triptych and footer columns.

RTL the whole thing + some hasLayout glue for IE.

On a whole the basic layout seems to be working fine, but we'll need to kick back and wait for some the big patches for Bartik to hit core before we can really move ahead (the header reworking and some other stuff).

The color stuff is all working also - since its a subtheme we need to add all the color stuff.

Yes, lets postpone this for now and please post all issues to to http://drupal.org/project/issues/antonelli

subscribe

Now that the D8 branch is open, this can move forward.

Times have changed peeps, and so has the focus for D8, please see #1077094: Make Bartik a responsive design - meta issue, this will introduce a fluid grid type approach, so in essence will give us a fluid Bartik.