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

;)

This website stores cookies on your computer. These cookies are used to improve your website experience and provide more personalized services to you, both on this website and through other media. To find out more about the cookies we use, see our Privacy Policy.