From 4363a2e889db7187441a45fbb7cc8457e811a89f Mon Sep 17 00:00:00 2001 From: shubhu Date: Fri, 17 Feb 2017 17:33:59 +0530 Subject: [PATCH 1/2] fixed #994 challenge cards in mobile --- assets/css/directives/challenge-tile.scss | 5 +++++ assets/css/my-dashboard/my-challenges.scss | 6 ++++-- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/assets/css/directives/challenge-tile.scss b/assets/css/directives/challenge-tile.scss index 28e6de3e3..357643b6f 100644 --- a/assets/css/directives/challenge-tile.scss +++ b/assets/css/directives/challenge-tile.scss @@ -280,6 +280,11 @@ challenge-tile .challenge.tile-view { } + @media only screen and (max-width: 768px) { + .active-challenge { + height: auto; + } + } .completed-challenge { height: 390px; display: flex; diff --git a/assets/css/my-dashboard/my-challenges.scss b/assets/css/my-dashboard/my-challenges.scss index 92dc8a5d1..94ae21b52 100644 --- a/assets/css/my-dashboard/my-challenges.scss +++ b/assets/css/my-dashboard/my-challenges.scss @@ -131,7 +131,10 @@ } .challenges { - @include horizontal-scroll; + display: flex; + flex-direction: column; + justify-content: center; + margin-left: 0; &.tile-view, &.list-view { @media only screen and (min-width: 768px) { @@ -168,7 +171,6 @@ margin-bottom: 15px; @media only screen and (max-width: 767px) { display: inline-block; - margin-left: 15px; &:first-child { margin-left: 0; From f475776cbc104659467f7f77a64b6a3137e6e69f Mon Sep 17 00:00:00 2001 From: "Dr. Sergey Pogodin" Date: Sun, 19 Feb 2017 00:28:31 +0100 Subject: [PATCH 2/2] Small correction of styling --- assets/css/directives/challenge-tile.scss | 2 ++ 1 file changed, 2 insertions(+) diff --git a/assets/css/directives/challenge-tile.scss b/assets/css/directives/challenge-tile.scss index 357643b6f..8f8adace9 100644 --- a/assets/css/directives/challenge-tile.scss +++ b/assets/css/directives/challenge-tile.scss @@ -111,6 +111,7 @@ challenge-tile .challenge.tile-view { flex-direction: column; align-items: center; justify-content: center; + padding: 12px 0; flex: 2; } @@ -283,6 +284,7 @@ challenge-tile .challenge.tile-view { @media only screen and (max-width: 768px) { .active-challenge { height: auto; + margin: auto; } } .completed-challenge { pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy