2022-10-25 23:32:01 +03:00
|
|
|
//
|
|
|
|
// Copyright 2021 Google LLC
|
|
|
|
// SPDX-License-Identifier: Apache-2.0
|
|
|
|
//
|
|
|
|
|
2023-02-14 22:09:50 +03:00
|
|
|
// go/keep-sorted start
|
2022-10-25 23:32:01 +03:00
|
|
|
@use 'sass:map';
|
2023-02-14 22:09:50 +03:00
|
|
|
// go/keep-sorted end
|
|
|
|
// go/keep-sorted start
|
2022-10-25 23:32:01 +03:00
|
|
|
@use './icon';
|
|
|
|
@use './input';
|
2023-02-14 22:09:50 +03:00
|
|
|
// go/keep-sorted end
|
2022-10-25 23:32:01 +03:00
|
|
|
|
|
|
|
@mixin styles() {
|
|
|
|
:host {
|
|
|
|
display: inline-flex;
|
|
|
|
outline: none;
|
2023-07-19 00:01:22 +03:00
|
|
|
resize: both;
|
2024-03-12 02:38:00 +03:00
|
|
|
// Match default text-align of `<input>` instead of `inherit`.
|
|
|
|
text-align: start;
|
2023-01-03 22:54:00 +03:00
|
|
|
-webkit-tap-highlight-color: transparent;
|
2022-10-25 23:32:01 +03:00
|
|
|
}
|
|
|
|
|
2023-07-19 00:01:22 +03:00
|
|
|
.text-field,
|
|
|
|
.field {
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
|
2023-02-17 03:32:38 +03:00
|
|
|
.text-field {
|
2022-10-25 23:32:01 +03:00
|
|
|
display: inline-flex;
|
|
|
|
}
|
|
|
|
|
2023-02-17 03:32:38 +03:00
|
|
|
.field {
|
2022-10-25 23:32:01 +03:00
|
|
|
cursor: text;
|
2023-02-17 20:00:35 +03:00
|
|
|
}
|
2022-10-25 23:32:01 +03:00
|
|
|
|
2023-02-17 20:00:35 +03:00
|
|
|
.disabled .field {
|
|
|
|
cursor: default;
|
2022-10-25 23:32:01 +03:00
|
|
|
}
|
|
|
|
|
2023-07-19 00:01:22 +03:00
|
|
|
.text-field,
|
|
|
|
.textarea .field {
|
|
|
|
// Note: only inherit default `resize: both` to the field when textarea.
|
|
|
|
resize: inherit;
|
|
|
|
}
|
|
|
|
|
2022-10-25 23:32:01 +03:00
|
|
|
@include icon.styles;
|
|
|
|
@include input.styles;
|
|
|
|
}
|