Changeset ffd6bb5 in OpenWorkouts-current for ow/static

Timestamp:

Feb 4, 2019, 5:48:44 PM (5 years ago)

Author:

Segundo Fdez <segun.2@…>

Branches:

current, feature/docs, master

Children:

d24a64a

Parents:

d52ba50

Message:

update profile header ui

Location:

ow/static

Files:

• css/main.css (modified) (5 diffs)
• less/modules/workout.less (modified) (1 diff)
• less/pages/profile.less (modified) (4 diffs)

ow/static/css/main.css

@@ -663 +663 @@
   border-radius: 4px;
   padding: 0;
+  width: auto;
 }
 .workout-options li {
@@ -1009 +1010 @@
   font-size: 13px;
   font-size: 0.8125rem;
+  margin-right: 2em;
 }
 .user-profile-account {
@@ -1018 +1020 @@
     padding: 2em 6em;
   }
+}
+.user-profile-account > div {
+  display: flex;
+  align-items: center;
 }
 .user-profile-account img {
@@ -1025 +1031 @@
   border-radius: 50%;
   margin-bottom: 0.5em;
+  margin-right: 1em;
 }
 .user-profile-account h2 {
@@ -1050 +1057 @@
   font-size: 14px;
   font-size: 0.875rem;
+  background-color: white;
+  padding: 0.5em 0.75em;
+  border-radius: 4px;
+  border: 1px solid #e1e1e1;
+  max-width: 200px;
 }
 .profile-data li {
-  margin-bottom: 0.25em;
+  display: flex;
+  justify-content: space-between;
+  color: #959595;
+}
+.profile-data li:not(:last-child) {
+  margin-bottom: 0.5em;
+  padding-bottom: 0.5em;
+  border-bottom: 1px solid #e1e1e1;
+}
+.profile-data li span {
+  font-weight: bold;
+  color: #151515;
 }
 .profile-bio {
-  margin: 1em 0;
+  margin: 0.5em 0;
+  font-size: 14px;
+  font-size: 0.875rem;
 }
 .month-stats,
 .latest-workouts {
-  max-width: 40vw;
-  margin: 0 auto;
+  max-width: 700px;
+}
+.month-stats {
+  margin-bottom: 4em;
 }
 .latest-workouts h4 {

ow/static/less/modules/workout.less

@@ -122 +122 @@
     border-radius: 4px;
     padding: 0;
+    width: auto;
     li{
         display: inline-block;

ow/static/less/pages/profile.less

@@ -2 +2 @@
     .workout-options {
         .font-size(13);
+                margin-right: 2em;
     }
 }
@@ -11 +12 @@
         padding: 2em 6em;
     }
+    >div {
+        display: flex;
+        align-items: center;
+    }
     img {
         width: 140px;
@@ -17 +22 @@
         border-radius: 50%;
         margin-bottom: .5em;
+        margin-right: 1em;
     }
         h2 {
@@ -40 +46 @@
         padding: 0;
         .font-size(14);
+        background-color: white;
+        padding: .5em .75em;
+        border-radius: 4px;
+        border: 1px solid @color-main-light;
+        max-width: 200px;
         li {
-                margin-bottom: .25em;
+                display: flex;
+                justify-content: space-between;
+                color: @color-main-medium;
+                &:not(:last-child) {
+                        margin-bottom: .5em;
+                        padding-bottom: .5em;
+                        border-bottom: 1px solid @color-main-light;
+                }
+                span {
+                        font-weight: bold;
+                        color: @color-main;
+                }
         }
 }
 
 .profile-bio {
-        margin: 1em 0;
+        margin: .5em 0;
+        .font-size(14);
 }
 
 .month-stats,
 .latest-workouts {
-        max-width: 40vw;
-        margin: 0 auto;
+        max-width: 700px
+}
+
+.month-stats {
+        margin-bottom: 4em;
 }