kotovalexarian-likes-github/twbs--bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2022-11-09 12:25:43 -05:00
Code Releases Activity

Fixes #11193: Add kbd element styles to indicate user input via keyboard

Browse source
This commit is contained in:
Mark Otto 2013-12-07 12:18:13 -08:00
parent fe58357df1
commit b1215d1b2e
6 changed files with 42 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
_includes/nav-css.html
View file

@ -37,7 +37,14 @@
<li><a href="#type-lists">Lists</a></li>
</ul>
</li>
<li><a href="#code">Code</a></li>
<li>
<a href="#code">Code</a>
<ul class="nav">
<li><a href="#code-inline">Inline code</a></li>
<li><a href="#code-user-input">User input</a></li>
<li><a href="#code-block">Blocks of code</a></li>
</ul>
</li>
<li>
<a href="#tables">Tables</a>
<ul class="nav">

13
css.html
View file

@ -1047,7 +1047,7 @@ base_url: "../"
<h1 id="code">Code</h1>
</div>
<h2>Inline</h2>
<h2 id="code-inline">Inline</h2>
<p>Wrap inline snippets of code with <code>&lt;code&gt;</code>.</p>
<div class="bs-example">
For example, <code>&lt;section&gt;</code> should be wrapped as inline.
@ -1056,7 +1056,16 @@ base_url: "../"
For example, <code>&lt;section&gt;</code> should be wrapped as inline.
{% endhighlight %}
<h2>Basic block</h2>
<h2 id="code-user-input">User input</h2>
<p>Use the <code>&lt;kbd&gt;</code> to indicate input that is typically entered via keyboard.</p>
<div class="bs-example">
To switch directories, type <kbd>cd</kbd> followed the name of the directory.
</div>
{% highlight html %}
To switch directories, type <kbd>cd</kbd> followed the name of the directory.
{% endhighlight %}
<h2 id="code-block">Basic block</h2>
<p>Use <code>&lt;pre&gt;</code> for multiple lines of code. Be sure to escape any angle brackets in the code for proper rendering.</p>
<div class="bs-example">
<pre>&lt;p&gt;Sample text here...&lt;/p&gt;</pre>

9
dist/css/bootstrap.css vendored
View file

@ -753,6 +753,15 @@ code {
border-radius: 4px;
}
kbd {
padding: 2px 4px;
font-size: 90%;
color: #ffffff;
background-color: #333333;
border-radius: 3px;
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}
pre {
display: block;
padding: 9.5px;

2
dist/css/bootstrap.min.css vendored
View file

File diff suppressed because one or more lines are too long

10
less/code.less
View file

@ -21,6 +21,16 @@ code {
border-radius: @border-radius-base;
}
// User input typically entered via keyboard
kbd {
padding: 2px 4px;
font-size: 90%;
color: @kbd-color;
background-color: @kbd-bg;
border-radius: @border-radius-small;
box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
}
// Blocks of code
pre {
display: block;

3
less/variables.less
View file

@ -602,6 +602,9 @@
@code-color: #c7254e;
@code-bg: #f9f2f4;
@kbd-color: #fff;
@kbd-bg: #333;
@pre-bg: #f5f5f5;
@pre-color: @gray-dark;
@pre-border-color: #ccc;