Enhance Search Bar Functionality: Prevent Text Overlap and Adjust Text Alignment Using CSS text-indent Property

Created on 24 July 2024, 3 months ago
Updated 7 August 2024, 2 months ago

Problem/Motivation

Steps to reproduce

While typing long text in search bar then text overlaps on search icon, Once you complete typing and you click outside of search bar then text move to the right side. This issue is happens due to "text-indent" (CSS Property) used in input.

1. Setup drupal ^10.1 || ^11
2. Use Solo 1.0.8 ad default theme
3. Open homepage and type any long text in header or sidebar Search bar.

Attached screenshot for reference.

Proposed resolution

Use padding left instead of text-indent in input field.

Remaining tasks

User interface changes

API changes

Data model changes

📌 Task
Status

Fixed

Version

1.0

Component

Code

Created by

🇮🇳India jaydeep_patel Ahmedabad

Live updates comments and jobs are added and updated live.
  • Novice

    It would make a good project for someone who is new to the Drupal contribution process. It's preferred over Newbie.

Sign in to follow issues

Merge Requests

Comments & Activities

Production build 0.71.5 2024