diff --git a/app/modules/home/home.scss b/app/modules/home/home.scss index 3aff4057..1aed3983 100644 --- a/app/modules/home/home.scss +++ b/app/modules/home/home.scss @@ -23,12 +23,19 @@ flex-direction: column; } } + .watching-container, .working-on-container { - margin-right: .5rem; + flex: 1; + padding-left: .5rem; padding-right: .5rem; } + .working-on-container { + margin-right: 1rem; + } .project-list { - width: 250px; + flex-basis: 250px; + flex-grow: 0; + flex-shrink: 0; } .see-more-projects-btn { display: block; diff --git a/app/modules/home/working-on/empty.scss b/app/modules/home/working-on/empty.scss index 848ffebd..28630947 100644 --- a/app/modules/home/working-on/empty.scss +++ b/app/modules/home/working-on/empty.scss @@ -3,7 +3,7 @@ margin-bottom: 4rem; p { @include font-type(light); - margin: 2rem 9rem 1rem; + margin: 2rem 2rem 1rem; text-align: center; } } @@ -34,10 +34,28 @@ background: $mass-white; height: 1rem; margin-bottom: 1rem; - width: 40vw; + width: 8vw; + @include breakpoint(laptop) { + width: 30vw; + } + @include breakpoint(tablet) { + width: 30vw; + } + @include breakpoint(mobile) { + width: 30vw; + } &:last-child { margin: 0; - width: 20vw; + width: 18vw; + @include breakpoint(laptop) { + width: 50vw; + } + @include breakpoint(tablet) { + width: 50vw; + } + @include breakpoint(mobile) { + width: 50vw; + } } } }