Questions tagged [stitches]
12 questions
3
votes
0 answers
How to use stitches and tailwind together in Next.js?
Is there a way to combine the power of both stitches (https://stitches.dev/) and tailwind https://tailwindcss.com/ in a Next.js project? How to use them together?
Onkeltem
- 1,889
- 1
- 18
- 27
3
votes
3 answers
How can a prop value be used in an Stitches js component?
How to pass a prop value into a Stitchesjs component and use it in the component definition?
This is a common pattern in styled-components. In Stitches, however, I can't seem to find a way. Take this component for example:
const Spacer =…
Edy Bourne
- 5,679
- 13
- 53
- 101
2
votes
2 answers
Why can't I use stitches token in css prop?
I believe my question is simple for those who work with stitches on a daily basis.
I was following Pedro Duarte's post and saw that there is a way to create a configuration file, that is, stitches.config.ts.
I did this, however, when trying to use…
AndresdoSantos
- 49
- 1
- 1
- 5
1
vote
0 answers
How to load and apply a 3rd-party stylesheet into a NextJS component after CSS-in-JS globals?
I've got a problem with the loading order in a NextJS app.
We use Stitches CSS-in-JS, which provides globalCss() for loading global styles like resetters/normalizers and it gets invoked in _app.tsx.
On the other hand, a component that requires an…
Onkeltem
- 1,889
- 1
- 18
- 27
1
vote
1 answer
Typescript styled component "The type of this node cannot be serialized because its property '[$$PropertyValue]' cannot be serialized"
I am building a server-side rendered website using NextJS, TypeScript and the Stitches CSS library.
When using Stitches styled function to create styled components I get this lint error:
The type of this node cannot be serialized because its…
starfish731
- 13
- 5
1
vote
0 answers
Implementing darkMode to a react-native app styled with stitches-native
I have a react-native app styled with a combination of stitches-native and css. The colors defined within the stitches-native are as follows:
const themeLight = {
theme: {
fonts: {
inter: 'Inter',
system: 'system-ui',
},
…
cbg_retro
- 11
- 2
0
votes
1 answer
Composing styles with stitches composition API
I am trying to change the background colour of a element, when hovered on another element using stitches composing API. But, that doesn't seem to work. The code looks fine, but i am not sure where it's going…
Jaya Krishna
- 313
- 4
- 14
0
votes
0 answers
BackgroundColor of radix Select trigger does not work when using stitches
I use ReactJS 17 with radix-ui and stitches. My Select component is very straight forward:
I'm styling it with stitches. Everything works fine except the background color of…
Simon
- 6,025
- 7
- 46
- 98
0
votes
1 answer
Migrating from emotion to stitches: include two props in variants and breakpoints
I am wondering how can I write this styled-emotion code in stitches. Basically I accept onlyShowOnDesktop and breakpoint props.
breakpoint is basically:
const breakpoint = isTopNavigationBreakPoint ? theme.defaultBreakpoints.xl :…
Stefan
- 250
- 4
- 13
0
votes
1 answer
@vanilla-extract/css - is there a way to export stylesheet CSS for shadow DOM
I am looking at @vanilla-extract/css for my styling in React app. The method style exports a className from the *.css.ts file but I require inline styling for Shadow DOM encapsulation.
I was checking @stitches/react it provides a way called…
cs1193
- 1,090
- 1
- 16
- 28
0
votes
1 answer
Calling Stitches createStitches for every component in React
I'm using Stitches to write my CSS in a React application, mainly for the theming and variables. I'm calling createStitches in every component file, like so:
ComponentA.tsx
import { createStitches, styled } from "@stitches/react";
const {…
darkhorse
- 8,192
- 21
- 72
- 148
0
votes
1 answer
Dark theme does not work with React Stitches
I'm using Stitches in React to handle my CSS and theming. I have the following code:
import React from 'react'
import { createStitches, globalCss } from '@stitches/react'
const { theme, createTheme } = createStitches({
theme: {
colors: {
…
darkhorse
- 8,192
- 21
- 72
- 148