<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Agaric</title> <meta name="description" content=""> <meta name="generator" content="kss-node"> <meta name="viewport" content="width=device-width"> <link rel="stylesheet" href="./kss-assets/kss.css"> <link rel="stylesheet" href="../agaric/css/agaric.css"> </head> <body id="kss-node" > <!-- kss-sidebar --> <div class="kss-sidebar"> <header class="kss-sidebar__header"> <a class="kss-link" href="index.html"> <h1 class="kss-doc-title">Agaric</h1> </a> </header> <nav class="kss-nav"> <ul class="kss-nav__menu"> <li class="kss-nav__menu-item"> <a class="kss-nav__menu-link" href="section-componenet.html"> <!-- <span class="kss-nav__ref">1</span> --> Componenet</a> <!-- Design links stright to item tempplate --> </li> <li class="kss-nav__menu-item"> <a class="kss-nav__menu-link" href="section-base.html"> <!-- <span class="kss-nav__ref">2</span> --> Base</a> <!-- Design links stright to item tempplate --> </li> <li class="kss-nav__menu-item"> <a class="kss-nav__menu-link" href="section-layout.html"> <!-- <span class="kss-nav__ref">3</span> --> Layout</a> <!-- Design links stright to item tempplate --> <ul class="kss-nav__menu-child"> <li class="kss-nav__menu-item"> <a class="kss-nav__menu-link" href="section-layout.html#kssref-layout-columns"> <!-- <span class="kss-nav__ref">3.1</span> --> Columns </a> </li> <li class="kss-nav__menu-item"> <a class="kss-nav__menu-link" href="section-layout.html#kssref-layout-flow"> <!-- <span class="kss-nav__ref">3.2</span> --> Flow Layout </a> </li> </ul> </li> <li class="kss-nav__menu-item"> <a class="kss-nav__menu-link" href="section-component.html"> <!-- <span class="kss-nav__ref">4</span> --> Component</a> <!-- Design links stright to item tempplate --> </li> </ul> </nav> </div> <!-- kss-main --> <div class="kss-main-wrap"> <article role="main" class="kss-main"> <!-- Section --> <div id="" class="kss-section kss-section--depth-1 "> <a name="kssref-layout"></a> <div class="kss-pattern"><!-- kss-pattern --> <!-- Header --> <div class="kss-pattern__header"><!-- kss-pattern__header --> <a class="kss-code-toggle" href="#layout">Info</a> <h1 class="kss-title"> <a class="kss-link" href="#kssref-layout">3 Layout </a> </> <!-- Description --> <div class="kss-description"> <p>Styling that determines the position of content on the page.</p> </div> </div><!-- kss-pattern__header --> <!-- Parameters --> <!-- Example --> <div id="layout" class="kss-pattern-code"><!-- kss-pattern-code --> <a class="kss-code-toggle" href="#layout">Close</a> <!-- Source --> <div class="kss-source kss-style"> <b>Source</b><br> <code>agaric.scss</code>, line 37 </div> <!-- Markup --> </div><!-- kss-pattern-code --> </div><!-- kss-pattern --> </> <!-- Section --> <section id="" class="kss-section kss-section--depth-2 "> <a name="kssref-layout-columns"></a> <div class="kss-pattern"><!-- kss-pattern --> <!-- Header --> <div class="kss-pattern__header"><!-- kss-pattern__header --> <a class="kss-code-toggle" href="#layout-columns">Info</a> <h2 class="kss-title"> <a class="kss-link" href="#kssref-layout-columns">3.1 Columns </a> </> <!-- Description --> <div class="kss-description"> <p>Extends Bulma Columns</p> </div> </div><!-- kss-pattern__header --> <!-- Parameters --> <div class="kss-parameters__title">Parameters:</div> <ul class="kss-parameters"> <li class="kss-parameters__item"> <div class="kss-parameters__name"> <code>.is-equal-height</code> </div> <div class="kss-parameters__description"> equal height child lements </div> </li> <li class="kss-parameters__item"> <div class="kss-parameters__name"> <code>.is-centered-vert</code> </div> <div class="kss-parameters__description"> vertical center child content </div> </li> </ul> <!-- Example --> <div id="layout-columns" class="kss-pattern-code"><!-- kss-pattern-code --> <a class="kss-code-toggle" href="#layout-columns">Close</a> <!-- Source --> <div class="kss-source kss-style"> <b>Source</b><br> <code>agaric/_layout.columns.scss</code>, line 1 </div> <!-- Markup --> </div><!-- kss-pattern-code --> </div><!-- kss-pattern --> </> <!-- Section --> <section id="" class="kss-section kss-section--depth-2 "> <a name="kssref-layout-flow"></a> <div class="kss-pattern"><!-- kss-pattern --> <!-- Header --> <div class="kss-pattern__header"><!-- kss-pattern__header --> <a class="kss-code-toggle" href="#layout-flow">Info</a> <h2 class="kss-title"> <a class="kss-link" href="#kssref-layout-flow">3.2 Flow Layout </a> </> <!-- Description --> <div class="kss-description"> <p>Flow layouts are intended for use with the Drupal Paragraphs module</p> </div> </div><!-- kss-pattern__header --> <!-- Parameters --> <div class="kss-parameters__title">Parameters:</div> <ul class="kss-parameters"> <li class="kss-parameters__item"> <div class="kss-parameters__name"> <code>.flow-thirds</code> </div> <div class="kss-parameters__description"> add to parent element, use three columns </div> </li> <li class="kss-parameters__item"> <div class="kss-parameters__name"> <code>.flow_middle</code> </div> <div class="kss-parameters__description"> center column (default) </div> </li> <li class="kss-parameters__item"> <div class="kss-parameters__name"> <code>.flow_left</code> </div> <div class="kss-parameters__description"> float to left column </div> </li> <li class="kss-parameters__item"> <div class="kss-parameters__name"> <code>.flow_right</code> </div> <div class="kss-parameters__description"> float to right column </div> </li> <li class="kss-parameters__item"> <div class="kss-parameters__name"> <code>.flow_full</code> </div> <div class="kss-parameters__description"> full-width column </div> </li> </ul> <!-- Example --> <div id="layout-flow" class="kss-pattern-code"><!-- kss-pattern-code --> <a class="kss-code-toggle" href="#layout-flow">Close</a> <!-- Source --> <div class="kss-source kss-style"> <b>Source</b><br> <code>agaric/_layout.flow.scss</code>, line 1 </div> <!-- Markup --> </div><!-- kss-pattern-code --> </div><!-- kss-pattern --> </> </article> </div> <script src="../agaric/js/jquery-3.2.1.min.js"></script> <!-- Automatically built using <a href="https://github.com/kss-node/kss-node">kss-node</a>. --> <script> $(document).ready(function() { $(".kss-code-toggle").on("click tap", function(e) { e.preventDefault(); var url = $(this).attr('href') var objRef = url.substring(url.indexOf('#') + 1); $("#" + objRef).toggleClass('active'); }); }); </script> </body> </html>