Fix seach bar overlapping (#2276)

SenpuDev · SenpuDev · web-flow · commit 7d46bedb0ba9 · 2023-08-22T16:15:33.000+02:00
Co-authored-by: SenpuDev &lt;senpuudev@gmail.com&gt;
diff --git a/src/themes/website/styles/forms.scss b/src/themes/website/styles/forms.scss
@@ -32,6 +32,11 @@
         vertical-align: middle;
     }
 
+    .form-inline input[type=search] {
+        width: 100%;
+        max-width: 200px;
+    }
+
     .form-inline .form-control-plaintext {
         display: inline-block;
     }
@@ -126,6 +131,9 @@
 }
 
 input[type=search] {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
     @extend .icon-svg-magnifier;
     background-position: 5px center;
     background-size: 1em;

Original file line number	Diff line number	Diff line change
`@@ -32,6 +32,11 @@`
`32`	`32`	`vertical-align: middle;`
`33`	`33`	`}`
`34`	`34`
	`35`	`+ .form-inline input[type=search] {`
	`36`	`+ width: 100%;`
	`37`	`+ max-width: 200px;`
	`38`	`+ }`
	`39`	`+`
`35`	`40`	`.form-inline .form-control-plaintext {`
`36`	`41`	`display: inline-block;`
`37`	`42`	`}`
`@@ -126,6 +131,9 @@`
`126`	`131`	`}`
`127`	`132`
`128`	`133`	`input[type=search] {`
	`134`	`+ white-space: nowrap;`
	`135`	`+ overflow: hidden;`
	`136`	`+ text-overflow: ellipsis;`
`129`	`137`	`@extend .icon-svg-magnifier;`
`130`	`138`	`background-position: 5px center;`
`131`	`139`	`background-size: 1em;`