From d74fd9af2f694ba2b700ed95423ba865175992b9 Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Sun, 30 Nov 2014 00:54:43 -0800
Subject: [PATCH] Fixes #15096: Fix navbar forms in the non-responsive example
---
docs/examples/non-responsive/index.html | 6 ++
.../non-responsive/non-responsive.css | 78 ++++++++++++++++++-
2 files changed, 83 insertions(+), 1 deletion(-)
diff --git a/docs/examples/non-responsive/index.html b/docs/examples/non-responsive/index.html
index d30d3c3c26..5e2672280f 100644
--- a/docs/examples/non-responsive/index.html
+++ b/docs/examples/non-responsive/index.html
@@ -61,6 +61,12 @@
</ul>
</li>
</ul>
+ <form class="navbar-form navbar-left" role="search">
+ <div class="form-group">
+ <input type="text" class="form-control" placeholder="Search">
+ </div>
+ <button type="submit" class="btn btn-default">Submit</button>
+ </form>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
diff --git a/docs/examples/non-responsive/non-responsive.css b/docs/examples/non-responsive/non-responsive.css
index c36e82e381..d7021991ad 100644
--- a/docs/examples/non-responsive/non-responsive.css
+++ b/docs/examples/non-responsive/non-responsive.css
@@ -6,11 +6,16 @@
/* Account for fixed navbar */
body {
- min-width: 970px;
padding-top: 70px;
padding-bottom: 30px;
}
+body,
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+ min-width: 970px;
+}
+
/* Don't let the lead text change font-size. */
.lead {
font-size: 16px;
@@ -64,6 +69,7 @@ body {
height: auto !important;
padding-bottom: 0;
overflow: visible !important;
+ visibility: visible !important;
}
.navbar-toggle {
@@ -123,3 +129,73 @@ body {
color: #999 !important;
background-color: transparent !important;
}
+
+/* Undo form expansion */
+.navbar-form {
+ float: left;
+ width: auto;
+ margin-left: 0;
+ margin-right: 0;
+ padding-top: 0;
+ padding-bottom: 0;
+ border: 0;
+ box-shadow: none;
+}
+
+/* Copy-pasted from forms.less since we mixin the .form-inline styles. */
+.navbar-form .form-group {
+ display: inline-block;
+ margin-bottom: 0;
+ vertical-align: middle;
+}
+
+.navbar-form .form-control {
+ display: inline-block;
+ width: auto;
+ vertical-align: middle;
+}
+
+.navbar-form .form-control-static {
+ display: inline-block;
+}
+
+.navbar-form .input-group {
+ display: inline-table;
+ vertical-align: middle;
+}
+
+.navbar-form .input-group .input-group-addon,
+.navbar-form .input-group .input-group-btn,
+.navbar-form .input-group .form-control {
+ width: auto;
+}
+
+.navbar-form .input-group > .form-control {
+ width: 100%;
+}
+
+.navbar-form .control-label {
+ margin-bottom: 0;
+ vertical-align: middle;
+}
+
+.navbar-form .radio,
+.navbar-form .checkbox {
+ display: inline-block;
+ margin-top: 0;
+ margin-bottom: 0;
+ vertical-align: middle;
+
+ label {
+ padding-left: 0;
+ }
+}
+.navbar-form .radio input[type="radio"],
+.navbar-form .checkbox input[type="checkbox"] {
+ position: relative;
+ margin-left: 0;
+}
+
+.navbar-form .has-feedback .form-control-feedback {
+ top: 0;
+}
--
GitLab