diff --git a/src/components/InstanceCard.vue b/src/components/InstanceCard.vue index 8c207ca..2c765c8 100644 --- a/src/components/InstanceCard.vue +++ b/src/components/InstanceCard.vue @@ -190,27 +190,25 @@ } @media screen and (max-width: $responsive-screen) { - .root { - width: auto; - flex-direction: column; - padding: 15px 10px; + width: auto; + flex-direction: column; + padding: 15px; - .left { - width: auto; - margin-right: 0; + .left { + width: auto; + margin-right: 0; + } + + .right { + margin-top: 20px; + + .follow, + .languages { + margin-bottom: 5px; } - .right { + .link { margin-top: 20px; - - .follow, - .languages { - margin-bottom: 5px; - } - - .link { - margin-top: 20px; - } } } } diff --git a/src/scss/main.scss b/src/scss/main.scss index 2e17fc7..bd9d275 100644 --- a/src/scss/main.scss +++ b/src/scss/main.scss @@ -155,6 +155,10 @@ p > a { height: 3px; background-color: $orange; flex-grow: 1; + + @media screen and (max-width: $small-screen) { + display: none; + } } } @@ -175,7 +179,12 @@ p > a { } @media screen and (max-width: $small-screen) { - margin: 50px 0 30px 0; + margin: 75px 0 30px 0; + font-size: 25px; + + .brand-title { + height: 30px; + } } } @@ -188,6 +197,7 @@ p > a { @media screen and (max-width: $responsive-screen) { white-space: normal; + margin-top: 50px; } } diff --git a/src/views/Hall-Of-Fame.vue b/src/views/Hall-Of-Fame.vue index d0cffa0..91f537f 100644 --- a/src/views/Hall-Of-Fame.vue +++ b/src/views/Hall-Of-Fame.vue @@ -611,6 +611,17 @@ } } } + + @media screen and (max-width: $small-screen) { + .sponsors a img { + width: 100%; + height: auto; + } + + ul li { + display: block; + } + } } diff --git a/src/views/Help.vue b/src/views/Help.vue index aca24ca..8ac2091 100644 --- a/src/views/Help.vue +++ b/src/views/Help.vue @@ -127,6 +127,7 @@ .text-block { text-align: right; + width: 100%; p { margin-bottom: 0; @@ -153,6 +154,10 @@ } @media screen and (max-width: $small-screen) { + .title-block { + margin-bottom: 60px; + } + .blocks { width: auto; } @@ -160,6 +165,11 @@ .block-with-image { flex-direction: column; + &.community, + &.contribute { + flex-direction: column-reverse; + } + .text-block { margin-left: 0 !important; } diff --git a/src/views/Home.vue b/src/views/Home.vue index ab38eac..7abc7cd 100644 --- a/src/views/Home.vue +++ b/src/views/Home.vue @@ -401,7 +401,7 @@ .brand { height: 47px; margin-bottom: 20px; - margin-left: -30px; + margin-left: -10px; } div { @@ -411,18 +411,18 @@ .description { font-size: 24px; font-weight: 600; + text-align: center; } @media screen and (max-width: $small-screen) { - padding: 15px 0; + padding: 40px 0 0 0; .brand { - height: 25px !important + height: 50px !important } .description { font-size: 20px; - margin-left: 20px; } } } diff --git a/src/views/Instances.vue b/src/views/Instances.vue index 29b5f69..eb8d444 100644 --- a/src/views/Instances.vue +++ b/src/views/Instances.vue @@ -15,7 +15,7 @@ -