Описание тега styled-system

2 ответа

Как исправить несовместимость типов свойств цвета в компоненте Box с помощью машинописного текста и эмоций

Я пытаюсь сделать генерала Boxкомпонент реагировать на новый проект. Это будет основа для всех остальных компонентов. Я использую стилизованную систему, эмоции и, в конечном итоге, пользовательский интерфейс темы для оформления и стилизации всех мои…
2 ответа

Как использовать адаптивный реквизит в стиле стилевой системы

Могу ли я использовать styled-system добиться чего-то подобного? <MyComponent backgroundImage={{ default: "https://placekitten.com/380/80", sm: "https://placekitten.com/340/80" }} /> или это (потому что я знаю, что это можно сделать и с другим…
0 ответов

Стилизованная система в реагирующих нативных адаптивных значениях

Я пытаюсь использовать системную библиотеку в моем собственном приложении для реагирования. Я хочу использовать адаптивный стиль в своем компоненте коробки, но получаю сообщение об ошибке "Node of type atrule не поддерживается как встроенный стиль".…
0 ответов

Изменение типа машинописного текста свойства в библиотеке React внутри приложения.

Я использую styled-system создавать стили с reactв нашем приложении, которое имеет типы в @types/styled-system здесь. при рендеринге react компонент, я нашел оба react а также styled-system имеет собственную реализацию типа машинописного текста для …
0 ответов

Создание компонента React с вариациями на основе компонента Chakra-UI

Я пытаюсь создать некоторые компоненты типографики, используя Heading и Textкомпоненты из chakra-ui: https://chakra-ui.com/. Идея состоит в том, что эти компоненты содержат в себе все стили line-height, letter-spacing, font-weight и другие стили, ко…
0 ответов

styled-components - Доступ к реквизитам при определении компонента

Я пытаюсь найти способ доступа к реквизитам в момент определения компонента, чтобы я мог дать базовому компоненту динамическое, определяемое отображаемое имя (для ясности в инструментах разработчика в браузере и реагировании) Для справки это: export…
01 окт '20 в 18:26
1 ответ

стилизованная система | Разрешить функцию стиля темы в компоненте

Я пытаюсь понять, как разрешить функцию стилизованной системы в компоненте по умолчанию. Идея состоит в том, чтобы иметь элемент контейнера, который использует тему из коробки для предоставления основных адаптивных разрывов. Прямо сейчас то, что я д…
22 сен '20 в 16:40
0 ответов

Использование точек останова

Как можно было добиться styled-systemс themeGet, в styled-components? styled-system: const Box = styled.div` ${typography}; `; const Test = () => <Box fontSize={["2xl", "xl", "base"]}>Box</Box>; Но исполь…
01 дек '20 в 17:44
1 ответ

Стилизованные системы не отображаются в Интернете, как на мобильных устройствах в React Native.

Сегодня я начал проект с expo и хотел использовать styled-system. Я создал и использовал собственный компонент со Styled-системой. Хотя на мобильных устройствах это выглядит хорошо, стили не появятся в экспо-сети. В чем причина этого? Чтобы показать…
14 ноя '20 в 21:07
1 ответ

Использование react-test-renderer со стилями-компонентами и темой (React Native)

У меня есть styled-component что использует styled-system и он работает отлично, но когда я иду тестировать компонент, я не могу заставить его правильно заполнять стили из темы. Это странно, потому что если я применяю такой реквизит, как marginLeft=…
1 ответ

Зачем css-in-js системам ThemeProvider/useTheme

(или с аналогичным названием в зависимости от библиотеки) Эти функции предназначены исключительно для простоты использования при доступе к теме в приложении или они обеспечивают некоторые функциональные преимущества / преимущества? В чем разница меж…
1 ответ

Тип "CssFunctionReturnType" не может быть назначен типу "InterpolationFunction <any>" .ts(2769)

В последнее время я получаю сообщение об ошибке каждый раз, когда пытаюсь использовать функцию css из стилизованной системы. Раньше он работал отлично, без ошибок. Нет, я получаю сообщение об ошибке: Тип 'CssFunctionReturnType' не может быть назначе…
24 ноя '20 в 12:22
1 ответ

Пользовательские точки останова в стиле стилевой системы

Я хотел бы указать свои собственные точки останова. Документация https://styled-system.com/responsive-styles/#using-objects относится только к. Но я не понимаю, где мне разместить theme.js? или найти? и как мне его импортировать в проект? и как мне …
09 фев '21 в 01:57
1 ответ

Как сочетать style-system с React Material?

Я хочу использовать стилизованную систему в своем проекте, который является админ-панелью. Я построил проект на основе React Material, и у меня есть много разных форм с вводом, выбором, флажками и т. Д. Во многих местах мне нужно установить некоторы…
17 мар '21 в 23:05
1 ответ

Можно ли использовать компонент «Коробка» для всего?

В настоящее время я использую эмоции с плагином стилизованной системы и документацией, есть несколько примеров компонента Box, который мы можем использовать для создания некоторых блоков нашего макета, например: Может это из-за каких-то моментов выс…
1 ответ

Компонент заголовка в стилизованной системе

Как я могу создать общий компонент заголовка, используя стилизованную систему и стилизованные компоненты? Следующее работает, но все мои заголовки используют тег h1. import css from "@styled-system/css" import styled from "styled-components" import …
1 ответ

Стилизованные компоненты, стилизованная система, эмоции и пользовательский интерфейс темы?

Может кто-нибудь объяснить различия между Styled-components, Styled-system, emotion and theme-ui. И, кроме того, как эти библиотеки вписываются в среду MDX? NB: я просмотрел всю документацию, но не смог выявить различия
1 ответ

Компонент Box vs css prop для макета, что выбрать?

Сейчас я использую style-system и Emotion и не могу понять, какой подход более правильный. У меня есть компонент "Box", который обрабатывает различные свойства, такие как mx, my, px, py, bg, color и многие другие, из https://styled-system.com/api/. …
28 апр '21 в 18:08
1 ответ

Проблема с состоянием реакции (плохой setState?) При попытке показать компонент, состоящий из стилизованных компонентов

Теперь я не совсем уверен, какое стечение вещей привело к этой проблеме, но давайте начнем с моего минимального воспроизведения. Что я пытаюсь сделать Я хочу показать стилизованный элемент, состоящий из различных «унаследованных» членов внутри модал…
12 авг '21 в 00:09
0 ответов

Почему не работает адаптивный массив в стиле стилевой системы?

Я не могу сделать свои размеры адаптивными. Я передаю массив в стилизованный компонент, и он должен быть изменен для разных макетов. Макеты изменены правильно, точка останова отображается правильно, когда я меняю размер экрана с широкого на мобильны…
03 ноя '21 в 15:50