vmario/wisemapping-frontend
1
0
Fork 0
mirror of https://bitbucket.org/wisemapping/wisemapping-frontend.git synced 2024-09-21 11:40:07 +02:00
Code Issues Packages Projects Releases Wiki Activity

bug: responsive layout for all except maps list

Browse Source
This commit is contained in:
Paulo Gustavo Veiga 2021-02-28 20:04:51 -08:00
parent eac5f73839
commit 9e0bc83f19
2 changed files with 21 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
packages/webapp/src/components/layout/header/styled.ts
View File

@ -26,30 +26,36 @@ export const StyledNav = styled.nav`
z-index: 2; z-index: 2;
} }
/* Review ....*/
.header-middle {
grid-column-start: 2;
}
.header-area-right1 {
grid-column-start: 3;
}
.header-area-right2 { .header-area-right2 {
grid-column-start: 4; grid-column-start: 3;
text-align: right;
} }
.header-area-right1 span, .header-area-right1 span,
.header-area-right2 span { .header-area-right2 span {
font-size: 15px; font-size: 15px;
} }
.header-area-content-span { .header-area-content-span {
grid-column-start: 2; grid-column-start: 2;
grid-column-end: 4; grid-column-end: 3;
text-align: right; text-align: right;
font-size: 14px; font-size: 14px;
padding: 10px; padding: 10px;
} }
@media only screen and (max-width: 600px) {
.header-area-content-span {
display: none;
grid-column-start: 2;
grid-column-end: 3;
text-align: right;
font-size: 14px;
padding: 10px;
}
}
`; `;
export const StyledDiv = styled.nav` export const StyledDiv = styled.nav`
@ -63,12 +69,12 @@ export const StyledDiv = styled.nav`
display: grid; display: grid;
white-space: nowrap; white-space: nowrap;
grid-template-columns: 200px 1fr 130px 160px 50px; grid-template-columns: 150px 1fr 160px 20px;
`; `;
export const Logo = styled.span` export const Logo = styled.span`
grid-column-start: 1; grid-column-start: 1;
margin-left: 50px; margin-left: 20px;
margin-top: 0px; margin-top: 0px;
.header-logo a { .header-logo a {

3
packages/webapp/src/theme/index.ts
View File

@ -6,7 +6,8 @@ const theme = createMuiTheme({
'@global': { '@global': {
body: { body: {
backgroundColor: 'white', backgroundColor: 'white',
minWidth: '800px' // Important: This size is the min to diplay all pages except maps list.
minWidth: '450px'
}, },
}, },
}, },