Site: (liferay#481) Management Bar Primary demos should truncate Sele…

…ct All text
pat270 · Feb 20, 2018 · 5a3cf05 · 5a3cf05
1 parent ec72db3
commit 5a3cf05
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 16 deletions.
diff --git a/packages/clay/src/content/management-bar.html b/packages/clay/src/content/management-bar.html
@@ -277,9 +277,9 @@ <h3>Navbar Management Bar</h3>
 	</div>
 </nav>
 
-<nav class="management-bar management-bar-primary navbar navbar-expand-md">
+<nav class="management-bar management-bar-primary navbar navbar-expand-md navbar-nowrap">
 	<div class="container-fluid container-fluid-max-xl">
-		<ul class="navbar-nav">
+		<ul class="navbar-nav navbar-nav-expand">
 			<li class="nav-item">
 				<div class="custom-control custom-checkbox">
 					<label>
@@ -294,9 +294,11 @@ <h3>Navbar Management Bar</h3>
 					<span class="navbar-breakpoint-down-d-none">items selected</span>
 				</span>
 			</li>
-			<li class="nav-item">
+			<li class="nav-item nav-item-shrink">
 				<button class="btn btn-link nav-btn" type="button">
-					Select all
+					<span class="text-truncate-inline">
+						<span class="text-truncate">Select All the Things</span>
+					</span>
 				</button>
 			</li>
 		</ul>

diff --git a/packages/clay/src/content/test_card_view_template_info_panel.html b/packages/clay/src/content/test_card_view_template_info_panel.html
@@ -80,9 +80,9 @@
 	</div>
 </nav>
 
-<nav class="management-bar management-bar-primary navbar navbar-expand-md">
+<nav class="management-bar management-bar-primary navbar navbar-expand-md navbar-nowrap">
 	<div class="container-fluid container-fluid-max-xl">
-		<ul class="navbar-nav">
+		<ul class="navbar-nav navbar-nav-expand">
 			<li class="nav-item">
 				<div class="custom-control custom-checkbox">
 					<label>
@@ -97,9 +97,13 @@
 					<span class="navbar-breakpoint-down-d-none">items selected</span>
 				</span>
 			</li>
-			<li class="nav-item">
+			<li class="nav-item nav-item-shrink">
 				<button class="btn btn-link nav-btn" type="button">
-					Select All
+					<span class="text-truncate-inline">
+						<span class="text-truncate">
+							Select All the Things
+						</span>
+					</span>
 				</button>
 			</li>
 		</ul>

diff --git a/packages/clay/src/content/test_list_view_template_info_panel.html b/packages/clay/src/content/test_list_view_template_info_panel.html
@@ -80,9 +80,9 @@
 	</div>
 </nav>
 
-<nav class="management-bar management-bar-primary navbar navbar-expand-md">
+<nav class="management-bar management-bar-primary navbar navbar-expand-md navbar-nowrap">
 	<div class="container-fluid container-fluid-max-xl">
-		<ul class="navbar-nav">
+		<ul class="navbar-nav navbar-nav-expand">
 			<li class="nav-item">
 				<div class="custom-control custom-checkbox">
 					<label>
@@ -97,9 +97,11 @@
 					<span class="navbar-breakpoint-down-d-none">items selected</span>
 				</span>
 			</li>
-			<li class="nav-item">
+			<li class="nav-item nav-item-shrink">
 				<button class="btn btn-link nav-btn" type="button">
-					Select All
+					<span class="text-truncate-inline">
+						<span class="text-truncate">Select All the Things</span>
+					</span>
 				</button>
 			</li>
 		</ul>

diff --git a/packages/clay/src/content/test_table_view_template_info_panel.html b/packages/clay/src/content/test_table_view_template_info_panel.html
@@ -80,9 +80,9 @@
 	</div>
 </nav>
 
-<nav class="management-bar management-bar-primary navbar navbar-expand-md">
+<nav class="management-bar management-bar-primary navbar navbar-expand-md navbar-nowrap">
 	<div class="container-fluid container-fluid-max-xl">
-		<ul class="navbar-nav">
+		<ul class="navbar-nav navbar-nav-expand">
 			<li class="nav-item">
 				<div class="custom-control custom-checkbox">
 					<label>
@@ -97,9 +97,11 @@
 					<span class="navbar-breakpoint-down-d-none">items selected</span>
 				</span>
 			</li>
-			<li class="nav-item">
+			<li class="nav-item nav-item-shrink">
 				<button class="btn btn-link nav-btn" type="button">
-					Select All
+					<span class="text-truncate-inline">
+						<span class="text-truncate">Select All the Things</span>
+					</span>
 				</button>
 			</li>
 		</ul>