| Encoding: UTF-8 | Encoding: UTF-8 | ||||
| LazyData: true | LazyData: true | ||||
| RoxygenNote: 6.1.1 | RoxygenNote: 6.1.1 | ||||
| Roxygen: list(markdown = TRUE) |
| <th>text</th> | <th>text</th> | ||||
| <td><p>One of "white", "black", "light", "dark", "primary", "info", | <td><p>One of "white", "black", "light", "dark", "primary", "info", | ||||
| "link", "success", "warning", "danger", "black-bis", "black-ter", | "link", "success", "warning", "danger", "black-bis", "black-ter", | ||||
| "grey-darker", "grey-dark", "grey", "gre-light", "grey-lighter", | |||||
| "grey-darker", "grey-dark", "grey", "grey-light", "grey-lighter", | |||||
| "white-ter", "white-bis"</p></td> | "white-ter", "white-bis"</p></td> | ||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>background</th> | <th>background</th> | ||||
| <td><p>One of "white", "black", "light", "dark", "primary", | <td><p>One of "white", "black", "light", "dark", "primary", | ||||
| "info", "link", "success", "warning", "danger", "black-bis", "black-ter", | "info", "link", "success", "warning", "danger", "black-bis", "black-ter", | ||||
| "grey-darker", "grey-dark", "grey", "gre-light", "grey-lighter", | |||||
| "grey-darker", "grey-dark", "grey", "grey-light", "grey-lighter", | |||||
| "white-ter", "white-bis"</p></td> | "white-ter", "white-bis"</p></td> | ||||
| </tr> | </tr> | ||||
| </table> | </table> |
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>offset</th> | <th>offset</th> | ||||
| <td><p>Column offset, one of `size` or `width`</p></td> | |||||
| <td><p>Column offset, one of <code>size</code> or <code>width</code></p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>narrow</th> | <th>narrow</th> | ||||
| <td><p>Use [bulma_column_narrow()] to construct options</p></td> | |||||
| <td><p>Use <code><a href='bulma_column_narrow.html'>bulma_column_narrow()</a></code> to construct options</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>class</th> | <th>class</th> | ||||
| <td><p>Extra classes that should be applied to the `columns` container.</p></td> | |||||
| <td><p>Extra classes that should be applied to the <code>columns</code> container.</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>style</th> | <th>style</th> | ||||
| <td><p>CSS styles applied to the `columns` container.</p></td> | |||||
| <td><p>CSS styles applied to the <code>columns</code> container.</p></td> | |||||
| </tr> | </tr> | ||||
| </table> | </table> | ||||
| <tr> | <tr> | ||||
| <th>viewport</th> | <th>viewport</th> | ||||
| <td><p>One of "mobile", "tablet", "touch", "desktop", "widescreen", | <td><p>One of "mobile", "tablet", "touch", "desktop", "widescreen", | ||||
| "fullhd". See <https://bulma.io/documentation/modifiers/responsive-helpers/> | |||||
| "fullhd". See <a href='https://bulma.io/documentation/modifiers/responsive-helpers/'>https://bulma.io/documentation/modifiers/responsive-helpers/</a> | |||||
| for more information.</p></td> | for more information.</p></td> | ||||
| </tr> | </tr> | ||||
| </table> | </table> |
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>offset</th> | <th>offset</th> | ||||
| <td><p>Column offset, one of `size` or `width`</p></td> | |||||
| <td><p>Column offset, one of <code>size</code> or <code>width</code></p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>narrow</th> | <th>narrow</th> | ||||
| <td><p>Use [bulma_column_narrow()] to construct options</p></td> | |||||
| <td><p>Use <code><a href='bulma_column_narrow.html'>bulma_column_narrow()</a></code> to construct options</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>class</th> | <th>class</th> | ||||
| <td><p>Extra classes that should be applied to the `columns` container.</p></td> | |||||
| <td><p>Extra classes that should be applied to the <code>columns</code> container.</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>style</th> | <th>style</th> | ||||
| <td><p>CSS styles applied to the `columns` container.</p></td> | |||||
| <td><p>CSS styles applied to the <code>columns</code> container.</p></td> | |||||
| </tr> | </tr> | ||||
| </table> | </table> | ||||
| <colgroup><col class="name" /><col class="desc" /></colgroup> | <colgroup><col class="name" /><col class="desc" /></colgroup> | ||||
| <tr> | <tr> | ||||
| <th>breakpoint</th> | <th>breakpoint</th> | ||||
| <td><p>By default, columns are only activated from **tablet** | |||||
| <td><p>By default, columns are only activated from <strong>tablet</strong> | |||||
| onwards, meaning that columns are stacked on top of each other on | onwards, meaning that columns are stacked on top of each other on | ||||
| **mobile**. Use `breakpoint` to set the point at which columns are spread | |||||
| out. See `viewport` option in [bulma_responsive()] for valid options.</p></td> | |||||
| <strong>mobile</strong>. Use <code>breakpoint</code> to set the point at which columns are spread | |||||
| out. See <code>viewport</code> option in <code><a href='bulma_responsive.html'>bulma_responsive()</a></code> for valid options.</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>gap</th> | <th>gap</th> | ||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>class</th> | <th>class</th> | ||||
| <td><p>Extra classes that should be applied to the `columns` container.</p></td> | |||||
| <td><p>Extra classes that should be applied to the <code>columns</code> container.</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>style</th> | <th>style</th> | ||||
| <td><p>CSS styles applied to the `columns` container.</p></td> | |||||
| <td><p>CSS styles applied to the <code>columns</code> container.</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>column_options</th> | <th>column_options</th> | ||||
| <td><p>Column options to be applied to each column. Use | <td><p>Column options to be applied to each column. Use | ||||
| [bulma_column_options()] to format.</p></td> | |||||
| <code><a href='bulma_column_options.html'>bulma_column_options()</a></code> to format.</p></td> | |||||
| </tr> | </tr> | ||||
| </table> | </table> | ||||
| <pre class="examples"><div class='input'><span class='fu'>bulma_constants</span>(<span class='st'>"colors"</span>)</div><div class='output co'>#> [1] "white" "black" "light" "dark" "primary" | <pre class="examples"><div class='input'><span class='fu'>bulma_constants</span>(<span class='st'>"colors"</span>)</div><div class='output co'>#> [1] "white" "black" "light" "dark" "primary" | ||||
| #> [6] "info" "link" "success" "warning" "danger" | #> [6] "info" "link" "success" "warning" "danger" | ||||
| #> [11] "black-bis" "black-ter" "grey-darker" "grey-dark" "grey" | #> [11] "black-bis" "black-ter" "grey-darker" "grey-dark" "grey" | ||||
| #> [16] "gre-light" "grey-lighter" "white-ter" "white-bis" </div><div class='input'><span class='fu'>bulma_constants</span>(<span class='st'>"column sizes"</span>)</div><div class='output co'>#> [1] "full" "four-fifths" "three-quarters" "two-thirds" | |||||
| #> [16] "grey-light" "grey-lighter" "white-ter" "white-bis" </div><div class='input'><span class='fu'>bulma_constants</span>(<span class='st'>"column sizes"</span>)</div><div class='output co'>#> [1] "full" "four-fifths" "three-quarters" "two-thirds" | |||||
| #> [5] "three-fifths" "half" "two-fifths" "one-third" | #> [5] "three-fifths" "half" "two-fifths" "one-third" | ||||
| #> [9] "one-quarter" "one-fifth" </div><div class='input'><span class='fu'>bulma_constants</span>(<span class='st'>"viewports"</span>)</div><div class='output co'>#> [1] "mobile" "tablet" "touch" "desktop" "widescreen" | #> [9] "one-quarter" "one-fifth" </div><div class='input'><span class='fu'>bulma_constants</span>(<span class='st'>"viewports"</span>)</div><div class='output co'>#> [1] "mobile" "tablet" "touch" "desktop" "widescreen" | ||||
| #> [6] "fullhd" </div><div class='input'> | #> [6] "fullhd" </div><div class='input'> |
| <meta property="og:title" content="Bulma Document Renderer — bulma_document" /> | <meta property="og:title" content="Bulma Document Renderer — bulma_document" /> | ||||
| <meta property="og:description" content="TODO Document YAML options here." /> | |||||
| <meta property="og:description" content="Bulma Document Renderer" /> | |||||
| <meta name="twitter:card" content="summary" /> | <meta name="twitter:card" content="summary" /> | ||||
| <div class="ref-description"> | <div class="ref-description"> | ||||
| <p>TODO Document YAML options here.</p> | |||||
| <p>Bulma Document Renderer</p> | |||||
| </div> | </div> | ||||
| </tr> | </tr> | ||||
| </table> | </table> | ||||
| <h2 class="hasAnchor" id="yaml-options"><a class="anchor" href="#yaml-options"></a>YAML options</h2> | |||||
| <p>You can pass additional options to the underlying template via the <code>bulma</code> | |||||
| YAML item. The following options can be specified there.</p><ul> | |||||
| <li><p><code>hero</code>: Classes applied to the hero containing the title</p></li> | |||||
| <li><p><code>hero_button</code>: Classes applied to the <code>header_links</code> buttons</p></li> | |||||
| <li><p><code>hero_links</code>: Links that will be displayed under title as buttons. | |||||
| Formatted as a list, each element having entries for <code>name</code>, <code>url</code>, | |||||
| and <code>icon</code>. Icons use <a href='https://fontawesome.com/icons'>Font Awesome</a>; | |||||
| see <code><a href='fa_icon.html'>fa_icon()</a></code> for help constructing the Font Awesome class. The | |||||
| full Font Awesome class name is required.</p></li> | |||||
| </ul><pre>--- | |||||
| bulma: | |||||
| hero: ["info"] | |||||
| hero_button: ["is-secondary", "is-outlined"] | |||||
| hero_links: | |||||
| - name: Github | |||||
| url: https://github.com/ | |||||
| icon: '`r bulma::fa_icon("github")`' | |||||
| - name: Twitter | |||||
| url: https://twitter.com | |||||
| icon: "fab fa-twitter" | |||||
| --- | |||||
| </pre> | |||||
| </div> | </div> | ||||
| <div class="col-md-3 hidden-xs hidden-sm" id="sidebar"> | <div class="col-md-3 hidden-xs hidden-sm" id="sidebar"> | ||||
| <h2>Contents</h2> | <h2>Contents</h2> | ||||
| <ul class="nav nav-pills nav-stacked"> | <ul class="nav nav-pills nav-stacked"> | ||||
| <li><a href="#arguments">Arguments</a></li> | <li><a href="#arguments">Arguments</a></li> | ||||
| </ul> | |||||
| <li><a href="#yaml-options">YAML options</a></li> | |||||
| </ul> | |||||
| </div> | </div> | ||||
| </div> | </div> |
| <colgroup><col class="name" /><col class="desc" /></colgroup> | <colgroup><col class="name" /><col class="desc" /></colgroup> | ||||
| <tr> | <tr> | ||||
| <th>float</th> | <th>float</th> | ||||
| <td><p>`clearfix` Fixes an element's floating children</p> | |||||
| <p>`pulled-left` Moves an element to the left</p> | |||||
| <p>`pulled-right` Moves an element to the right</p></td> | |||||
| <td><p><code>clearfix</code> Fixes an element's floating children</p> | |||||
| <p><code>pulled-left</code> Moves an element to the left</p> | |||||
| <p><code>pulled-right</code> Moves an element to the right</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>spacing</th> | <th>spacing</th> | ||||
| <td><p>`marginless` Removes any margin</p> | |||||
| <p>`paddingless` Removes any padding</p></td> | |||||
| <td><p><code>marginless</code> Removes any margin</p> | |||||
| <p><code>paddingless</code> Removes any padding</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>other</th> | <th>other</th> | ||||
| <td><p>`overlay` Completely covers the first positioned parent | |||||
| `clipped` Adds overflow hidden</p> | |||||
| <p>`radiusless` Removes any radius</p> | |||||
| <p>`shadowless` Removes any shadow</p> | |||||
| <p>`unselectable` Prevents the text from being selectable</p> | |||||
| <p>`invisible` Adds visibility hidden</p> | |||||
| <p>`sr-only` Hide elements visually but keep the element available to be announced by a screen reader</p></td> | |||||
| <td><p><code>overlay</code> Completely covers the first positioned parent | |||||
| <code>clipped</code> Adds overflow hidden</p> | |||||
| <p><code>radiusless</code> Removes any radius</p> | |||||
| <p><code>shadowless</code> Removes any shadow</p> | |||||
| <p><code>unselectable</code> Prevents the text from being selectable</p> | |||||
| <p><code>invisible</code> Adds visibility hidden</p> | |||||
| <p><code>sr-only</code> Hide elements visually but keep the element available to be announced by a screen reader</p></td> | |||||
| </tr> | </tr> | ||||
| </table> | </table> | ||||
| <tr> | <tr> | ||||
| <th>viewport</th> | <th>viewport</th> | ||||
| <td><p>One of "mobile", "tablet", "touch", "desktop", "widescreen", | <td><p>One of "mobile", "tablet", "touch", "desktop", "widescreen", | ||||
| "fullhd". See <https://bulma.io/documentation/modifiers/responsive-helpers/> | |||||
| "fullhd". See <a href='https://bulma.io/documentation/modifiers/responsive-helpers/'>https://bulma.io/documentation/modifiers/responsive-helpers/</a> | |||||
| for more information.</p></td> | for more information.</p></td> | ||||
| </tr> | </tr> | ||||
| </table> | </table> |
| <tr> | <tr> | ||||
| <th>viewport</th> | <th>viewport</th> | ||||
| <td><p>One of "mobile", "tablet", "touch", "desktop", "widescreen", | <td><p>One of "mobile", "tablet", "touch", "desktop", "widescreen", | ||||
| "fullhd". See <https://bulma.io/documentation/modifiers/responsive-helpers/> | |||||
| "fullhd". See <a href='https://bulma.io/documentation/modifiers/responsive-helpers/'>https://bulma.io/documentation/modifiers/responsive-helpers/</a> | |||||
| for more information.</p></td> | for more information.</p></td> | ||||
| </tr> | </tr> | ||||
| </table> | </table> |
| <tr> | <tr> | ||||
| <th>viewport</th> | <th>viewport</th> | ||||
| <td><p>One of "mobile", "tablet", "touch", "desktop", "widescreen", | <td><p>One of "mobile", "tablet", "touch", "desktop", "widescreen", | ||||
| "fullhd". See <https://bulma.io/documentation/modifiers/responsive-helpers/> | |||||
| "fullhd". See <a href='https://bulma.io/documentation/modifiers/responsive-helpers/'>https://bulma.io/documentation/modifiers/responsive-helpers/</a> | |||||
| for more information.</p></td> | for more information.</p></td> | ||||
| </tr> | </tr> | ||||
| </table> | </table> |
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>responsive_size</th> | <th>responsive_size</th> | ||||
| <td><p>See [bulma_responsive_size()].</p></td> | |||||
| <td><p>See <code><a href='bulma_responsive_size.html'>bulma_responsive_size()</a></code>.</p></td> | |||||
| </tr> | </tr> | ||||
| <tr> | <tr> | ||||
| <th>alignment</th> | <th>alignment</th> | ||||
| <th>text</th> | <th>text</th> | ||||
| <td><p>One of "white", "black", "light", "dark", "primary", "info", | <td><p>One of "white", "black", "light", "dark", "primary", "info", | ||||
| "link", "success", "warning", "danger", "black-bis", "black-ter", | "link", "success", "warning", "danger", "black-bis", "black-ter", | ||||
| "grey-darker", "grey-dark", "grey", "gre-light", "grey-lighter", | |||||
| "grey-darker", "grey-dark", "grey", "grey-light", "grey-lighter", | |||||
| "white-ter", "white-bis"</p></td> | "white-ter", "white-bis"</p></td> | ||||
| </tr> | </tr> | ||||
| </table> | </table> |
| <!-- Generated by pkgdown: do not edit by hand --> | |||||
| <!DOCTYPE html> | |||||
| <html> | |||||
| <head> | |||||
| <meta charset="utf-8"> | |||||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |||||
| <title>Font Awesome Icon — fa_icon • bulma</title> | |||||
| <!-- jquery --> | |||||
| <script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha384-nrOSfDHtoPMzJHjVTdCopGqIqeYETSXhZDFyniQ8ZHcVy08QesyHcnOUpMpqnmWq" crossorigin="anonymous"></script> | |||||
| <!-- Bootstrap --> | |||||
| <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> | |||||
| <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> | |||||
| <!-- Font Awesome icons --> | |||||
| <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous"> | |||||
| <!-- clipboard.js --> | |||||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js" integrity="sha384-cV+rhyOuRHc9Ub/91rihWcGmMmCXDeksTtCihMupQHSsi8GIIRDG0ThDc3HGQFJ3" crossorigin="anonymous"></script> | |||||
| <!-- sticky kit --> | |||||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/sticky-kit/1.1.3/sticky-kit.min.js" integrity="sha256-c4Rlo1ZozqTPE2RLuvbusY3+SU1pQaJC0TjuhygMipw=" crossorigin="anonymous"></script> | |||||
| <!-- pkgdown --> | |||||
| <link href="../pkgdown.css" rel="stylesheet"> | |||||
| <script src="../pkgdown.js"></script> | |||||
| <meta property="og:title" content="Font Awesome Icon — fa_icon" /> | |||||
| <meta property="og:description" content="Create the correct Font Awesome class." /> | |||||
| <meta name="twitter:card" content="summary" /> | |||||
| <!-- mathjax --> | |||||
| <script src='https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML'></script> | |||||
| <!--[if lt IE 9]> | |||||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> | |||||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||||
| <![endif]--> | |||||
| </head> | |||||
| <body> | |||||
| <div class="container template-reference-topic"> | |||||
| <header> | |||||
| <div class="navbar navbar-default navbar-fixed-top" role="navigation"> | |||||
| <div class="container"> | |||||
| <div class="navbar-header"> | |||||
| <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"> | |||||
| <span class="icon-bar"></span> | |||||
| <span class="icon-bar"></span> | |||||
| <span class="icon-bar"></span> | |||||
| </button> | |||||
| <span class="navbar-brand"> | |||||
| <a class="navbar-link" href="../index.html">bulma</a> | |||||
| <span class="label label-default" data-toggle="tooltip" data-placement="bottom" title="Released package">0.0.0.9000</span> | |||||
| </span> | |||||
| </div> | |||||
| <div id="navbar" class="navbar-collapse collapse"> | |||||
| <ul class="nav navbar-nav"> | |||||
| <li> | |||||
| <a href="../index.html"> | |||||
| <span class="fa fa-home fa-lg"></span> | |||||
| </a> | |||||
| </li> | |||||
| <li> | |||||
| <a href="../reference/index.html">Reference</a> | |||||
| </li> | |||||
| </ul> | |||||
| <ul class="nav navbar-nav navbar-right"> | |||||
| </ul> | |||||
| </div><!--/.nav-collapse --> | |||||
| </div><!--/.container --> | |||||
| </div><!--/.navbar --> | |||||
| </header> | |||||
| <div class="row"> | |||||
| <div class="col-md-9 contents"> | |||||
| <div class="page-header"> | |||||
| <h1>Font Awesome Icon</h1> | |||||
| <div class="hidden name"><code>fa_icon.Rd</code></div> | |||||
| </div> | |||||
| <div class="ref-description"> | |||||
| <p>Create the correct Font Awesome class.</p> | |||||
| </div> | |||||
| <pre class="usage"><span class='fu'>fa_icon</span>(<span class='no'>name</span>, <span class='kw'>solid</span> <span class='kw'>=</span> <span class='fl'>TRUE</span>, <span class='kw'>as_html</span> <span class='kw'>=</span> <span class='fl'>FALSE</span>)</pre> | |||||
| <h2 class="hasAnchor" id="arguments"><a class="anchor" href="#arguments"></a>Arguments</h2> | |||||
| <table class="ref-arguments"> | |||||
| <colgroup><col class="name" /><col class="desc" /></colgroup> | |||||
| <tr> | |||||
| <th>name</th> | |||||
| <td><p>Name of the Font Awesome icon</p></td> | |||||
| </tr> | |||||
| <tr> | |||||
| <th>solid</th> | |||||
| <td><p>Should the solid or the regular icon be used?</p></td> | |||||
| </tr> | |||||
| <tr> | |||||
| <th>as_html</th> | |||||
| <td><p>If <code>FALSE</code> (default), only the icon class is returned.</p></td> | |||||
| </tr> | |||||
| </table> | |||||
| <h2 class="hasAnchor" id="references"><a class="anchor" href="#references"></a>References</h2> | |||||
| <p><a href='https://fontawesome.com/icons'>https://fontawesome.com/icons</a></p> | |||||
| <h2 class="hasAnchor" id="examples"><a class="anchor" href="#examples"></a>Examples</h2> | |||||
| <pre class="examples"><div class='input'><span class='fu'>fa_icon</span>(<span class='st'>"github"</span>)</div><div class='output co'>#> [1] "fab fa-github"</div><div class='input'><span class='fu'>fa_icon</span>(<span class='st'>"star"</span>)</div><div class='output co'>#> [1] "fas fa-star"</div><div class='input'><span class='fu'>fa_icon</span>(<span class='st'>"star"</span>, <span class='fl'>FALSE</span>)</div><div class='output co'>#> [1] "far fa-star"</div><div class='input'> | |||||
| </div></pre> | |||||
| </div> | |||||
| <div class="col-md-3 hidden-xs hidden-sm" id="sidebar"> | |||||
| <h2>Contents</h2> | |||||
| <ul class="nav nav-pills nav-stacked"> | |||||
| <li><a href="#arguments">Arguments</a></li> | |||||
| <li><a href="#references">References</a></li> | |||||
| <li><a href="#examples">Examples</a></li> | |||||
| </ul> | |||||
| </div> | |||||
| </div> | |||||
| <footer> | |||||
| <div class="copyright"> | |||||
| <p>Developed by Garrick Aden-Buie.</p> | |||||
| </div> | |||||
| <div class="pkgdown"> | |||||
| <p>Site built with <a href="http://pkgdown.r-lib.org/">pkgdown</a>.</p> | |||||
| </div> | |||||
| </footer> | |||||
| </div> | |||||
| </body> | |||||
| </html> | |||||
| <td><p>Bulma Typography Helper Classes</p></td> | <td><p>Bulma Typography Helper Classes</p></td> | ||||
| </tr><tr> | </tr><tr> | ||||
| <td> | |||||
| <p><code><a href="fa_icon.html">fa_icon()</a></code> </p> | |||||
| </td> | |||||
| <td><p>Font Awesome Icon</p></td> | |||||
| </tr><tr> | |||||
| <td> | <td> | ||||
| <p><code><a href="level_item_header.html">level_item_header()</a></code> </p> | <p><code><a href="level_item_header.html">level_item_header()</a></code> </p> | ||||
| </td> | </td> |
| \item{width}{Column width in terms of the 12 grid units, i.e. 1-12.} | \item{width}{Column width in terms of the 12 grid units, i.e. 1-12.} | ||||
| \item{offset}{Column offset, one of `size` or `width`} | |||||
| \item{offset}{Column offset, one of \code{size} or \code{width}} | |||||
| \item{narrow}{Use [bulma_column_narrow()] to construct options} | |||||
| \item{narrow}{Use \code{\link[=bulma_column_narrow]{bulma_column_narrow()}} to construct options} | |||||
| \item{class}{Extra classes that should be applied to the `columns` container.} | |||||
| \item{class}{Extra classes that should be applied to the \code{columns} container.} | |||||
| \item{style}{CSS styles applied to the `columns` container.} | |||||
| \item{style}{CSS styles applied to the \code{columns} container.} | |||||
| } | } | ||||
| \description{ | \description{ | ||||
| Bulma Column | Bulma Column |
| } | } | ||||
| \arguments{ | \arguments{ | ||||
| \item{viewport}{One of "mobile", "tablet", "touch", "desktop", "widescreen", | \item{viewport}{One of "mobile", "tablet", "touch", "desktop", "widescreen", | ||||
| "fullhd". See <https://bulma.io/documentation/modifiers/responsive-helpers/> | |||||
| "fullhd". See \url{https://bulma.io/documentation/modifiers/responsive-helpers/} | |||||
| for more information.} | for more information.} | ||||
| } | } | ||||
| \description{ | \description{ |
| \item{width}{Column width in terms of the 12 grid units, i.e. 1-12.} | \item{width}{Column width in terms of the 12 grid units, i.e. 1-12.} | ||||
| \item{offset}{Column offset, one of `size` or `width`} | |||||
| \item{offset}{Column offset, one of \code{size} or \code{width}} | |||||
| \item{narrow}{Use [bulma_column_narrow()] to construct options} | |||||
| \item{narrow}{Use \code{\link[=bulma_column_narrow]{bulma_column_narrow()}} to construct options} | |||||
| \item{class}{Extra classes that should be applied to the `columns` container.} | |||||
| \item{class}{Extra classes that should be applied to the \code{columns} container.} | |||||
| \item{style}{CSS styles applied to the `columns` container.} | |||||
| \item{style}{CSS styles applied to the \code{columns} container.} | |||||
| } | } | ||||
| \description{ | \description{ | ||||
| Bulma Column Options | Bulma Column Options |
| column_options = NULL) | column_options = NULL) | ||||
| } | } | ||||
| \arguments{ | \arguments{ | ||||
| \item{breakpoint}{By default, columns are only activated from **tablet** | |||||
| \item{breakpoint}{By default, columns are only activated from \strong{tablet} | |||||
| onwards, meaning that columns are stacked on top of each other on | onwards, meaning that columns are stacked on top of each other on | ||||
| **mobile**. Use `breakpoint` to set the point at which columns are spread | |||||
| out. See `viewport` option in [bulma_responsive()] for valid options.} | |||||
| \strong{mobile}. Use \code{breakpoint} to set the point at which columns are spread | |||||
| out. See \code{viewport} option in \code{\link[=bulma_responsive]{bulma_responsive()}} for valid options.} | |||||
| \item{gap}{Gap between colums, integer from 0 to 8} | \item{gap}{Gap between colums, integer from 0 to 8} | ||||
| \item{multiline}{Should columns wrap to multiple lines (allows columns whose | \item{multiline}{Should columns wrap to multiple lines (allows columns whose | ||||
| width or size add up to more than the screen width).} | width or size add up to more than the screen width).} | ||||
| \item{class}{Extra classes that should be applied to the `columns` container.} | |||||
| \item{class}{Extra classes that should be applied to the \code{columns} container.} | |||||
| \item{style}{CSS styles applied to the `columns` container.} | |||||
| \item{style}{CSS styles applied to the \code{columns} container.} | |||||
| \item{column_options}{Column options to be applied to each column. Use | \item{column_options}{Column options to be applied to each column. Use | ||||
| [bulma_column_options()] to format.} | |||||
| \code{\link[=bulma_column_options]{bulma_column_options()}} to format.} | |||||
| } | } | ||||
| \description{ | \description{ | ||||
| Bulma Columns | Bulma Columns |
| }} | }} | ||||
| } | } | ||||
| \description{ | \description{ | ||||
| TODO Document YAML options here. | |||||
| Bulma Document Renderer | |||||
| } | } | ||||
| \section{YAML options}{ | |||||
| You can pass additional options to the underlying template via the \code{bulma} | |||||
| YAML item. The following options can be specified there. | |||||
| \itemize{ | |||||
| \item{\code{hero}: Classes applied to the hero containing the title} | |||||
| \item{\code{hero_button}: Classes applied to the \code{header_links} buttons} | |||||
| \item{\code{hero_links}: Links that will be displayed under title as buttons. | |||||
| Formatted as a list, each element having entries for \code{name}, \code{url}, | |||||
| and \code{icon}. Icons use \href{https://fontawesome.com/icons}{Font Awesome}; | |||||
| see \code{\link[=fa_icon]{fa_icon()}} for help constructing the Font Awesome class. The | |||||
| full Font Awesome class name is required.} | |||||
| }\preformatted{--- | |||||
| bulma: | |||||
| hero: ["info"] | |||||
| hero_button: ["is-secondary", "is-outlined"] | |||||
| hero_links: | |||||
| - name: Github | |||||
| url: https://github.com/ | |||||
| icon: '`r bulma::fa_icon("github")`' | |||||
| - name: Twitter | |||||
| url: https://twitter.com | |||||
| icon: "fab fa-twitter" | |||||
| --- | |||||
| } | |||||
| } | |||||
| bulma_helper(float = NULL, spacing = NULL, other = NULL) | bulma_helper(float = NULL, spacing = NULL, other = NULL) | ||||
| } | } | ||||
| \arguments{ | \arguments{ | ||||
| \item{float}{`clearfix` Fixes an element's floating children | |||||
| \item{float}{\code{clearfix} Fixes an element's floating children | |||||
| `pulled-left` Moves an element to the left | |||||
| \code{pulled-left} Moves an element to the left | |||||
| `pulled-right` Moves an element to the right} | |||||
| \code{pulled-right} Moves an element to the right} | |||||
| \item{spacing}{`marginless` Removes any margin | |||||
| \item{spacing}{\code{marginless} Removes any margin | |||||
| `paddingless` Removes any padding} | |||||
| \code{paddingless} Removes any padding} | |||||
| \item{other}{`overlay` Completely covers the first positioned parent | |||||
| `clipped` Adds overflow hidden | |||||
| \item{other}{\code{overlay} Completely covers the first positioned parent | |||||
| \code{clipped} Adds overflow hidden | |||||
| `radiusless` Removes any radius | |||||
| \code{radiusless} Removes any radius | |||||
| `shadowless` Removes any shadow | |||||
| \code{shadowless} Removes any shadow | |||||
| `unselectable` Prevents the text from being selectable | |||||
| \code{unselectable} Prevents the text from being selectable | |||||
| `invisible` Adds visibility hidden | |||||
| \code{invisible} Adds visibility hidden | |||||
| `sr-only` Hide elements visually but keep the element available to be announced by a screen reader} | |||||
| \code{sr-only} Hide elements visually but keep the element available to be announced by a screen reader} | |||||
| } | } | ||||
| \value{ | \value{ | ||||
| String of modifer classes | String of modifer classes |
| \item{display}{One of "block", "flex", "inline", "inline-block", "inline-flex"} | \item{display}{One of "block", "flex", "inline", "inline-block", "inline-flex"} | ||||
| \item{viewport}{One of "mobile", "tablet", "touch", "desktop", "widescreen", | \item{viewport}{One of "mobile", "tablet", "touch", "desktop", "widescreen", | ||||
| "fullhd". See <https://bulma.io/documentation/modifiers/responsive-helpers/> | |||||
| "fullhd". See \url{https://bulma.io/documentation/modifiers/responsive-helpers/} | |||||
| for more information.} | for more information.} | ||||
| } | } | ||||
| \value{ | \value{ |
| \item{alignment}{One of "centered", "justified", "left", "right"} | \item{alignment}{One of "centered", "justified", "left", "right"} | ||||
| \item{viewport}{One of "mobile", "tablet", "touch", "desktop", "widescreen", | \item{viewport}{One of "mobile", "tablet", "touch", "desktop", "widescreen", | ||||
| "fullhd". See <https://bulma.io/documentation/modifiers/responsive-helpers/> | |||||
| "fullhd". See \url{https://bulma.io/documentation/modifiers/responsive-helpers/} | |||||
| for more information.} | for more information.} | ||||
| } | } | ||||
| \value{ | \value{ |
| \item{size}{One of 1 through 7 (large to small)} | \item{size}{One of 1 through 7 (large to small)} | ||||
| \item{viewport}{One of "mobile", "tablet", "touch", "desktop", "widescreen", | \item{viewport}{One of "mobile", "tablet", "touch", "desktop", "widescreen", | ||||
| "fullhd". See <https://bulma.io/documentation/modifiers/responsive-helpers/> | |||||
| "fullhd". See \url{https://bulma.io/documentation/modifiers/responsive-helpers/} | |||||
| for more information.} | for more information.} | ||||
| } | } | ||||
| \value{ | \value{ |
| \arguments{ | \arguments{ | ||||
| \item{size}{One of 1 through 7 (large to small)} | \item{size}{One of 1 through 7 (large to small)} | ||||
| \item{responsive_size}{See [bulma_responsive_size()].} | |||||
| \item{responsive_size}{See \code{\link[=bulma_responsive_size]{bulma_responsive_size()}}.} | |||||
| \item{alignment}{One of "centered", "justified", "left", "right"} | \item{alignment}{One of "centered", "justified", "left", "right"} | ||||
| % Generated by roxygen2: do not edit by hand | |||||
| % Please edit documentation in R/utils.R | |||||
| \name{fa_icon} | |||||
| \alias{fa_icon} | |||||
| \title{Font Awesome Icon} | |||||
| \usage{ | |||||
| fa_icon(name, solid = TRUE, as_html = FALSE) | |||||
| } | |||||
| \arguments{ | |||||
| \item{name}{Name of the Font Awesome icon} | |||||
| \item{solid}{Should the solid or the regular icon be used?} | |||||
| \item{as_html}{If \code{FALSE} (default), only the icon class is returned.} | |||||
| } | |||||
| \description{ | |||||
| Create the correct Font Awesome class. | |||||
| } | |||||
| \examples{ | |||||
| fa_icon("github") | |||||
| fa_icon("star") | |||||
| fa_icon("star", FALSE) | |||||
| } | |||||
| \references{ | |||||
| \url{https://fontawesome.com/icons} | |||||
| } |