Merge branch 'master' into v0.3.0

fittrackee_client/src/components/Activity/ActivityDisplay/index.jsx

@@ -155,7 +155,9 @@ class ActivityDisplay extends React.Component {
                         <div className="card-body">
                           <div className="row">
                             <div className="col">
-                              <div className="chart-title">Chart</div>
+                              <div className="chart-title">
+                                {t('activities:Chart')}
+                              </div>
                               <ActivityCharts
                                 activity={activity}
                                 dataType={dataType}

fittrackee_client/src/components/Activity/ActivityForms/FormWithoutGpx.jsx

@@ -6,17 +6,18 @@ import {
   editActivity,
 } from '../../../actions/activities'
 import { history } from '../../../index'
+import { getDateWithTZ } from '../../../utils'
 import { formatActivityDate, translateSports } from '../../../utils/activities'
 
 function FormWithoutGpx(props) {
-  const { activity, onAddOrEdit, sports, t } = props
+  const { activity, onAddOrEdit, sports, t, user } = props
   const translatedSports = translateSports(sports, t, true)
   let activityDate,
     activityTime,
     sportId = ''
   if (activity) {
     const activityDateTime = formatActivityDate(
-      activity.activity_date,
+      getDateWithTZ(activity.activity_date, user.timezone),
       'yyyy-MM-dd'
     )
     activityDate = activityDateTime.activity_date
@@ -133,7 +134,9 @@ function FormWithoutGpx(props) {
 }
 
 export default connect(
-  () => ({}),
+  state => ({
+    user: state.user,
+  }),
   dispatch => ({
     onAddOrEdit: (e, activity) => {
       const d = e.target.form.duration.value.split(':')

fittrackee_client/src/components/App.css

@@ -296,7 +296,11 @@ label {
 }
 
 .dropdown-item-selected {
-    font-weight: bold;
+  font-weight: bold;
+}
+
+.dropdown-item-selected::after {
+  content: " ✔";
 }
 
 .fa-question-circle {
@@ -341,10 +345,6 @@ label {
   color: lightgrey;
 }
 
-.img-disabled {
-  opacity: .4;
-}
-
 .leaflet-container {
   height: 400px;
 }
@@ -594,3 +594,11 @@ label {
   flex-basis: calc(100%/7);
   width: calc(100%/7);
 }
+
+.calendar .body .img-disabled {
+  opacity: .4;
+}
+
+.calendar .body .weekend {
+  background: #f5f5f5;
+}

fittrackee_client/src/components/Dashboard/Calendar.jsx

@@ -92,7 +92,7 @@ class Calendar extends React.Component {
   }
 
   renderCells() {
-    const { currentMonth, startDate, endDate } = this.state
+    const { currentMonth, startDate, endDate, weekStartOnMonday } = this.state
     const { sports } = this.props
 
     const dateFormat = 'd'
@@ -106,40 +106,45 @@ class Calendar extends React.Component {
       for (let i = 0; i < 7; i++) {
         formattedDate = format(day, dateFormat)
         const dayActivities = this.filterActivities(day)
-        const isDisabled = isSameMonth(day, currentMonth) ? '' : 'disabled'
+        const isDisabled = isSameMonth(day, currentMonth) ? '' : '-disabled'
+        const isWeekEnd = weekStartOnMonday
+          ? [5, 6].includes(i)
+          : [0, 6].includes(i)
         days.push(
-          <div className={`col cell img-${isDisabled}`} key={day}>
-            <span className="number">{formattedDate}</span>
-            {dayActivities.map(act => (
-              <Link key={act.id} to={`/activities/${act.id}`}>
-                <Fragment>
-                  <img
-                    alt="activity sport logo"
-                    className={`activity-sport ${isDisabled}`}
-                    src={sports
-                      .filter(s => s.id === act.sport_id)
-                      .map(s => s.img)}
-                    title={act.title}
-                  />
-                  {act.records.length > 0 && (
-                    <sup>
-                      <i
-                        className="fa fa-trophy custom-fa-small"
-                        aria-hidden="true"
-                        title={act.records.map(
-                          rec =>
-                            ` ${
-                              recordsLabels.filter(
-                                r => r.record_type === rec.record_type
-                              )[0].label
-                            }`
-                        )}
-                      />
-                    </sup>
-                  )}
-                </Fragment>
-              </Link>
-            ))}
+          <div className={`col cell ${isWeekEnd ? ' weekend' : ''}`} key={day}>
+            <div className={`img${isDisabled}`}>
+              <span className="number">{formattedDate}</span>
+              {dayActivities.map(act => (
+                <Link key={act.id} to={`/activities/${act.id}`}>
+                  <Fragment>
+                    <img
+                      alt="activity sport logo"
+                      className={`activity-sport ${isDisabled}`}
+                      src={sports
+                        .filter(s => s.id === act.sport_id)
+                        .map(s => s.img)}
+                      title={act.title}
+                    />
+                    {act.records.length > 0 && (
+                      <sup>
+                        <i
+                          className="fa fa-trophy custom-fa-small"
+                          aria-hidden="true"
+                          title={act.records.map(
+                            rec =>
+                              ` ${
+                                recordsLabels.filter(
+                                  r => r.record_type === rec.record_type
+                                )[0].label
+                              }`
+                          )}
+                        />
+                      </sup>
+                    )}
+                  </Fragment>
+                </Link>
+              ))}
+            </div>
           </div>
         )
         day = addDays(day, 1)