how to make the bold style only in the list for an element

[enzo2016]

Yes, sorry, I was unclear. The CSS is working ok.
I don't know how to have two elements in the same row (in the div template). Only for example: the element {country___country} to the left and the element {country___question_value} to the right of the same row.


Thanks,

Enzo

 

[cheesegrits]

Ah, OK. For that you'd probably need to either customize the template itself, or use custom CSS, with a little modification I just made to the template:

https://github.com/Fabrik/fabrik/commit/bb7dadc519c61eb6c7bcfad36181655846661195

... that just adds the 'fabrikDivElement' class to the wrapper div around each element.

Then in a custom CSS, you'd be able to use "pseudo selectors", like :nth-of-type, to apply styling to specific element divs within each "row". So to make (say) the first two elements side by side ...

.fabrik_row .fabrikDivElement:nth-of-type(1) {
   float: left;
   width: 50%;
}

.fabrik_row .fabrikDivElement:nth-of-type(2) {
   float: left;
   width: 50%;
}

Use this version of the custom css example:

https://github.com/Fabrik/fabrik/bl...ws/list/tmpl/bootstrap/custom_css_example.php

... put it in your div template folder ...

./components/com_fabrik/views/list/tmpl/div/custom_css.php

... and replace the example CSS between the BEGIN and END comments with the code above. At some point you'll want to make it specific to this list, but for now keep it simple till it's working.

-- hugh

 

[enzo2016]

Thank you very much Hugh.
I uploaded this default_row.php (into the div folder):

<?php

/**

* Fabrik List Template: Div Row

* Note the div cell container is now generated in the default template

* in FabrikHelperHTML::bootstrapGrid();

*

* @package     Joomla

* @subpackage  Fabrik

* @copyright   Copyright (C) 2005-2016  Media A-Team, Inc. - All rights reserved.

* @license     GNU/GPL http://www.gnu.org/copyleft/gpl.html

*/



// No direct access

defined('_JEXEC') or die('Restricted access');



?>

<?php foreach ($this->headings as $heading => $label) :

    $d = @$this->_row->data->$heading;

    if (isset($this->showEmpty) && $this->showEmpty === false && trim(strip_tags($d)) == '') :

        continue;
    endif;
    $h = $this->headingClass[$heading];
    $c = $this->cellClass[$heading];
    $hStyle = empty($h['style']) ? '' : 'style="' . $h['style'] . '"';
    $cStyle = empty($c['style']) ? '' : 'style="'. $c['style'].'"';
    ?>
    <div class="row-fluid fabrikDivElement">

        <?php if (isset($this->showLabels) && $this->showLabels) :

            echo '<span class="muted ' . $h['class'] . '" ' . $hStyle . '>' . $label . ': </span>';

        endif; ?>



        <?php echo '<span class="' . $c['class'] . '" ' . $cStyle . '>' . $d . '</span>'; ?>

    </div>

    <?php

endforeach;

?>

Then uploaded the following custom_css (into the div folder):

<?php
/**
* Fabrik List Template: Default Custom CSS
*
* @package     Joomla
* @subpackage  Fabrik
* @copyright   Copyright (C) 2005-2016  Media A-Team, Inc. - All rights reserved.
* @license     GNU/GPL http://www.gnu.org/copyleft/gpl.html
*/
/**
* If you need to make small adjustments or additions to the CSS for a Fabrik
* list template, you can create a custom_css.php file, which will be loaded after
* the main template_css.php for the template.
*
* This file will be invoked as a PHP file, so the list ID
* can be used in order to narrow the scope of any style changes.  You do
* this by prepending #listform_$c to any selectors you use.  This will become
* (say) #listform_12, owhich will be the HTML ID of your list on the page.
*
* See examples below, which you should remove if you copy this file.
*
* Don't edit anything outside of the BEGIN and END comments.
*
* For more on custom CSS, see the Wiki at:
*
* http://www.fabrikar.com/forums/index.php?wiki/form-and-details-templates/#the-custom-css-file
*
* NOTE - for backward compatibility with Fabrik 2.1, and in case you
* just prefer a simpler CSS file, without the added PHP parsing that
* allows you to be be more specific in your selectors, we will also include
* a custom.css we find in the same location as this file.
*
*/
header('Content-type: text/css');
$c = $_REQUEST['c'];
echo <<<EOT
/* BEGIN - Your CSS styling starts here */
.fabrik_row .fabrikDivElement:nth-of-type(1) {
   float: left;
   width: 50%;
}

.fabrik_row .fabrikDivElement:nth-of-type(2) {
   float: left;
   width: 50%;
}
/* END - Your CSS styling ends here */
EOT;

Then I have looked at the country list because it has the div template, but it doesn't look like with the first two elements side by side.
Please could you confirm that the content (written above) of the two files is correct?


-- Enzo

 

[cheesegrits]

If you look at the 'sources' in Chrome's dev tools for that CSS file, it's returning:

<br />
<b>Parse error</b>:  syntax error, unexpected end of file, expecting variable (T_VARIABLE) or heredoc end (T_END_HEREDOC) or ${ (T_DOLLAR_OPEN_CURLY_BRACES) or {$ (T_CURLY_OPEN) in <b>.../components/com_fabrik/views/list/tmpl/div/custom_css.php</b> on line <b>48</b><br />

... which means there's a syntax error in that file.

If I recall correctly, the "heredoc" end (the "EOT;") has to have a newline after it. Which it does in the version of the file in github.

So add a new line on the end of that file.

-- hugh

 

[enzo2016]

I am sorry, I haven't noticed it.
Thank you very very much. It works ok.

-- Enzo