2018-06-21 01:38:13 +00:00
|
|
|
<!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">
|
2018-08-20 22:27:23 +00:00
|
|
|
<link rel="stylesheet" href="../agaric/css/agaric.css">
|
2018-06-21 01:38:13 +00:00
|
|
|
|
|
|
|
|
</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 -->
|
|
|
|
|
</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 -->
|
|
|
|
|
<ul class="kss-nav__menu-child">
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-agaricons">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.1</span> -->
|
|
|
|
|
Agaricons
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-card-allow-linking-the-entire-object">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.2</span> -->
|
|
|
|
|
Card
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-carousel">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.3</span> -->
|
|
|
|
|
Carousel
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-footer">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.4</span> -->
|
|
|
|
|
Footer
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-iconlist">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.5</span> -->
|
|
|
|
|
Icon List
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-media">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.6</span> -->
|
|
|
|
|
Media
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-media-comment">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.6.1</span> -->
|
|
|
|
|
Comments
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-media-list">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.6.2</span> -->
|
|
|
|
|
Media List
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-navbar">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.7</span> -->
|
|
|
|
|
Navbar
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-pagination">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.8</span> -->
|
|
|
|
|
Pagination
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-related">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.9</span> -->
|
|
|
|
|
Related
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-tabs">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.10</span> -->
|
|
|
|
|
Tabs
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-teaser">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.11</span> -->
|
|
|
|
|
Teaser
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-tile">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.12</span> -->
|
|
|
|
|
Tile
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-nav__menu-item">
|
|
|
|
|
<a class="kss-nav__menu-link" href="section-component.html#kssref-component-titlebar">
|
|
|
|
|
<!-- <span class="kss-nav__ref">4.13</span> -->
|
|
|
|
|
Titlebar
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</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-component"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component">Info</a>
|
|
|
|
|
<h1 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component">4
|
|
|
|
|
Component
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Custom structures.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric.scss</code>, line
|
2019-01-29 02:41:58 +00:00
|
|
|
48
|
2018-06-21 01:38:13 +00:00
|
|
|
</div>
|
|
|
|
|
<!-- Markup -->
|
|
|
|
|
</div><!-- kss-pattern-code -->
|
|
|
|
|
</div><!-- kss-pattern -->
|
|
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Section -->
|
|
|
|
|
<section id="" class="kss-section kss-section--depth-2 ">
|
|
|
|
|
<a name="kssref-component-agaricons"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-agaricons">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-agaricons">4.1
|
|
|
|
|
Agaricons
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extends Bulma icon classes.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-agaricons" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-agaricons">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.agaricons.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-component-card-allow-linking-the-entire-object"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-card-allow-linking-the-entire-object">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-card-allow-linking-the-entire-object">4.2
|
|
|
|
|
Card
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extension of the Bulma card componnet.</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>.card-project</code>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="kss-parameters__description">
|
|
|
|
|
for projects, 50% image, text on the right
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-parameters__item">
|
|
|
|
|
<div class="kss-parameters__name">
|
|
|
|
|
<code>.card-initiative</code>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="kss-parameters__description">
|
|
|
|
|
for initiaitives, image on top
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-card-allow-linking-the-entire-object" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-card-allow-linking-the-entire-object">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.card.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-component-carousel"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-carousel">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-carousel">4.3
|
|
|
|
|
Carousel
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extension of <code>slick-theme.scss</code> from <a href="https://kenwheeler.github.io/slick/">Slick Carousel</a>.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-carousel" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-carousel">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.carousel.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-component-footer"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-footer">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-footer">4.4
|
|
|
|
|
Footer
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extends Bulma footer component.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-footer" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-footer">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.footer.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-component-iconlist"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-iconlist">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-iconlist">4.5
|
|
|
|
|
Icon List
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Lists with icons to the left. Extends the agaricons component.
|
|
|
|
|
You can select any icon in <code>_component.agaricons.scss</code></p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-iconlist" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-iconlist">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.iconlist.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-component-media"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-media">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-media">4.6
|
|
|
|
|
Media
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extends Bulma media object.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-media" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-media">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.media.scss</code>, line
|
|
|
|
|
1
|
|
|
|
|
</div>
|
|
|
|
|
<!-- Markup -->
|
|
|
|
|
</div><!-- kss-pattern-code -->
|
|
|
|
|
</div><!-- kss-pattern -->
|
|
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Section -->
|
|
|
|
|
<section id="" class="kss-section kss-section--depth-3 ">
|
|
|
|
|
<a name="kssref-component-media-comment"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-media-comment">Info</a>
|
|
|
|
|
<h3 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-media-comment">4.6.1
|
|
|
|
|
Comments
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extends Bulma media object for use in blog comments.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-media-comment" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-media-comment">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.media.scss</code>, line
|
|
|
|
|
14
|
|
|
|
|
</div>
|
|
|
|
|
<!-- Markup -->
|
|
|
|
|
</div><!-- kss-pattern-code -->
|
|
|
|
|
</div><!-- kss-pattern -->
|
|
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Section -->
|
|
|
|
|
<section id="" class="kss-section kss-section--depth-3 ">
|
|
|
|
|
<a name="kssref-component-media-list"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-media-list">Info</a>
|
|
|
|
|
<h3 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-media-list">4.6.2
|
|
|
|
|
Media List
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extends Bulma media object for use in blog teaser list.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-media-list" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-media-list">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.media.scss</code>, line
|
|
|
|
|
50
|
|
|
|
|
</div>
|
|
|
|
|
<!-- Markup -->
|
|
|
|
|
</div><!-- kss-pattern-code -->
|
|
|
|
|
</div><!-- kss-pattern -->
|
|
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Section -->
|
|
|
|
|
<section id="" class="kss-section kss-section--depth-2 ">
|
|
|
|
|
<a name="kssref-component-navbar"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-navbar">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-navbar">4.7
|
|
|
|
|
Navbar
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Customize Bulma navbar. Uses <a href="http://scrollmagic.io">ScrollMagic</a> to change
|
|
|
|
|
background colors for optimal legibility against various backgrounds.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-navbar" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-navbar">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.navbar.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-component-pagination"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-pagination">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-pagination">4.8
|
|
|
|
|
Pagination
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extend Bulma pagination.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-pagination" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-pagination">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.pagination.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-component-related"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-related">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-related">4.9
|
|
|
|
|
Related
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Block of three related items.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-related" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-related">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.related.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-component-tabs"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-tabs">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-tabs">4.10
|
|
|
|
|
Tabs
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extends Bulma Tabs component.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-tabs" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-tabs">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.tabs.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-component-teaser"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-teaser">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-teaser">4.11
|
|
|
|
|
Teaser
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Styles for teasers, typically lists of linked excerpts.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-teaser" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-teaser">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.teaser.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-component-tile"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-tile">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-tile">4.12
|
|
|
|
|
Tile
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Extends Bulma Tile component.</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div><!-- kss-pattern__header -->
|
|
|
|
|
<!-- Parameters -->
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-tile" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-tile">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.tile.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-component-titlebar"></a>
|
|
|
|
|
<div class="kss-pattern"><!-- kss-pattern -->
|
|
|
|
|
<!-- Header -->
|
|
|
|
|
<div class="kss-pattern__header"><!-- kss-pattern__header -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-titlebar">Info</a>
|
|
|
|
|
<h2 class="kss-title">
|
|
|
|
|
<a class="kss-link" href="#kssref-component-titlebar">4.13
|
|
|
|
|
Titlebar
|
|
|
|
|
</a>
|
|
|
|
|
</>
|
|
|
|
|
<!-- Description -->
|
|
|
|
|
<div class="kss-description">
|
|
|
|
|
<p>Structure to title a section with the title to the left and links
|
|
|
|
|
to the right.</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>.titlebar-bigborder</code>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="kss-parameters__description">
|
|
|
|
|
border at the top
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="kss-parameters__item">
|
|
|
|
|
<div class="kss-parameters__name">
|
|
|
|
|
<code>.titlebar-padded</code>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="kss-parameters__description">
|
|
|
|
|
padding at the bottom
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
|
|
<!-- Example -->
|
|
|
|
|
<div id="component-titlebar" class="kss-pattern-code"><!-- kss-pattern-code -->
|
|
|
|
|
<a class="kss-code-toggle" href="#component-titlebar">Close</a>
|
|
|
|
|
<!-- Source -->
|
|
|
|
|
<div class="kss-source kss-style">
|
|
|
|
|
<b>Source</b><br>
|
|
|
|
|
<code>agaric/_component.titlebar.scss</code>, line
|
|
|
|
|
1
|
|
|
|
|
</div>
|
|
|
|
|
<!-- Markup -->
|
|
|
|
|
</div><!-- kss-pattern-code -->
|
|
|
|
|
</div><!-- kss-pattern -->
|
|
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
|
|
|
|
|
</article>
|
|
|
|
|
</div>
|
|
|
|
|
|
2018-08-20 22:27:23 +00:00
|
|
|
<script src="../agaric/js/jquery-3.2.1.min.js"></script>
|
2018-06-21 01:38:13 +00:00
|
|
|
|
|
|
|
|
<!-- 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>
|
