Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2024-11-22 16:46:34 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix: fix the media queries utils so it gets the values from the current theme (#420)

Browse Source
This commit is contained in:
Cesar Landeros Delgado 2018-02-25 04:13:42 -06:00 committed by Roman Hotsiy
parent f30a92be82
commit 3924d3c1be
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/styled-components.ts
View File

@ -1,6 +1,6 @@
import * as styledComponents from 'styled-components'; import * as styledComponents from 'styled-components';
import theme, { ThemeInterface } from './theme'; import { ThemeInterface } from './theme';
export type StyledFunction<T> = styledComponents.ThemedStyledFunction<T, ThemeInterface>; export type StyledFunction<T> = styledComponents.ThemedStyledFunction<T, ThemeInterface>;
@ -24,7 +24,7 @@ const {
export const media = { export const media = {
lessThan(breakpoint) { lessThan(breakpoint) {
return (...args) => css` return (...args) => css`
@media (max-width: ${theme.breakpoints[breakpoint]}) { @media (max-width: ${props => props.theme.breakpoints[breakpoint]}) {
${(css as any)(...args)}; ${(css as any)(...args)};
} }
`; `;
@ -32,7 +32,7 @@ export const media = {
greaterThan(breakpoint) { greaterThan(breakpoint) {
return (...args) => css` return (...args) => css`
@media (min-width: ${theme.breakpoints[breakpoint]}) { @media (min-width: ${props => props.theme.breakpoints[breakpoint]}) {
${(css as any)(...args)}; ${(css as any)(...args)};
} }
`; `;
@ -40,7 +40,7 @@ export const media = {
between(firstBreakpoint, secondBreakpoint) { between(firstBreakpoint, secondBreakpoint) {
return (...args) => css` return (...args) => css`
@media (min-width: ${theme.breakpoints[firstBreakpoint]}) and (max-width: ${theme.breakpoints[ @media (min-width: ${props => props.theme.breakpoints[firstBreakpoint]}) and (max-width: ${props => props.theme.breakpoints[
secondBreakpoint secondBreakpoint
]}) { ]}) {
${(css as any)(...args)}; ${(css as any)(...args)};