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

@@ -2,6 +2,7 @@ import { CheckboxIcon, InfoIcon, WarningIcon } from "outline-icons";
import { darken } from "polished";
import * as React from "react";
import styled, { css } from "styled-components";
import { s } from "@shared/styles";
import { fadeAndScaleIn, pulse } from "~/styles/animations";
import { Toast as TToast } from "~/types";
import Spinner from "./Spinner";
@@ -72,7 +73,7 @@ function Toast({ closeAfterMs = 3000, onRequestClose, toast }: Props) {
const Action = styled.span`
display: inline-block;
padding: 4px 8px;
color: ${(props) => props.theme.toastText};
color: ${s("toastText")};
background: ${(props) => darken(0.05, props.theme.toastBackground)};
border-radius: 4px;
margin-left: 8px;
@@ -99,8 +100,8 @@ const Container = styled.div`
animation: ${fadeAndScaleIn} 100ms ease;
margin: 8px 0;
padding: 0 12px;
color: ${(props) => props.theme.toastText};
background: ${(props) => props.theme.toastBackground};
color: ${s("toastText")};
background: ${s("toastBackground")};
font-size: 15px;
border-radius: 5px;
cursor: default;