From: Geoff Kimball Date: Tue, 8 Mar 2016 18:25:25 +0000 (-0800) Subject: Change with property to max-width for elements inside of a top bar, which... X-Git-Tag: v6.2.1~59 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=c8eedec2aafcef7ba7ada8eaf4ed5af6198a38d3;p=thirdparty%2Ffoundation%2Ffoundation-sites.git Change with property to max-width for elements inside of a top bar, which restrains the width of text fields without making them crazy wide in some situations. #7451 --- diff --git a/scss/components/_top-bar.scss b/scss/components/_top-bar.scss index 10fb45f4e..cb4fcd6d0 100644 --- a/scss/components/_top-bar.scss +++ b/scss/components/_top-bar.scss @@ -22,7 +22,7 @@ $topbar-submenu-background: $topbar-background !default; /// @type Number $topbar-title-spacing: 1rem !default; -/// Width of `` elements inside the top bar. +/// Maximum width of `` elements inside the top bar. /// @type Number $topbar-input-width: 200px !default; @@ -58,7 +58,7 @@ $topbar-unstack-breakpoint: medium !default; // Restrain width of inputs by default to make them easier to arrange input { - width: $topbar-input-width; + max-width: $topbar-input-width; margin-#{$global-right}: 1rem; } diff --git a/test/visual/dropdown/in-top-bar.html b/test/visual/dropdown/in-top-bar.html new file mode 100644 index 000000000..2470fe477 --- /dev/null +++ b/test/visual/dropdown/in-top-bar.html @@ -0,0 +1,55 @@ + + + + + + + Foundation for Sites Testing + + + +
+

Dropdown: Inside Top Bar

+ +

Text fields inside of a top bar should not be super long.

+ +
+
+ +
+
+ +
+
+
+ + + + + +