mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2025-07-25 15:40:06 +03:00
chore(rtk-query): improve demo visibility on small devices
This commit is contained in:
parent
dc5045f280
commit
990521bba4
|
@ -1,46 +0,0 @@
|
|||
.App {
|
||||
text-align: center;
|
||||
}
|
||||
.App code {
|
||||
background: #fff3;
|
||||
padding: 4px 8px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.App p {
|
||||
margin: 0.4rem;
|
||||
}
|
||||
|
||||
.App-logo {
|
||||
height: 40vmin;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
.App-logo {
|
||||
animation: App-logo-spin infinite 20s linear;
|
||||
}
|
||||
}
|
||||
|
||||
.App-header {
|
||||
background-color: #282c34;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: calc(10px + 2vmin);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.App-link {
|
||||
color: #61dafb;
|
||||
}
|
||||
|
||||
@keyframes App-logo-spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
|
@ -4,7 +4,6 @@ import { Box, Flex, Heading } from '@chakra-ui/react';
|
|||
import { Link, UnorderedList, ListItem } from '@chakra-ui/react';
|
||||
import { Code } from '@chakra-ui/react';
|
||||
import * as React from 'react';
|
||||
import './styles.css';
|
||||
|
||||
export function App() {
|
||||
return (
|
||||
|
|
|
@ -3,11 +3,15 @@ import { createDevTools } from '@redux-devtools/core';
|
|||
import DockMonitor from '@redux-devtools/dock-monitor';
|
||||
import RtkQueryMonitor from './build';
|
||||
|
||||
const largeScreenQuery = window.matchMedia('(min-width: 1024px)');
|
||||
|
||||
export default createDevTools(
|
||||
<DockMonitor
|
||||
fluid
|
||||
toggleVisibilityKey="ctrl-h"
|
||||
changePositionKey="ctrl-q"
|
||||
changeMonitorKey="ctrl-m"
|
||||
defaultSize={largeScreenQuery.matches ? 0.34 : 0.55}
|
||||
>
|
||||
<RtkQueryMonitor />
|
||||
</DockMonitor>
|
||||
|
|
|
@ -1,4 +0,0 @@
|
|||
.App {
|
||||
font-family: sans-serif;
|
||||
text-align: center;
|
||||
}
|
Loading…
Reference in New Issue
Block a user