Add 's' method to access theme props (#5163)

This commit is contained in:
Tom Moor
2023-04-07 22:43:34 -04:00
committed by GitHub
parent c202198d61
commit 422bdc32d9
116 changed files with 482 additions and 388 deletions

View File

@@ -1,7 +1,7 @@
import * as React from "react";
import { Dialog, DialogBackdrop, useDialogState } from "reakit/Dialog";
import styled from "styled-components";
import { depths } from "@shared/styles";
import { depths, s } from "@shared/styles";
import Scrollable from "~/components/Scrollable";
import usePrevious from "~/hooks/usePrevious";
@@ -71,7 +71,7 @@ const Backdrop = styled.div`
left: 0;
right: 0;
bottom: 0;
background-color: ${(props) => props.theme.backdrop} !important;
background-color: ${s("backdrop")} !important;
z-index: ${depths.modalOverlay};
transition: opacity 200ms ease-in-out;
opacity: 0;
@@ -92,8 +92,8 @@ const Scene = styled.div`
justify-content: center;
align-items: flex-start;
width: 350px;
background: ${(props) => props.theme.background};
transition: ${(props) => props.theme.backgroundTransition};
background: ${s("background")};
transition: ${s("backgroundTransition")};
border-radius: 8px;
outline: none;
opacity: 0;