docs(styles): updated input text field [ci visual]

SAP · Jul 12, 2023 · f32d129 · f32d129
1 parent d925288
commit f32d129
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 10 deletions.
diff --git a/packages/styles/stories/Components/tool-header/horizontal-paddings.example.html b/packages/styles/stories/Components/tool-header/horizontal-paddings.example.html
@@ -96,17 +96,19 @@ <h4>Size XL (3rem)</h4>
             </button>
         </div>
     </div>
-    <div class="fd-tool-header__group">
+    <div class="fd-tool-header__group--center">
         <div class="fd-tool-header__element">
-            <div class="fd-input-group fd-tool-header__input-group">
-                <input class="fd-input fd-input-group__input" type="text" id="aqwsdewfwfw" name="" placeholder="Search...">
+            <div class="fd-input-group fd-tool-header__input-group fd-tool-header__search-field">
+                <input class="fd-input fd-input-group__input fd-tool-header__search-field-input" type="text" id="aqwsdewfwfw" name="" placeholder="Search...">
                 <span class="fd-input-group__addon fd-input-group__addon--button">
-                    <button class="fd-input-group__button fd-button fd-button--icon fd-button--transparent fd-tool-header__button" aria-label="Select">
-                        <i class="sap-icon--navigation-down-arrow"></i>
+                    <button class="fd-input-group__button fd-button fd-button--icon fd-button--transparent fd-tool-header__button" aria-label="Search">
+                        <i class="sap-icon--search"></i>
                     </button>
-                    </span>
+                </span>
             </div>
         </div>
+    </div>
+    <div class="fd-tool-header__group">
         <div class="fd-tool-header__element">
             <button class="fd-button fd-button--transparent fd-tool-header__button" aria-label="notification">
                  <i class="sap-icon--bell"></i>

diff --git a/packages/styles/stories/Components/tool-header/menu.example.html b/packages/styles/stories/Components/tool-header/menu.example.html
@@ -15,17 +15,20 @@ <h4 class="fd-title fd-title--h5 fd-tool-header__title">Product Name</h4>
             <label class="fd-text fd-tool-header__text" for="input-1">Description (Text Element)</label>
         </div>
     </div>
-    <div class="fd-tool-header__group">
+    <div class="fd-tool-header__group--center">
         <div class="fd-tool-header__element">
-            <div class="fd-input-group fd-tool-header__input-group">
-                <input class="fd-input fd-input-group__input" type="text" id="aqwsdewfwfw" name="" placeholder="Search...">
+            <div class="fd-input-group fd-tool-header__input-group fd-tool-header__search-field">
+                <input class="fd-input fd-input-group__input fd-tool-header__search-field-input" type="text" id="aqwsdewfwfw" name="" placeholder="Search...">
                 <span class="fd-input-group__addon fd-input-group__addon--button">
                     <button class="fd-input-group__button fd-button fd-button--icon fd-button--transparent fd-tool-header__button" aria-label="Search">
                         <i class="sap-icon--search"></i>
                     </button>
-                    </span>
+                </span>
             </div>
         </div>
+    </div>
+    <div class="fd-tool-header__group">
+
         <div class="fd-tool-header__element">
             <button class="fd-button fd-button--transparent fd-tool-header__button" aria-label="task">
                  <i class="sap-icon--circle-task"></i>