diff --git a/client/less/map.less b/client/less/map.less
index 00bedaef73..0dcef5c7c0 100644
--- a/client/less/map.less
+++ b/client/less/map.less
@@ -219,8 +219,7 @@
> h3 {
padding-left: 40px;
padding-bottom: 10px;
- display:block;
- max-width: 535px;
+ display: block;
}
}
@@ -257,13 +256,11 @@
.challenge-block-time {
font-size: 18px;
color: #BBBBBB;
- display:block;
- margin-left: 40px;
margin-bottom: 20px;
@media (min-width: 721px) {
- margin-right: 20px;
- margin-top:-30px;
- float:right;
+ // margin-right: 20px;
+ // margin-top: -30px;
+ float: right;
}
}
diff --git a/common/app/routes/challenges/components/map/Block.jsx b/common/app/routes/challenges/components/map/Block.jsx
index b26ffdc64c..e7a9d5053c 100644
--- a/common/app/routes/challenges/components/map/Block.jsx
+++ b/common/app/routes/challenges/components/map/Block.jsx
@@ -45,6 +45,23 @@ export class Block extends PureComponent {
this.props.toggleThisPanel(eventKey);
}
+ renderHeader(isOpen, title, time, isCompleted) {
+ return (
+
+
+
+
+ { title }
+
+ ({ time })
+
+
+ );
+ }
+
renderChallenges(challenges) {
if (!Array.isArray(challenges) || !challenges.length) {
return No Challenges Found
;
@@ -71,12 +88,7 @@ export class Block extends PureComponent {
collapsible={ true }
eventKey={ dashedName || title }
expanded={ isOpen }
- header={
-
-
{ title }
- ({ time })
-
- }
+ header={ this.renderHeader(isOpen, title, time) }
id={ title }
key={ title }
onSelect={ this.handleSelect }
diff --git a/common/app/routes/challenges/components/map/Super-Block.jsx b/common/app/routes/challenges/components/map/Super-Block.jsx
index 2f6ac7cb8d..b94706e8aa 100644
--- a/common/app/routes/challenges/components/map/Super-Block.jsx
+++ b/common/app/routes/challenges/components/map/Super-Block.jsx
@@ -62,6 +62,18 @@ export class SuperBlock extends PureComponent {
);
}
+ renderHeader(isOpen, title, isCompleted) {
+ return (
+
+
+ { title }
+
+ );
+ }
+
render() {
const {
title,
@@ -76,7 +88,7 @@ export class SuperBlock extends PureComponent {
collapsible={ true }
eventKey={ dashedName || title }
expanded={ isOpen }
- header={ { title }
}
+ header={ this.renderHeader(isOpen, title) }
id={ title }
key={ dashedName || title }
onSelect={ this.handleSelect }