Changeset 594fbe8 in OpenWorkouts-current


Ignore:
Timestamp:
Jan 29, 2019, 1:59:43 PM (4 years ago)
Author:
Segundo Fdez <segun.2@…>
Branches:
current, feature/docs, master
Children:
67fc2ed
Parents:
22eb5de
Message:

Added profile basic ui

Location:
ow
Files:
1 added
4 edited

Legend:

Unmodified
Added
Removed
  • ow/static/css/main.css

    r22eb5de r594fbe8  
    408408  max-width: 100%;
    409409}
     410.header-content {
     411  padding: 1em 1.5em;
     412}
     413.header-content a {
     414  text-decoration: none;
     415}
     416.header-content .description {
     417  margin: 0;
     418}
     419/* logo ----------------------------------------------------------------------*/
     420.logo {
     421  font-size: 24px;
     422  font-size: 1.5rem;
     423  line-height: 1em;
     424  font-weight: 800;
     425  text-transform: uppercase;
     426  margin: 0;
     427  display: inline-block;
     428}
     429.logo span {
     430  transition: all 250ms ease-in-out;
     431}
     432.logo:hover span {
     433  color: #EE4056;
     434}
     435.logo-open {
     436  display: block;
     437  color: #EE4056;
     438}
     439.logo-work,
     440.logo-outs {
     441  color: #f8b5be;
     442}
     443/* menu navigation -----------------------------------------------------------*/
     444.nav-site {
     445  font-size: 13px;
     446  font-size: 0.8125rem;
     447}
     448.nav-site ul {
     449  list-style-type: none;
     450  padding: 0;
     451  margin: 0;
     452  display: flex;
     453  flex-direction: row;
     454  justify-content: space-between;
     455}
     456.nav-site li {
     457  border-left: 1px solid #e1e1e1;
     458  flex-grow: 1;
     459  text-align: center;
     460}
     461.nav-site a {
     462  color: #959595;
     463  padding: 1.25em;
     464  display: block;
     465}
     466.nav-site a:hover {
     467  color: #151515;
     468}
     469.nav-site .is-active a {
     470  color: #151515;
     471}
     472/* Add workout button with submenu -------------------------------------------*/
     473.add-workout {
     474  position: relative;
     475  /* submenu -------------------------------------------------------------- */
     476}
     477.add-workout > a {
     478  color: #EE4056;
     479}
     480.add-workout > a:before {
     481  content: "+";
     482  font-weight: 800;
     483  font-size: 32px;
     484  font-size: 2rem;
     485  line-height: 0;
     486  position: relative;
     487  top: 8px;
     488}
     489.add-workout > a span {
     490  display: none;
     491}
     492.add-workout > a:hover {
     493  background-color: #EE4056;
     494  color: white;
     495}
     496.add-workout:hover:after {
     497  content: "";
     498  position: absolute;
     499  background-color: white;
     500  bottom: -1px;
     501  width: 100%;
     502  height: 1px;
     503  display: block;
     504  z-index: 20;
     505}
     506.add-workout:hover ul {
     507  display: inline-block;
     508}
     509.add-workout ul {
     510  display: none;
     511  flex-direction: column;
     512  position: absolute;
     513  background-color: rgba(255, 255, 255, 0.95);
     514  right: -1px;
     515  border: 1px solid #e1e1e1;
     516  width: 153px;
     517}
     518.add-workout ul li {
     519  border-left: transparent;
     520  text-align: left;
     521}
     522.add-workout ul a:hover {
     523  background-color: #fbfbfb;
     524}
     525/* description ---------------------------------------------------------------*/
     526.description {
     527  font-size: 14px;
     528  font-size: 0.875rem;
     529  font-weight: 300;
     530  letter-spacing: 0.025em;
     531  color: #959595;
     532}
     533/* ------------------------------ STATES ------------------------------------ */
     534/* when user is login --------------------------------------------------------*/
     535.is-login .header-content {
     536  border-bottom: 1px solid #e1e1e1;
     537  display: flex;
     538  padding: 0em 1.5em;
     539  justify-content: space-between;
     540  align-items: center;
     541}
     542.is-login .description {
     543  display: none;
     544}
     545.is-login .logo-open {
     546  display: inline-block;
     547}
     548.workout-content {
     549  padding: 2em  1em;
     550}
     551@media (min-width: 480px) {
     552  .workout-content {
     553    padding: 2em 6em;
     554  }
     555}
     556@media (min-width: 800px) {
     557  .workout-content {
     558    display: flex;
     559    justify-content: space-between;
     560  }
     561}
     562/* list mode */
     563.workout-list {
     564  margin-right: 2em;
     565  width: 100%;
     566  /* provisional layout, replace this with grid layout system based on final content */
     567}
     568.workout-list > h2 {
     569  font-weight: 300;
     570  margin: 0 0 1.5em;
     571}
     572/* Module resume on dashboard workouts */
     573.workout-resume {
     574  padding: 1.5em 0;
     575  position: relative;
     576  max-width: 700px;
     577}
     578@media (min-width: 800px) {
     579  .workout-resume {
     580    padding-left: 2em;
     581    border-left: 1px solid #e1e1e1;
     582    transition: all 250ms ease-in-out;
     583  }
     584}
     585.workout-resume:hover {
     586  border-color: #151515;
     587}
     588.workout-resume:hover .workout-title:before {
     589  color: #151515;
     590}
     591.workout-resume ul {
     592  padding: 0;
     593  list-style-type: none;
     594  font-size: 13px;
     595  font-size: 0.8125rem;
     596}
     597.workout-resume ul a {
     598  display: block;
     599  text-decoration: none;
     600}
     601.bike:before {
     602  display: block;
     603  content: "";
     604  width: 30px;
     605  height: 30px;
     606  background-image: url('../media/img/bike.svg');
     607  background-size: 100%;
     608}
     609.workout-title {
     610  font-size: 14px;
     611  font-size: 0.875rem;
     612  margin: 0 0 0em 0;
     613  position: relative;
     614}
     615.workout-title:before {
     616  transition: all 250ms ease-in-out;
     617  content: "▶";
     618  position: absolute;
     619  left: -3.25em;
     620  top: 0.35em;
     621  color: #e1e1e1;
     622  font-size: 10px;
     623  font-size: 0.625rem;
     624}
     625.workout-title a {
     626  color: #151515;
     627  text-decoration: none;
     628}
     629.workout-title a:hover {
     630  color: #EE4056;
     631}
     632.workout-info {
     633  display: flex;
     634  align-items: center;
     635  margin: 0.25em 0;
     636}
     637.workout-info li {
     638  color: #959595;
     639}
     640.workout-info li:after {
     641  content: "|";
     642  margin: 0 0.5em;
     643}
     644.workout-info li:last-child:after {
     645  content: "";
     646  margin: 0;
     647}
     648.workout-map {
     649  margin-top: 1em;
     650}
     651.workout-map img {
     652  width: 100%;
     653}
     654.workout-intro {
     655  font-size: 13px;
     656  font-size: 0.8125rem;
     657  color: #151515;
     658}
     659.workout-options {
     660  display: inline-block;
     661  border: 1px solid #e1e1e1;
     662  margin-bottom: 0;
     663  border-radius: 4px;
     664  padding: 0;
     665}
     666.workout-options li {
     667  display: inline-block;
     668  border-right: 1px solid #e1e1e1;
     669}
     670.workout-options li:last-child {
     671  border-right: none;
     672}
     673.workout-options a {
     674  display: block;
     675  color: #959595;
     676  padding: 0.5em 0.75em;
     677  text-decoration: none;
     678}
     679.workout-options a:hover {
     680  color: #151515;
     681}
     682.owo-del a:hover {
     683  color: red;
     684}
     685.workout-aside {
     686  width: 100%;
     687}
     688@media (min-width: 800px) {
     689  .workout-aside {
     690    max-width: 300px;
     691    padding-left: 1.5em;
     692    border-left: 1px solid #e1e1e1;
     693  }
     694}
     695.aside-profile {
     696  margin-bottom: 1em;
     697}
     698.aside-profile img {
     699  width: 80px;
     700  height: 80px;
     701  object-fit: cover;
     702  border-radius: 50%;
     703}
     704.aside-profile h2 {
     705  font-weight: 400;
     706  font-size: 18px;
     707  font-size: 1.125rem;
     708  margin: 0 0 0.5em 0;
     709}
     710.aside-profile ul {
     711  list-style-type: none;
     712  margin: 0;
     713  padding: 0;
     714  font-size: 13px;
     715  font-size: 0.8125rem;
     716  color: #555555;
     717}
     718/* Week report */
     719.svg-cotent svg {
     720  width: 100%;
     721  height: 100%;
     722}
     723.svg-cotent .label {
     724  font-size: 13px;
     725  font-size: 0.8125rem;
     726  text-anchor: middle;
     727}
     728.svg-cotent .tick {
     729  font-size: 13px;
     730  font-size: 0.8125rem;
     731}
     732/* dashboard graphics*/
     733.x-axis path,
     734.x-axis line {
     735  fill: none;
     736  stroke: none;
     737}
     738.bar {
     739  fill: #f8b5be;
     740}
     741.bar:hover {
     742  fill: #ee4056;
     743}
     744.current {
     745  fill: #ee4056;
     746}
     747.week-stats {
     748  border: 1px solid #e1e1e1;
     749  background-color: rgba(225, 225, 225, 0.1);
     750  padding: 0.75em;
     751  border-radius: 4px;
     752  margin-bottom: 2em;
     753}
     754.week-stats h3 {
     755  margin: 0;
     756  font-size: 14px;
     757  font-size: 0.875rem;
     758}
     759.week-stats h3 + p {
     760  margin: 0.25em 0 2em 0;
     761  color: #959595;
     762  font-size: 13px;
     763  font-size: 0.8125rem;
     764}
     765.workout-activity-summary {
     766  list-style-type: none;
     767  padding: 0;
     768  margin: 0;
     769  background-color: rgba(21, 21, 21, 0.8);
     770  margin-bottom: 0.75em;
     771}
     772.workout-activity-summary li {
     773  color: #e1e1e1;
     774  border-bottom: 1px solid #959595;
     775  padding: 0.75em 1em;
     776  display: flex;
     777  justify-content: space-between;
     778}
     779.workout-activity-summary li:last-child {
     780  margin-bottom: 0;
     781  border: none;
     782}
     783.workout-activity-summary li span:first-child {
     784  font-weight: bold;
     785}
     786.workout-activity-tree {
     787  list-style-type: none;
     788  padding: 0;
     789  margin: 0;
     790  transition: all 250ms ease-in-out;
     791  font-size: 13px;
     792  font-size: 0.8125rem;
     793}
     794.workout-activity-tree > li {
     795  margin-bottom: 0.5em;
     796  padding-bottom: 0.5em;
     797  border-bottom: 1px solid #e1e1e1;
     798}
     799.workout-activity-tree a {
     800  text-decoration: none;
     801  display: block;
     802  color: #EE4056;
     803}
     804.workout-activity-tree a:hover {
     805  color: #151515;
     806}
     807.workout-activity-tree a.viewing-year {
     808  color: #151515;
     809  font-weight: 700;
     810  margin-bottom: 0.5em;
     811  font-size: 16px;
     812  font-size: 1rem;
     813}
     814.workout-activity-tree a.viewing-month {
     815  background-color: #e1e1e1;
     816  color: #151515;
     817  font-weight: 700;
     818}
     819.workout-activity-tree-year {
     820  list-style-type: none;
     821  padding: 0;
     822  margin: 0;
     823}
     824.workout-activity-tree-year > li {
     825  display: block;
     826  margin-bottom: 0.5em;
     827}
     828.workout-activity-tree-year a {
     829  display: flex;
     830  justify-content: space-between;
     831  padding: 0.5em;
     832  background-color: #fbfbfb;
     833  color: #555555;
     834}
     835.workout-activity-tree-year a:hover {
     836  background-color: #e1e1e1;
     837}
    410838.login-content {
    411839  background-image: url("../media/img/back-01.jpg");
     
    470898<a class="login-remember" href="#">Forgot your password?</a>
    471899*/
    472 .header-content {
    473   padding: 1em 1.5em;
    474 }
    475 .header-content a {
    476   text-decoration: none;
    477 }
    478 .header-content .description {
    479   margin: 0;
    480 }
    481 /* logo ----------------------------------------------------------------------*/
    482 .logo {
    483   font-size: 24px;
    484   font-size: 1.5rem;
    485   line-height: 1em;
    486   font-weight: 800;
    487   text-transform: uppercase;
    488   margin: 0;
    489   display: inline-block;
    490 }
    491 .logo span {
    492   transition: all 250ms ease-in-out;
    493 }
    494 .logo:hover span {
    495   color: #EE4056;
    496 }
    497 .logo-open {
    498   display: block;
    499   color: #EE4056;
    500 }
    501 .logo-work,
    502 .logo-outs {
    503   color: #f8b5be;
    504 }
    505 /* menu navigation -----------------------------------------------------------*/
    506 .nav-site {
    507   font-size: 13px;
    508   font-size: 0.8125rem;
    509 }
    510 .nav-site ul {
    511   list-style-type: none;
    512   padding: 0;
    513   margin: 0;
    514   display: flex;
    515   flex-direction: row;
    516   justify-content: space-between;
    517 }
    518 .nav-site li {
    519   border-left: 1px solid #e1e1e1;
    520   flex-grow: 1;
    521   text-align: center;
    522 }
    523 .nav-site a {
    524   color: #959595;
    525   padding: 1.25em;
    526   display: block;
    527 }
    528 .nav-site a:hover {
    529   color: #151515;
    530 }
    531 .nav-site .is-active a {
    532   color: #151515;
    533 }
    534 /* Add workout button with submenu -------------------------------------------*/
    535 .add-workout {
    536   position: relative;
    537   /* submenu -------------------------------------------------------------- */
    538 }
    539 .add-workout > a {
    540   color: #EE4056;
    541 }
    542 .add-workout > a:before {
    543   content: "+";
    544   font-weight: 800;
    545   font-size: 32px;
    546   font-size: 2rem;
    547   line-height: 0;
    548   position: relative;
    549   top: 8px;
    550 }
    551 .add-workout > a span {
    552   display: none;
    553 }
    554 .add-workout > a:hover {
    555   background-color: #EE4056;
    556   color: white;
    557 }
    558 .add-workout:hover:after {
    559   content: "";
    560   position: absolute;
    561   background-color: white;
    562   bottom: -1px;
    563   width: 100%;
    564   height: 1px;
    565   display: block;
    566   z-index: 20;
    567 }
    568 .add-workout:hover ul {
    569   display: inline-block;
    570 }
    571 .add-workout ul {
    572   display: none;
    573   flex-direction: column;
    574   position: absolute;
    575   background-color: rgba(255, 255, 255, 0.95);
    576   right: -1px;
    577   border: 1px solid #e1e1e1;
    578   width: 153px;
    579 }
    580 .add-workout ul li {
    581   border-left: transparent;
    582   text-align: left;
    583 }
    584 .add-workout ul a:hover {
    585   background-color: #fbfbfb;
    586 }
    587 /* description ---------------------------------------------------------------*/
    588 .description {
    589   font-size: 14px;
    590   font-size: 0.875rem;
    591   font-weight: 300;
    592   letter-spacing: 0.025em;
    593   color: #959595;
    594 }
    595 /* ------------------------------ STATES ------------------------------------ */
    596 /* when user is login --------------------------------------------------------*/
    597 .is-login .header-content {
    598   border-bottom: 1px solid #e1e1e1;
    599   display: flex;
    600   padding: 0em 1.5em;
    601   justify-content: space-between;
    602   align-items: center;
    603 }
    604 .is-login .description {
    605   display: none;
    606 }
    607 .is-login .logo-open {
    608   display: inline-block;
    609 }
    610 .workout-content {
     900.user-profile {
    611901  padding: 2em  1em;
    612902}
    613903@media (min-width: 480px) {
    614   .workout-content {
     904  .user-profile {
    615905    padding: 2em 6em;
    616906  }
    617907}
    618 @media (min-width: 800px) {
    619   .workout-content {
    620     display: flex;
    621     justify-content: space-between;
    622   }
    623 }
    624 /* list mode */
    625 .workout-list {
    626   margin-right: 2em;
    627   width: 100%;
    628   /* provisional layout, replace this with grid layout system based on final content */
    629 }
    630 .workout-list > h2 {
    631   font-weight: 300;
    632   margin: 0 0 1.5em;
    633 }
    634 /* Module resume on dashboard workouts */
    635 .workout-resume {
    636   padding: 1.5em 0;
    637   position: relative;
    638   max-width: 700px;
    639 }
    640 @media (min-width: 800px) {
    641   .workout-resume {
    642     padding-left: 2em;
    643     border-left: 1px solid #e1e1e1;
    644     transition: all 250ms ease-in-out;
    645   }
    646 }
    647 .workout-resume:hover {
    648   border-color: #151515;
    649 }
    650 .workout-resume:hover .workout-title:before {
    651   color: #151515;
    652 }
    653 .workout-resume ul {
    654   padding: 0;
    655   list-style-type: none;
    656   font-size: 13px;
    657   font-size: 0.8125rem;
    658 }
    659 .workout-resume ul a {
    660   display: block;
    661   text-decoration: none;
    662 }
    663 .bike:before {
    664   display: block;
    665   content: "";
    666   width: 30px;
    667   height: 30px;
    668   background-image: url('../media/img/bike.svg');
    669   background-size: 100%;
    670 }
    671 .workout-title {
    672   font-size: 14px;
    673   font-size: 0.875rem;
    674   margin: 0 0 0em 0;
    675   position: relative;
    676 }
    677 .workout-title:before {
    678   transition: all 250ms ease-in-out;
    679   content: "▶";
    680   position: absolute;
    681   left: -3.25em;
    682   top: 0.35em;
    683   color: #e1e1e1;
    684   font-size: 10px;
    685   font-size: 0.625rem;
    686 }
    687 .workout-title a {
    688   color: #151515;
    689   text-decoration: none;
    690 }
    691 .workout-title a:hover {
    692   color: #EE4056;
    693 }
    694 .workout-info {
    695   display: flex;
    696   align-items: center;
    697   margin: 0.25em 0;
    698 }
    699 .workout-info li {
    700   color: #959595;
    701 }
    702 .workout-info li:after {
    703   content: "|";
    704   margin: 0 0.5em;
    705 }
    706 .workout-info li:last-child:after {
    707   content: "";
    708   margin: 0;
    709 }
    710 .workout-map {
    711   margin-top: 1em;
    712 }
    713 .workout-map img {
    714   width: 100%;
    715 }
    716 .workout-intro {
    717   font-size: 13px;
    718   font-size: 0.8125rem;
    719   color: #151515;
    720 }
    721 .workout-options {
    722   display: inline-block;
    723   border: 1px solid #e1e1e1;
    724   margin-bottom: 0;
    725   border-radius: 4px;
    726 }
    727 .workout-options li {
    728   display: inline-block;
    729   border-right: 1px solid #e1e1e1;
    730 }
    731 .workout-options li:last-child {
    732   border-right: none;
    733 }
    734 .workout-options a {
    735   color: #959595;
    736   padding: 0.5em 0.75em;
    737 }
    738 .workout-options a:hover {
    739   color: #151515;
    740 }
    741 .owo-del a:hover {
    742   color: red;
    743 }
    744 .workout-aside {
    745   width: 100%;
    746 }
    747 @media (min-width: 800px) {
    748   .workout-aside {
    749     max-width: 300px;
    750     padding-left: 1.5em;
    751     border-left: 1px solid #e1e1e1;
    752   }
    753 }
    754 .aside-profile {
    755   margin-bottom: 1em;
    756 }
    757 .aside-profile img {
    758   width: 80px;
    759   height: 80px;
     908.user-profile img {
     909  width: 140px;
     910  height: 140px;
    760911  object-fit: cover;
    761912  border-radius: 50%;
    762913}
    763 .aside-profile h2 {
    764   font-weight: 400;
    765   font-size: 18px;
    766   font-size: 1.125rem;
    767   margin: 0 0 0.5em 0;
    768 }
    769 .aside-profile ul {
    770   list-style-type: none;
    771   margin: 0;
    772   padding: 0;
     914.user-profile .workout-options {
    773915  font-size: 13px;
    774916  font-size: 0.8125rem;
    775   color: #555555;
    776 }
    777 /* Week report */
    778 .svg-cotent svg {
    779   width: 100%;
    780   height: 100%;
    781 }
    782 .svg-cotent .label {
    783   font-size: 13px;
    784   font-size: 0.8125rem;
    785   text-anchor: middle;
    786 }
    787 .svg-cotent .tick {
    788   font-size: 13px;
    789   font-size: 0.8125rem;
    790 }
    791 .week-stats {
    792   border: 1px solid #e1e1e1;
    793   background-color: rgba(225, 225, 225, 0.1);
    794   padding: 0.75em;
    795   border-radius: 4px;
    796   margin-bottom: 2em;
    797 }
    798 .week-stats h3 {
    799   margin: 0;
    800   font-size: 14px;
    801   font-size: 0.875rem;
    802 }
    803 .week-stats h3 + p {
    804   margin: 0.25em 0 2em 0;
    805   color: #959595;
    806   font-size: 13px;
    807   font-size: 0.8125rem;
    808 }
    809 .workout-activity-summary {
    810   list-style-type: none;
    811   padding: 0;
    812   margin: 0;
    813   background-color: rgba(21, 21, 21, 0.8);
    814   margin-bottom: 0.75em;
    815 }
    816 .workout-activity-summary li {
    817   color: #e1e1e1;
    818   border-bottom: 1px solid #959595;
    819   padding: 0.75em 1em;
    820   display: flex;
    821   justify-content: space-between;
    822 }
    823 .workout-activity-summary li:last-child {
    824   margin-bottom: 0;
    825   border: none;
    826 }
    827 .workout-activity-summary li span:first-child {
    828   font-weight: bold;
    829 }
    830 .workout-activity-tree {
    831   list-style-type: none;
    832   padding: 0;
    833   margin: 0;
    834   transition: all 250ms ease-in-out;
    835   font-size: 13px;
    836   font-size: 0.8125rem;
    837 }
    838 .workout-activity-tree > li {
    839   margin-bottom: 0.5em;
    840   padding-bottom: 0.5em;
    841   border-bottom: 1px solid #e1e1e1;
    842 }
    843 .workout-activity-tree a {
    844   text-decoration: none;
    845   display: block;
    846   color: #EE4056;
    847 }
    848 .workout-activity-tree a:hover {
    849   color: #151515;
    850 }
    851 .workout-activity-tree a.viewing-year {
    852   color: #151515;
    853   font-weight: 700;
    854   margin-bottom: 0.5em;
    855   font-size: 16px;
    856   font-size: 1rem;
    857 }
    858 .workout-activity-tree a.viewing-month {
    859   background-color: #e1e1e1;
    860   color: #151515;
    861   font-weight: 700;
    862 }
    863 .workout-activity-tree-year {
    864   list-style-type: none;
    865   padding: 0;
    866   margin: 0;
    867 }
    868 .workout-activity-tree-year > li {
    869   display: block;
    870   margin-bottom: 0.5em;
    871 }
    872 .workout-activity-tree-year a {
    873   display: flex;
    874   justify-content: space-between;
    875   padding: 0.5em;
    876   background-color: #fbfbfb;
    877   color: #555555;
    878 }
    879 .workout-activity-tree-year a:hover {
    880   background-color: #e1e1e1;
    881917}
    882918/* Workout detail */
     
    884920  height: 50vh;
    885921}
    886 /* dashboard graphics*/
    887 .x-axis path,
    888 .x-axis line {
    889   fill: none;
    890   stroke: none;
    891 }
    892 .bar {
    893   fill: #f8b5be;
    894 }
    895 .bar:hover {
    896   fill: #ee4056;
    897 }
    898 .current {
    899   fill: #ee4056;
    900 }
  • ow/static/less/main.less

    r22eb5de r594fbe8  
    1818@import "ui/buttons.less";
    1919
    20 // Pages
    21 @import "pages/login.less";
    22 
    2320// Modules
    2421@import "modules/header.less";
    2522@import "modules/workout.less";
    2623
     24// Pages
     25@import "pages/login.less";
     26@import "pages/profile.less";
    2727
    2828
     
    3131    height: 50vh;
    3232}
    33 
    34 /* dashboard graphics*/
    35 
    36 .x-axis path, .x-axis line {
    37     fill: none;
    38     stroke: none;
    39 }
    40 
    41 .bar {
    42     fill: #f8b5be;
    43 }
    44 
    45 .bar:hover {
    46     fill: #ee4056;
    47 }
    48 
    49 .current {
    50     fill: #ee4056;
    51 }
  • ow/static/less/modules/workout.less

    r22eb5de r594fbe8  
    121121    margin-bottom: 0;
    122122    border-radius: 4px;
     123    padding: 0;
    123124    li{
    124125        display: inline-block;
     
    129130    }
    130131    a{
     132        display: block;
    131133        color: @color-main-medium;
    132134        padding: .5em .75em;
     135        text-decoration: none;
    133136        &:hover{
    134137            color: @color-main;
     
    181184
    182185/* Week report */
    183 
    184186.svg-cotent {
    185187    svg {
     
    197199
    198200}
     201
     202/* dashboard graphics*/
     203.x-axis path, .x-axis line {
     204    fill: none;
     205    stroke: none;
     206}
     207
     208.bar {
     209    fill: #f8b5be;
     210    &:hover {
     211        fill: #ee4056;
     212    }
     213}
     214
     215.current {
     216    fill: #ee4056;
     217}
     218
     219
     220
    199221.week-stats {
    200222    border: 1px solid @color-main-light;
  • ow/templates/profile.pt

    r22eb5de r594fbe8  
    2121      <h2>
    2222          <tal:fullname tal:content="context.fullname"></tal:fullname>
    23           <tal:has-nickname tal:condition="context.nickname">
    24               (<tal:nickname tal:content="context.nickname"></tal:nickname>)
    25           </tal:has-nickname>
    2623      </h2>
    27       <h3>
    28         <tal:email tal:content="context.email"></tal:email>
    29       </h3>
    30       <h4>
    31         <a href=""
     24      <p>
     25        <tal:has-nickname tal:condition="context.nickname">
     26            <tal:nickname tal:content="context.nickname"></tal:nickname>
     27        </tal:has-nickname> (<tal:email tal:content="context.email"></tal:email>)
     28      </p>
     29      <ul class="workout-options">
     30        <li><a href=""
    3231           tal:attributes="href request.resource_url(context, 'edit')"
    33            i18n:translate="">edit profile</a> |
    34         <a href=""
     32           i18n:translate="">edit profile</a></li>
     33        <li><a href=""
    3534           tal:attributes="href request.resource_url(context, 'passwd')"
    36            i18n:translate="">change password</a>
    37       </h4>
     35           i18n:translate="">change password</a></li>
     36      </ul>
     37
    3838      <div class="profile-info">
    3939        <ul>
     
    8383      <div class="month-stats js-month-stats">
    8484        <svg width="600" height="300"></svg>
    85         <div class="filters js-filters">
    86           <a href="#" class="js-distance" i18n:translate="">distance</a>
    87           <a href="#" class="js-time" i18n:translate="">time</a>
    88           <a href="#" class="js-elevation" i18n:translate="">elevation</a>
    89         </div>
     85        <ul class="filters js-filters">
     86          <li><a href="#" class="js-distance" i18n:translate="">distance</a></li>
     87          <li><a href="#" class="js-time" i18n:translate="">time</a></li>
     88          <li><a href="#" class="js-elevation" i18n:translate="">elevation</a></li>
     89        </ul>
    9090      </div>
    9191
     
    107107
    108108     var year_chart = owjs.year_chart({
    109          chart_selector: 'div.js-month-stats svg',
    110          filters_selector: 'div.js-month-stats div.js-filters a',
     109         chart_selector: '.js-month-stats svg',
     110         filters_selector: '.js-month-stats .js-filters a',
    111111         url: "${request.resource_url(context, 'yearly')}",
    112112         current_month: "${current_month}",
Note: See TracChangeset for help on using the changeset viewer.