Changes in / [26220ba:d0fc76b] in OpenWorkouts-current
- Location:
- ow
- Files:
-
- 23 added
- 3 deleted
- 6 edited
Legend:
- Unmodified
- Added
- Removed
-
ow/static/css/main.css
r26220ba rd0fc76b 1 img,legend {2 border:03 }4 5 legend,td,th {6 padding:07 }8 9 .add-workout,.button,sub,sup {10 position:relative11 }12 13 .button,.header-content a,.workout-resume ul a,.workout-title a {14 text-decoration:none15 }16 17 1 @font-face { 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 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 } 24 7 @font-face { 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 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 } 31 13 @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/v13/k3k702ZOKiLJc3WVjuplzInF5uFdDttMLvmWuJdhhgs.ttf) format('truetype') 36 } 37 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 } 38 19 @font-face { 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 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 } 45 25 @font-face { 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 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 } 52 31 @font-face { 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 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 } 59 37 @font-face { 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 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 */ 66 50 html { 67 font-family:sans-serif; 68 -ms-text-size-adjust:100%; 69 -webkit-text-size-adjust:100%; 70 box-sizing:border-box 71 } 72 73 article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary { 74 display:block 75 } 76 77 audio,canvas,progress,video { 78 display:inline-block; 79 vertical-align:baseline 80 } 81 82 audio:not([controls]) { 83 display:none; 84 height:0 85 } 86 87 .hide,[hidden],template { 88 display:none 89 } 90 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 */ 61 body { 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 */ 91 107 a { 92 background-color:transparent 93 } 94 95 a:active,a:hover { 96 outline:0 97 } 98 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 */ 99 114 abbr[title] { 100 border-bottom:1px dotted 101 } 102 103 b,optgroup,strong { 104 font-weight:700 105 } 106 107 dfn { 108 font-style:italic 109 } 110 111 h1 { 112 font-size:2em; 113 margin:.67em 0 114 } 115 116 mark { 117 background:#ff0; 118 color:#000 119 } 120 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 */ 121 144 small { 122 font-size:80% 123 } 124 125 sub,sup { 126 font-size:75%; 127 line-height:0; 128 vertical-align:baseline 129 } 130 145 font-size: 80%; 146 } 147 /** 148 * Prevent `sub` and `sup` elements from affecting the line height in 149 * all browsers. 150 */ 151 sub, 131 152 sup { 132 top:-.5em 133 } 134 153 font-size: 75%; 154 line-height: 0; 155 position: relative; 156 vertical-align: baseline; 157 } 135 158 sub { 136 bottom:-.25em 137 } 138 139 svg:not(:root) { 140 overflow:hidden 141 } 142 143 figure { 144 margin:1em 40px 145 } 146 147 hr { 148 box-sizing:content-box; 149 height:0 150 } 151 152 pre,textarea { 153 overflow:auto 154 } 155 156 code,kbd,pre,samp { 157 font-family:monospace,monospace; 158 font-size:1em 159 } 160 161 button,input,optgroup,select,textarea { 162 color:inherit; 163 font:inherit; 164 margin:0 165 } 166 167 button { 168 overflow:visible 169 } 170 171 button,select { 172 text-transform:none 173 } 174 175 button,html input[type=button],input[type=reset],input[type=submit] { 176 -webkit-appearance:button; 177 cursor:pointer 178 } 179 180 button[disabled],html input[disabled] { 181 cursor:default 182 } 183 184 button::-moz-focus-inner,input::-moz-focus-inner { 185 border:0; 186 padding:0 187 } 188 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, 189 197 input { 190 line-height:normal 191 } 192 193 input[type=checkbox],input[type=radio] { 194 box-sizing:border-box; 195 padding:0 196 } 197 198 input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button { 199 height:auto 200 } 201 202 input[type=search] { 203 -webkit-appearance:textfield; 204 box-sizing:content-box 205 } 206 207 input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration { 208 -webkit-appearance:none 209 } 210 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 */ 211 241 fieldset { 212 border:1px solid silver; 213 margin:0 2px; 214 padding:.35em .625em .75em 215 } 216 217 table { 218 border-collapse:collapse; 219 border-spacing:0 220 } 221 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 } 222 352 body { 223 margin:0; 224 font-family:'Open Sans',sans-serif 225 } 226 227 *,:after,:before { 228 box-sizing:inherit 229 } 230 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 */ 231 389 .button { 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 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 } 251 410 .login-content { 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 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 } 419 .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 } 428 .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 } 440 .login-content .button { 441 transition: all 500ms ease-in-out; 442 background-color: #EE4056; 443 color: white; 444 text-transform: uppercase; 445 } 446 .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); 464 text-decoration: none; 465 font-weight: 300; 466 &:hover{ 467 color: @color-main-light; 271 468 } 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 297 .login-content form { 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 328 .login-content label { 329 display:block; 330 font-size:14px; 331 font-size:.875rem; 332 color:#959595; 333 margin-bottom:.25em 334 } 335 336 .login-content .button { 337 transition:all .5s ease-in-out; 338 background-color:#EE4056; 339 color:#fff; 340 margin-bottom:1em; 341 text-transform:uppercase 342 } 343 344 .login-content .button:hover { 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 469 } 470 <a class="login-remember" href="#">Forgot your password?</a> 471 */ 449 472 .header-content { 450 padding:1em 1.5em 451 } 452 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 ----------------------------------------------------------------------*/ 453 482 .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 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 } 462 497 .logo-open { 463 display:block 464 } 465 466 .logo-outs,.logo-work { 467 color:#f8b5be 468 } 469 498 display: block; 499 color: #EE4056; 500 } 501 .logo-work, 502 .logo-outs { 503 color: #f8b5be; 504 } 505 /* menu navigation -----------------------------------------------------------*/ 470 506 .nav-site { 471 font-size:13px; 472 font-size:.8125rem 473 } 474 507 font-size: 13px; 508 font-size: 0.8125rem; 509 } 475 510 .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 511 list-style-type: none; 512 padding: 0; 513 margin: 0; 514 display: flex; 515 flex-direction: row; 516 justify-content: space-between; 517 } 490 518 .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 519 border-left: 1px solid #e1e1e1; 520 flex-grow: 1; 521 text-align: center; 522 } 498 523 .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 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 } 535 558 .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:20543 } 544 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 } 545 568 .add-workout:hover ul { 546 display:inline-block 547 } 548 569 display: inline-block; 570 } 549 571 .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 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 } 562 580 .add-workout ul li { 563 border-left:transparent; 564 text-align:left 565 } 566 581 border-left: transparent; 582 text-align: left; 583 } 567 584 .add-workout ul a:hover { 568 background-color:#fbfbfb569 } 570 585 background-color: #fbfbfb; 586 } 587 /* description ---------------------------------------------------------------*/ 571 588 .description { 572 font-size:14px; 573 font-size:.875rem; 574 font-weight:300; 575 letter-spacing:.025em; 576 color:#959595 577 } 578 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 --------------------------------------------------------*/ 579 597 .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 598 border-bottom: 1px solid #e1e1e1; 599 display: flex; 600 padding: 0em 1.5em; 601 justify-content: space-between; 602 align-items: center; 603 } 593 604 .is-login .description { 594 display:none 595 } 596 605 display: none; 606 } 597 607 .is-login .logo-open { 598 display:inline-block 599 } 600 608 display: inline-block; 609 } 601 610 .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 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 */ 613 625 .workout-list { 614 margin-right:2em 615 } 616 617 .workout-list>h2 { 618 font-weight:300; 619 margin:0 0 1.5em 620 } 621 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 */ 622 635 .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 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 647 .workout-resume:hover { 648 border-color:#151515 649 } 650 648 border-color: #151515; 649 } 651 650 .workout-resume:hover .workout-title:before { 652 color:#151515 653 } 654 651 color: #151515; 652 } 655 653 .workout-resume ul { 656 padding:0; 657 list-style-type:none; 658 font-size:13px; 659 font-size:.8125rem 660 } 661 654 padding: 0; 655 list-style-type: none; 656 font-size: 13px; 657 font-size: 0.8125rem; 658 } 662 659 .workout-resume ul a { 663 display:block664 } 665 660 display: block; 661 text-decoration: none; 662 } 666 663 .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 664 display: block; 665 content: ""; 666 width: 30px; 667 height: 30px; 668 background-image: url('../media/img/bike.svg'); 669 background-size: 100%; 670 } 674 671 .workout-title { 675 font-size:14px; 676 font-size:.875rem; 677 margin:0; 678 position:relative 679 } 680 672 font-size: 14px; 673 font-size: 0.875rem; 674 margin: 0 0 0em 0; 675 position: relative; 676 } 681 677 .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:.625rem689 } 690 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 } 691 687 .workout-title a { 692 color:#151515693 } 694 688 color: #151515; 689 text-decoration: none; 690 } 695 691 .workout-title a:hover { 696 color:#EE4056 697 } 698 692 color: #EE4056; 693 } 699 694 .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 695 display: flex; 696 align-items: center; 697 margin: 0.25em 0; 698 } 709 699 .workout-info li { 710 color:#959595 711 } 712 700 color: #959595; 701 } 713 702 .workout-info li:after { 714 content:"|"; 715 margin:0 .5em 716 } 717 703 content: "|"; 704 margin: 0 0.5em; 705 } 718 706 .workout-info li:last-child:after { 719 content:""; 720 margin:0 721 } 722 707 content: ""; 708 margin: 0; 709 } 710 .workout-map { 711 margin-top: 1em; 712 } 713 .workout-map img { 714 width: 100%; 715 } 723 716 .workout-intro { 724 font-size:13px; 725 font-size:.8125rem; 726 color:#151515 727 } 728 717 font-size: 13px; 718 font-size: 0.8125rem; 719 color: #151515; 720 } 729 721 .workout-options { 730 display:inline-block; 731 border:1px solid #e1e1e1; 732 margin-bottom:0; 733 border-radius:4px 734 } 735 722 display: inline-block; 723 border: 1px solid #e1e1e1; 724 margin-bottom: 0; 725 border-radius: 4px; 726 } 736 727 .workout-options li { 737 display:inline-block; 738 border-right:1px solid #e1e1e1 739 } 740 728 display: inline-block; 729 border-right: 1px solid #e1e1e1; 730 } 741 731 .workout-options li:last-child { 742 border-right:none 743 } 744 732 border-right: none; 733 } 745 734 .workout-options a { 746 color:#959595; 747 padding:.5em .75em 748 } 749 735 color: #959595; 736 padding: 0.5em 0.75em; 737 } 750 738 .workout-options a:hover { 751 color:#151515 752 } 753 754 .workout-map img { 755 width: 100%; 756 } 757 739 color: #151515; 740 } 758 741 .owo-del a:hover { 759 color:red 760 } 761 742 color: red; 743 } 762 744 .workout-aside { 763 width:100% 764 } 765 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 } 766 777 .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 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 } 776 790 .workout-activity-tree a { 777 text-decoration: none; 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 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 } 793 808 .workout-activity-tree-year { 794 795 796 padding-left: 15px;797 font-size:13px; 798 font-size:.8125rem; 799 color: #959595;800 } 801 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 } 802 817 .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 838 } 839 840 841 } 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 } -
ow/templates/base_anonymous.pt
r26220ba rd0fc76b 25 25 26 26 <link rel="stylesheet" 27 href="${request.static_url('ow:static/css/main. min.css')}" />27 href="${request.static_url('ow:static/css/main.css')}" /> 28 28 29 29 </head> … … 37 37 <a href="#" tal:attributes="href request.resource_url(request.root)"> 38 38 <span class="logo-open">Open</span><span class="logo-work">work</span><span class="logo-outs">outs</span> 39 </a>39 </a> 40 40 </h1> 41 41 <p class="description">tracking your workouts openly</p> -
ow/templates/dashboard.pt
r26220ba rd0fc76b 25 25 <section class="workout-list"> 26 26 27 <h2 tal:content="context.fullname"></h2>28 29 27 <h3> 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>28 <tal:n tal:content="len(workouts)"></tal:n> <tal:t i18n:translate="">Activities</tal:t> 31 29 </h3> 32 30 … … 110 108 111 109 <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> 112 122 <tal:activity_tree tal:condition="context.num_workouts > 0"> 113 123 <ul class="workout-activity-tree" tal:define="tree context.activity_dates_tree"> … … 122 132 <tal:months tal:repeat="month sorted(tree[year].keys())"> 123 133 <li tal:define="is_viewing_month is_viewing_year and month == viewing_month"> 124 <a href="" tal:content="month_name[month]"134 <a href="" 125 135 tal:attributes="href request.resource_url(context, query={'year': year, 'month': month}); 126 136 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> 127 139 </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>137 140 </li> 138 141 </tal:months> -
ow/templates/login.pt
r26220ba rd0fc76b 34 34 type="password" i18n:attributes="placeholder"> 35 35 </div> 36 <input class="button" type="submit" name="submit" value="Login"> 36 <div> 37 <input class="button button-action" type="submit" name="submit" value="Login"> 38 </div> 37 39 <a class="login-remember" href="#" i18n:translate=""> 38 Forgot your password?</a> |40 Forgot your password?</a> 39 41 <a class="join-now" href="" i18n:translate="" 40 42 tal:attributes="href request.resource_url(context, 'signup')"> -
ow/templates/signup.pt
r26220ba rd0fc76b 12 12 <!-- Login --> 13 13 14 <div class=" signup-content">14 <div class="login-content"> 15 15 16 16 <form method="post" name="signup" action=""> … … 57 57 </fieldset> 58 58 59 <input class="button " type="submit" name="submit" value="Sign up!">59 <input class="button button-action" type="submit" name="submit" value="Sign up!"> 60 60 61 61 </form>
Note: See TracChangeset
for help on using the changeset viewer.