diff options
Diffstat (limited to 'assets/scss/web')
| -rw-r--r-- | assets/scss/web/_base.scss | 5 | ||||
| -rw-r--r-- | assets/scss/web/_work.scss | 83 |
2 files changed, 34 insertions, 54 deletions
diff --git a/assets/scss/web/_base.scss b/assets/scss/web/_base.scss index cd56020..0789eb5 100644 --- a/assets/scss/web/_base.scss +++ b/assets/scss/web/_base.scss @@ -45,11 +45,6 @@ body { } } -main { - margin-left: 0.5cm; - margin-right: 0.5cm; -} - a { &:link, &:visited, &:active { text-decoration-color: $secondaryColor; diff --git a/assets/scss/web/_work.scss b/assets/scss/web/_work.scss index 0bb807e..811da2f 100644 --- a/assets/scss/web/_work.scss +++ b/assets/scss/web/_work.scss @@ -4,35 +4,41 @@ } .work__header { + margin-bottom: 1.5rem; } -.work__experience { +.work__company { + margin-top: -1.5rem; + display: flex; + flex-flow: row wrap; + justify-content: space-between; + @media (max-width: 780px) { + flex-flow: column wrap; + } + + // Add horizontal line after each work experience &:after { - display: flex; + display: block; + flex: 1 100%; content: ""; border-bottom: 1px solid; - margin: auto; - max-width: 75%; + margin-top: 1.5rem; + margin-bottom: 1.5rem; + margin-left: auto; + margin-right: auto; + max-width: 80%; } + + // Remove the extra horizontal line after the last work article &:last-of-type:after { - // remove the extra horizontal line after the last work__experience display: none; } } -.job-position { - display: flex; - flex-flow: row wrap; - justify-content: space-between; - @media (max-width: 780px) { - flex-flow: column wrap; - } -} - -.job-position__company, -.job-position__title, -.job-position__duration, -.job-position__location { +.work__company__name, +.work__company__location, +.work__company__position__title, +.work__company__position__duration { min-width: 50%; @media (max-width: 812px) { @media (orientation: landscape) { @@ -41,34 +47,13 @@ } } -.job-position__company { - order: 0; - margin-bottom: 0; +.work__company__name { + margin-bottom: 0%; font-size: 1.5rem; } -.job-position__title { - order: 2; - text-align: left; - align-self: flex-start; - @media (max-width: 780px) { - order: 1; - } -} - -.job-position__duration { - order: 1; - text-align: right; - align-self: flex-end; - @media (max-width: 780px) { - order: 2; - text-align: left; - align-self: flex-start; - } -} - -.job-position__location { - order: 3; +.work__company__location, +.work__company__position__duration { text-align: right; align-self: flex-end; @media (max-width: 780px) { @@ -77,15 +62,15 @@ } } -.note { +.work__company__note { max-width: 93%; margin-top: 0.6rem; margin-bottom: 0.6rem; } -.tasks { +.work__company__tasks { max-width: 90%; - margin-top: 0.4rem; + margin-bottom: 0%; @media (max-width: 812px) { max-width: 99%; @@ -101,7 +86,7 @@ } } -.footnote { - margin-bottom: 0.8rem; - font-size: 0.8rem; +.work__company__footnote { + min-width: 100%; + font-size: 0.9rem; } |
