Changes in / [d0fc76b:26220ba] in OpenWorkouts-current


Ignore:
Location:
ow
Files:
3 added
23 deleted
6 edited

Legend:

Unmodified
Added
Removed

  • ow/static/css/main.css

    rd0fc76b r26220ba  
     1img,legend {
     2    border:0
     3}
     4
     5legend,td,th {
     6    padding:0
     7}
     8
     9.add-workout,.button,sub,sup {
     10    position:relative
     11}
     12
     13.button,.header-content a,.workout-resume ul a,.workout-title a {
     14    text-decoration:none
     15}
     16
    117@font-face {
    2   font-family: 'Open Sans';
    3   font-style: italic;
    4   font-weight: 300;
    5   src: local('Open Sans Light Italic'), local('OpenSans-LightItalic'), url(http://fonts.gstatic.com/s/opensans/v15/memnYaGs126MiZpBA-UFUKWyV9hrIqY.ttf) format('truetype');
    6 }
     18    font-family:'Open Sans';
     19    font-style:normal;
     20    font-weight:300;
     21    src:local('Open Sans Light'),local('OpenSans-Light'),url(http://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTYnF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
     22}
     23
    724@font-face {
    8   font-family: 'Open Sans';
    9   font-style: italic;
    10   font-weight: 400;
    11   src: local('Open Sans Italic'), local('OpenSans-Italic'), url(http://fonts.gstatic.com/s/opensans/v15/mem6YaGs126MiZpBA-UFUK0Zdcg.ttf) format('truetype');
    12 }
     25    font-family:'Open Sans';
     26    font-style:normal;
     27    font-weight:400;
     28    src:local('Open Sans'),local('OpenSans'),url(http://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')
     29}
     30
    1331@font-face {
    14   font-family: 'Open Sans';
    15   font-style: italic;
    16   font-weight: 700;
    17   src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'), url(http://fonts.gstatic.com/s/opensans/v15/memnYaGs126MiZpBA-UFUKWiUNhrIqY.ttf) format('truetype');
    18 }
     32    font-family:'Open Sans';
     33    font-style:normal;
     34    font-weight:700;
     35    src:local('Open Sans Bold'),local('OpenSans-Bold'),url(http://fonts.gstatic.com/s/opensans/v13/k3k702ZOKiLJc3WVjuplzInF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
     36}
     37
    1938@font-face {
    20   font-family: 'Open Sans';
    21   font-style: normal;
    22   font-weight: 300;
    23   src: local('Open Sans Light'), local('OpenSans-Light'), url(http://fonts.gstatic.com/s/opensans/v15/mem5YaGs126MiZpBA-UN_r8OUuhs.ttf) format('truetype');
    24 }
     39    font-family:'Open Sans';
     40    font-style:normal;
     41    font-weight:800;
     42    src:local('Open Sans Extrabold'),local('OpenSans-Extrabold'),url(http://fonts.gstatic.com/s/opensans/v13/EInbV5DfGHOiMmvb1Xr-honF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
     43}
     44
    2545@font-face {
    26   font-family: 'Open Sans';
    27   font-style: normal;
    28   font-weight: 400;
    29   src: local('Open Sans Regular'), local('OpenSans-Regular'), url(http://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0e.ttf) format('truetype');
    30 }
     46    font-family:'Open Sans';
     47    font-style:italic;
     48    font-weight:300;
     49    src:local('Open Sans Light Italic'),local('OpenSansLight-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxrfB31yxOzP-czbf6AAKCVo.ttf) format('truetype')
     50}
     51
    3152@font-face {
    32   font-family: 'Open Sans';
    33   font-style: normal;
    34   font-weight: 700;
    35   src: local('Open Sans Bold'), local('OpenSans-Bold'), url(http://fonts.gstatic.com/s/opensans/v15/mem5YaGs126MiZpBA-UN7rgOUuhs.ttf) format('truetype');
    36 }
     53    font-family:'Open Sans';
     54    font-style:italic;
     55    font-weight:400;
     56    src:local('Open Sans Italic'),local('OpenSans-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/xjAJXh38I15wypJXxuGMBp0EAVxt0G0biEntp43Qt6E.ttf) format('truetype')
     57}
     58
    3759@font-face {
    38   font-family: 'Open Sans';
    39   font-style: normal;
    40   font-weight: 800;
    41   src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(http://fonts.gstatic.com/s/opensans/v15/mem5YaGs126MiZpBA-UN8rsOUuhs.ttf) format('truetype');
    42 }
    43 /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
    44 /* Document
    45    ========================================================================== */
    46 /**
    47  * 1. Correct the line height in all browsers.
    48  * 2. Prevent adjustments of font size after orientation changes in iOS.
    49  */
     60    font-family:'Open Sans';
     61    font-style:italic;
     62    font-weight:700;
     63    src:local('Open Sans Bold Italic'),local('OpenSans-BoldItalic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxp_TkvowlIOtbR7ePgFOpF4.ttf) format('truetype')
     64}
     65
    5066html {
    51   line-height: 1.15;
    52   /* 1 */
    53   -webkit-text-size-adjust: 100%;
    54   /* 2 */
    55 }
    56 /* Sections
    57    ========================================================================== */
    58 /**
    59  * Remove the margin in all browsers.
    60  */
     67    font-family:sans-serif;
     68    -ms-text-size-adjust:100%;
     69    -webkit-text-size-adjust:100%;
     70    box-sizing:border-box
     71}
     72
     73article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
     74    display:block
     75}
     76
     77audio,canvas,progress,video {
     78    display:inline-block;
     79    vertical-align:baseline
     80}
     81
     82audio:not([controls]) {
     83    display:none;
     84    height:0
     85}
     86
     87.hide,[hidden],template {
     88    display:none
     89}
     90
     91a {
     92    background-color:transparent
     93}
     94
     95a:active,a:hover {
     96    outline:0
     97}
     98
     99abbr[title] {
     100    border-bottom:1px dotted
     101}
     102
     103b,optgroup,strong {
     104    font-weight:700
     105}
     106
     107dfn {
     108    font-style:italic
     109}
     110
     111h1 {
     112    font-size:2em;
     113    margin:.67em 0
     114}
     115
     116mark {
     117    background:#ff0;
     118    color:#000
     119}
     120
     121small {
     122    font-size:80%
     123}
     124
     125sub,sup {
     126    font-size:75%;
     127    line-height:0;
     128    vertical-align:baseline
     129}
     130
     131sup {
     132    top:-.5em
     133}
     134
     135sub {
     136    bottom:-.25em
     137}
     138
     139svg:not(:root) {
     140    overflow:hidden
     141}
     142
     143figure {
     144    margin:1em 40px
     145}
     146
     147hr {
     148    box-sizing:content-box;
     149    height:0
     150}
     151
     152pre,textarea {
     153    overflow:auto
     154}
     155
     156code,kbd,pre,samp {
     157    font-family:monospace,monospace;
     158    font-size:1em
     159}
     160
     161button,input,optgroup,select,textarea {
     162    color:inherit;
     163    font:inherit;
     164    margin:0
     165}
     166
     167button {
     168    overflow:visible
     169}
     170
     171button,select {
     172    text-transform:none
     173}
     174
     175button,html input[type=button],input[type=reset],input[type=submit] {
     176    -webkit-appearance:button;
     177    cursor:pointer
     178}
     179
     180button[disabled],html input[disabled] {
     181    cursor:default
     182}
     183
     184button::-moz-focus-inner,input::-moz-focus-inner {
     185    border:0;
     186    padding:0
     187}
     188
     189input {
     190    line-height:normal
     191}
     192
     193input[type=checkbox],input[type=radio] {
     194    box-sizing:border-box;
     195    padding:0
     196}
     197
     198input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
     199    height:auto
     200}
     201
     202input[type=search] {
     203    -webkit-appearance:textfield;
     204    box-sizing:content-box
     205}
     206
     207input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
     208    -webkit-appearance:none
     209}
     210
     211fieldset {
     212    border:1px solid silver;
     213    margin:0 2px;
     214    padding:.35em .625em .75em
     215}
     216
     217table {
     218    border-collapse:collapse;
     219    border-spacing:0
     220}
     221
    61222body {
    62   margin: 0;
    63 }
    64 /**
    65  * Render the `main` element consistently in IE.
    66  */
    67 main {
    68   display: block;
    69 }
    70 /**
    71  * Correct the font size and margin on `h1` elements within `section` and
    72  * `article` contexts in Chrome, Firefox, and Safari.
    73  */
    74 h1 {
    75   font-size: 2em;
    76   margin: 0.67em 0;
    77 }
    78 /* Grouping content
    79    ========================================================================== */
    80 /**
    81  * 1. Add the correct box sizing in Firefox.
    82  * 2. Show the overflow in Edge and IE.
    83  */
    84 hr {
    85   box-sizing: content-box;
    86   /* 1 */
    87   height: 0;
    88   /* 1 */
    89   overflow: visible;
    90   /* 2 */
    91 }
    92 /**
    93  * 1. Correct the inheritance and scaling of font size in all browsers.
    94  * 2. Correct the odd `em` font sizing in all browsers.
    95  */
    96 pre {
    97   font-family: monospace, monospace;
    98   /* 1 */
    99   font-size: 1em;
    100   /* 2 */
    101 }
    102 /* Text-level semantics
    103    ========================================================================== */
    104 /**
    105  * Remove the gray background on active links in IE 10.
    106  */
    107 a {
    108   background-color: transparent;
    109 }
    110 /**
    111  * 1. Remove the bottom border in Chrome 57-
    112  * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
    113  */
    114 abbr[title] {
    115   border-bottom: none;
    116   /* 1 */
    117   text-decoration: underline;
    118   /* 2 */
    119   text-decoration: underline dotted;
    120   /* 2 */
    121 }
    122 /**
    123  * Add the correct font weight in Chrome, Edge, and Safari.
    124  */
    125 b,
    126 strong {
    127   font-weight: bolder;
    128 }
    129 /**
    130  * 1. Correct the inheritance and scaling of font size in all browsers.
    131  * 2. Correct the odd `em` font sizing in all browsers.
    132  */
    133 code,
    134 kbd,
    135 samp {
    136   font-family: monospace, monospace;
    137   /* 1 */
    138   font-size: 1em;
    139   /* 2 */
    140 }
    141 /**
    142  * Add the correct font size in all browsers.
    143  */
    144 small {
    145   font-size: 80%;
    146 }
    147 /**
    148  * Prevent `sub` and `sup` elements from affecting the line height in
    149  * all browsers.
    150  */
    151 sub,
    152 sup {
    153   font-size: 75%;
    154   line-height: 0;
    155   position: relative;
    156   vertical-align: baseline;
    157 }
    158 sub {
    159   bottom: -0.25em;
    160 }
    161 sup {
    162   top: -0.5em;
    163 }
    164 /* Embedded content
    165    ========================================================================== */
    166 /**
    167  * Remove the border on images inside links in IE 10.
    168  */
    169 img {
    170   border-style: none;
    171 }
    172 /* Forms
    173    ========================================================================== */
    174 /**
    175  * 1. Change the font styles in all browsers.
    176  * 2. Remove the margin in Firefox and Safari.
    177  */
    178 button,
    179 input,
    180 optgroup,
    181 select,
    182 textarea {
    183   font-family: inherit;
    184   /* 1 */
    185   font-size: 100%;
    186   /* 1 */
    187   line-height: 1.15;
    188   /* 1 */
    189   margin: 0;
    190   /* 2 */
    191 }
    192 /**
    193  * Show the overflow in IE.
    194  * 1. Show the overflow in Edge.
    195  */
    196 button,
    197 input {
    198   /* 1 */
    199   overflow: visible;
    200 }
    201 /**
    202  * Remove the inheritance of text transform in Edge, Firefox, and IE.
    203  * 1. Remove the inheritance of text transform in Firefox.
    204  */
    205 button,
    206 select {
    207   /* 1 */
    208   text-transform: none;
    209 }
    210 /**
    211  * Correct the inability to style clickable types in iOS and Safari.
    212  */
    213 button,
    214 [type="button"],
    215 [type="reset"],
    216 [type="submit"] {
    217   -webkit-appearance: button;
    218 }
    219 /**
    220  * Remove the inner border and padding in Firefox.
    221  */
    222 button::-moz-focus-inner,
    223 [type="button"]::-moz-focus-inner,
    224 [type="reset"]::-moz-focus-inner,
    225 [type="submit"]::-moz-focus-inner {
    226   border-style: none;
    227   padding: 0;
    228 }
    229 /**
    230  * Restore the focus styles unset by the previous rule.
    231  */
    232 button:-moz-focusring,
    233 [type="button"]:-moz-focusring,
    234 [type="reset"]:-moz-focusring,
    235 [type="submit"]:-moz-focusring {
    236   outline: 1px dotted ButtonText;
    237 }
    238 /**
    239  * Correct the padding in Firefox.
    240  */
    241 fieldset {
    242   padding: 0.35em 0.75em 0.625em;
    243 }
    244 /**
    245  * 1. Correct the text wrapping in Edge and IE.
    246  * 2. Correct the color inheritance from `fieldset` elements in IE.
    247  * 3. Remove the padding so developers are not caught out when they zero out
    248  *    `fieldset` elements in all browsers.
    249  */
    250 legend {
    251   box-sizing: border-box;
    252   /* 1 */
    253   color: inherit;
    254   /* 2 */
    255   display: table;
    256   /* 1 */
    257   max-width: 100%;
    258   /* 1 */
    259   padding: 0;
    260   /* 3 */
    261   white-space: normal;
    262   /* 1 */
    263 }
    264 /**
    265  * Add the correct vertical alignment in Chrome, Firefox, and Opera.
    266  */
    267 progress {
    268   vertical-align: baseline;
    269 }
    270 /**
    271  * Remove the default vertical scrollbar in IE 10+.
    272  */
    273 textarea {
    274   overflow: auto;
    275 }
    276 /**
    277  * 1. Add the correct box sizing in IE 10.
    278  * 2. Remove the padding in IE 10.
    279  */
    280 [type="checkbox"],
    281 [type="radio"] {
    282   box-sizing: border-box;
    283   /* 1 */
    284   padding: 0;
    285   /* 2 */
    286 }
    287 /**
    288  * Correct the cursor style of increment and decrement buttons in Chrome.
    289  */
    290 [type="number"]::-webkit-inner-spin-button,
    291 [type="number"]::-webkit-outer-spin-button {
    292   height: auto;
    293 }
    294 /**
    295  * 1. Correct the odd appearance in Chrome and Safari.
    296  * 2. Correct the outline style in Safari.
    297  */
    298 [type="search"] {
    299   -webkit-appearance: textfield;
    300   /* 1 */
    301   outline-offset: -2px;
    302   /* 2 */
    303 }
    304 /**
    305  * Remove the inner padding in Chrome and Safari on macOS.
    306  */
    307 [type="search"]::-webkit-search-decoration {
    308   -webkit-appearance: none;
    309 }
    310 /**
    311  * 1. Correct the inability to style clickable types in iOS and Safari.
    312  * 2. Change font properties to `inherit` in Safari.
    313  */
    314 ::-webkit-file-upload-button {
    315   -webkit-appearance: button;
    316   /* 1 */
    317   font: inherit;
    318   /* 2 */
    319 }
    320 /* Interactive
    321    ========================================================================== */
    322 /*
    323  * Add the correct display in Edge, IE 10+, and Firefox.
    324  */
    325 details {
    326   display: block;
    327 }
    328 /*
    329  * Add the correct display in all browsers.
    330  */
    331 summary {
    332   display: list-item;
    333 }
    334 /* Misc
    335    ========================================================================== */
    336 /**
    337  * Add the correct display in IE 10+.
    338  */
    339 template {
    340   display: none;
    341 }
    342 /**
    343  * Add the correct display in IE 10.
    344  */
    345 [hidden] {
    346   display: none;
    347 }
    348 .hidden,
    349 .hide {
    350   display: none;
    351 }
    352 body {
    353   font-family: 'Open Sans', sans-serif;
    354 }
    355 html {
    356   box-sizing: border-box;
    357 }
    358 *,
    359 *:before,
    360 *:after {
    361   box-sizing: inherit;
    362 }
    363 /* Generic default forms */
    364 form {
    365   width: 100%;
    366 }
    367 legend {
    368   display: none;
    369 }
    370 fieldset {
    371   border: none;
    372   padding: 0;
    373 }
    374 fieldset > div {
    375   margin-bottom: 1.5em;
    376 }
    377 label {
    378   display: block;
    379   font-size: 13px;
    380   margin-bottom: 0.25em;
    381 }
    382 input {
    383   width: 100%;
    384   padding: 0.5em 0.75em;
    385   border: 1px solid transparent;
    386   border-radius: 2px;
    387 }
    388 /* Generic button */
     223    margin:0;
     224    font-family:'Open Sans',sans-serif
     225}
     226
     227*,:after,:before {
     228    box-sizing:inherit
     229}
     230
    389231.button {
    390   box-sizing: border-box;
    391   display: inline-block;
    392   text-align: center;
    393   vertical-align: middle;
    394   cursor: pointer;
    395   border: 1px solid transparent;
    396   text-decoration: none;
    397   font-style: normal;
    398   white-space: nowrap;
    399   text-overflow: ellipsis;
    400   padding: 0.3em 1em;
    401   margin: 0;
    402   position: relative;
    403   overflow: hidden;
    404   background: #e1e1e1;
    405   color: #151515;
    406   font-size: 1em;
    407   line-height: 1.25;
    408   max-width: 100%;
    409 }
     232    box-sizing:border-box;
     233    display:inline-block;
     234    text-align:center;
     235    vertical-align:middle;
     236    cursor:pointer;
     237    border:1px solid transparent;
     238    font-style:normal;
     239    white-space:nowrap;
     240    text-overflow:ellipsis;
     241    padding:.3em 1em;
     242    margin:0;
     243    overflow:hidden;
     244    background:#e1e1e1;
     245    color:#151515;
     246    font-size:1em;
     247    line-height:1.25;
     248    max-width:100%
     249}
     250
    410251.login-content {
    411   background-image: url("../media/img/back-01.jpg");
    412   background-size: cover;
    413   display: flex;
    414   justify-content: center;
    415   align-items: center;
    416   min-height: calc(100vh - 98px);
    417   padding: 1em 0;
    418 }
     252    background-image:url(../media/img/back-01.jpg);
     253    background-size:cover;
     254    display:-webkit-flex;
     255    display:-ms-flexbox;
     256    display:flex;
     257    -webkit-justify-content:center;
     258    -ms-flex-pack:center;
     259    justify-content:center;
     260    -webkit-align-items:center;
     261    -ms-flex-align:center;
     262    align-items:center;
     263    min-height:300px;
     264    padding:1em 0;
     265    transition:all 250ms ease-in-out
     266}
     267
     268@media (min-width:1024px) {
     269    .login-content {
     270        min-height:550px
     271    }
     272
     273
     274}
     275
     276@media (min-width:1440px) {
     277    .login-content {
     278        min-height:650px
     279    }
     280
     281
     282}
     283
     284.login-content .message {
     285    padding:.5em;
     286    margin:0;
     287    text-align:center;
     288    font-size:13px;
     289    font-size:.8125rem
     290}
     291
     292.login-content .message.message-error {
     293    color:#fff;
     294    background-color:red
     295}
     296
    419297.login-content form {
    420   max-width: 380px;
    421   background-color: rgba(21, 21, 21, 0.6);
    422   border-radius: 6px;
    423   padding: 2em 1.5em;
    424 }
    425 .login-content form div {
    426   margin-bottom: 1.5em;
    427 }
     298    width:100%;
     299    max-width:350px
     300}
     301
     302.login-content legend {
     303    display:none
     304}
     305
     306.login-content fieldset {
     307    border:none;
     308    background-color:rgba(21,21,21,.6);
     309    border-radius:6px;
     310    padding:2em
     311}
     312
     313.login-content fieldset>div {
     314    margin-bottom:1.5em
     315}
     316
     317.login-content input {
     318    width:100%;
     319    padding:.5em .75em;
     320    border:1px solid transparent;
     321    border-radius:2px
     322}
     323
     324.login-content input:focus {
     325    border-color:#EE4056
     326}
     327
    428328.login-content label {
    429   color: #e1e1e1;
    430 }
    431 .login-content a {
    432   color: #e1e1e1;
    433   font-size: 13px;
    434   text-decoration: none;
    435   margin-right: 0.75em;
    436 }
    437 .login-content a:hover {
    438   color: white;
    439 }
     329    display:block;
     330    font-size:14px;
     331    font-size:.875rem;
     332    color:#959595;
     333    margin-bottom:.25em
     334}
     335
    440336.login-content .button {
    441   transition: all 500ms ease-in-out;
    442   background-color: #EE4056;
    443   color: white;
    444   text-transform: uppercase;
    445 }
     337    transition:all .5s ease-in-out;
     338    background-color:#EE4056;
     339    color:#fff;
     340    margin-bottom:1em;
     341    text-transform:uppercase
     342}
     343
    446344.login-content .button:hover {
    447   background-color: #e6152f;
    448 }
    449 .login-content .message {
    450   padding: 0.5em;
    451   margin: 0;
    452   text-align: center;
    453   font-size: 13px;
    454   font-size: 0.8125rem;
    455 }
    456 .login-content .message.message-error {
    457   color: white;
    458   background-color: red;
    459 }
    460 /*
    461 .login-remember {
    462     color: @color-main-medium;
    463     .font-size(14);
     345    background-color:#e6152f
     346}
     347
     348.signup-content {
     349    background-image:url(../media/img/signup-01.jpg);
     350    background-size:cover;
     351    display:-webkit-flex;
     352    display:-ms-flexbox;
     353    display:flex;
     354    -webkit-justify-content:center;
     355    -ms-flex-pack:center;
     356    justify-content:center;
     357    -webkit-align-items:center;
     358    -ms-flex-align:center;
     359    align-items:center;
     360    min-height:300px;
     361    padding:1em 0;
     362    transition:all 250ms ease-in-out
     363}
     364
     365@media (min-width:1024px) {
     366    .signup-content {
     367        min-height:550px
     368    }
     369
     370
     371}
     372
     373@media (min-width:1440px) {
     374    .signup-content {
     375        min-height:650px
     376    }
     377
     378
     379}
     380
     381.signup-content form {
     382    width:100%;
     383    max-width:40%
     384}
     385
     386.signup-content ul.error li {
     387    color:#fff;
     388    background-color:red
     389}
     390
     391.signup-content legend {
     392    display:none
     393}
     394
     395.signup-content fieldset {
     396    border:none;
     397    background-color:rgba(21,21,21,.6);
     398    border-radius:6px;
     399    padding:2em
     400}
     401
     402.signup-content fieldset>div {
     403    margin-bottom:1.5em
     404}
     405
     406.signup-content input {
     407    width:100%;
     408    padding:.5em .75em;
     409    border:1px solid transparent;
     410    border-radius:2px
     411}
     412
     413.signup-content input:focus {
     414    border-color:#EE4056
     415}
     416
     417.signup-content label {
     418    display:block;
     419    font-size:14px;
     420    font-size:.875rem;
     421    color:#959595;
     422    margin-bottom:.25em
     423}
     424
     425.signup-content .button {
     426    transition:all .5s ease-in-out;
     427    background-color:#EE4056;
     428    color:#fff;
     429    margin-bottom:1em;
     430    text-transform:uppercase
     431}
     432
     433.logo span,.workout-title:before {
     434    transition:all 250ms ease-in-out
     435}
     436
     437.logo-open,.logo:hover span {
     438    color:#EE4056
     439}
     440
     441.header-content .description,.logo {
     442    margin:0
     443}
     444
     445.signup-content .button:hover {
     446    background-color:#e6152f
     447}
     448
     449.header-content {
     450    padding:1em 1.5em
     451}
     452
     453.logo {
     454    font-size:24px;
     455    font-size:1.5rem;
     456    line-height:1em;
     457    font-weight:800;
     458    text-transform:uppercase;
     459    display:inline-block
     460}
     461
     462.logo-open {
     463    display:block
     464}
     465
     466.logo-outs,.logo-work {
     467    color:#f8b5be
     468}
     469
     470.nav-site {
     471    font-size:13px;
     472    font-size:.8125rem
     473}
     474
     475.nav-site ul {
     476    list-style-type:none;
     477    padding:0;
     478    margin:0;
     479    display:-webkit-flex;
     480    display:-ms-flexbox;
     481    display:flex;
     482    -webkit-flex-direction:row;
     483    -ms-flex-direction:row;
     484    flex-direction:row;
     485    -webkit-justify-content:space-between;
     486    -ms-flex-pack:justify;
     487    justify-content:space-between
     488}
     489
     490.nav-site li {
     491    border-left:1px solid #e1e1e1;
     492    -webkit-flex-grow:1;
     493    -ms-flex-positive:1;
     494    flex-grow:1;
     495    text-align:center
     496}
     497
     498.nav-site a {
     499    color:#959595;
     500    padding:1.25em;
     501    display:block
     502}
     503
     504.nav-site .is-active a,.nav-site a:hover {
     505    color:#151515
     506}
     507
     508.add-workout>a {
     509    color:#EE4056
     510}
     511
     512.add-workout>a:before {
     513    content:"+";
     514    font-weight:800;
     515    font-size:32px;
     516    font-size:2rem;
     517    line-height:0;
     518    position:relative;
     519    top:8px
     520}
     521
     522.add-workout:hover:after,.bike:before {
     523    content:""
     524}
     525
     526.add-workout>a span {
     527    display:none
     528}
     529
     530.add-workout>a:hover {
     531    background-color:#EE4056;
     532    color:#fff
     533}
     534
     535.add-workout:hover:after {
     536    position:absolute;
     537    background-color:#fff;
     538    bottom:-1px;
     539    width:100%;
     540    height:1px;
     541    display:block;
     542    z-index:20
     543}
     544
     545.add-workout:hover ul {
     546    display:inline-block
     547}
     548
     549.add-workout ul {
     550    display:none;
     551    -webkit-flex-direction:column;
     552    -ms-flex-direction:column;
     553    flex-direction:column;
     554    position:absolute;
     555    background-color:rgba(255,255,255,.95);
     556    right:-1px;
     557    border:1px solid #e1e1e1;
     558    width:153px;
     559    z-index:10;
     560}
     561
     562.add-workout ul li {
     563    border-left:transparent;
     564    text-align:left
     565}
     566
     567.add-workout ul a:hover {
     568    background-color:#fbfbfb
     569}
     570
     571.description {
     572    font-size:14px;
     573    font-size:.875rem;
     574    font-weight:300;
     575    letter-spacing:.025em;
     576    color:#959595
     577}
     578
     579.is-login .header-content {
     580    border-bottom:1px solid #e1e1e1;
     581    display:-webkit-flex;
     582    display:-ms-flexbox;
     583    display:flex;
     584    padding:0 1.5em;
     585    -webkit-justify-content:space-between;
     586    -ms-flex-pack:justify;
     587    justify-content:space-between;
     588    -webkit-align-items:center;
     589    -ms-flex-align:center;
     590    align-items:center
     591}
     592
     593.is-login .description {
     594    display:none
     595}
     596
     597.is-login .logo-open {
     598    display:inline-block
     599}
     600
     601.workout-content {
     602    padding:2em 1em
     603}
     604
     605@media (min-width:480px) {
     606    .workout-content {
     607        padding:2em 6em
     608    }
     609
     610
     611}
     612
     613.workout-list {
     614    margin-right:2em
     615}
     616
     617.workout-list>h2 {
     618    font-weight:300;
     619    margin:0 0 1.5em
     620}
     621
     622.workout-resume {
     623    max-width:540px;
     624    padding:1.5em 0;
     625    position:relative
     626}
     627
     628@media (min-width:800px) {
     629    .workout-content {
     630        display:-webkit-flex;
     631        display:-ms-flexbox;
     632        display:flex;
     633        -webkit-justify-content:space-between;
     634        -ms-flex-pack:justify;
     635        justify-content:space-between
     636    }
     637
     638    .workout-resume {
     639        padding-left:2em;
     640        border-left:1px solid #e1e1e1;
     641        transition:all 250ms ease-in-out
     642    }
     643
     644
     645}
     646
     647.workout-resume:hover {
     648    border-color:#151515
     649}
     650
     651.workout-resume:hover .workout-title:before {
     652    color:#151515
     653}
     654
     655.workout-resume ul {
     656    padding:0;
     657    list-style-type:none;
     658    font-size:13px;
     659    font-size:.8125rem
     660}
     661
     662.workout-resume ul a {
     663    display:block
     664}
     665
     666.bike:before {
     667    display:block;
     668    width:30px;
     669    height:30px;
     670    background-image:url(../media/img/bike.svg);
     671    background-size:100%
     672}
     673
     674.workout-title {
     675    font-size:14px;
     676    font-size:.875rem;
     677    margin:0;
     678    position:relative
     679}
     680
     681.workout-title:before {
     682    content:"▶";
     683    position:absolute;
     684    left:-3.25em;
     685    top:.35em;
     686    color:#e1e1e1;
     687    font-size:10px;
     688    font-size:.625rem
     689}
     690
     691.workout-title a {
     692    color:#151515
     693}
     694
     695.workout-title a:hover {
     696    color:#EE4056
     697}
     698
     699.workout-info {
     700    display:-webkit-flex;
     701    display:-ms-flexbox;
     702    display:flex;
     703    -webkit-align-items:center;
     704    -ms-flex-align:center;
     705    align-items:center;
     706    margin:.25em 0
     707}
     708
     709.workout-info li {
     710    color:#959595
     711}
     712
     713.workout-info li:after {
     714    content:"|";
     715    margin:0 .5em
     716}
     717
     718.workout-info li:last-child:after {
     719    content:"";
     720    margin:0
     721}
     722
     723.workout-intro {
     724    font-size:13px;
     725    font-size:.8125rem;
     726    color:#151515
     727}
     728
     729.workout-options {
     730    display:inline-block;
     731    border:1px solid #e1e1e1;
     732    margin-bottom:0;
     733    border-radius:4px
     734}
     735
     736.workout-options li {
     737    display:inline-block;
     738    border-right:1px solid #e1e1e1
     739}
     740
     741.workout-options li:last-child {
     742    border-right:none
     743}
     744
     745.workout-options a {
     746    color:#959595;
     747    padding:.5em .75em
     748}
     749
     750.workout-options a:hover {
     751    color:#151515
     752}
     753
     754.workout-map img {
     755    width: 100%;
     756}
     757
     758.owo-del a:hover {
     759    color:red
     760}
     761
     762.workout-aside {
     763    width:100%
     764}
     765
     766.workout-activity-tree {
     767    padding:0;
     768    list-style-type: none;
     769    transition:all 250ms ease-in-out
     770                   list-style-type:none;
     771    font-size:13px;
     772    font-size:.8125rem;
     773    color: #959595;
     774}
     775
     776.workout-activity-tree a {
    464777    text-decoration: none;
    465     font-weight: 300;
    466     &:hover{
    467         color: @color-main-light;
     778    background-color: transparent;
     779    outline: 0;
     780    color: #959595;
     781}
     782
     783
     784.workout-activity-tree li a.viewing-year {
     785    font-size: 17px;
     786    color: #151515;
     787}
     788
     789.workout-activity-tree ul.hidden {
     790    display: none;
     791}
     792
     793.workout-activity-tree-year {
     794    list-style-type: none;
     795    padding: 0;
     796    padding-left: 15px;
     797    font-size:13px;
     798    font-size:.8125rem;
     799    color: #959595;
     800}
     801
     802.workout-activity-tree-year a {
     803    text-decoration: none;
     804    background-color: transparent;
     805    outline: 0;
     806    color: #959595;
     807}
     808
     809
     810.workout-activity-tree-year li a.viewing-month {
     811    font-size: 17px;
     812    color: #151515;
     813}
     814
     815.workout-activity-tree-month {
     816    list-style-type: none;
     817    padding: 0;
     818    padding-left: 15px;
     819    font-size:13px;
     820    font-size:.8125rem
     821    color: #959595;
     822}
     823
     824.workout-activity-tree-month a {
     825    text-decoration: none;
     826    background-color: transparent;
     827    outline: 0;
     828    color: #959595;
     829}
     830
     831
     832
     833@media (min-width:800px) {
     834    .workout-aside {
     835        max-width:300px;
     836        padding-left:1.5em;
     837        border-left:1px solid #e1e1e1
    468838    }
    469 }
    470 <a class="login-remember" href="#">Forgot your password?</a>
    471 */
    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 {
    611   padding: 2em  1em;
    612 }
    613 @media (min-width: 480px) {
    614   .workout-content {
    615     padding: 2em 6em;
    616   }
    617 }
    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: 2em;
    756 }
    757 .aside-profile img {
    758   width: 80px;
    759   height: 80px;
    760   object-fit: cover;
    761   border-radius: 50%;
    762 }
    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;
    773   font-size: 13px;
    774   font-size: 0.8125rem;
    775   color: #555555;
    776 }
    777 .workout-activity-tree {
    778   list-style-type: none;
    779   padding: 0;
    780   margin: 0;
    781   transition: all 250ms ease-in-out;
    782   font-size: 13px;
    783   font-size: 0.8125rem;
    784 }
    785 .workout-activity-tree > li {
    786   margin-bottom: 0.5em;
    787   padding-bottom: 0.5em;
    788   border-bottom: 1px solid #e1e1e1;
    789 }
    790 .workout-activity-tree a {
    791   text-decoration: none;
    792   display: block;
    793   color: #EE4056;
    794 }
    795 .workout-activity-tree a:hover {
    796   color: #151515;
    797 }
    798 .workout-activity-tree a.viewing-year {
    799   color: #151515;
    800   font-weight: 700;
    801   margin-bottom: 0.5em;
    802 }
    803 .workout-activity-tree a.viewing-month {
    804   background-color: #e1e1e1;
    805   color: #151515;
    806   font-weight: 700;
    807 }
    808 .workout-activity-tree-year {
    809   list-style-type: none;
    810   padding: 0;
    811   margin: 0;
    812 }
    813 .workout-activity-tree-year > li {
    814   display: block;
    815   margin-bottom: 0.5em;
    816 }
    817 .workout-activity-tree-year a {
    818   display: flex;
    819   justify-content: space-between;
    820   padding: 0.5em;
    821   background-color: #fbfbfb;
    822   color: #555555;
    823 }
    824 .workout-activity-tree-year a:hover {
    825   background-color: #e1e1e1;
    826 }
     839
     840
     841}

  • ow/templates/base_anonymous.pt

    rd0fc76b r26220ba  
    2525
    2626    <link rel="stylesheet"
    27           href="${request.static_url('ow:static/css/main.css')}" />
     27          href="${request.static_url('ow:static/css/main.min.css')}" />
    2828
    2929  </head>
    … …  
    3737          <a href="#" tal:attributes="href request.resource_url(request.root)">
    3838            <span class="logo-open">Open</span><span class="logo-work">work</span><span class="logo-outs">outs</span>
    39           </a>
     39        </a>
    4040        </h1>
    4141        <p class="description">tracking your workouts openly</p>

  • ow/templates/dashboard.pt

    rd0fc76b r26220ba  
    2525      <section class="workout-list">
    2626
     27        <h2 tal:content="context.fullname"></h2>
     28
    2729        <h3>
    28            <tal:n tal:content="len(workouts)"></tal:n> <tal:t i18n:translate="">Activities</tal:t>
     30            (<tal:n tal:content="len(workouts)"></tal:n>/<tal:n tal:content="context.num_workouts"></tal:n>) <tal:t i18n:translate="">workouts</tal:t>
    2931        </h3>
    3032
    … …  
    108110
    109111      <aside class="workout-aside">
    110       <div class="aside-profile">
    111         <tal:c tal:condition="getattr(context, 'picture', None)">
    112           <img tal:attributes="src request.resource_path(context, 'picture')"
    113                width="450" />
    114         </tal:c>
    115         <h2 tal:content="context.fullname"></h2>
    116         <ul>
    117           <Li>
    118             <tal:n tal:content="context.num_workouts"></tal:n> <tal:t i18n:translate="">workouts</tal:t>
    119           </Li>
    120         </ul>
    121       </div>
    122112          <tal:activity_tree tal:condition="context.num_workouts > 0">
    123113              <ul class="workout-activity-tree" tal:define="tree context.activity_dates_tree">
    … …  
    132122                              <tal:months tal:repeat="month sorted(tree[year].keys())">
    133123                                  <li tal:define="is_viewing_month is_viewing_year and month == viewing_month">
    134                                       <a href=""
     124                                      <a href="" tal:content="month_name[month]"
    135125                                         tal:attributes="href request.resource_url(context, query={'year': year, 'month': month});
    136126                                                         class 'viewing-month' if is_viewing_month else ''">
    137                                            <span tal:content="month_name[month]"></span>
    138                                            <span tal:content="sum([tree[year][month][sport] for sport in tree[year][month]])"></span>
    139127                                      </a>
     128                                      <ul class="workout-activity-tree-month">
     129                                          <tal:sports tal:repeat="sport sorted(tree[year][month].keys())">
     130                                              <li>
     131                                                  <a href="#">
     132                                                      <tal:sport tal:content="sport"></tal:sport> (<tal:workouts tal:content="tree[year][month][sport]"></tal:workouts>)
     133                                                  </a>
     134                                              </li>
     135                                          </tal:sports>
     136                                      </ul>
    140137                                  </li>
    141138                              </tal:months>

  • ow/templates/login.pt

    rd0fc76b r26220ba  
    3434                     type="password" i18n:attributes="placeholder">
    3535            </div>
    36             <div>
    37               <input class="button button-action" type="submit" name="submit" value="Login">
    38             </div>
     36            <input class="button" type="submit" name="submit" value="Login">
    3937            <a class="login-remember" href="#" i18n:translate="">
    40               Forgot your password?</a>
     38              Forgot your password?</a> |
    4139            <a class="join-now" href="" i18n:translate=""
    4240               tal:attributes="href request.resource_url(context, 'signup')">

  • ow/templates/signup.pt

    rd0fc76b r26220ba  
    1212      <!-- Login -->
    1313
    14       <div class="login-content">
     14      <div class="signup-content">
    1515
    1616        <form method="post" name="signup" action="">
    … …  
    5757          </fieldset>
    5858
    59           <input class="button button-action" type="submit" name="submit" value="Sign up!">
     59          <input class="button" type="submit" name="submit" value="Sign up!">
    6060
    6161        </form>
Note: See TracChangeset for help on using the changeset viewer.