样式化组件中针对Ipad的特定媒体查询

Question

我有以下代码库，我正在尝试为ipad大小应用特定的最小和最大宽度。我无法实现，将不胜感激

device.js

const size = {
  mobileS: '320px',
  mobileM: '375px',
  mobileL: '425px',
  tablet: '768px',
  ipad: '1366',
  laptop: '1024px',
  laptopL: '1440px',
  desktop: '2560px',
};

const device = {
  mobileS: `(max-width: ${size.tablet})`,
  mobileM: `(min-width: ${size.mobileM})`,
  ipad: `(min-width: ${size.ipad})`,
  mobileL: `(min-width: ${size.mobileL})`,
  tablet: `(max-width: ${size.desktop})`,
  laptop: `(min-width: ${size.laptop})`,
  laptopL: `(min-width: ${size.laptopL})`,
  desktop: `(min-width: ${size.desktop})`,
  desktopL: `(min-width: ${size.desktop})`,
};

export default device;

implementation.js

const SignUpParagraph = styled(Nunito20)`
  margin-top: 187px;
  @media ${device.mobileS} {
    margin-bottom: 10px;
    margin-top: 7.6%;
  }
`;
export default SignUpParagraph;

如何在实现中添加最小值和最大值以使ipad的范围正确？ 谢谢