1
0
mirror of https://github.com/uetchy/namae.git synced 2025-03-16 20:20:38 +09:00

fix: content margin

This commit is contained in:
uetchy 2020-03-26 16:32:52 +09:00
parent 8b850fa09f
commit 4a41743943
2 changed files with 101 additions and 89 deletions

View File

@ -72,51 +72,30 @@ function Search() {
<Header>
<Form initialValue={currentQuery} />
</Header>
<Legend>
<ResultItem color={COLORS.available}>
<ResultIcon>
<IoIosRocket />
</ResultIcon>
<ResultName>{t('available')}</ResultName>
<AvailableIcon>
<IoIosFlash />
</AvailableIcon>
</ResultItem>
<ResultItem color={COLORS.unavailable}>
<ResultIcon>
<IoIosRocket />
</ResultIcon>
<ResultName>{t('unavailable')}</ResultName>
</ResultItem>
</Legend>
<Content>
<Legend>
<ResultItem color={COLORS.available}>
<ResultIcon>
<IoIosRocket />
</ResultIcon>
<ResultName>{t('available')}</ResultName>
<AvailableIcon>
<IoIosFlash />
</AvailableIcon>
</ResultItem>
<ResultItem color={COLORS.unavailable}>
<ResultIcon>
<IoIosRocket />
</ResultIcon>
<ResultName>{t('unavailable')}</ResultName>
</ResultItem>
</Legend>
<Cards query={currentQuery} />
</Content>
</>
);
}
const Legend = styled.div`
padding: 80px 0 30px;
display: flex;
flex-direction: row;
justify-content: center;
user-select: none;
cursor: default;
background-color: #f6f6fa;
${mobile} {
padding: 60px 0 20px;
align-items: center;
flex-direction: column;
background-color: none;
}
${ResultItem} {
margin: 0 20px 0;
}
`;
const GlobalStyle = createGlobalStyle`
* {
box-sizing: border-box;
@ -144,10 +123,10 @@ body {
`;
const Content = styled.div`
/* padding-top: 100px; */
padding-top: 100px;
${mobile} {
/* padding-top: 60px; */
padding-top: 60px;
}
`;
@ -159,3 +138,24 @@ const Header = styled.header`
padding: 0 20px;
}
`;
const Legend = styled.div`
margin-top: -100px;
padding: 80px 0 30px;
display: flex;
flex-direction: row;
justify-content: center;
user-select: none;
cursor: default;
background-color: #f6f6fa;
${mobile} {
margin-top: -80px;
padding: 60px 0 30px;
background-color: none;
}
${ResultItem} {
margin: 0 10px 0;
}
`;

110
yarn.lock
View File

@ -1303,14 +1303,14 @@
style-value-types "^3.1.7"
tslib "^1.10.0"
"@sentry/browser@^5.14.2":
version "5.14.2"
resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-5.14.2.tgz#b0d1bf7bd771e64de0f9f801fa6625e47fced016"
integrity sha512-Vuuy2E5mt2VQKeHpFqtowZdKUe1Ui7J2KmgZQCduVilM7dFmprdXfv/mQ3Uv+73VIiCd22PpxojR3peDksb/Gg==
"@sentry/browser@^5.15.0":
version "5.15.0"
resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-5.15.0.tgz#ea0ba1ceccc82a6467e10e4e94070e4cfb7accee"
integrity sha512-9sgqWGaoT5jb3vk8sgQ1bz1LzhUf3oKoDMp/c6vX0reuA6Vz+/jwOC7a/FPWtQir2PwRJfbak2QOxw8W6Mwa3g==
dependencies:
"@sentry/core" "5.14.2"
"@sentry/types" "5.14.2"
"@sentry/utils" "5.14.2"
"@sentry/core" "5.15.0"
"@sentry/types" "5.15.0"
"@sentry/utils" "5.15.0"
tslib "^1.9.3"
"@sentry/cli@^1.51.1":
@ -1325,46 +1325,46 @@
progress "2.0.0"
proxy-from-env "^1.0.0"
"@sentry/core@5.14.2":
version "5.14.2"
resolved "https://registry.yarnpkg.com/@sentry/core/-/core-5.14.2.tgz#950709a2281086c64f1ba60f2c3290dc81c19659"
integrity sha512-B2XjUMCmVu4H3s5hapgynhb28MSc+irt9wRI9j0Lbjx2cxsCUr/YFGL8GuEuYwf4zXNKnh2ke6t+I37OlSaGOg==
"@sentry/core@5.15.0":
version "5.15.0"
resolved "https://registry.yarnpkg.com/@sentry/core/-/core-5.15.0.tgz#46380a747faa0ac2973523de3c47b9a12f7f4c9f"
integrity sha512-ujwHMwinPwuADoIBFjh1BiC6Li7RpEG3Mmo0MxOqKm7xKngkRUk5uH5e36roORnx+ngr/3NCe80QuvSqK7gQsw==
dependencies:
"@sentry/hub" "5.14.2"
"@sentry/minimal" "5.14.2"
"@sentry/types" "5.14.2"
"@sentry/utils" "5.14.2"
"@sentry/hub" "5.15.0"
"@sentry/minimal" "5.15.0"
"@sentry/types" "5.15.0"
"@sentry/utils" "5.15.0"
tslib "^1.9.3"
"@sentry/hub@5.14.2":
version "5.14.2"
resolved "https://registry.yarnpkg.com/@sentry/hub/-/hub-5.14.2.tgz#24a0990a901d49f8a362dfd404cb7cd33e429d60"
integrity sha512-0ckTDnhCANkuY+VepMPz5vl/dkFQnWmzlJiCIxgM5fCgAF8dfNd9VhGn0qVQXnzKPGoW9zxs/uAmH3/XFqqmNA==
"@sentry/hub@5.15.0":
version "5.15.0"
resolved "https://registry.yarnpkg.com/@sentry/hub/-/hub-5.15.0.tgz#6af4e7407ff2309306e9675fce96e321371ed18f"
integrity sha512-wIDcaIuaYpg+Ma01NfFQTOnZLDCKSx2D06TTBqlo93WfMFNgyEgdMbU5Fk1PFZzjj2AMtzlc9DJzAfvt1hZx3w==
dependencies:
"@sentry/types" "5.14.2"
"@sentry/utils" "5.14.2"
"@sentry/types" "5.15.0"
"@sentry/utils" "5.15.0"
tslib "^1.9.3"
"@sentry/minimal@5.14.2":
version "5.14.2"
resolved "https://registry.yarnpkg.com/@sentry/minimal/-/minimal-5.14.2.tgz#9fa39cc6432a05aae22e892a1be3cc314c3b77c4"
integrity sha512-uih9a8KwFCQrWaGb3UxkrSntxMRT4EIlud158ZKlrsLaCOE6i08unOR4xWqlrXlKPySq16H4wjbBFQ56ogOWdQ==
"@sentry/minimal@5.15.0":
version "5.15.0"
resolved "https://registry.yarnpkg.com/@sentry/minimal/-/minimal-5.15.0.tgz#81193a588cf637dcaf0d0913ecd7b697cdebc286"
integrity sha512-VBkMfR6ahmuJrx4V51BNYd6XzGZ7GB8sfnBufMzqK6MsKe+g5oSyXeqHFd4oFC0co0YlFIw7IphF2JZLwVs0zA==
dependencies:
"@sentry/hub" "5.14.2"
"@sentry/types" "5.14.2"
"@sentry/hub" "5.15.0"
"@sentry/types" "5.15.0"
tslib "^1.9.3"
"@sentry/types@5.14.2":
version "5.14.2"
resolved "https://registry.yarnpkg.com/@sentry/types/-/types-5.14.2.tgz#43c3723b2f5b31234892fbe6a28b293ad050faac"
integrity sha512-NtB/o+/whR/mJJf67Nvdab7E2+/THgAUY114FWFqDLHMaoiIVWy9J/yLKtQWymwuQslh7zpPxjA1AhqTJerVCg==
"@sentry/types@5.15.0":
version "5.15.0"
resolved "https://registry.yarnpkg.com/@sentry/types/-/types-5.15.0.tgz#7bc101b2f1a433b0086f1ac7e00b830691814c80"
integrity sha512-MC96wUAHhzRuH3xo4Qd+EXTOap8+d+SWbAdLBukScxuwhOSY/HNRh1TW17CuAu7s1oXa7xxO2ZCdyamSZinIiQ==
"@sentry/utils@5.14.2":
version "5.14.2"
resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-5.14.2.tgz#2e812f2788a00ca4e6e35acbeb86000792f53473"
integrity sha512-DV9/kw/O8o5xqvQYwITm0lBaBqS4RKicjguWYJQ/+F94P/SKxuXor7EE0iMDYvUGslvPz8TlgB7r+nb/YRl+Fg==
"@sentry/utils@5.15.0":
version "5.15.0"
resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-5.15.0.tgz#3577c1bae0c18b53d7500538b8b6894f74ad9dd5"
integrity sha512-td+wSBdVUPO3mEPcEHZwJiVEQ0+wplJCHBvM1PHqwQd+miB2mQAaiSkzdAAHzUpTeqPBI3rzjWPn59WkCcVF5Q==
dependencies:
"@sentry/types" "5.14.2"
"@sentry/types" "5.15.0"
tslib "^1.9.3"
"@sindresorhus/is@^2.0.0":
@ -1675,6 +1675,11 @@
resolved "https://registry.yarnpkg.com/@types/node/-/node-13.9.1.tgz#96f606f8cd67fb018847d9b61e93997dabdefc72"
integrity sha512-E6M6N0blf/jiZx8Q3nb0vNaswQeEyn0XlupO+xN6DtJ6r6IT4nXrTry7zhIfYvFCl3/8Cu6WIysmUBKiqV0bqQ==
"@types/node@^13.9.3":
version "13.9.4"
resolved "https://registry.yarnpkg.com/@types/node/-/node-13.9.4.tgz#63c58e67999bfbfa688dd49ed84639b01b543606"
integrity sha512-uzaaDXey/NI2l7kU+xCgWu852Dh/zmf6ZKApc0YQEQpY4DaiZFmLN29E6SLHJfSedj3iNWAndSwfSBpEDadJfg==
"@types/parse-json@^4.0.0":
version "4.0.0"
resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0"
@ -4405,7 +4410,14 @@ escodegen@^1.11.0, escodegen@^1.9.1:
optionalDependencies:
source-map "~0.6.1"
eslint-config-prettier@^6.10.0, eslint-config-prettier@^6.7.0:
eslint-config-prettier@^6.10.1:
version "6.10.1"
resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-6.10.1.tgz#129ef9ec575d5ddc0e269667bf09defcd898642a"
integrity sha512-svTy6zh1ecQojvpbJSgH3aei/Rt7C6i090l5f2WQ4aB05lYHeZIR1qL4wZyyILTbtmnbHP5Yn8MrsOJMGa8RkQ==
dependencies:
get-stdin "^6.0.0"
eslint-config-prettier@^6.7.0:
version "6.10.0"
resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-6.10.0.tgz#7b15e303bf9c956875c948f6b21500e48ded6a7f"
integrity sha512-AtndijGte1rPILInUdHjvKEGbIV06NuvPrqlIEaEaWtbtvJh464mDeyGMdZEQMsGvC0ZVkiex1fSNcC4HAbRGg==
@ -7836,10 +7848,10 @@ no-case@^3.0.3:
lower-case "^2.0.1"
tslib "^1.10.0"
nock@^12.0.2:
version "12.0.2"
resolved "https://registry.yarnpkg.com/nock/-/nock-12.0.2.tgz#47617b34738e026b29d2294b4579e35b27e6a4d3"
integrity sha512-pTckyfP8QHvwXP/oX+zQuSIL3S/mWTd84ba4pOGZlS/FgRZyljv4C3ZyOjgMilvkydSaERML/aJEF13EBUuDTQ==
nock@^12.0.3:
version "12.0.3"
resolved "https://registry.yarnpkg.com/nock/-/nock-12.0.3.tgz#83f25076dbc4c9aa82b5cdf54c9604c7a778d1c9"
integrity sha512-QNb/j8kbFnKCiyqi9C5DD0jH/FubFGj5rt9NQFONXwQm3IPB0CULECg/eS3AU1KgZb/6SwUa4/DTRKhVxkGABw==
dependencies:
debug "^4.1.0"
json-stringify-safe "^5.0.1"
@ -9698,10 +9710,10 @@ react-helmet@^5.2.1:
react-fast-compare "^2.0.2"
react-side-effect "^1.1.0"
react-i18next@11.3.3:
version "11.3.3"
resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-11.3.3.tgz#a84dcc32e3ad013012964d836790d8c6afac8e88"
integrity sha512-sGnPwJ0Kf8qTRLTnTRk030KiU6WYEZ49rP9ILPvCnsmgEKyucQfTxab+klSYnCSKYija+CWL+yo+c9va9BmJeg==
react-i18next@11.3.4:
version "11.3.4"
resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-11.3.4.tgz#355df5fe5133e5e30302d166f529678100ffc968"
integrity sha512-IRZMD7PAM3C+fJNzRbyLNi1ZD0kc3Z3obBspJjEl+9H+ME41PhVor3BpdIqv/Rm7lUoGhMjmpu42J45ooJ61KA==
dependencies:
"@babel/runtime" "^7.3.1"
html-parse-stringify2 "2.0.1"
@ -9828,10 +9840,10 @@ react-tippy@^1.3.4:
dependencies:
popper.js "^1.11.1"
react@^16.13.0:
version "16.13.0"
resolved "https://registry.yarnpkg.com/react/-/react-16.13.0.tgz#d046eabcdf64e457bbeed1e792e235e1b9934cf7"
integrity sha512-TSavZz2iSLkq5/oiE7gnFzmURKZMltmi193rm5HEoUDAXpzT9Kzw6oNZnGoai/4+fUnm7FqS5dwgUL34TujcWQ==
react@^16.13.1:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e"
integrity sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==
dependencies:
loose-envify "^1.1.0"
object-assign "^4.1.1"