建立 RWD 的判斷斷點
const mediaXS = "@media only screen and (min-width: 360px)";
const mediaSM = "@media only screen and (min-width: 480px)";
const mediaMD = "@media only screen and (min-width: 768px)";
const mediaLG = "@media only screen and (min-width: 1024px)";
const mediaXL = "@media only screen and (min-width: 1280px)";
export default {
mediaXS,
mediaSM,
mediaMD,
mediaLG,
mediaXL,
}
import styled from 'styled-jss';
import breakpoint from "../constant/breakpoint";
const FormGroup = styled("div")({
display: "flex",
flexDirection: "column",
justifyContent: "flex-star",
// 大螢幕時讀取
[breakpoint.mediaLG]: {
display: "flex",
alignItems: "center",
flexDirection: "row",
boxSizing: "border-box",
},
});
export default FormGroup;