From 048a7808a135979ad5405d8d578229fe4557119a Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Thu, 16 May 2024 16:46:20 -0400 Subject: [PATCH] docs(components): update filled inputs in items callout to an admonition --- docs/api/input.md | 6 ++++-- docs/api/select.md | 8 ++++++-- docs/api/textarea.md | 6 ++++-- 3 files changed, 14 insertions(+), 6 deletions(-) diff --git a/docs/api/input.md b/docs/api/input.md index cab651f57bd..6ffbdb5ca1f 100644 --- a/docs/api/input.md +++ b/docs/api/input.md @@ -83,9 +83,11 @@ import Clear from '@site/static/usage/v8/input/clear/index.md'; Material Design offers filled styles for an input. The `fill` property on the input can be set to either `"solid"` or `"outline"`. -Since the `fill` styles visually defines the input container, inputs that use `fill` should not be used in `ion-item`. +Filled inputs can be used on iOS by setting the input's `mode` to `md`. -Filled inputs can be used on iOS by setting Input's `mode` to `md`. +:::warning +Inputs that use `fill` should not be used in an `ion-item` due to styling conflicts between the components. +::: import Fill from '@site/static/usage/v8/input/fill/index.md'; diff --git a/docs/api/select.md b/docs/api/select.md index 0beb1767edd..f451191093c 100644 --- a/docs/api/select.md +++ b/docs/api/select.md @@ -134,7 +134,7 @@ import ObjectValuesAndMultipleSelectionExample from '@site/static/usage/v8/selec ## Justification - + Developers can use the `justify` property to control how the label and control are packed on a line. import JustifyExample from '@site/static/usage/v8/select/justify/index.md'; @@ -145,7 +145,11 @@ import JustifyExample from '@site/static/usage/v8/select/justify/index.md'; Material Design offers filled styles for a select. The `fill` property on the select can be set to either `"solid"` or `"outline"`. -Since the `fill` styles visually defines the select container, selects that use `fill` should not be used in `ion-item`. +Filled selects can be used on iOS by setting the select's `mode` to `md`. + +:::warning +Selects that use `fill` should not be used in an `ion-item` due to styling conflicts between the components. +::: import FillExample from '@site/static/usage/v8/select/fill/index.md'; diff --git a/docs/api/textarea.md b/docs/api/textarea.md index 012a917f101..4e61786d24b 100644 --- a/docs/api/textarea.md +++ b/docs/api/textarea.md @@ -67,9 +67,11 @@ import NoVisibleLabel from '@site/static/usage/v8/textarea/no-visible-label/inde Material Design offers filled styles for a textarea. The `fill` property on the item can be set to either `"solid"` or `"outline"`. -Since the `fill` styles visually defines the textarea container, textareas that use `fill` should not be used in `ion-item`. +Filled textareas can be used on iOS by setting the textarea's `mode` to `md`. -Filled textareas can be used on iOS by setting Textarea's `mode` to `md`. +:::warning +Textareas that use `fill` should not be used in an `ion-item` due to styling conflicts between the components. +::: import Fill from '@site/static/usage/v8/textarea/fill/index.md';