diff --git a/packages/vkui/src/components/Image/Readme.md b/packages/vkui/src/components/Image/Readme.md index cefdf68b50..a532a70c5b 100644 --- a/packages/vkui/src/components/Image/Readme.md +++ b/packages/vkui/src/components/Image/Readme.md @@ -14,6 +14,30 @@ const Default = () => { ); }; +const Responsive = () => { + const [size, setSize] = React.useState(100); + return ( + + Изображения без фиксированных размеров с сохранением пропорций + + } + > + + + + +
+ +
+
+
+ ); +}; + /** * Какие значения принимают параметры смотрите в разделе "Свойства и методы". */ @@ -60,9 +84,8 @@ const Example = () => { Image - - + diff --git a/packages/vkui/src/components/ImageBase/ImageBase.module.css b/packages/vkui/src/components/ImageBase/ImageBase.module.css index fa7095cb7d..ce53996250 100644 --- a/packages/vkui/src/components/ImageBase/ImageBase.module.css +++ b/packages/vkui/src/components/ImageBase/ImageBase.module.css @@ -31,10 +31,6 @@ } .ImageBase__img { - position: absolute; - z-index: var(--vkui_internal--z_index_image_base_img); - inset-block-start: 0; - inset-inline-start: 0; display: block; inline-size: 100%; block-size: 100%; diff --git a/packages/vkui/src/styles/constants.css b/packages/vkui/src/styles/constants.css index d7f7e6968e..16b411169c 100644 --- a/packages/vkui/src/styles/constants.css +++ b/packages/vkui/src/styles/constants.css @@ -72,7 +72,6 @@ --vkui_internal--z_index_form_field_side: 6; /* z_index ImageBase isolate */ - --vkui_internal--z_index_image_base_img: -1; --vkui_internal--z_index_image_base_overlay: 0; --vkui_internal--z_index_image_base_border: 1; --vkui_internal--z_index_image_base_badge: 2;