Styled the main project section for mobile

This commit is contained in:
Rohit Pai 2021-09-15 11:38:11 +01:00
parent d304149f9b
commit c323924d77
3 changed files with 38 additions and 3 deletions

2
dist/css/main.css vendored

File diff suppressed because one or more lines are too long

View File

@ -31,8 +31,6 @@
--headingFS: 1.5rem; --headingFS: 1.5rem;
} }
/**** Media Queries *****/ /**** Media Queries *****/
@media screen and (max-width: 90em) { @media screen and (max-width: 90em) {
@ -249,6 +247,42 @@
section#curriculumvitae .cvGrid { section#curriculumvitae .cvGrid {
padding: 0; padding: 0;
} }
/**** Projects Styles ***/
section#projects {
flex-direction: column;
justify-content: center;
align-items: center;
padding: 0;
}
section#projects .mainProj {
border-right: 0;
padding: 0;
width: 100%;
margin: 0 5em;
}
section#projects .mainProj img {
padding-right: 1em;
gap: 1em;
}
section#projects .mainProj, section#projects .otherProj {
align-items: unset;
}
section#projects .mainProj .flexRow {
flex-direction: column;
margin: 0 2.5em;
}
section#projects .mainProj .flexCol {
flex-direction: row;
justify-content: center;
align-items: center;
}
} }
@media screen and (max-width: 55em) { @media screen and (max-width: 55em) {

View File

@ -32,6 +32,7 @@ section#projects .mainProj img, section#projects .otherProj .oProjItem img {
} }
section#projects .mainProj img { section#projects .mainProj img {
width: 100%;
max-width: 30rem; max-width: 30rem;
} }