Make iron-autogrow-textarea have a white background in sshEditor & gpgEditor
Fixes an issue where the background was grey. This was incorrect
behaviour and we fix this by setting the background to white.
Release-Notes: Make iron-autogrow-textarea have a white background in sshEditor & gpgEditor
Change-Id: I6e131fb8a625915e9bac27335bf093c414e6a0f8
diff --git a/polygerrit-ui/app/elements/settings/gr-gpg-editor/gr-gpg-editor.ts b/polygerrit-ui/app/elements/settings/gr-gpg-editor/gr-gpg-editor.ts
index 3c54c59..97804946 100644
--- a/polygerrit-ui/app/elements/settings/gr-gpg-editor/gr-gpg-editor.ts
+++ b/polygerrit-ui/app/elements/settings/gr-gpg-editor/gr-gpg-editor.ts
@@ -15,7 +15,6 @@
* limitations under the License.
*/
import '@polymer/iron-autogrow-textarea/iron-autogrow-textarea';
-import '../../../styles/gr-form-styles';
import '../../shared/gr-button/gr-button';
import '../../shared/gr-copy-clipboard/gr-copy-clipboard';
import '../../shared/gr-overlay/gr-overlay';
@@ -26,8 +25,8 @@
import {getAppContext} from '../../../services/app-context';
import {css, html, LitElement} from 'lit';
import {customElement, property, query, state} from 'lit/decorators';
-import {sharedStyles} from '../../../styles/shared-styles';
import {formStyles} from '../../../styles/gr-form-styles';
+import {sharedStyles} from '../../../styles/shared-styles';
import {assertIsDefined} from '../../../utils/common-util';
import {BindValueChangeEvent} from '../../../types/events';
import {fire} from '../../../utils/event-util';
@@ -63,8 +62,8 @@
private readonly restApiService = getAppContext().restApiService;
static override styles = [
- sharedStyles,
formStyles,
+ sharedStyles,
css`
.keyHeader {
width: 9em;
@@ -84,6 +83,9 @@
#existing {
margin-bottom: var(--spacing-l);
}
+ iron-autogrow-textarea {
+ background-color: var(--view-background-color);
+ }
`,
];
diff --git a/polygerrit-ui/app/elements/settings/gr-ssh-editor/gr-ssh-editor.ts b/polygerrit-ui/app/elements/settings/gr-ssh-editor/gr-ssh-editor.ts
index 72c87b2..daed7d2 100644
--- a/polygerrit-ui/app/elements/settings/gr-ssh-editor/gr-ssh-editor.ts
+++ b/polygerrit-ui/app/elements/settings/gr-ssh-editor/gr-ssh-editor.ts
@@ -15,25 +15,21 @@
* limitations under the License.
*/
import '@polymer/iron-autogrow-textarea/iron-autogrow-textarea';
-import '../../../styles/gr-form-styles';
import '../../shared/gr-button/gr-button';
import '../../shared/gr-copy-clipboard/gr-copy-clipboard';
import '../../shared/gr-overlay/gr-overlay';
-import '../../../styles/shared-styles';
import {dom, EventApi} from '@polymer/polymer/lib/legacy/polymer.dom';
import {SshKeyInfo} from '../../../types/common';
import {GrButton} from '../../shared/gr-button/gr-button';
import {IronAutogrowTextareaElement} from '@polymer/iron-autogrow-textarea/iron-autogrow-textarea';
import {GrOverlay} from '../../shared/gr-overlay/gr-overlay';
import {getAppContext} from '../../../services/app-context';
-import {LitElement, html} from 'lit';
+import {LitElement, css, html, PropertyValues} from 'lit';
import {customElement, property, query, state} from 'lit/decorators';
-import {sharedStyles} from '../../../styles/shared-styles';
-import {css} from 'lit';
-import {BindValueChangeEvent} from '../../../types/events';
-import {fire} from '../../../utils/event-util';
-import {PropertyValues} from 'lit';
import {formStyles} from '../../../styles/gr-form-styles';
+import {sharedStyles} from '../../../styles/shared-styles';
+import {fire} from '../../../utils/event-util';
+import {BindValueChangeEvent} from '../../../types/events';
declare global {
interface HTMLElementTagNameMap {
@@ -69,8 +65,8 @@
static override get styles() {
return [
- sharedStyles,
formStyles,
+ sharedStyles,
css`
.statusHeader {
width: 4em;
@@ -102,6 +98,9 @@
min-width: 27em;
width: auto;
}
+ iron-autogrow-textarea {
+ background-color: var(--view-background-color);
+ }
`,
];
}
@@ -170,8 +169,8 @@
<iron-autogrow-textarea
id="newKey"
autocomplete="on"
- .bindValue=${this.newKey}
placeholder="New SSH Key"
+ .bindValue=${this.newKey}
@bind-value-changed=${(e: BindValueChangeEvent) => {
this.newKey = e.detail.value;
}}
