mirror of
https://github.com/filecoin-project/slate.git
synced 2024-12-28 19:42:01 +03:00
nav adjustments for mobile and 404 page
This commit is contained in:
parent
1531e1628a
commit
506cad42a0
@ -7,15 +7,14 @@ const STYLES_ROOT = css`
|
|||||||
position: -webkit-sticky;
|
position: -webkit-sticky;
|
||||||
position: sticky;
|
position: sticky;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
padding: 8px 88px 8px 64px;
|
padding: 8px 64px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
z-index: ${Constants.zindex.header};
|
z-index: ${Constants.zindex.header};
|
||||||
background-color: ${Constants.system.foreground};
|
background-color: ${Constants.system.foreground};
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
@media (max-width: ${Constants.sizes.mobile}px) {
|
||||||
padding: 16px 24px;
|
padding: 8px 24px;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
@ -25,11 +24,12 @@ const STYLES_CONTAINER = css`
|
|||||||
font-family: ${Constants.font.text};
|
font-family: ${Constants.font.text};
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: ${Constants.typescale.lvl0};
|
font-size: ${Constants.typescale.lvl0};
|
||||||
width: 100%;
|
line-height: 150%;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
@media (max-width: ${Constants.sizes.mobile}px) {
|
||||||
display: flex;
|
display: block;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
@ -46,16 +46,16 @@ const STYLES_LINK = css`
|
|||||||
|
|
||||||
const STYLES_LEFT = css`
|
const STYLES_LEFT = css`
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
|
text-align: left;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const STYLES_RIGHT = css`
|
const STYLES_RIGHT = css`
|
||||||
min-width: 10%;
|
min-width: 10%;
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
@media (max-width: ${Constants.sizes.mobile}px) {
|
||||||
justify-content: center;
|
justify-content: flex-start;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
@ -74,16 +74,16 @@ export const WebsitePrototypeFooter = (props) => {
|
|||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<div css={STYLES_RIGHT}>
|
<div css={STYLES_RIGHT}>
|
||||||
<a css={STYLES_LINK} href="https://twitter.com/_slate" style={{ marginRight: 24 }}>
|
<a css={STYLES_LINK} href="https://twitter.com/_slate" style={{ marginRight: 12 }}>
|
||||||
Twitter
|
Twitter
|
||||||
</a>
|
</a>
|
||||||
<a css={STYLES_LINK} href="https://filecoin.io/slack" style={{ marginRight: 24 }}>
|
<a css={STYLES_LINK} href="https://filecoin.io/slack" style={{ marginRight: 12 }}>
|
||||||
Slack
|
Slack
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
css={STYLES_LINK}
|
css={STYLES_LINK}
|
||||||
href="https://github.com/filecoin-project/slate/issues"
|
href="https://github.com/filecoin-project/slate/issues"
|
||||||
style={{ marginRight: 24 }}
|
style={{ marginRight: 12 }}
|
||||||
>
|
>
|
||||||
Contribute
|
Contribute
|
||||||
</a>
|
</a>
|
||||||
|
@ -10,7 +10,6 @@ const STYLES_ROOT = css`
|
|||||||
top: 0;
|
top: 0;
|
||||||
padding: 24px 88px 24px 64px;
|
padding: 24px 88px 24px 64px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
z-index: ${Constants.zindex.header};
|
z-index: ${Constants.zindex.header};
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user