├── .travis.yml ├── README.md ├── deploy ├── build.js ├── script.bash └── ssh_private_key.enc └── public ├── .htaccess └── leokzw ├── assets └── images │ ├── bg.svg │ ├── braziljs-logo.svg │ ├── devsforleokz_logo.svg │ ├── eventials-logo.png │ ├── leo_cover.png │ ├── logo.svg │ └── nejs_hackathon_logo.png ├── basscss.css ├── index.en.html ├── index.html └── style.css /.travis.yml: -------------------------------------------------------------------------------- 1 | language: bash 2 | sudo: false 3 | script: 4 | - bash deploy/script.bash 5 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Deploy to production 2 | 3 | ```console 4 | $ git tag -d production 5 | $ git push origin :production 6 | $ git tag production [COMMIT HASH] 7 | $ git push origin master 8 | $ git push --tags 9 | ``` 10 | -------------------------------------------------------------------------------- /deploy/build.js: -------------------------------------------------------------------------------- 1 | console.log('=> DONE'); 2 | -------------------------------------------------------------------------------- /deploy/script.bash: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | set -ex 3 | 4 | branch=$TRAVIS_BRANCH 5 | site_dir="~/frontendunited.io" 6 | 7 | if [[ "$TRAVIS_PULL_REQUEST" != "false" ]]; then 8 | echo "=> Skipping deploy for pull request." 9 | exit 0 10 | fi 11 | 12 | if [[ "$branch" = "production" ]]; then 13 | root_dir="$site_dir/public" 14 | elif [[ "$branch" = "master" ]]; then 15 | root_dir="$site_dir/public/staging" 16 | else 17 | echo "=> Skipping deploy for $branch branch" 18 | exit 0 19 | fi 20 | 21 | mkdir -p $site_dir 22 | openssl aes-256-cbc -K $encrypted_994a64a0c4e9_key -iv $encrypted_994a64a0c4e9_iv -in deploy/ssh_private_key.enc -out deploy/ssh_private_key -d 23 | chmod 600 deploy/ssh_private_key 24 | ssh-keyscan -t rsa frontendunited.io >> ~/.ssh/known_hosts 25 | chmod 600 ~/.ssh/known_hosts 26 | ssh -i deploy/ssh_private_key frontendunited@frontendunited.io "rm -rf $root_dir" 27 | ssh -i deploy/ssh_private_key frontendunited@frontendunited.io "mkdir -p $root_dir" 28 | scp -r -i deploy/ssh_private_key ./public/{*,.htaccess} frontendunited@frontendunited.io:$root_dir 29 | find $site_dir -type f -exec chmod 644 {} \; 30 | find $site_dir -type d -exec chmod 775 {} \; 31 | -------------------------------------------------------------------------------- /deploy/ssh_private_key.enc: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/frontendunited/www/458cdb6ba782dde798a74f9946aee271f4f4e39a/deploy/ssh_private_key.enc -------------------------------------------------------------------------------- /public/.htaccess: -------------------------------------------------------------------------------- 1 | RedirectMatch 301 ^/$ /leokzw/ 2 | -------------------------------------------------------------------------------- /public/leokzw/assets/images/bg.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | bg 5 | Created with Sketch. 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | -------------------------------------------------------------------------------- /public/leokzw/assets/images/braziljs-logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 7 | 8 | 9 | 10 | 24 | 25 | 26 | 27 | 28 | 29 | 31 | 32 | 33 | 41 | 46 | 48 | 50 | 51 | 52 | 55 | 68 | 78 | 90 | 92 | 94 | 95 | 96 | -------------------------------------------------------------------------------- /public/leokzw/assets/images/devsforleokz_logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | 8 | 13 | 16 | 21 | 22 | 23 | 28 | 30 | 32 | 37 | 38 | 39 | 40 | 43 | 44 | 45 | 51 | 52 | 53 | 59 | 64 | 65 | 72 | 73 | 74 | -------------------------------------------------------------------------------- /public/leokzw/assets/images/eventials-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/frontendunited/www/458cdb6ba782dde798a74f9946aee271f4f4e39a/public/leokzw/assets/images/eventials-logo.png -------------------------------------------------------------------------------- /public/leokzw/assets/images/leo_cover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/frontendunited/www/458cdb6ba782dde798a74f9946aee271f4f4e39a/public/leokzw/assets/images/leo_cover.png -------------------------------------------------------------------------------- /public/leokzw/assets/images/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 6 | 7 | 8 | 11 | 15 | 16 | 17 | 18 | 19 | 20 | 22 | 23 | 24 | 26 | 27 | 28 | 29 | 30 | 33 | 34 | 35 | 38 | 45 | 48 | 49 | 50 | 55 | 58 | 64 | 65 | 66 | 71 | 73 | 75 | 80 | 81 | 82 | 83 | -------------------------------------------------------------------------------- /public/leokzw/assets/images/nejs_hackathon_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/frontendunited/www/458cdb6ba782dde798a74f9946aee271f4f4e39a/public/leokzw/assets/images/nejs_hackathon_logo.png -------------------------------------------------------------------------------- /public/leokzw/basscss.css: -------------------------------------------------------------------------------- 1 | /* 2 | Basscss Custom Build 3 | http://basscss.com 4 | */ 5 | 6 | body, 7 | button { 8 | margin: 0; 9 | } 10 | 11 | button, 12 | input, 13 | select, 14 | textarea { 15 | font-family: inherit; 16 | font-size: 100%; 17 | } 18 | 19 | img { 20 | max-width: 100%; 21 | } 22 | 23 | svg { 24 | max-height: 100%; 25 | } 26 | 27 | /* Basscss Base Forms */ 28 | 29 | input, 30 | select, 31 | textarea, 32 | fieldset { 33 | font-size: 1rem; 34 | margin-top: 0; 35 | margin-bottom: .5rem; 36 | } 37 | 38 | input[type=text], 39 | input[type=datetime], 40 | input[type=datetime-local], 41 | input[type=email], 42 | input[type=month], 43 | input[type=number], 44 | input[type=password], 45 | input[type=search], 46 | input[type=tel], 47 | input[type=time], 48 | input[type=url], 49 | input[type=week] { 50 | box-sizing: border-box; 51 | height: 2.25rem; 52 | padding: .5rem .5rem; 53 | vertical-align: middle; 54 | -webkit-appearance: none; 55 | } 56 | 57 | select { 58 | box-sizing: border-box; 59 | line-height: 1.75; 60 | padding: .5rem .5rem; 61 | } 62 | 63 | select:not([multiple]) { 64 | height: 2.25rem; 65 | vertical-align: middle; 66 | } 67 | 68 | textarea { 69 | box-sizing: border-box; 70 | line-height: 1.75; 71 | padding: .5rem .5rem; 72 | } 73 | 74 | .fieldset-reset { 75 | padding: 0; 76 | margin-left: 0; 77 | margin-right: 0; 78 | border: 0; 79 | } 80 | 81 | .fieldset-reset legend { 82 | padding: 0; 83 | } 84 | 85 | 86 | 87 | /* Basscss Base Buttons */ 88 | 89 | button, 90 | .button { 91 | font-size: inherit; 92 | font-weight: bold; 93 | text-decoration: none; 94 | cursor: pointer; 95 | display: inline-block; 96 | box-sizing: border-box; 97 | line-height: 1.125rem; 98 | padding: .5rem 1rem; 99 | margin: 0; 100 | height: auto; 101 | border: 1px solid transparent; 102 | vertical-align: middle; 103 | -webkit-appearance: none; 104 | } 105 | 106 | ::-moz-focus-inner { 107 | border: 0; 108 | padding: 0; 109 | } 110 | 111 | .button:hover { 112 | text-decoration: none; 113 | } 114 | 115 | 116 | 117 | /* Basscss Base Tables */ 118 | 119 | table { 120 | border-collapse: separate; 121 | border-spacing: 0; 122 | max-width: 100%; 123 | width: 100%; 124 | } 125 | 126 | th { 127 | text-align: left; 128 | font-weight: bold; 129 | } 130 | 131 | th, 132 | td { 133 | padding: .25rem 1rem; 134 | line-height: inherit; 135 | } 136 | 137 | th { 138 | vertical-align: bottom; 139 | } 140 | 141 | td { 142 | vertical-align: top; 143 | } 144 | 145 | 146 | 147 | /* Basscss Base Typography */ 148 | 149 | body { 150 | font-family: 'Helvetica Neue', Helvetica, sans-serif; 151 | line-height: 1.5; 152 | font-size: 100%; 153 | } 154 | 155 | h1, 156 | h2, 157 | h3, 158 | h4, 159 | h5, 160 | h6 { 161 | font-family: 'Helvetica Neue', Helvetica, sans-serif; 162 | font-weight: bold; 163 | line-height: 1.25; 164 | margin-top: 1em; 165 | margin-bottom: .5em; 166 | } 167 | 168 | p, 169 | dl, 170 | ol, 171 | ul { 172 | font-size: 1rem; 173 | margin-top: 0; 174 | margin-bottom: 1rem; 175 | } 176 | 177 | ol, 178 | ul { 179 | padding-left: 2rem; 180 | } 181 | 182 | pre, 183 | code, 184 | samp { 185 | font-family: 'Source Code Pro', Consolas, monospace; 186 | font-size: inherit; 187 | } 188 | 189 | pre { 190 | margin-top: 0; 191 | margin-bottom: 1rem; 192 | overflow-x: scroll; 193 | } 194 | 195 | hr { 196 | margin-top: 2rem; 197 | margin-bottom: 2rem; 198 | } 199 | 200 | blockquote { 201 | margin-top: 2rem; 202 | margin-bottom: 2rem; 203 | margin-left: 0; 204 | padding-left: 1rem; 205 | padding-right: 1rem; 206 | } 207 | 208 | blockquote, 209 | blockquote p { 210 | font-size: 1.25rem; 211 | font-style: italic; 212 | } 213 | 214 | h1, 215 | .h1 { 216 | font-size: 2rem; 217 | } 218 | 219 | h2, 220 | .h2 { 221 | font-size: 1.5rem; 222 | } 223 | 224 | h3, 225 | .h3 { 226 | font-size: 1.25rem; 227 | } 228 | 229 | h4, 230 | .h4 { 231 | font-size: 1rem; 232 | } 233 | 234 | h5, 235 | .h5 { 236 | font-size: .875rem; 237 | } 238 | 239 | h6, 240 | .h6 { 241 | font-size: .75rem; 242 | } 243 | 244 | .list-reset { 245 | list-style: none; 246 | padding-left: 0; 247 | } 248 | 249 | 250 | 251 | /* Basscss Utility Layout */ 252 | 253 | .inline { 254 | display: inline; 255 | } 256 | 257 | .block { 258 | display: block; 259 | } 260 | 261 | .inline-block { 262 | display: inline-block; 263 | } 264 | 265 | .overflow-hidden { 266 | overflow: hidden; 267 | } 268 | 269 | .overflow-scroll { 270 | overflow: scroll; 271 | } 272 | 273 | .overflow-auto { 274 | overflow: auto; 275 | } 276 | 277 | .clearfix:before, 278 | .clearfix:after { 279 | content: " "; 280 | display: table; 281 | } 282 | 283 | .clearfix:after { 284 | clear: both; 285 | } 286 | 287 | .left { 288 | float: left; 289 | } 290 | 291 | .right { 292 | float: right; 293 | } 294 | 295 | .fit { 296 | max-width: 100%; 297 | } 298 | 299 | .half-width { 300 | width: 50%; 301 | } 302 | 303 | .full-width { 304 | width: 100%; 305 | } 306 | 307 | /* Basscss Utility Typography */ 308 | 309 | .bold { 310 | font-weight: bold; 311 | } 312 | 313 | .regular { 314 | font-weight: normal; 315 | } 316 | 317 | .italic { 318 | font-style: italic; 319 | } 320 | 321 | .caps { 322 | text-transform: uppercase; 323 | letter-spacing: .2em; 324 | } 325 | 326 | .left-align { 327 | text-align: left; 328 | } 329 | 330 | .center { 331 | text-align: center; 332 | } 333 | 334 | .right-align { 335 | text-align: right; 336 | } 337 | 338 | .justify { 339 | text-align: justify; 340 | } 341 | 342 | .nowrap { 343 | white-space: nowrap; 344 | } 345 | 346 | 347 | 348 | /* Basscss Utility White Space */ 349 | 350 | .m0 { 351 | margin: 0; 352 | } 353 | 354 | .mt0 { 355 | margin-top: 0; 356 | } 357 | 358 | .mr0 { 359 | margin-right: 0; 360 | } 361 | 362 | .mb0 { 363 | margin-bottom: 0; 364 | } 365 | 366 | .ml0 { 367 | margin-left: 0; 368 | } 369 | 370 | .m1 { 371 | margin: .5rem; 372 | } 373 | 374 | .mt1 { 375 | margin-top: .5rem; 376 | } 377 | 378 | .mr1 { 379 | margin-right: .5rem; 380 | } 381 | 382 | .mb1 { 383 | margin-bottom: .5rem; 384 | } 385 | 386 | .ml1 { 387 | margin-left: .5rem; 388 | } 389 | 390 | .m2 { 391 | margin: 1rem; 392 | } 393 | 394 | .mt2 { 395 | margin-top: 1rem; 396 | } 397 | 398 | .mr2 { 399 | margin-right: 1rem; 400 | } 401 | 402 | .mb2 { 403 | margin-bottom: 1rem; 404 | } 405 | 406 | .ml2 { 407 | margin-left: 1rem; 408 | } 409 | 410 | .m3 { 411 | margin: 2rem; 412 | } 413 | 414 | .mt3 { 415 | margin-top: 2rem; 416 | } 417 | 418 | .mr3 { 419 | margin-right: 2rem; 420 | } 421 | 422 | .mb3 { 423 | margin-bottom: 2rem; 424 | } 425 | 426 | .ml3 { 427 | margin-left: 2rem; 428 | } 429 | 430 | .m4 { 431 | margin: 4rem; 432 | } 433 | 434 | .mt4 { 435 | margin-top: 4rem; 436 | } 437 | 438 | .mr4 { 439 | margin-right: 4rem; 440 | } 441 | 442 | .mb4 { 443 | margin-bottom: 4rem; 444 | } 445 | 446 | .ml4 { 447 | margin-left: 4rem; 448 | } 449 | 450 | .mxn1 { 451 | margin-left: -.5rem; 452 | margin-right: -.5rem; 453 | } 454 | 455 | .mxn2 { 456 | margin-left: -1rem; 457 | margin-right: -1rem; 458 | } 459 | 460 | .mxn3 { 461 | margin-left: -2rem; 462 | margin-right: -2rem; 463 | } 464 | 465 | .mxn4 { 466 | margin-left: -4rem; 467 | margin-right: -4rem; 468 | } 469 | 470 | .mx-auto { 471 | margin-left: auto; 472 | margin-right: auto; 473 | } 474 | 475 | .p1 { 476 | padding: .5rem; 477 | } 478 | 479 | .py1 { 480 | padding-top: .5rem; 481 | padding-bottom: .5rem; 482 | } 483 | 484 | .px1 { 485 | padding-left: .5rem; 486 | padding-right: .5rem; 487 | } 488 | 489 | .p2 { 490 | padding: 1rem; 491 | } 492 | 493 | .py2 { 494 | padding-top: 1rem; 495 | padding-bottom: 1rem; 496 | } 497 | 498 | .px2 { 499 | padding-left: 1rem; 500 | padding-right: 1rem; 501 | } 502 | 503 | .p3 { 504 | padding: 2rem; 505 | } 506 | 507 | .py3 { 508 | padding-top: 2rem; 509 | padding-bottom: 2rem; 510 | } 511 | 512 | .px3 { 513 | padding-left: 2rem; 514 | padding-right: 2rem; 515 | } 516 | 517 | .p4 { 518 | padding: 4rem; 519 | } 520 | 521 | .py4 { 522 | padding-top: 4rem; 523 | padding-bottom: 4rem; 524 | } 525 | 526 | .px4 { 527 | padding-left: 4rem; 528 | padding-right: 4rem; 529 | } 530 | 531 | 532 | 533 | /* Basscss Utility Responsive States */ 534 | 535 | .sm-show, 536 | .md-show, 537 | .lg-show { 538 | display: none !important; 539 | } 540 | 541 | @media (min-width: 40em) { 542 | .sm-show { 543 | display: block !important; 544 | } 545 | } 546 | 547 | @media (min-width: 52em) { 548 | .md-show { 549 | display: block !important; 550 | } 551 | } 552 | 553 | @media (min-width: 64em) { 554 | .lg-show { 555 | display: block !important; 556 | } 557 | } 558 | 559 | @media (min-width: 40em) { 560 | .sm-hide { 561 | display: none !important; 562 | } 563 | } 564 | 565 | @media (min-width: 52em) { 566 | .md-hide { 567 | display: none !important; 568 | } 569 | } 570 | 571 | @media (min-width: 64em) { 572 | .lg-hide { 573 | display: none !important; 574 | } 575 | } 576 | 577 | .display-none { 578 | display: none !important; 579 | } 580 | 581 | .hide { 582 | position: absolute !important; 583 | height: 1px; 584 | width: 1px; 585 | overflow: hidden; 586 | clip: rect(1px, 1px, 1px, 1px); 587 | } 588 | 589 | /* Basscss Positions */ 590 | 591 | .relative { 592 | position: relative; 593 | } 594 | 595 | .absolute { 596 | position: absolute; 597 | } 598 | 599 | .fixed { 600 | position: fixed; 601 | } 602 | 603 | .top-0 { 604 | top: 0; 605 | } 606 | 607 | .right-0 { 608 | right: 0; 609 | } 610 | 611 | .bottom-0 { 612 | bottom: 0; 613 | } 614 | 615 | .left-0 { 616 | left: 0; 617 | } 618 | 619 | .z1 { 620 | z-index: 1; 621 | } 622 | 623 | .z2 { 624 | z-index: 2; 625 | } 626 | 627 | .z3 { 628 | z-index: 3; 629 | } 630 | 631 | .z4 { 632 | z-index: 4; 633 | } 634 | 635 | .absolute-center { 636 | top: 0; 637 | right: 0; 638 | bottom: 0; 639 | left: 0; 640 | margin: auto; 641 | display: table; 642 | } 643 | 644 | /* Basscss UI Utility Button Sizes */ 645 | 646 | .button-small { 647 | padding: .25rem .5rem; 648 | } 649 | 650 | .button-big { 651 | padding: 1rem 1.25rem; 652 | } 653 | 654 | .button-narrow { 655 | padding-left: .5rem; 656 | padding-right: .5rem; 657 | } 658 | 659 | 660 | 661 | /* Basscss Grid */ 662 | 663 | .container { 664 | max-width: 64em; 665 | margin-left: auto; 666 | margin-right: auto; 667 | } 668 | 669 | .col { 670 | float: left; 671 | box-sizing: border-box; 672 | } 673 | 674 | .col-right { 675 | float: right; 676 | box-sizing: border-box; 677 | } 678 | 679 | .col-1 { 680 | width: 8.333333333333332%; 681 | } 682 | 683 | .col-2 { 684 | width: 16.666666666666664%; 685 | } 686 | 687 | .col-3 { 688 | width: 25%; 689 | } 690 | 691 | .col-4 { 692 | width: 33.33333333333333%; 693 | } 694 | 695 | .col-5 { 696 | width: 41.66666666666667%; 697 | } 698 | 699 | .col-6 { 700 | width: 50%; 701 | } 702 | 703 | .col-7 { 704 | width: 58.333333333333336%; 705 | } 706 | 707 | .col-8 { 708 | width: 66.66666666666666%; 709 | } 710 | 711 | .col-9 { 712 | width: 75%; 713 | } 714 | 715 | .col-10 { 716 | width: 83.33333333333334%; 717 | } 718 | 719 | .col-11 { 720 | width: 91.66666666666666%; 721 | } 722 | 723 | .col-12 { 724 | width: 100%; 725 | } 726 | 727 | @media (min-width: 40em) { 728 | .sm-col { 729 | float: left; 730 | box-sizing: border-box; 731 | } 732 | 733 | .sm-col-right { 734 | float: right; 735 | box-sizing: border-box; 736 | } 737 | 738 | .sm-col-1 { 739 | width: 8.333333333333332%; 740 | } 741 | 742 | .sm-col-2 { 743 | width: 16.666666666666664%; 744 | } 745 | 746 | .sm-col-3 { 747 | width: 25%; 748 | } 749 | 750 | .sm-col-4 { 751 | width: 33.33333333333333%; 752 | } 753 | 754 | .sm-col-5 { 755 | width: 41.66666666666667%; 756 | } 757 | 758 | .sm-col-6 { 759 | width: 50%; 760 | } 761 | 762 | .sm-col-7 { 763 | width: 58.333333333333336%; 764 | } 765 | 766 | .sm-col-8 { 767 | width: 66.66666666666666%; 768 | } 769 | 770 | .sm-col-9 { 771 | width: 75%; 772 | } 773 | 774 | .sm-col-10 { 775 | width: 83.33333333333334%; 776 | } 777 | 778 | .sm-col-11 { 779 | width: 91.66666666666666%; 780 | } 781 | 782 | .sm-col-12 { 783 | width: 100%; 784 | } 785 | } 786 | 787 | @media (min-width: 52em) { 788 | .md-col { 789 | float: left; 790 | box-sizing: border-box; 791 | } 792 | 793 | .md-col-right { 794 | float: right; 795 | box-sizing: border-box; 796 | } 797 | 798 | .md-col-1 { 799 | width: 8.333333333333332%; 800 | } 801 | 802 | .md-col-2 { 803 | width: 16.666666666666664%; 804 | } 805 | 806 | .md-col-3 { 807 | width: 25%; 808 | } 809 | 810 | .md-col-4 { 811 | width: 33.33333333333333%; 812 | } 813 | 814 | .md-col-5 { 815 | width: 41.66666666666667%; 816 | } 817 | 818 | .md-col-6 { 819 | width: 50%; 820 | } 821 | 822 | .md-col-7 { 823 | width: 58.333333333333336%; 824 | } 825 | 826 | .md-col-8 { 827 | width: 66.66666666666666%; 828 | } 829 | 830 | .md-col-9 { 831 | width: 75%; 832 | } 833 | 834 | .md-col-10 { 835 | width: 83.33333333333334%; 836 | } 837 | 838 | .md-col-11 { 839 | width: 91.66666666666666%; 840 | } 841 | 842 | .md-col-12 { 843 | width: 100%; 844 | } 845 | } 846 | 847 | @media (min-width: 64em) { 848 | .lg-col { 849 | float: left; 850 | box-sizing: border-box; 851 | } 852 | 853 | .lg-col-right { 854 | float: right; 855 | box-sizing: border-box; 856 | } 857 | 858 | .lg-col-1 { 859 | width: 8.333333333333332%; 860 | } 861 | 862 | .lg-col-2 { 863 | width: 16.666666666666664%; 864 | } 865 | 866 | .lg-col-3 { 867 | width: 25%; 868 | } 869 | 870 | .lg-col-4 { 871 | width: 33.33333333333333%; 872 | } 873 | 874 | .lg-col-5 { 875 | width: 41.66666666666667%; 876 | } 877 | 878 | .lg-col-6 { 879 | width: 50%; 880 | } 881 | 882 | .lg-col-7 { 883 | width: 58.333333333333336%; 884 | } 885 | 886 | .lg-col-8 { 887 | width: 66.66666666666666%; 888 | } 889 | 890 | .lg-col-9 { 891 | width: 75%; 892 | } 893 | 894 | .lg-col-10 { 895 | width: 83.33333333333334%; 896 | } 897 | 898 | .lg-col-11 { 899 | width: 91.66666666666666%; 900 | } 901 | 902 | .lg-col-12 { 903 | width: 100%; 904 | } 905 | } 906 | 907 | 908 | 909 | /* 910 | * Basscss Flex Object 911 | */ 912 | 913 | .flex { 914 | display: flex; 915 | } 916 | 917 | .flex-column { 918 | flex-direction: column; 919 | } 920 | 921 | .flex-wrap { 922 | flex-wrap: wrap; 923 | } 924 | 925 | .flex-center { 926 | align-items: center; 927 | } 928 | 929 | .flex-baseline { 930 | align-items: baseline; 931 | } 932 | 933 | .flex-stretch { 934 | align-items: stretch; 935 | } 936 | 937 | .flex-start { 938 | align-items: flex-start; 939 | } 940 | 941 | .flex-end { 942 | align-items: flex-end; 943 | } 944 | 945 | .flex-first { 946 | order: -1; 947 | } 948 | 949 | .flex-last { 950 | order: 1024; 951 | } 952 | 953 | .flex-auto { 954 | flex: 1 1 auto; 955 | } 956 | 957 | .flex-grow { 958 | flex: 1 0 auto; 959 | } 960 | 961 | .flex-none { 962 | flex: none; 963 | } 964 | 965 | .flex > div { 966 | box-sizing: border-box; 967 | } 968 | 969 | @media (min-width: 40em) { 970 | .sm-flex { 971 | display: flex; 972 | } 973 | 974 | .sm-flex > div { 975 | box-sizing: border-box; 976 | } 977 | } 978 | 979 | @media (min-width: 52em) { 980 | .md-flex { 981 | display: flex; 982 | } 983 | 984 | .md-flex > div { 985 | box-sizing: border-box; 986 | } 987 | } 988 | 989 | @media (min-width: 64em) { 990 | .lg-flex { 991 | display: flex; 992 | } 993 | 994 | .lg-flex > div { 995 | box-sizing: border-box; 996 | } 997 | } 998 | 999 | /* Basscss Color Base */ 1000 | 1001 | /* 1002 | 1003 | COLOR VARIABLES 1004 | 1005 | - Cool 1006 | - Warm 1007 | - Gray Scale 1008 | 1009 | */ 1010 | 1011 | :root { 1012 | /* Cool */ 1013 | /* Warm */ 1014 | /* Gray scale */ 1015 | } 1016 | 1017 | body { 1018 | color: #222; 1019 | background-color: white; 1020 | } 1021 | 1022 | a { 1023 | color: #0074d9; 1024 | text-decoration: none; 1025 | } 1026 | 1027 | a:hover { 1028 | text-decoration: underline; 1029 | } 1030 | 1031 | pre, 1032 | code { 1033 | background-color: #ddd; 1034 | border-radius: 3px; 1035 | } 1036 | 1037 | hr { 1038 | border: 0; 1039 | border-bottom-style: solid; 1040 | border-bottom-width: 1px; 1041 | border-bottom-color: rgba(0, 0, 0, .125); 1042 | } 1043 | 1044 | .button { 1045 | color: white; 1046 | background-color: #0074d9; 1047 | border-radius: 3px; 1048 | transition-duration: .05s; 1049 | transition-timing-function: ease-out; 1050 | transition-property: box-shadow, background-color; 1051 | } 1052 | 1053 | .button:hover { 1054 | box-shadow: inset 0 0 0 20rem rgba(0, 0, 0, .0625); 1055 | } 1056 | 1057 | .button:focus { 1058 | outline: none; 1059 | border-color: rgba(0, 0, 0, .125); 1060 | box-shadow: 0 0 2px 1px rgba(0, 0, 0, .25); 1061 | } 1062 | 1063 | .button:active, 1064 | .button.is-active { 1065 | box-shadow: inset 0 0 0 20rem rgba(0, 0, 0, .125), 1066 | inset 0 3px 4px 0 rgba(0, 0, 0, .25), 1067 | 0 0 1px rgba(0, 0, 0, .125); 1068 | } 1069 | 1070 | .button:disabled, 1071 | .button.is-disabled { 1072 | opacity: .5; 1073 | } 1074 | 1075 | 1076 | 1077 | /* Basscss Color Forms */ 1078 | 1079 | .field-light { 1080 | background-color: white; 1081 | transition: box-shadow .2s ease; 1082 | border-style: solid; 1083 | border-width: 1px; 1084 | border-color: rgba(0, 0, 0, .125); 1085 | border-radius: 3px; 1086 | } 1087 | 1088 | .field-light:focus { 1089 | outline: none; 1090 | border-color: #0074d9; 1091 | box-shadow: 0 0 2px rgba(0, 116, 217, .5); 1092 | } 1093 | 1094 | .field-light:disabled { 1095 | color: #aaa; 1096 | background-color: rgba(0, 0, 0, .125); 1097 | } 1098 | 1099 | .field-light:read-only:not(select) { 1100 | background-color: rgba(0, 0, 0, .125); 1101 | } 1102 | 1103 | .field-light:invalid { 1104 | border-color: #ff4136; 1105 | } 1106 | 1107 | .field-light.is-success { 1108 | border-color: #2ecc40; 1109 | } 1110 | 1111 | .field-light.is-warning { 1112 | border-color: #f9af28; 1113 | } 1114 | 1115 | .field-light.is-error { 1116 | border-color: #ff4136; 1117 | } 1118 | 1119 | .radio-light, 1120 | .checkbox-light { 1121 | transition: box-shadow .2s ease; 1122 | } 1123 | 1124 | .radio-light { 1125 | border-radius: 50%; 1126 | } 1127 | 1128 | .radio-light:focus, 1129 | .checkbox-light:focus { 1130 | outline: none; 1131 | box-shadow: 0 0 2px rgba(0, 116, 217, .5); 1132 | } 1133 | 1134 | 1135 | 1136 | /* Basscss Color Forms Dark */ 1137 | 1138 | .field-dark { 1139 | color: white; 1140 | background-color: rgba(0, 0, 0, .25); 1141 | border: 1px solid rgba(0, 0, 0, .0625); 1142 | border-radius: 3px; 1143 | } 1144 | 1145 | .field-dark::placeholder { 1146 | color: rgba(255, 255, 255, .75); 1147 | } 1148 | 1149 | .field-dark:focus { 1150 | outline: 0; 1151 | border: 1px solid rgba(255, 255, 255, .5); 1152 | } 1153 | 1154 | .field-dark:read-only:not(select) { 1155 | background-color: rgba(255, 255, 255, .25); 1156 | } 1157 | 1158 | .field-dark:invalid { 1159 | border-color: #ff4136; 1160 | } 1161 | 1162 | .field-dark.is-success { 1163 | border-color: #2ecc40; 1164 | } 1165 | 1166 | .field-dark.is-warning { 1167 | border-color: #f9af28; 1168 | } 1169 | 1170 | .field-dark.is-error { 1171 | border-color: #ff4136; 1172 | } 1173 | 1174 | 1175 | 1176 | /* Basscss Input Range */ 1177 | 1178 | input[type=range] { 1179 | vertical-align: middle; 1180 | background-color: transparent; 1181 | } 1182 | 1183 | .range-light { 1184 | color: inherit; 1185 | -webkit-appearance: none; 1186 | padding-top: .5rem; 1187 | padding-bottom: .5rem; 1188 | } 1189 | 1190 | .range-light::-webkit-slider-thumb { 1191 | -webkit-appearance: none; 1192 | position: relative; 1193 | width: .5rem; 1194 | height: 1.25rem; 1195 | border-radius: 3px; 1196 | background-color: currentcolor; 1197 | cursor: pointer; 1198 | margin-top: -0.5rem; 1199 | } 1200 | 1201 | /* Touch screen friendly pseudo element */ 1202 | 1203 | .range-light::-webkit-slider-thumb:before { 1204 | content: ''; 1205 | display: block; 1206 | position: absolute; 1207 | top: -0.5rem; 1208 | left: -0.875rem; 1209 | width: 2.25rem; 1210 | height: 2.25rem; 1211 | opacity: 0; 1212 | } 1213 | 1214 | .range-light::-moz-range-thumb { 1215 | width: .5rem; 1216 | height: 1.25rem; 1217 | border-radius: 3px; 1218 | border-color: transparent; 1219 | border-width: 0; 1220 | background-color: currentcolor; 1221 | cursor: pointer; 1222 | } 1223 | 1224 | .range-light::-webkit-slider-runnable-track { 1225 | height: 0.25rem; 1226 | cursor: pointer; 1227 | border-radius: 3px; 1228 | background-color: rgba(0, 0, 0, .25); 1229 | } 1230 | 1231 | .range-light::-moz-range-track { 1232 | height: 0.25rem; 1233 | cursor: pointer; 1234 | border-radius: 3px; 1235 | background-color: rgba(0, 0, 0, .25); 1236 | } 1237 | 1238 | .range-light:focus { 1239 | outline: none; 1240 | } 1241 | 1242 | .range-light:focus::-webkit-slider-thumb { 1243 | outline: none; 1244 | border: 0; 1245 | box-shadow: 0 0 1px 2px currentcolor; 1246 | } 1247 | 1248 | .range-light:focus::-moz-range-thumb { 1249 | outline: none; 1250 | border: 0; 1251 | box-shadow: 0 0 1px 2px currentcolor; 1252 | } 1253 | 1254 | 1255 | 1256 | /* Basscss Color Tables */ 1257 | 1258 | .table-light th, 1259 | .table-light td { 1260 | border-bottom-style: solid; 1261 | border-bottom-width: 1px; 1262 | border-bottom-color: rgba(0, 0, 0, .125); 1263 | } 1264 | 1265 | .table-light tr:last-child td { 1266 | border-bottom: 0; 1267 | } 1268 | 1269 | 1270 | 1271 | /* Basscss Button Outline */ 1272 | 1273 | .button-outline { 1274 | position: relative; 1275 | z-index: 2; 1276 | color: inherit; 1277 | background-color: transparent; 1278 | border-radius: 3px; 1279 | border: 1px solid currentcolor; 1280 | transition-duration: .1s; 1281 | transition-timing-function: ease-out; 1282 | transition-property: box-shadow, background-color; 1283 | } 1284 | 1285 | .button-outline:before { 1286 | content: ''; 1287 | width: 100%; 1288 | height: 100%; 1289 | display: block; 1290 | position: absolute; 1291 | z-index: -1; 1292 | top: -1px; 1293 | left: -1px; 1294 | border: 1px solid transparent; 1295 | background-color: currentcolor; 1296 | border-radius: 3px; 1297 | transition-duration: .1s; 1298 | transition-timing-function: ease-out; 1299 | transition-property: opacity; 1300 | opacity: 0; 1301 | } 1302 | 1303 | .button-outline:hover { 1304 | box-shadow: none; 1305 | } 1306 | 1307 | .button-outline:hover:before { 1308 | opacity: .125; 1309 | } 1310 | 1311 | .button-outline:focus { 1312 | outline: none; 1313 | border: 1px solid currentcolor; 1314 | box-shadow: 0 0 3px 1px; 1315 | } 1316 | 1317 | .button-outline:active, 1318 | .button-outline.is-active { 1319 | box-shadow: inset 0 1px 5px 0, 0 0 1px; 1320 | } 1321 | 1322 | .button-outline:disabled, 1323 | .button-outline.is-disabled { 1324 | opacity: .5; 1325 | } 1326 | 1327 | 1328 | 1329 | /* Basscss Button Transparent */ 1330 | 1331 | .button-transparent { 1332 | position: relative; 1333 | z-index: 2; 1334 | color: inherit; 1335 | background-color: transparent; 1336 | border-radius: 0; 1337 | border: 1px solid transparent; 1338 | transition-duration: .1s; 1339 | transition-timing-function: ease-out; 1340 | transition-property: box-shadow; 1341 | } 1342 | 1343 | .button-transparent:before { 1344 | content: ''; 1345 | width: 100%; 1346 | height: 100%; 1347 | display: block; 1348 | position: absolute; 1349 | z-index: -1; 1350 | top: -1px; 1351 | left: -1px; 1352 | border: 1px solid transparent; 1353 | background-color: currentcolor; 1354 | transition-duration: .1s; 1355 | transition-timing-function: ease-out; 1356 | transition-property: opacity; 1357 | opacity: 0; 1358 | } 1359 | 1360 | .button-transparent:hover { 1361 | box-shadow: none; 1362 | } 1363 | 1364 | .button-transparent:hover:before { 1365 | opacity: .0625; 1366 | opacity: .09375; 1367 | } 1368 | 1369 | .button-transparent:focus { 1370 | outline: none; 1371 | border-color: transparent; 1372 | box-shadow: 0 0 3px; 1373 | } 1374 | 1375 | .button-transparent:active:before, 1376 | .button-transparent.is-active:before { 1377 | opacity: .0625; 1378 | } 1379 | 1380 | .button-transparent:disabled, 1381 | .button-transparent.is-disabled { 1382 | opacity: .5; 1383 | } 1384 | 1385 | 1386 | 1387 | /* Basscss Background Images */ 1388 | 1389 | .bg-cover { 1390 | background-size: cover; 1391 | } 1392 | 1393 | .bg-contain { 1394 | background-size: contain; 1395 | } 1396 | 1397 | .bg-center { 1398 | background-position: center; 1399 | } 1400 | 1401 | .bg-top { 1402 | background-position: top; 1403 | } 1404 | 1405 | .bg-right { 1406 | background-position: right; 1407 | } 1408 | 1409 | .bg-bottom { 1410 | background-position: bottom; 1411 | } 1412 | 1413 | .bg-left { 1414 | background-position: left; 1415 | } 1416 | 1417 | /* Basscss Color Borders */ 1418 | 1419 | .border { 1420 | border-style: solid; 1421 | border-width: 1px; 1422 | border-color: rgba(0, 0, 0, .125); 1423 | } 1424 | 1425 | .border-top { 1426 | border-top-style: solid; 1427 | border-top-width: 1px; 1428 | border-top-color: rgba(0, 0, 0, .125); 1429 | } 1430 | 1431 | .border-right { 1432 | border-right-style: solid; 1433 | border-right-width: 1px; 1434 | border-right-color: rgba(0, 0, 0, .125); 1435 | } 1436 | 1437 | .border-bottom { 1438 | border-bottom-style: solid; 1439 | border-bottom-width: 1px; 1440 | border-bottom-color: rgba(0, 0, 0, .125); 1441 | } 1442 | 1443 | .border-left { 1444 | border-left-style: solid; 1445 | border-left-width: 1px; 1446 | border-left-color: rgba(0, 0, 0, .125); 1447 | } 1448 | 1449 | .rounded { 1450 | border-radius: 3px; 1451 | } 1452 | 1453 | .circle { 1454 | border-radius: 50%; 1455 | } 1456 | 1457 | .rounded-top { 1458 | border-radius: 3px 3px 0 0; 1459 | } 1460 | 1461 | .rounded-right { 1462 | border-radius: 0 3px 3px 0; 1463 | } 1464 | 1465 | .rounded-bottom { 1466 | border-radius: 0 0 3px 3px; 1467 | } 1468 | 1469 | .rounded-left { 1470 | border-radius: 3px 0 0 3px; 1471 | } 1472 | 1473 | .not-rounded { 1474 | border-radius: 0; 1475 | } 1476 | 1477 | 1478 | 1479 | /* Basscss Colors */ 1480 | 1481 | /* Color */ 1482 | 1483 | .black, 1484 | .dark-gray { 1485 | color: #222; 1486 | } 1487 | 1488 | .gray, 1489 | .mid-gray { 1490 | color: #aaa; 1491 | } 1492 | 1493 | .silver, 1494 | .light-gray { 1495 | color: #ddd; 1496 | } 1497 | 1498 | .white { 1499 | color: #fff; 1500 | } 1501 | 1502 | .aqua { 1503 | color: #7fdbff; 1504 | } 1505 | 1506 | .blue { 1507 | color: #0074d9; 1508 | } 1509 | 1510 | .navy { 1511 | color: #001f3f; 1512 | } 1513 | 1514 | .teal { 1515 | color: #39cccc; 1516 | } 1517 | 1518 | .green { 1519 | color: #2ecc40; 1520 | } 1521 | 1522 | .olive { 1523 | color: #3d9970; 1524 | } 1525 | 1526 | .lime { 1527 | color: #01ff70; 1528 | } 1529 | 1530 | .yellow { 1531 | color: #f9af28; 1532 | } 1533 | 1534 | .orange { 1535 | color: #ff851b; 1536 | } 1537 | 1538 | .red { 1539 | color: #ff4136; 1540 | } 1541 | 1542 | .fuchsia { 1543 | color: #f012be; 1544 | } 1545 | 1546 | .purple { 1547 | color: #b10dc9; 1548 | } 1549 | 1550 | .maroon { 1551 | color: #85144b; 1552 | } 1553 | 1554 | /* Background Color */ 1555 | 1556 | .bg-black, 1557 | .bg-dark-gray { 1558 | background-color: #222; 1559 | } 1560 | 1561 | .bg-gray, 1562 | .bg-mid-gray { 1563 | background-color: #aaa; 1564 | } 1565 | 1566 | .bg-silver, 1567 | .bg-light-gray { 1568 | background-color: #ddd; 1569 | } 1570 | 1571 | .bg-white { 1572 | background-color: #fff; 1573 | } 1574 | 1575 | .bg-aqua { 1576 | background-color: #7fdbff; 1577 | } 1578 | 1579 | .bg-blue { 1580 | background-color: #0074d9; 1581 | } 1582 | 1583 | .bg-navy { 1584 | background-color: #001f3f; 1585 | } 1586 | 1587 | .bg-teal { 1588 | background-color: #39cccc; 1589 | } 1590 | 1591 | .bg-green { 1592 | background-color: #2ecc40; 1593 | } 1594 | 1595 | .bg-olive { 1596 | background-color: #3d9970; 1597 | } 1598 | 1599 | .bg-lime { 1600 | background-color: #01ff70; 1601 | } 1602 | 1603 | .bg-yellow { 1604 | background-color: #f9af28; 1605 | } 1606 | 1607 | .bg-orange { 1608 | background-color: #ff851b; 1609 | } 1610 | 1611 | .bg-red { 1612 | background-color: #ff4136; 1613 | } 1614 | 1615 | .bg-fuchsia { 1616 | background-color: #f012be; 1617 | } 1618 | 1619 | .bg-purple { 1620 | background-color: #b10dc9; 1621 | } 1622 | 1623 | .bg-maroon { 1624 | background-color: #85144b; 1625 | } 1626 | 1627 | .bg-darken-1 { 1628 | background-color: rgba(0, 0, 0, .0625); 1629 | } 1630 | 1631 | .bg-darken-2 { 1632 | background-color: rgba(0, 0, 0, .125); 1633 | } 1634 | 1635 | .bg-darken-3 { 1636 | background-color: rgba(0, 0, 0, .25); 1637 | } 1638 | 1639 | .bg-darken-4 { 1640 | background-color: rgba(0, 0, 0, .5); 1641 | } 1642 | 1643 | /* Border Color */ 1644 | 1645 | .border-aqua { 1646 | border-color: #7fdbff; 1647 | } 1648 | 1649 | .border-blue { 1650 | border-color: #0074d9; 1651 | } 1652 | 1653 | .border-navy { 1654 | border-color: #001f3f; 1655 | } 1656 | 1657 | .border-teal { 1658 | border-color: #39cccc; 1659 | } 1660 | 1661 | .border-green { 1662 | border-color: #2ecc40; 1663 | } 1664 | 1665 | .border-olive { 1666 | border-color: #3d9970; 1667 | } 1668 | 1669 | .border-lime { 1670 | border-color: #01ff70; 1671 | } 1672 | 1673 | .border-yellow { 1674 | border-color: #f9af28; 1675 | } 1676 | 1677 | .border-orange { 1678 | border-color: #ff851b; 1679 | } 1680 | 1681 | .border-red { 1682 | border-color: #ff4136; 1683 | } 1684 | 1685 | .border-fuchsia { 1686 | border-color: #f012be; 1687 | } 1688 | 1689 | .border-purple { 1690 | border-color: #b10dc9; 1691 | } 1692 | 1693 | .border-maroon { 1694 | border-color: #85144b; 1695 | } 1696 | 1697 | .border-black { 1698 | border-color: #222; 1699 | } 1700 | 1701 | .border-gray { 1702 | border-color: #aaa; 1703 | } 1704 | 1705 | .border-silver { 1706 | border-color: #ddd; 1707 | } 1708 | 1709 | .border-white { 1710 | border-color: #fff; 1711 | } 1712 | 1713 | .border-darken-1 { 1714 | border-color: rgba(0, 0, 0, .0625); 1715 | } 1716 | 1717 | .border-darken-2 { 1718 | border-color: rgba(0, 0, 0, .125); 1719 | } 1720 | 1721 | .border-darken-3 { 1722 | border-color: rgba(0, 0, 0, .25); 1723 | } 1724 | 1725 | .border-darken-4 { 1726 | border-color: rgba(0, 0, 0, .5); 1727 | } 1728 | 1729 | /* Opacity */ 1730 | 1731 | .muted { 1732 | opacity: .5; 1733 | } 1734 | 1735 | /* 1736 | 1737 | COLOR VARIABLES 1738 | 1739 | - Cool 1740 | - Warm 1741 | - Gray Scale 1742 | 1743 | */ 1744 | 1745 | :root { 1746 | /* Cool */ 1747 | /* Warm */ 1748 | /* Gray scale */ 1749 | } 1750 | 1751 | 1752 | 1753 | /* Basscss Defaults */ 1754 | 1755 | /* 1756 | 1757 | COLOR VARIABLES 1758 | 1759 | - Cool 1760 | - Warm 1761 | - Gray Scale 1762 | 1763 | */ 1764 | 1765 | :root { 1766 | /* Cool */ 1767 | /* Warm */ 1768 | /* Gray scale */ 1769 | } 1770 | 1771 | :root { 1772 | /* Legacy support */ 1773 | } -------------------------------------------------------------------------------- /public/leokzw/index.en.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Front-end United for leokz 9 | 10 | 11 | 12 | 13 |
14 |
15 | 27 | 28 |
29 |

frontend united

30 | 31 |

Developers united for Leonardo Konarzewski

32 | Find out more 33 |
34 |
35 | 36 |
37 |
38 |
39 |

Campaign

40 |

We are joining forces for Leonardo Konarzewski to help him raise the funds for his treatment in the United Estates.

41 |

Our aim is to raise the money in the least amount of time.

42 | View how you can take part 43 |
44 | 45 |
46 |
47 | 48 |
49 |
50 |
51 |
52 | 53 |
54 |
55 |

Initiatives

56 |

These are courses, conferences and talks that you can buy to help us raise the funds needed.

57 |
58 | 59 |
60 |
61 |

BrazilJS

62 | 63 |
64 | 65 |
66 |

BrazilJS—the universe's biggest JavaScript conference—is also helping Leo in his battle! Everyone who buys from the early bird "Konarzewski" batch until 10/05 will help in his treatment: R$50,00 from the ticket price will be donated to the campaign!

67 |

The event will take place in 21/08 and 22/08, in Porto Alegre - RS, and will gather highly skilled people from the JavaScript community. You can't miss that out!

68 |
69 | 70 |
71 | Buy your BrazilJS ticket! 72 |
73 |
74 | 75 |
76 | 77 |
78 |
79 |

NEJS Hackathon 2015

80 | 81 |
82 | 83 |
84 |

The folks from NordesteJS are organising the 1st Northeast JavaScript Hackathon, which will take place on 04/07 and 05/07, at the Universidade Federal do Rio Grande do Norte!

85 |

The ticket is only R$30,00, and all money will be donated to Leo's fundraising. And on top of that, you'll get to know the people from NeJS community, will learn something, and share your knowledge!

86 |
87 | 88 |
89 | Veja o site da hackathon! 90 |
91 |
92 | 93 |
94 | 95 |
96 |
97 |

Devs pelo leokz

98 | 99 |
100 | 101 |
102 |

In partnership with Eventials we organised an online conference with many Brazilian developers.

103 |

Those who couldn't see the live transmission can still contribute! For R$50,00 only, you'll have access to the presentations recordings, and will be able to help Leo! All raised funds will still be redirected to Leo's fundraising!

104 |
105 | 106 |
107 |

Speakers

108 | 109 |
110 |
111 |
112 | 113 | 114 | 115 |
116 |
117 |

Bernard de Luna

118 |

119 | Lean UX: stop creating products, start creating experiences! 120 |

121 |

A product may be easily swappable, but an remarkable experience may change lives, create stories, and become a case of love and affection.

122 |
123 |
124 | 125 |
126 |
127 | 128 | 129 | 130 |
131 |
132 |

Caio Gondim

133 |

134 | Starting with Git and Github 135 |

136 |

137 | From basic Git to your open source project in the air on 138 | Github. How and why to work with Git, what are branches, what 139 | are tags, how to resolve conflicts, how to create and how to 140 | maintain an open source project. 141 |

142 |
143 |
144 | 145 |
146 |
147 | 148 | 149 | 150 |
151 |
152 |

Daniel Filho

153 |

154 | Creating a static web server from stratch (and something more) 155 |

156 |

Let's see how simple creating a static web server is. It'll take us 5 minutes. Then, I'll explain how the automated deploy system that we use on ZOFE works (which uses the same static server, with the help of Travis CI, GitHub, scripts, and a few friends).

157 |
158 |
159 | 160 |
161 |
162 | 163 | 164 | 165 |
166 |
167 |

Diego Eis

168 |

169 | CSS4: What's coming soon 170 |

171 |
172 |
173 | 174 |
175 |
176 | 177 | 178 | 179 |
180 |
181 |

Eduardo Shiota

182 |

183 | Organising your JavaScript in 5 steps 184 |

185 |

The terms "architecture" and "modularisation" may give you the impression that maintaining an organised JavaScript code requires planning, too much time, and too much refactoring. However, with some good practices, it's possible to improve your application's code without big redesigns and months of work. In this presentation, I'll show you how to start organising your JavaScript right away, in 5 steps, with no headaches.

186 |
187 |
188 | 189 |
190 |
191 | 192 | 193 | 194 |
195 |
196 |

Fabio Akita

197 |

198 | WTF Oriented Programming 199 |

200 |

You can't always start a project from scratch (green field), and sometimes we have to maintain other people's code (brown field). It wouldn't be so bad to keep it going forward if the code was at least clean, readable, organised, and with tests. But sometimes we find a few gems that make us think: WTF!?!? Let's see some real life examples in this presentation.

201 |
202 |
203 | 204 |
205 |
206 | 207 | 208 | 209 |
210 |
211 |

Rafael Rinaldi

212 |

213 | Visual consistency in web projects 214 |

215 |

CSS is easy to modify, but very hard to maintain and test. This presentation's idea is to share a series of techniques and tools that help us guaranteeing a web project's visual consistency.

216 |
217 |
218 |
219 |
220 | 221 |
222 | See the Devs pelo leokz videos! 223 |
224 |
225 |
226 |
227 |
228 |

HOWTO courses

229 |

230 | HOWTO donated the money from all subscriptions during 9 days and raised around R$7.000,00. Thanks everyone for joining us! 231 |

232 |
233 |
234 |
235 | 236 |
237 |
238 |
239 |

Who we are

240 |

241 | Frontend United is a group of volunteer web developers, with the aim of encourage, share, promote and manage social initiatives through technology and the internet. 242 |

243 |
244 | 245 | 330 |
331 |
332 | 333 |
334 |
335 |

Partners

336 | 337 |
338 |
339 | 340 | 341 | 342 |
343 |
344 |
345 |
346 | 347 | 358 |
359 | 369 | 370 | 371 | -------------------------------------------------------------------------------- /public/leokzw/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Front-end United for leokz 9 | 10 | 11 | 12 | 13 |
14 |
15 | 27 | 28 |
29 |

frontend united

30 | 31 |

Desenvolvedores juntos por Leonardo Konarzewski

32 | Saiba mais 33 |
34 |
35 | 36 |
37 |
38 |
39 |

Campanha

40 |

Sensibilizados pela história do Leonardo Konarzewski, resolvemos unir forças e tentar ajudá-lo a conseguir a quantia necessária para o seu tratamento nos Estados Unidos.

41 |

Nossa meta é atingir o valor no menor tempo possível.

42 |

43 | Entenda como você pode participar 44 |

45 |
46 | 47 |
48 |
49 | 50 |
51 |
52 |
53 |
54 | 55 |
56 |
57 |

Iniciativas

58 |

São cursos, conferências e palestras que você adquire para nos ajudar a levantar fundos para a campanha.

59 |
60 | 61 |
62 |
63 |

BrazilJS

64 | 65 |
66 | 67 |
68 |

A BrazilJS—a maior conferência de JavaScript do universo—também está ajudando o Leo! Quem comprar o lote promocional "Konarzewski" até o dia 10/05 ajudará no seu tratamento: R$50,00 do preço do ingresso serão revertidos para a campanha!

69 |

O evento acontecerá 21/08 e 22/08 (sexta e sábado), em Porto Alegre - RS, e reunirá grandes figuras do mundo do JavaScript. Imperdível!

70 |
71 | 72 |
73 | Compre seu ticket da BrazilJS 74 |
75 |
76 | 77 |
78 | 79 |
80 |
81 |

NEJS Hackathon 2015

82 | 83 |
84 | 85 |
86 |

O pessoal do NordesteJS está organizando a 1a. Hackathon de JavaScript do Nordeste, que acontecerá nos dias 04/07 e 05/07, na Universidade Federal do Rio Grande do Norte!

87 |

A inscrição é de apenas R$30,00, e todo o dinheiro arrecadado será destinado à campanha do Leo. E de quebra, você ainda conhece o pessoal da comunidade do NeJS, aprende e compartilha conhecimento!

88 |
89 | 90 |
91 | Veja o site da hackathon! 92 |
93 |
94 | 95 |
96 | 97 |
98 |
99 |

Devs pelo leokz

100 | 101 |
102 | 103 |
104 |

Em parceria com a Eventials organizamos no dia 21/03 uma conferência online com diversos desenvolvedores brasileiros.

105 |

Para quem não pôde companhar, ainda é possível contribuir! Por apenas R$50,00, você pode ter acesso às gravações de todos os vídeos, e de quebra ajudar o Leo! Todo o dinheiro arrecadado continuará sendo revertido para a campanha!

106 |
107 | 108 |
109 |

Palestrantes

110 | 111 |
112 |
113 |
114 | 115 | 116 | 117 |
118 |
119 |

Bernard de Luna

120 |

121 | Lean UX: parem de criar produtos, comecem a criar experiências! 122 |

123 |

Um produto pode ser facilmente trocado por outro, mas uma experiência realmente marcante pode mudar vidas, criar histórias e se tornar um caso de amor.

124 |
125 |
126 | 127 |
128 |
129 | 130 | 131 | 132 |
133 |
134 |

Caio Gondim

135 |

136 | Começando com Git e Github 137 |

138 |

139 | Do básico do Git ao seu projeto open source no ar no Github. 140 | Como e por que trabalhar com Git, o que são branches, o que 141 | são tags, como resolver conflitos, como criar e como manter um 142 | projeto open source. 143 |

144 |
145 |
146 | 147 |
148 |
149 | 150 | 151 | 152 |
153 |
154 |

Daniel Filho

155 |

156 | Criando um servidor estático na web do zero (e algo mais) 157 |

158 |

Vamos entender como é simples criar um servidor estático na web. E isso leva cinco minutos. Depois disso, vou explicar como funciona o sistema automatizado de deploy que usamos no ZOFE (que usa o mesmo servidor estático, com ajuda do Travis-CI, GitHub, scripts e mais alguns colegas).

159 |
160 |
161 | 162 |
163 |
164 | 165 | 166 | 167 |
168 |
169 |

Diego Eis

170 |

171 | CSS4: O que virá muito em breve 172 |

173 |
174 |
175 | 176 |
177 |
178 | 179 | 180 | 181 |
182 |
183 |

Eduardo Shiota

184 |

185 | Organizando seu JavaScript em 5 passos 186 |

187 |

Os termos "arquitetura" e "modularização" podem dar a impressão de que manter o código JavaScript organizado requer planejamento, muito tempo, e muita refatoração. Mas com algumas boas práticas, é possível melhorar o código da sua aplicação sem grandes redesigns e meses de trabalho. Nesta palestra, mostrarei como começar agora mesmo a organizar seu JavaScript em 5 passos, sem dores de cabeça.

188 |
189 |
190 | 191 |
192 |
193 | 194 | 195 | 196 |
197 |
198 |

Fabio Akita

199 |

200 | WTF Oriented Programming 201 |

202 |

Nem sempre é possível começar um projeto do zero (green field) e às vezes somos obrigados a dar manutenção no código dos outros (brown field). Não seria ruim se o código fosse minimamente limpo, legível, organizado, com testes para que pudéssemos evoluir tranquilamente. Mas às vezes encontramos algumas pérolas que nos fazem pensar: WTF!?!? Vamos ver alguns exemplos reais nesta apresentação.

203 |
204 |
205 | 206 |
207 |
208 | 209 | 210 | 211 |
212 |
213 |

Rafael Rinaldi

214 |

215 | Consistência visual em projetos web 216 |

217 |

CSS é muito fácil de alterar, mas muito difícil de manter e testar. a ideia da talk é compartilhar uma serie de técnicas e ferramentas que ajudam a garantir a consistência visual de projetos web.

218 |
219 |
220 |
221 |
222 | 223 |
224 | Acesse os vídeos do Devs pelo leokz! 225 |
226 |
227 | 228 |
229 | 230 |
231 |
232 |

Cursos da HOWTO

233 |

234 | O HOWTO fez uma campanha de 10/03 a 18/03 onde todas 235 | as inscrições realizadas seriam revertidas para a Campanha do Leo. Foram arrecadados pouco mais de R$7.000,00. 236 |

237 | 238 |

239 | A todos que participaram, um muito obrigado! 240 |

241 |
242 |
243 |
244 | 245 |
246 |
247 |
248 |

Quem somos

249 |

250 | Frontend United é composta por um grupo de desenvolvedores web 251 | voluntários, com o propósito de encorajar, compartilhar, promover e 252 | guiar iniciativas sociais através da tecnologia e da internet. 253 |

254 |
255 | 256 | 341 |
342 |
343 | 344 |
345 |
346 |

Apoio

347 | 348 |
349 |
350 | 351 | 352 | 353 |
354 |
355 |
356 |
357 | 358 | 369 |
370 | 380 | 381 | 382 | -------------------------------------------------------------------------------- /public/leokzw/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | color: #444; 3 | } 4 | 5 | p { 6 | font-size: 1.15em; 7 | font-weight: 300; 8 | } 9 | 10 | .visuallyhidden { 11 | border: 0; 12 | clip: rect(0 0 0 0); 13 | height: 1px; 14 | margin: -1px; 15 | overflow: hidden; 16 | padding: 0; 17 | position: absolute; 18 | width: 1px; 19 | } 20 | 21 | .caps { 22 | letter-spacing: -.01em 23 | } 24 | 25 | .button-bigger { 26 | padding: 1.75rem 3rem; 27 | } 28 | 29 | .campaign-video { 30 | position: relative; 31 | padding-bottom: 66.6%; 32 | height: 0; 33 | } 34 | 35 | .campaign-video iframe { 36 | position: absolute; 37 | top: 0; 38 | left: 0; 39 | width: 100%; 40 | height: 100%; 41 | } 42 | 43 | @media screen and (max-width: 400px) { 44 | .avatars { 45 | display: -webkit-flex; 46 | display: -ms-flexbox; 47 | display: flex; 48 | -webkit-flex-flow: row wrap; 49 | -ms-flex-flow: row wrap; 50 | flex-flow: row wrap; 51 | } 52 | 53 | .avatars > li { 54 | -webkit-flex: 0 1 49.8%; 55 | -ms-flex: 0 1 49.8%; 56 | flex: 0 1 49.8%; 57 | } 58 | 59 | .button-bigger { 60 | line-height: 1.2em; 61 | } 62 | } 63 | 64 | .contributors-list .h5 { 65 | white-space: nowrap; 66 | } 67 | 68 | .eventials-speakers { 69 | margin-left: auto; 70 | margin-right: auto; 71 | } 72 | 73 | .eventials-speaker { 74 | overflow: hidden; 75 | padding-bottom: 2rem; 76 | } 77 | 78 | .eventials-speaker-photo { 79 | box-sizing: border-box; 80 | width: 17.5%; 81 | padding: 0 1em 0 0; 82 | float: left; 83 | } 84 | 85 | .eventials-speaker-info { 86 | width: 82.5%; 87 | float: left; 88 | } 89 | 90 | .eventials-speaker-photo img { 91 | max-width: 100%; 92 | border-radius: 50%; 93 | } 94 | 95 | .eventials-speakers .h3 { 96 | margin-top: 0; 97 | } 98 | 99 | .eventials-speaker .h4 { 100 | font-size: 1em; 101 | } 102 | 103 | .eventials-speakers p { 104 | font-size: 1em; 105 | margin-bottom: 0; 106 | } 107 | 108 | @media (max-width: 40em) { 109 | .eventials-speaker-photo { 110 | float: none; 111 | width: 33.3%; 112 | padding: 0; 113 | margin: 0 auto 1em; 114 | } 115 | 116 | .eventials-speaker-info { 117 | width: 100%; 118 | float: none; 119 | } 120 | 121 | .eventials-speakers .h3, 122 | .eventials-speakers .h4 { 123 | text-align: center; 124 | } 125 | 126 | .button-bigger { 127 | line-height: 1.2em; 128 | } 129 | } 130 | --------------------------------------------------------------------------------