Foundation 6

Permalink
Hi

How can I add support for foundation 6 to the current concrete5? I mean, it's not a problem to add the assets, but how to make the layout tool have a foundation 6 option or to make it output the xy version of foundation?

 
studio108 replied on at Permalink Reply
studio108
Hi, you can add Foundation 6 layout presets using the method explained here.

https://documentation.concrete5.org/developers/designing-for-concret...

Obviously the foundation 6 css will need to be included somewhere in your theme.

I got this working successfully myself last week.

Firstly by adding in the page_theme.php file as explained in the link above.

protected $pThemeGridFrameworkHandle = 'foundation';


and then under Theme Area Layout Presets you can add your various grid options...

public function getThemeAreaLayoutPresets()
{
    $presets = array(
        array(
            'handle' => '2_columns',
            'name' => '2 Columns',
            'container' => '<div class="grid-x grid-margin-x grid-margin-y"></div>',
            'columns' => array(
                '<div class="small-11 medium-auto cell"></div>',
                '<div class="small-11 medium-auto cell"></div>'
            ),
        ),
        array(
            'handle' => '3_columns',
            'name' => '3 Columns',


I hope this helps?
dimger84 replied on at Permalink Reply
dimger84
I think you are looking for something like this:
https://documentation.concrete5.org/developers/designing-for-concret...

Although i don't know if the newest foundation6 (flex -based) will play well with c5 grid system. I think i tried it once and it messes up the layout ui in edit mode.


<?php
namespace xxxSomeNameSpace;
use Concrete\Core\Page\Theme\GridFramework\GridFramework;
defined('C5_EXECUTE') or die(_("Access Denied."));
class FoundationXYGridFramework  extends GridFramework
{
    public function supportsNesting()
    {
        return true;
    }
    public function getPageThemeGridFrameworkName()
    {
        return t('Foundation XY Grid');
    }
    public function getPageThemeGridFrameworkRowStartHTML()
Kiesel replied on at Permalink Reply
Hi

Late answer, but only had now time to test it. It works as a workaround. Obviously I won't have the flexibility to use the sliders to set the layout, but I think I can deal with that. And it's simple, easy and uncomplicated.

Thanks!
dimger84 replied on at Permalink Reply
dimger84
You can use:
#ccm-theme-grid-edit-mode-row-wrapper{
  display: flex;
  flex-flow: row wrap;
  width:100%;
}

in order to fi this slider bug

;)