corysanin/tubestation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bug 1966715 - Adjust search bar padding to account for reset button r=home-newtab-reviewers,nbarrett

Browse Source 
Differential Revision: https://phabricator.services.mozilla.com/D249635
This commit is contained in:
Maxx Crawford
2025-05-16 20:25:29 +00:00
committed by mcrawford@mozilla.com
parent 305b2a61d1
commit 3f4c442fda
4 changed files with 12 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
browser/extensions/newtab/content-src/components/Search/Search.jsx
View File

@@ -153,7 +153,7 @@ export class _Search extends React.PureComponent {
<div className={wrapperClassName}>
{this.props.showLogo && <Logo />}
{!this.props.handoffEnabled && (
<div className="search-inner-wrapper">
<div className="search-inner-wrapper no-handoff">
<input
id="newtab-search-text"
data-l10n-id="newtab-search-box-input"

7
browser/extensions/newtab/content-src/components/Search/_Search.scss
View File

@@ -66,6 +66,13 @@ $glyph-forward: url('chrome://browser/skin/forward.svg');
}
}
// Bug 1966715: Offset padding of the submit button so the reset button is visible
&.no-handoff {
input {
padding-inline-end: calc($search-button-width + var(--space-medium));
}
}
}
.search-handoff-button,

3
browser/extensions/newtab/css/activity-stream.css
View File

@@ -1642,6 +1642,9 @@ main section {
width: 720px;
}
}
.search-wrapper .search-inner-wrapper.no-handoff input {
padding-inline-end: calc(48px + var(--space-medium));
}
.search-wrapper .search-handoff-button,
.search-wrapper input {
background: var(--newtab-background-color-secondary) var(--newtab-search-icon) 16px center no-repeat;

2
browser/extensions/newtab/data/content/activity-stream.bundle.js
View File

@@ -13209,7 +13209,7 @@ class _Search extends (external_React_default()).PureComponent {
return /*#__PURE__*/external_React_default().createElement("div", {
className: wrapperClassName
}, this.props.showLogo && /*#__PURE__*/external_React_default().createElement(Logo, null), !this.props.handoffEnabled && /*#__PURE__*/external_React_default().createElement("div", {
className: "search-inner-wrapper"
className: "search-inner-wrapper no-handoff"
}, /*#__PURE__*/external_React_default().createElement("input", {
id: "newtab-search-text",
"data-l10n-id": "newtab-search-box-input",