mirror of
https://github.com/blitzkit/blitzkit.git
synced 2026-11-13 04:36:12 +01:00
30 lines
782 B
TypeScript
30 lines
782 B
TypeScript
|
import { style } from '@vanilla-extract/css';
|
||
|
|
import { theme } from '../../../../../stitches.config';
|
||
|
|
|
||
|
|
export const listing = style({});
|
||
|
|
|
||
|
|
export const listingShadow = style({
|
||
|
|
boxShadow: `inset 0 -128px 128px -128px ${theme.colors.appBackground1}`,
|
||
|
|
|
||
|
|
[`.${listing}:hover &`]: {
|
||
|
|
boxShadow: `inset 0 0 128px -128px ${theme.colors.appBackground1}`,
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
export const listingLabel = style({
|
||
|
|
transition: `transform ${theme.durations.regular}`,
|
||
|
|
transform: 'translateY(0)',
|
||
|
|
|
||
|
|
[`.${listing}:hover &`]: {
|
||
|
|
transform: 'translateY(200%)',
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
export const listingImage = style({
|
||
|
|
transition: `transform ${theme.durations.regular}`,
|
||
|
|
transform: 'translateX(25%) translateY(0)',
|
||
|
|
|
||
|
|
[`.${listing}:hover &`]: {
|
||
|
|
transform: 'translateX(25%) translateY(10%)',
|
||
|
|
},
|
||
|
|
});
|