From fe203ec382144ff5dabbbf0e69d97fb81bf852a6 Mon Sep 17 00:00:00 2001 From: Mark Otto <markdotto@gmail.com> Date: Fri, 17 Apr 2015 20:19:51 -0700 Subject: [PATCH] reorganize code docs --- docs/components/code.md | 22 ++++++++++------------ 1 file changed, 10 insertions(+), 12 deletions(-) diff --git a/docs/components/code.md b/docs/components/code.md index 19c02c84e4..423987d92f 100644 --- a/docs/components/code.md +++ b/docs/components/code.md @@ -13,25 +13,14 @@ Wrap inline snippets of code with `code`. Be sure to escape HTML angle brackets. For example, <code><section></code> should be wrapped as inline. {% endexample %} -## User input - -Use the `<kbd>` to indicate input that is typically entered via keyboard. - -{% example html %} -To switch directories, type <kbd>cd</kbd> followed by the name of the directory.<br> -To edit settings, press <kbd><kbd>ctrl</kbd> + <kbd>,</kbd></kbd> -{% endexample %} - ## Preformatted text -Or, code blocks. Use `<pre>`s for multiple lines of code. Once again, be sure to escape any angle brackets in the code for proper rendering. +Or, code blocks. Use `<pre>`s for multiple lines of code. Once again, be sure to escape any angle brackets in the code for proper rendering. You may optionally add the `.pre-scrollable` class, which will set a max-height of 350px and provide a y-axis scrollbar. {% example html %} <pre><p>Sample text here...</p></pre> {% endexample %} -You may optionally add the `.pre-scrollable` class, which will set a max-height of 350px and provide a y-axis scrollbar. - ## Variables For indicating variables use the `<var>` tag. @@ -40,6 +29,15 @@ For indicating variables use the `<var>` tag. <var>y</var> = <var>m</var><var>x</var> + <var>b</var> {% endexample %} +## User input + +Use the `<kbd>` to indicate input that is typically entered via keyboard. + +{% example html %} +To switch directories, type <kbd>cd</kbd> followed by the name of the directory.<br> +To edit settings, press <kbd><kbd>ctrl</kbd> + <kbd>,</kbd></kbd> +{% endexample %} + ## Sample output For indicating blocks sample output from a program use the `<samp>` tag. -- GitLab