├── Frontized.md ├── README v4.md ├── README.md ├── gulpfile.js ├── index.html ├── package.json ├── src ├── css │ └── bootstrap.css ├── images │ ├── bg-dvr.png │ ├── favicon.png │ ├── fill-mask.png │ ├── logo.png │ ├── noimage.jpg │ ├── preloading.png │ ├── select_ctrl_down.png │ ├── slide1.jpg │ ├── slide2.jpg │ └── usr.jpg ├── js │ ├── 5-template │ │ ├── _5-template.js │ │ └── _home.js │ └── main.js ├── scss │ ├── 0-plugin │ │ ├── _0-plugin.scss │ │ ├── _bootstrap-validator.scss │ │ ├── _datatable.scss │ │ ├── _datepicker.scss │ │ ├── _material-icons.scss │ │ └── _select2.scss │ ├── 1-helpers │ │ ├── _1-helpers.scss │ │ ├── _mixin.scss │ │ └── _var.scss │ ├── 2-base │ │ ├── _2-base.scss │ │ ├── _buttons.scss │ │ ├── _form │ │ │ ├── _0-form.scss │ │ │ └── _switch-group.scss │ │ ├── _global.scss │ │ ├── _inputs.scss │ │ ├── _placeholder.scss │ │ ├── _selection-colors.scss │ │ ├── _table.scss │ │ ├── _tabs.scss │ │ └── _typography.scss │ ├── 3-layout │ │ ├── _3-layout.scss │ │ ├── _common.scss │ │ ├── _footer.scss │ │ ├── _header.scss │ │ └── _navigation.scss │ ├── 4-modules │ │ ├── _4-modules.scss │ │ ├── _contact-form.scss │ │ ├── _modal.scss │ │ └── _print.scss │ ├── 5-templates │ │ ├── _5-templates.scss │ │ ├── _contact.scss │ │ └── _home.scss │ └── main.scss └── vendor │ ├── bootstrap-validator │ └── validator.min.js │ ├── bootstrap │ ├── bootstrap.css │ ├── bootstrap.min.js │ └── popper.min.js │ ├── ddslick │ └── jquery.ddslick.min.js │ ├── fontawesome │ ├── css │ │ └── all.css │ └── webfonts │ │ ├── fa-brands-400.eot │ │ ├── fa-brands-400.svg │ │ ├── fa-brands-400.ttf │ │ ├── fa-brands-400.woff │ │ ├── fa-brands-400.woff2 │ │ ├── fa-regular-400.eot │ │ ├── fa-regular-400.svg │ │ ├── fa-regular-400.ttf │ │ ├── fa-regular-400.woff │ │ ├── fa-regular-400.woff2 │ │ ├── fa-solid-900.eot │ │ ├── fa-solid-900.svg │ │ ├── fa-solid-900.ttf │ │ ├── fa-solid-900.woff │ │ └── fa-solid-900.woff2 │ ├── inputmask │ └── inputmask.js │ ├── jquery │ └── jquery-3.3.1.min.js │ ├── kodeized │ ├── kodeized.jquery.js │ ├── kodeized.js │ └── kodeized.v4.js │ ├── lazysizes │ └── lazysizes.min.js │ ├── material-icons │ ├── MaterialIcons.woff2 │ └── material-icons.css │ ├── polyfill │ └── polyfill.min.js │ ├── swiper │ ├── iconfinder_1_Facebook2_colored_svg_5296500.svg │ ├── swiper.min.css │ └── swiper.min.js │ ├── trip │ ├── trip.min.css │ └── trip.min.js │ └── viewportchecker │ └── viewportchecker.js └── style.css /Frontized.md: -------------------------------------------------------------------------------- 1 | ## .colset--slider 2 | 3 | ```html 4 | 5 |
6 |
Text 1
7 |
Text 2
8 |
Text 3
9 | 10 |
11 | 12 |
13 | 14 |
15 |
16 | ``` 17 | 18 | ```css 19 | // SEE CSS 20 | ``` 21 | 22 | ```javascript 23 | // JS FILE 24 | ``` 25 | 26 | 27 | -------------------------------------------------------------------------------- /README v4.md: -------------------------------------------------------------------------------- 1 | # Version 4 2 | 3 | 4 | ### TypeError: $.ajax(…) is not a function in Boostrap 5 | 6 | The problem is by default slim.jquery.js doesn't have the ajax. slim build of jQuery, which had some things removed, ajax being one of them. 7 | 8 | Need download the regular version of jQuery(http://jquery.com/%20download/#jquery) include it. -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | const gulp = require('gulp'); 2 | const sass = require('gulp-sass'); 3 | const minifyCss = require('gulp-minify-css'); 4 | const autoprefixer = require('gulp-autoprefixer'); 5 | const htmlmin = require('gulp-htmlmin'); 6 | const uglify = require('gulp-uglify'); 7 | const babel = require('gulp-babel'); 8 | const browserSync = require('browser-sync').create(); 9 | const imagemin = require('gulp-imagemin'); 10 | const plumber = require('gulp-plumber'); 11 | const pump = require('pump'); 12 | var sourcemaps = require('gulp-sourcemaps'); 13 | var minify = require('gulp-minify'); 14 | 15 | const minifyjs = require('gulp-js-minify'); 16 | const concat = require('gulp-concat'); 17 | const merge = require('merge-stream'); 18 | 19 | 20 | var log = require('fancy-log'); 21 | const lme = require('lme'); 22 | 23 | 24 | const srcPath = 'src'; 25 | const src = { 26 | scss: `${srcPath}/scss/main.scss`, 27 | html: `${srcPath}/**/*.html`, 28 | js: `${srcPath}/js/**/*.js`, 29 | img: `${srcPath}/images/**/*`, 30 | } 31 | 32 | 33 | 34 | // Dest set to docs for github pages, feel free to change 35 | const destPath = 'build'; 36 | const dest = { 37 | css: `${destPath}/css`, 38 | html: destPath, 39 | js: `${destPath}/js`, 40 | img: `${destPath}/images`, 41 | 42 | css_bundle: `${destPath}/css/*.css`, 43 | } 44 | 45 | 46 | 47 | gulp.task('sass', () => { 48 | pump([ 49 | gulp.src(src.scss), 50 | sourcemaps.init(), 51 | plumber(err => console.error(err)), 52 | sass({ style: 'compressed' }).on('error', sass.logError), 53 | autoprefixer({ browsers: ['last 2 versions'] }), 54 | minifyCss(), 55 | sourcemaps.write('./'), 56 | gulp.dest(dest.css), 57 | browserSync.stream({match: '**/*.css'}) 58 | ]); 59 | }); 60 | /* 61 | gulp.task('html', () => { 62 | pump([ 63 | gulp.src(src.html), 64 | plumber(err => console.error(err)), 65 | htmlmin({ collapseWhitespace: true, removeComments: true }), 66 | gulp.dest(dest.html) 67 | ]); 68 | }); 69 | 70 | */ 71 | gulp.task('js', () => { 72 | pump([ 73 | gulp.src(src.js), 74 | plumber(err => console.error(err)), 75 | babel({ presets: ['es2015', 'es2017'] }), 76 | uglify(), 77 | gulp.dest(dest.js), 78 | browserSync.stream() 79 | ]); 80 | }); 81 | 82 | gulp.task('image', () => { 83 | pump([ 84 | gulp.src(src.img), 85 | plumber(err => console.error(err)), 86 | imagemin({ verbose: true }), 87 | gulp.dest(dest.img) 88 | ]); 89 | }); 90 | 91 | 92 | 93 | // `gulp prod` CMD command 94 | gulp.task('prod', function() { 95 | 96 | var css = gulp.src([`${srcPath}/css/bootstrap.min.css`, `${srcPath}/css/stylized.css`, `${srcPath}/css/swiper.min.css`, `${srcPath}/css/font-awesome.min.css`, `${srcPath}/scss/main.scss`]) 97 | .pipe(sourcemaps.init()) 98 | .pipe( plumber(err => console.error(err)) ) 99 | .pipe( sass({ style: 'compressed' }).on('error', sass.logError) ) 100 | .pipe( autoprefixer({ browsers: ['last 2 versions'] }) ) 101 | .pipe(minifyCss()) 102 | .pipe(concat('style.bundle.css')) 103 | .pipe(sourcemaps.write(`./`)) 104 | .pipe(gulp.dest(`./${destPath}/css`)) 105 | ; 106 | 107 | 108 | var headerjs = gulp.src([`${srcPath}/js/jquery-2.2.4.min.js`, `${srcPath}/js/lazysizes.min.js`]) 109 | .pipe(sourcemaps.init()) 110 | .pipe(concat('header.bundle1.js')) 111 | // .pipe(minify()) 112 | .pipe(sourcemaps.write(`./${destPath}`)) 113 | .pipe(gulp.dest(`./${destPath}/js`)); 114 | 115 | 116 | var footerjs = gulp.src([`${srcPath}/js/bootstrap.min.js`, `${srcPath}/js/kodeized.js`, `${srcPath}/js/viewportchecker.js`, `${srcPath}/js/swiper.jquery.min.js`, `${srcPath}/js/customized.js`]) 117 | .pipe(concat('footer.bundle1.js')) 118 | // .pipe(minify()) 119 | .pipe(gulp.dest(`./${destPath}/js`)); 120 | 121 | lme.h(" *** DONE ! *** "); 122 | 123 | return merge(headerjs, footerjs, css).on('change', browserSync.stream); 124 | 125 | }); 126 | 127 | 128 | 129 | //gulp.task('browserSync', ['sass', 'js', 'html'], () => { 130 | gulp.task('browserSync', ['sass', 'prod'], () => { 131 | browserSync.init({ 132 | injectChanges: true, 133 | server: `./${destPath}`, 134 | }); 135 | 136 | 137 | //gulp.watch([dest.css_bundle, src.scss, src.js], ['sass', 'prod']); 138 | gulp.watch([src.scss], ['sass', 'prod']); 139 | // gulp.watch(src.js, ['js']); 140 | // gulp.watch(src.js).on('change', browserSync.stream); 141 | // gulp.watch(src.html, ['html']); 142 | // gulp.watch(src.html).on('change', browserSync.reload); 143 | // gulp.watch(src.js).on('change', browserSync.reload); 144 | }); 145 | 146 | 147 | 148 | gulp.task('default', ['browserSync']); 149 | 150 | 151 | 152 | // const webp = require('gulp-webp'); 153 | 154 | // imagemin(['images/*.{jpg,png}'], 'build/images', { use: [ imageminWebp({quality: 50}) ]}).then(() => { console.log('Images optimized');}); 155 | 156 | gulp.task('webp', () => 157 | gulp.src([`${destPath}/images/**/*`]) 158 | .pipe(webp()) 159 | .pipe(gulp.dest(`./${destPath}/images-webp`)) 160 | ); 161 | 162 | 163 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | Frontend v4 16 | 17 | 18 |
19 | 20 |
21 |
22 | 23 |
24 | 25 | 60 | 61 |
62 | 63 |
64 |
65 | 66 |
67 | 68 |
69 | 70 | 102 | 103 |
104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 |
123 |
124 | 125 |
126 |
    127 |
  • 128 | 129 | Ready 130 |
    • 131 |
  • 132 | 133 | Under review 134 |
    • 135 |
  • 136 | 137 | Deprecated 138 |
    • 139 |
  • 140 | 141 | Not applicable 142 |
    • 143 |
144 |
145 | 146 | 147 | 148 |
149 | × 150 | Whoops! There were some problems with your input.

151 |
    152 | @foreach ($errors->all() as $error) 153 |
  • {{ $error }}
    • 154 | @endforeach 155 |
156 |
157 | 162 | 163 | 164 |

.fnc-underline

165 |
166 |
167 |
168 |

.Metroflip-box

FRONT

169 |
170 |
171 |

.Metroflip-box

BACK

172 |
173 |
174 |
175 | 176 |
177 | 178 |
179 |
180 | 181 | 182 | Random Left/Right 183 | 184 |
CSS
 185 | 186 | 7% From last Week 187 | 188 |
189 |
190 | 191 |
192 |
193 | 194 | 195 | 2nd Slider 196 | 197 |
Bootstrap
 198 | 199 | 3% From last Week 200 | 201 |
202 |
203 | 204 |
205 |
206 | 207 | 208 | Chartist.JS 209 | 210 |
JS
 211 | 212 | 3% From last Week 213 | 214 |
215 |
216 | 217 |
218 |
219 | 220 | 221 | Swiper Slider 222 | 223 |
Slider
 224 | 225 | 3% From last Week 226 | 227 |
228 |
229 | 230 |
231 |
232 | 233 | 234 | Isotope filter 235 | 236 |
Isotope
 237 | 238 | 3% From last Week 239 | 240 |
241 |
242 | 243 |
244 |
245 | 246 | 247 | Content ... 248 | 249 |
HTML
 250 | 251 | 3% From last Week 252 | 253 |
254 |
255 | 256 |
257 |
258 | 259 | 260 | Gird Box 261 | 262 |
jQuery
 263 | 264 | 3% From last Week 265 | 266 |
267 |
268 | 269 |
270 |
271 | 272 | 273 | valigner 274 | 275 |
HTML
 276 | 277 | 3% From last Week 278 | 279 |
280 |
281 | 282 |
283 |
284 | 285 | 286 | More Less 287 | 288 |
HTML
 289 | 290 | 3% From last Week 291 | 292 |
293 |
294 | 295 |
296 |
297 | 298 | 299 | Accordion 300 | 301 |
Bootstrap
 302 | 303 | 3% From last Week 304 | 305 |
306 |
307 | 308 | 309 |
310 |
311 | 312 | 313 | List Area 314 | 315 |
HTML
 316 | 317 | 3% From last Week 318 | 319 |
320 |
321 | 322 | 323 |
324 |
325 | 326 | 327 | Tabs Area 328 | 329 |
HTML
 330 | 331 | 3% From last Week 332 | 333 |
334 |
335 | 336 |
337 |
338 | 339 | 340 | Date Range Picker 341 | 342 |
JS
 343 | 344 | 3% From last Week 345 | 346 |
347 |
348 | 349 | 350 |
351 |
352 | 353 | 354 | Date Time Picker 355 | 356 |
JS
 357 | 358 | 3% From last Week 359 | 360 |
361 |
362 | 363 | 364 |
365 |
366 | 367 | 368 | Upload Preview 369 | 370 |
JS
 371 | 372 | 3% From last Week 373 | 374 |
375 |
376 | 377 |
378 |
379 | 380 | 381 | inline Control 382 | 383 |
Bootstrap
 384 | 385 | 3% From last Week 386 | 387 |
388 |
389 | 390 | 391 |
392 |
393 | 394 | 395 | Fancy Form 396 | 397 |
CSS
 398 | 399 | 3% From last Week 400 | 401 |
402 |
403 | 404 |
405 |
406 | 407 | 408 | Masked Input 409 | 410 |
JS
 411 | 412 | 3% From last Week 413 | 414 |
415 |
416 | 417 | 418 |
419 |
420 | 421 | 422 | downloadable Link 423 | 424 |
HTML
 425 | 426 | 3% From last Week 427 | 428 |
429 |
430 | 431 | 432 | 433 |
434 |
435 | 436 | 437 | Table Area 438 | 439 |
HTML
 440 | 441 | 3% From last Week 442 | 443 |
444 |
445 | 446 | 447 |
448 |
449 | 450 | 451 | Color Area 452 | 453 |
HTML
 454 | 455 | 3% From last Week 456 | 457 |
458 |
459 | 460 | 461 |
462 |
463 | 464 | 465 | Heights 466 | 467 |
HTML
 468 | 469 | 8% From last Week 470 | 471 |
472 |
473 | 474 | 475 |
476 |
477 | 478 | 479 | Images Area 480 | 481 |
HTML
 482 | 483 | 3% From last Week 484 | 485 |
486 |
487 | 488 | 489 |
490 |
491 | 492 | 493 | Tooltip Area 494 | 495 |
JS
 496 | 497 | 3% From last Week 498 | 499 |
500 |
501 | 502 | 503 |
504 |
505 | 506 | 507 | Pinterest Style 508 | 509 |
CSS
 510 | 511 | 3% From last Week 512 | 513 |
514 |
515 | 516 |
517 |
518 | 519 | 520 | Modal 521 | 522 |
Bootstrap
 523 | 524 | 3% From last Week 525 | 526 |
527 |
528 | 529 |
530 |
531 | 532 | 533 | Footer 534 | 535 |
HTML
 536 | 537 | 3% From last Week 538 | 539 |
540 |
541 | 542 | 543 | 544 |
545 | 546 | 547 |

Counter-area

548 |

.lndotln heading

549 |

.underline-mini heading

550 |

.underline-mini--double heading

551 | 552 | 553 | 554 |
555 |
556 | 557 | 558 | 559 | 560 | 561 | 562 | 563 | 564 | 565 | 566 | 567 | 568 | 569 | 570 | 571 | 572 |
573 | 574 |
575 |
576 |
577 |

.randomlftrgt Randomized Content and Image

578 |

Bibendum ad ante a eleifend nec at a accumsan at taciti adipiscing gravida ut curae rutrum sit ornare.Ultrices cras adipiscing ante per feugiat ultricies et lobortis adipisci

579 |
580 | 581 |
582 | 583 |
584 |
585 |
586 | 587 |
588 |
589 |
590 |

a accumsan at taciti

591 |

Bibendum ad ante a eleifend nec at a accumsan at taciti adipiscing gravida ut curae rutrum sit ornare.Ultrices cras adipiscing ante per feugiat ultricies et lobortis adipisci

592 |
593 | 594 |
595 | 596 |
597 |
598 |
599 | 600 |
601 |
602 |
603 |

a accumsan at taciti

604 |

Bibendum ad ante a eleifend nec at a accumsan at taciti adipiscing gravida ut curae rutrum sit ornare.Ultrices cras adipiscing ante per feugiat ultricies et lobortis adipisci

605 |
606 | 607 |
608 | 609 |
610 |
611 |
612 | 613 |
614 | 615 | 616 | 617 | 618 | 619 | 620 | 621 | 622 |
623 |
624 |
625 | 626 |

Hello, world!

627 | 628 |
629 | Card image cap 630 |
631 |
Card title
632 |

Some quick example text to build on the card title and make up the bulk of the card's content.

633 | Go somewhere 634 |
635 |
636 | 637 |
638 | 639 | 640 |
641 |
642 | 643 | 644 |
645 | 646 | 647 | 648 | 649 | 654 | 655 | 656 | 657 |
726 | 727 | 728 |
729 |
730 |
731 | 732 | 733 | Created & Developed 734 | 740 | 741 |
742 |
743 |
744 | 745 | 746 | 747 | 748 | 749 | 750 | 751 | 752 | 753 | 754 | 755 | 756 | 757 | 758 | 759 | 760 | 761 | 762 | 763 | 764 | 765 | 772 | 773 | 774 | 775 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "gulp-boiler-17", 3 | "version": "1.0.0", 4 | "description": "A simple front end boilerplate using Gulp, SCSS, ESLint and Browsersync", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "gulp", 8 | "lint": "./node_modules/.bin/eslint ./src/js --ext js" 9 | }, 10 | "repository": { 11 | "type": "git", 12 | "url": "git+https://github.com/mildrenben/gulpBoiler17.git" 13 | }, 14 | "author": "", 15 | "license": "ISC", 16 | "bugs": { 17 | "url": "https://github.com/mildrenben/gulpBoiler17/issues" 18 | }, 19 | "homepage": "https://github.com/mildrenben/gulpBoiler17#readme", 20 | "devDependencies": { 21 | "babel-preset-es2015": "6.24.1", 22 | "babel-preset-es2017": "6.24.1", 23 | "browser-sync": "2.18.12", 24 | "eslint": "4.3.0", 25 | "eslint-config-airbnb-base": "^11.3.1", 26 | "eslint-plugin-import": "^2.7.0", 27 | "gulp": "3.9.1", 28 | "gulp-autoprefixer": "4.0.0", 29 | "gulp-babel": "6.1.2", 30 | "gulp-concat": "^2.6.1", 31 | "gulp-htmlmin": "3.0.0", 32 | "gulp-imagemin": "3.3.0", 33 | "gulp-js-minify": "0.0.3", 34 | "gulp-minify-css": "1.2.4", 35 | "gulp-plumber": "1.1.0", 36 | "gulp-sass": "3.1.0", 37 | "gulp-uglify": "3.0.0", 38 | "gulp-webp": "^3.0.0", 39 | "pump": "1.0.2" 40 | }, 41 | "dependencies": { 42 | "fancy-log": "^1.3.3", 43 | "gulp-minify": "^3.1.0", 44 | "gulp-retinize": "^0.1.0", 45 | "gulp-sourcemaps": "^2.6.4", 46 | "imagemin": "^6.0.0", 47 | "imagemin-webp": "^5.0.0", 48 | "lme": "^1.5.3", 49 | "merge-stream": "^1.0.1" 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /src/images/bg-dvr.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/bg-dvr.png -------------------------------------------------------------------------------- /src/images/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/favicon.png -------------------------------------------------------------------------------- /src/images/fill-mask.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/fill-mask.png -------------------------------------------------------------------------------- /src/images/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/logo.png -------------------------------------------------------------------------------- /src/images/noimage.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/noimage.jpg -------------------------------------------------------------------------------- /src/images/preloading.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/preloading.png -------------------------------------------------------------------------------- /src/images/select_ctrl_down.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/select_ctrl_down.png -------------------------------------------------------------------------------- /src/images/slide1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/slide1.jpg -------------------------------------------------------------------------------- /src/images/slide2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/slide2.jpg -------------------------------------------------------------------------------- /src/images/usr.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/images/usr.jpg -------------------------------------------------------------------------------- /src/js/5-template/_5-template.js: -------------------------------------------------------------------------------- 1 | console.log("%c 5 template module loaded ", "color: green"); -------------------------------------------------------------------------------- /src/js/5-template/_home.js: -------------------------------------------------------------------------------- 1 | var color_rainbow = "background: -webkit-linear-gradient(left, orange , yellow, green, cyan, blue, violet); font-size:24px; padding:0 10em;"; 2 | console.log("%c _home.js loaded ", color_rainbow ); 3 | 4 | 5 | // exporting function 6 | export function homeFunc() { 7 | console.log("homeFunc(); works fine!"); 8 | } 9 | -------------------------------------------------------------------------------- /src/js/main.js: -------------------------------------------------------------------------------- 1 | import "./5-template/_5-template.js"; 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/scss/0-plugin/_0-plugin.scss: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css?family=Work+Sans:400,500,600,700,800,900"); 2 | 3 | 4 | @import "_datepicker.scss"; 5 | 6 | @import "_datatable.scss"; 7 | 8 | @import "_bootstrap-validator.scss"; 9 | 10 | @import "_select2.scss"; 11 | 12 | @import "_material-icons"; -------------------------------------------------------------------------------- /src/scss/0-plugin/_bootstrap-validator.scss: -------------------------------------------------------------------------------- 1 | .form-group.has-error .help-block { 2 | display: block; 3 | float: left; 4 | width: 100%; 5 | font-size: 14px; 6 | } 7 | 8 | .has-feedback { 9 | transition: all 0.5s; 10 | .form-control-feedback { 11 | border-radius: 4px; 12 | margin-right: 3px; 13 | margin-top: -1px; 14 | } 15 | 16 | &.has-success { 17 | .form-control-feedback { 18 | background: #97f433; 19 | } 20 | } 21 | 22 | &.has-error { 23 | .form-control-feedback { 24 | background-color: #f9124d; 25 | color: #fff; 26 | } 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/scss/0-plugin/_datatable.scss: -------------------------------------------------------------------------------- 1 | .theme-liquid { 2 | 3 | .dataTables_length label { 4 | font-weight: 500; 5 | padding: 2px 0; 6 | margin-bottom: 0; 7 | border-radius: 3px; 8 | margin-left: 1px; 9 | margin-bottom: 10px; 10 | font-size: 14px; 11 | } 12 | 13 | 14 | .dataTables_length label select { 15 | border: 1px solid $color-greyLightest; 16 | text-align: center; 17 | text-align: center; 18 | padding: 2px 4px; 19 | min-height: 34px; 20 | } 21 | 22 | .dataTables_filter label { 23 | font-weight: 500; 24 | margin-bottom: 0; 25 | } 26 | 27 | 28 | .dataTables_filter { 29 | padding: 4px 4px; 30 | border-radius: 2px; 31 | font-size: 14px; 32 | } 33 | 34 | .dataTables_filter input { 35 | border: 1px solid $color-greyLightest; 36 | min-height: 34px; 37 | 38 | } 39 | 40 | .dataTables_wrapper { 41 | border-top: 1px solid $color-greyLightest; 42 | padding-top: 8px; 43 | } 44 | 45 | 46 | table.dataTable thead th, table.dataTable thead td { 47 | font-weight: 500; 48 | border-color: transparent; 49 | padding: 8px; 50 | } 51 | 52 | 53 | table.dataTable.no-footer { 54 | border-bottom-color: $color-greyLightest; 55 | } 56 | 57 | 58 | 59 | .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { 60 | background: $color-primary !important; 61 | padding: 2px 8px; 62 | border-color: $color-primary; 63 | color: $color-white !important; 64 | font-size: 14px; 65 | } 66 | 67 | .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate { 68 | font-size: 14px; 69 | } 70 | 71 | 72 | 73 | .dataTables_wrapper .dataTables_paginate .paginate_button:hover { 74 | background: $color-primary; 75 | border-color: $color-primary; 76 | /* transform: scale(1); */ 77 | padding: 2px 8px; 78 | } 79 | 80 | 81 | .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active { 82 | opacity: .5; 83 | } 84 | 85 | .dataTables_wrapper .dataTables_paginate .paginate_button { 86 | background-color: $color-greyLightest; 87 | padding: 2px 8px; 88 | } 89 | 90 | 91 | 92 | } 93 | 94 | -------------------------------------------------------------------------------- /src/scss/0-plugin/_datepicker.scss: -------------------------------------------------------------------------------- 1 | .datepicker { 2 | &.datepicker-dropdown { 3 | 4 | 5 | th { 6 | &.next, 7 | &.datepicker-switch, 8 | &.prev { 9 | background: $color-primaryLightest; 10 | border-color: $color-primaryLightest; 11 | cursor: pointer; 12 | } 13 | } 14 | 15 | .datepicker-days{ 16 | td, 17 | th { 18 | padding: 5px !important; 19 | border-color: $color-neutral; 20 | } 21 | 22 | 23 | td { 24 | &.active.day, 25 | &:hover { 26 | background-color: $color-primary; 27 | } 28 | } 29 | } 30 | 31 | 32 | 33 | .datepicker-decades .decade, 34 | .datepicker-centuries .century, 35 | .datepicker-years .year, 36 | .datepicker-months .month { 37 | margin: -1px -1px 0 0; 38 | display: inline-block; 39 | padding: 0 10px; 40 | padding: 5px; 41 | border: 1px solid $color-neutral; 42 | 43 | &:hover{ 44 | background-color: $color-primary; 45 | color: $color-white; 46 | cursor: pointer; 47 | } 48 | } 49 | 50 | 51 | 52 | 53 | } 54 | } 55 | -------------------------------------------------------------------------------- /src/scss/0-plugin/_material-icons.scss: -------------------------------------------------------------------------------- 1 | body { 2 | .material-icons { 3 | font-size: initial; 4 | line-height: inherit; 5 | position: relative; 6 | /* top: 1.8px; */ 7 | } 8 | } 9 | 10 | -------------------------------------------------------------------------------- /src/scss/0-plugin/_select2.scss: -------------------------------------------------------------------------------- 1 | .form-group { 2 | .select2-container { 3 | width: 100% !important; 4 | } 5 | 6 | .select2-container--default.select2-container--focus 7 | .select2-selection--multiple { 8 | border: 1px solid #eee; 9 | border-radius: 0; 10 | } 11 | 12 | .select2-container--default { 13 | .select2-selection--multiple { 14 | border-radius: 0; 15 | border-color: #ccc; 16 | width: 100%; 17 | 18 | ul.select2-selection__rendered { 19 | line-height: 32px; 20 | } 21 | 22 | .select2-selection__choice { 23 | background-color: $color-trans; 24 | border: 1px solid $color-primary; 25 | color: $color-black; 26 | border-radius: 2px; 27 | line-height: 32px; 28 | font-size: 14px; 29 | padding: 0px 10px; 30 | } 31 | .select2-selection__choice__remove { 32 | color: #f00; 33 | font-size: 15px; 34 | float: right; 35 | margin: 0; 36 | right: -5px; 37 | position: relative; 38 | } 39 | } 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /src/scss/1-helpers/_1-helpers.scss: -------------------------------------------------------------------------------- 1 | @import "_mixin.scss"; 2 | @import "_var.scss"; -------------------------------------------------------------------------------- /src/scss/1-helpers/_mixin.scss: -------------------------------------------------------------------------------- 1 | @mixin transform($property) { 2 | /* 3 | mixin: allow to reuse group of css attributes 4 | Usage: @include transform(rotate(-10deg)); 5 | */ 6 | -webkit-transform: $property; 7 | -ms-transform: $property; 8 | transform: $property; 9 | } 10 | 11 | @mixin multiple-transition( 12 | $properties: all, 13 | $duration: 200ms, 14 | $method: ease, 15 | $delay: 0ms 16 | ) { 17 | $prefixes: -webkit- -moz- -ms- -o-; 18 | @each $prefix in $prefixes { 19 | $value: (); 20 | @each $property in $properties { 21 | @if length($value) > 0 { 22 | $value: append( 23 | $value, 24 | unquote(",") #{$property} $duration $method $delay 25 | ); 26 | } @else { 27 | $value: append($value, #{$property} $duration $method $delay); 28 | } 29 | } 30 | #{$prefix}transition: $value; 31 | } 32 | } 33 | 34 | 35 | 36 | 37 | 38 | /* Usage */ 39 | .transition-element { 40 | @include multiple-transition(width height margin background-color, 500ms); 41 | 42 | &:hover { 43 | /* do styling */ 44 | } 45 | } 46 | 47 | 48 | 49 | 50 | @mixin transition--0_15 { 51 | transition: (all 0.15s ease-out 0s); 52 | } 53 | -------------------------------------------------------------------------------- /src/scss/1-helpers/_var.scss: -------------------------------------------------------------------------------- 1 | 2 | $font-stack: "Poppins", 3 | "Helvetica", Arial, 4 | sans-serif; 5 | 6 | 7 | $color-primaryLightest: #3399F4; 8 | $color-primaryLighter: #3399F4; 9 | $color-primaryLight: #3399F4; 10 | $color-primary: #3399F4; 11 | $color-primaryDark: #3399F4; 12 | $color-primaryDarker: #3399F4; 13 | $color-primaryDarkest: #3399F4; 14 | 15 | $color-primaryShadeY : linear-gradient(#2ea0bd 0%, #5f5ad9 100%); 16 | $color-primaryShadeX : linear-gradient(to right, #5f5ad9 0%, #2ea0bd 100%); 17 | $color-primaryGradientRadial: -webkit-radial-gradient(50% 50%, circle closest-side, rgb(255, 250, 250) 0%, rgb(225, 231, 250) 100%); 18 | 19 | 20 | 21 | 22 | $color-secondaryLightest: #DDD159; 23 | $color-secondaryLighter: #DDD159; 24 | $color-secondaryLight: #DDD159; 25 | $color-secondary: #DDD159; 26 | $color-secondaryDark: #DDD159; 27 | $color-secondaryDarker: #DDD159; 28 | $color-secondaryDarkest: #DDD159; 29 | 30 | 31 | $color-neutralLightest: #EEEEEE; 32 | $color-neutralLighter: #EEEEEE; 33 | $color-neutralLight: #EEEEEE; 34 | $color-neutral: #EEEEEE; // Creamy 35 | $color-neutralDark: #bbbbbb; 36 | $color-neutralDarker: #999999; 37 | $color-neutralDarkest: #777777; 38 | 39 | 40 | $color-trans : transparent; 41 | $color-white : #ffffff; 42 | $color-black : #000000; 43 | 44 | 45 | 46 | $color-greyLightest : #eee; 47 | $color-greyLighter : #dddfeb; 48 | $color-greyLight : #9d9d9d; 49 | $color-grey : #43445d; 50 | $color-greyDark : #232939; 51 | $color-greyDarker : #191919; 52 | $color-greyDarkest : #191919; 53 | 54 | 55 | 56 | $color-greenLight: #9fc459; 57 | $color-green: #94bd46; 58 | $color-greenDark:#88ad40; 59 | $color-greenDarker: #759932; 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | $breakpoint-mobile : 768px; 68 | $breakpoint-mobile : 801px; //nexus10 69 | 70 | $breakpoint-tablet : 1024px; 71 | 72 | $breakpoint-ubuntu: 1152px; 73 | 74 | $breakpoint-sdpi: 1272px; 75 | $breakpoint-mdpi: 1280px; 76 | 77 | 78 | $breakpoint-14in : 1366px; 79 | $breakpoint-hdpi : 1440px; //desktop 80 | 81 | $breakpoint-hd : 1600px; 82 | 83 | -------------------------------------------------------------------------------- /src/scss/2-base/_2-base.scss: -------------------------------------------------------------------------------- 1 | /* Folders */ 2 | @import "_form/_0-form.scss"; 3 | 4 | 5 | /* Files */ 6 | @import "_buttons.scss"; 7 | 8 | @import "_global.scss"; 9 | 10 | @import "_inputs.scss"; 11 | 12 | @import "_placeholder.scss"; 13 | 14 | @import "_selection-colors.scss"; 15 | 16 | @import "_tabs.scss"; 17 | 18 | @import "_typography.scss"; 19 | 20 | @import "_table.scss"; 21 | -------------------------------------------------------------------------------- /src/scss/2-base/_buttons.scss: -------------------------------------------------------------------------------- 1 | 2 | .btn, 3 | .button, 4 | button, 5 | input[type="submit"], 6 | input[type="reset"], 7 | input[type="button"] { 8 | line-height: 44px; 9 | height: 44px; 10 | min-width: 180px; 11 | border-radius: 0; 12 | padding: 0; 13 | background-color: $color-white; 14 | border: 0; 15 | 16 | * { 17 | @include multiple-transition(all, 0.3s); 18 | } 19 | 20 | &:hover, 21 | &:active, 22 | &:focus { 23 | outline: 0; 24 | border: 0; 25 | background-color: $color-white; 26 | } 27 | 28 | &.btn-arrow { 29 | position: relative; 30 | overflow: hidden; 31 | padding-right: 50px; 32 | 33 | &:hover { 34 | .icon { 35 | right: -5px; 36 | } 37 | } 38 | 39 | .icon { 40 | float: right; 41 | display: block; 42 | height: 44px; 43 | line-height: 44px; 44 | width: 60px; 45 | color: $color-black; 46 | font-size: 18px; 47 | background-color: $color-greyLight; 48 | transform: skewX(15deg); 49 | position: absolute; 50 | right: -8px; 51 | top: 0; 52 | padding-right: 8px; 53 | 54 | .fa { 55 | transform: skewX(-15deg); 56 | } 57 | } 58 | 59 | } 60 | 61 | 62 | &.btn-default { 63 | &:hover { 64 | background: $color-grey; 65 | color: $color-white; 66 | 67 | .icon { 68 | background-color: $color-greyDark; 69 | 70 | .fa:before { 71 | color: $color-white; 72 | } 73 | } 74 | } 75 | } 76 | 77 | 78 | 79 | 80 | 81 | &.btn-primary { 82 | background: $color-primary; 83 | 84 | &--outline { 85 | border:1px solid $color-primary; 86 | color: $color-primary; 87 | } 88 | 89 | .icon { 90 | background-color: $color-primaryDark; 91 | 92 | .fa { 93 | color: $color-white; 94 | } 95 | } 96 | 97 | &:hover { 98 | background-color: $color-primaryDark; 99 | 100 | .icon { 101 | background-color: $color-primaryDarker; 102 | } 103 | } 104 | } 105 | 106 | 107 | 108 | &.btn-secondary { 109 | background: $color-secondary; 110 | 111 | &--outline { 112 | border:1px solid $color-secondary; 113 | color: $color-secondary; 114 | } 115 | 116 | .icon { 117 | background-color: $color-secondaryDark; 118 | 119 | .fa { 120 | color: $color-white; 121 | } 122 | } 123 | 124 | &:hover { 125 | background-color: $color-secondaryDark; 126 | 127 | .icon { 128 | background-color: $color-secondaryDarker; 129 | } 130 | } 131 | } 132 | 133 | 134 | 135 | 136 | &.btn-neutral { 137 | background: $color-neutralDark; 138 | 139 | &--outline { 140 | border:1px solid $color-neutralDark; 141 | color: $color-neutralDark; 142 | } 143 | 144 | .icon { 145 | background-color: $color-neutral; 146 | 147 | .fa { 148 | color: $color-white; 149 | } 150 | } 151 | 152 | &:hover { 153 | background-color: $color-neutralDarker; 154 | 155 | .icon { 156 | background-color: $color-neutralDark; 157 | } 158 | } 159 | } 160 | 161 | } 162 | 163 | -------------------------------------------------------------------------------- /src/scss/2-base/_form/_0-form.scss: -------------------------------------------------------------------------------- 1 | @import "_switch-group.scss"; 2 | -------------------------------------------------------------------------------- /src/scss/2-base/_form/_switch-group.scss: -------------------------------------------------------------------------------- 1 | .form-group { 2 | .switch-group { 3 | border: 1px solid $color-white; 4 | float: left; 5 | border-radius: 4px; 6 | height: 40px; 7 | overflow: hidden; 8 | 9 | input { 10 | display: none; 11 | } 12 | 13 | input:checked + label { 14 | background: $color-primary; 15 | color: $color-white; 16 | } 17 | 18 | label { 19 | background: transparent; 20 | border-radius: 0; 21 | position: relative; 22 | padding: 8px 12px; 23 | line-height: 22px; 24 | height: 40px; 25 | cursor: pointer; 26 | border: 0px solid transparent; 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/scss/2-base/_global.scss: -------------------------------------------------------------------------------- 1 | body { 2 | //delete the background to apply your won style 3 | background: $color-white; 4 | } 5 | 6 | *:focus { 7 | outline: none; 8 | } 9 | 10 | a:link, a:visited{ 11 | @include transition--0_15; 12 | } -------------------------------------------------------------------------------- /src/scss/2-base/_inputs.scss: -------------------------------------------------------------------------------- 1 | select { 2 | background-image: url("../images/common/select-bg.png") !important; 3 | background-repeat: no-repeat; 4 | background-position-x: right; 5 | background-position-y: center; 6 | background-size: 24px; 7 | -webkit-appearance: textarea; 8 | } 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /src/scss/2-base/_placeholder.scss: -------------------------------------------------------------------------------- 1 | 2 | @mixin optional-at-root($sel) { 3 | @at-root #{if(not &, $sel, selector-append(&, $sel))} { 4 | @content; 5 | } 6 | } 7 | 8 | @mixin placeholder { 9 | @include optional-at-root('::-webkit-input-placeholder') { 10 | @content; 11 | } 12 | 13 | @include optional-at-root(':-moz-placeholder') { 14 | @content; 15 | } 16 | 17 | @include optional-at-root('::-moz-placeholder') { 18 | @content; 19 | } 20 | 21 | @include optional-at-root(':-ms-input-placeholder') { 22 | @content; 23 | } 24 | } 25 | 26 | 27 | 28 | 29 | /* Usage */ 30 | .form-control { 31 | @include placeholder { 32 | color: $color-greyLight; 33 | } 34 | } -------------------------------------------------------------------------------- /src/scss/2-base/_selection-colors.scss: -------------------------------------------------------------------------------- 1 | ::selection { 2 | background: lighten($color-primary, 10%); 3 | color: $color-white; 4 | } /* Safari */ 5 | 6 | 7 | ::-moz-selection { 8 | background: lighten($color-primary, 10%); 9 | color: $color-white; 10 | } /* Firefox */ 11 | -------------------------------------------------------------------------------- /src/scss/2-base/_table.scss: -------------------------------------------------------------------------------- 1 | .table > thead > tr > th, 2 | .table > tbody > tr > th, 3 | .table > tfoot > tr > th, 4 | .table > thead > tr > td, 5 | .table > tfoot > tr > td { 6 | background-color: $color-primaryLightest; 7 | font-weight: 500; 8 | } 9 | 10 | 11 | 12 | .table { 13 | font-size: 14px; 14 | > tbody { 15 | > tr{ 16 | td { 17 | .btn { 18 | padding: 4px 10px; 19 | line-height: 14px; 20 | } 21 | 22 | .form-group { 23 | > .btn { 24 | text-align: center; 25 | } 26 | } 27 | 28 | .btn-group { 29 | .dropdown-menu { 30 | right: 0; 31 | left: auto; 32 | box-shadow: 0px 10px 4px 0px #eee; 33 | 34 | .btn { 35 | margin: 4px 0px; 36 | width: 100%; 37 | box-sizing: inherit; 38 | text-align: left; 39 | padding: 4px 10px; 40 | 41 | i { 42 | margin-right: 4px; 43 | } 44 | } 45 | } 46 | } 47 | } 48 | 49 | &:nth-child(odd) { 50 | background: #fbfbfb; 51 | } 52 | } 53 | } 54 | } 55 | 56 | 57 | .table-report { 58 | .fa-arrow-down:before { 59 | color: #d00; 60 | } 61 | .fa-arrow-right:before { 62 | color: #f9c419; 63 | } 64 | 65 | .fa-arrow-up:before { 66 | color: #28bb09; 67 | } 68 | } 69 | 70 | 71 | 72 | 73 | 74 | .table { 75 | tr { 76 | td { 77 | .progress { 78 | height: 14px; 79 | color: $color-white; 80 | 81 | .progress-bar { 82 | font-size: 11px; 83 | padding: 0px; 84 | line-height: 14px; 85 | } 86 | } 87 | } 88 | } 89 | } 90 | -------------------------------------------------------------------------------- /src/scss/2-base/_tabs.scss: -------------------------------------------------------------------------------- 1 | .nav-tabs{ 2 | border-bottom-color: $color-primary; 3 | 4 | >li { 5 | >a { 6 | background-color: $color-neutral; 7 | border-radius: 0; 8 | color: $color-black; 9 | top: -1px; 10 | } 11 | } 12 | 13 | >li.active{ 14 | >a, 15 | >a:focus, 16 | >a:hover { 17 | border-radius: 0; 18 | background-color: $color-primary; 19 | color: $color-white; 20 | border-color: $color-primary; 21 | } 22 | } 23 | } -------------------------------------------------------------------------------- /src/scss/2-base/_typography.scss: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css?family=Roboto:400,500,900'); 2 | 3 | .gigantic, .huge, .large, .bigger, .big, 4 | h1, h2, h3, h4, h5, h6 { 5 | font-family: $font-stack; 6 | } 7 | 8 | p { 9 | line-height: 1.2; 10 | } 11 | -------------------------------------------------------------------------------- /src/scss/3-layout/_3-layout.scss: -------------------------------------------------------------------------------- 1 | @import "_header.scss"; 2 | 3 | @import "_navigation.scss"; 4 | 5 | @import "_common.scss"; 6 | 7 | @import "_footer.scss"; 8 | -------------------------------------------------------------------------------- /src/scss/3-layout/_common.scss: -------------------------------------------------------------------------------- 1 | 2 | .has-image .lazyload, 3 | .has-image .lazyload0 { 4 | top: 100% !important; 5 | z-index: 6; 6 | } 7 | 8 | .has-image .lazyload, 9 | .has-image .lazyload0 { 10 | position: relative; 11 | } 12 | 13 | .lazyload0, 14 | .lazyload { 15 | max-height: 50px; 16 | opacity: .2 !important; 17 | display: block; 18 | width: auto !important; 19 | margin: auto !important; 20 | } 21 | 22 | 23 | .preload * { 24 | -webkit-transition: none !important; 25 | -moz-transition: none !important; 26 | -ms-transition: none !important; 27 | -o-transition: none !important; 28 | } 29 | 30 | 31 | 32 | 33 | .home .casestudies-area, .index-page .casestudies-area { 34 | margin-bottom: 40px; 35 | } 36 | 37 | 38 | body { 39 | font-family: $font-stack; 40 | font-size: 16px; 41 | padding-right: 0 !important; 42 | 43 | @media (max-width: $breakpoint-mobile) { 44 | overflow-x: hidden !important; 45 | } 46 | 47 | .bg-none { 48 | background: none !important; 49 | } 50 | } -------------------------------------------------------------------------------- /src/scss/3-layout/_footer.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/scss/3-layout/_footer.scss -------------------------------------------------------------------------------- /src/scss/3-layout/_header.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/scss/3-layout/_header.scss -------------------------------------------------------------------------------- /src/scss/3-layout/_navigation.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/scss/3-layout/_navigation.scss -------------------------------------------------------------------------------- /src/scss/4-modules/_4-modules.scss: -------------------------------------------------------------------------------- 1 | @import "_contact-form.scss"; 2 | 3 | @import "_modal.scss"; 4 | 5 | @import "_print.scss"; 6 | -------------------------------------------------------------------------------- /src/scss/4-modules/_contact-form.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/scss/4-modules/_contact-form.scss -------------------------------------------------------------------------------- /src/scss/4-modules/_modal.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/scss/4-modules/_modal.scss -------------------------------------------------------------------------------- /src/scss/4-modules/_print.scss: -------------------------------------------------------------------------------- 1 | @page { 2 | size: landscape; /* optional */ 3 | } 4 | 5 | @media print { 6 | body { 7 | -webkit-print-color-adjust: exact; 8 | } 9 | 10 | @page { 11 | margin: 0; 12 | } 13 | 14 | .page-break-here { 15 | page-break-before: always; 16 | } 17 | 18 | * { 19 | background: transparent !important; 20 | color: #000 !important; 21 | box-shadow: none !important; 22 | text-shadow: none !important; 23 | } 24 | *, 25 | *::before, 26 | *::after { 27 | -webkit-print-color-adjust: exact; 28 | print-color-adjust: exact; 29 | } 30 | 31 | 32 | 33 | .btn, 34 | .btn-primary, 35 | .btn-default, 36 | button { 37 | display: none !important; 38 | } 39 | 40 | .print-hide { 41 | display: none !important; 42 | } 43 | 44 | .print-only { 45 | display: block !important; 46 | } 47 | 48 | .form-group { 49 | display: none !important; 50 | } 51 | 52 | 53 | 54 | a, 55 | a:visited { 56 | text-decoration: underline; 57 | } 58 | 59 | // show links on printed pages 60 | a[href]:after { 61 | content: " (" attr(href) ")"; 62 | } 63 | 64 | // show title too 65 | abbr[title]:after { 66 | content: " (" attr(title) ")"; 67 | } 68 | 69 | .ir a:after, 70 | a[href^="javascript:"]:after, 71 | a[href^="#"]:after { 72 | content: ""; 73 | } 74 | pre, 75 | blockquote { 76 | border: 1px solid #999; 77 | page-break-inside: avoid; 78 | } 79 | thead { 80 | display: table-header-group; 81 | } 82 | tr, 83 | img { 84 | page-break-inside: avoid; 85 | } 86 | img { 87 | max-width: 100% !important; 88 | } 89 | 90 | p, 91 | h2, 92 | h3 { 93 | orphans: 3; 94 | widows: 3; 95 | } 96 | h2, 97 | h3 { 98 | page-break-after: avoid; 99 | } 100 | } 101 | -------------------------------------------------------------------------------- /src/scss/5-templates/_5-templates.scss: -------------------------------------------------------------------------------- 1 | @import "_home.scss"; 2 | @import "_contact.scss"; 3 | -------------------------------------------------------------------------------- /src/scss/5-templates/_contact.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/scss/5-templates/_contact.scss -------------------------------------------------------------------------------- /src/scss/5-templates/_home.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/scss/5-templates/_home.scss -------------------------------------------------------------------------------- /src/scss/main.scss: -------------------------------------------------------------------------------- 1 | @import "1-helpers/_1-helpers.scss"; 2 | 3 | @import "0-plugin/_0-plugin.scss"; // on second place because using var from `1-helpers` 4 | 5 | @import "2-base/_2-base.scss"; 6 | 7 | @import "3-layout/_3-layout.scss"; 8 | 9 | @import "4-modules/_4-modules.scss"; 10 | 11 | @import "5-templates/_5-templates.scss"; 12 | 13 | 14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /src/vendor/bootstrap-validator/validator.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * Validator v0.11.9 for Bootstrap 3, by @1000hz 3 | * Copyright 2017 Cina Saffary 4 | * Licensed under http://opensource.org/licenses/MIT 5 | * 6 | * https://github.com/1000hz/bootstrap-validator 7 | */ 8 | 9 | +function(a){"use strict";function b(b){return b.is('[type="checkbox"]')?b.prop("checked"):b.is('[type="radio"]')?!!a('[name="'+b.attr("name")+'"]:checked').length:b.is("select[multiple]")?(b.val()||[]).length:b.val()}function c(b){return this.each(function(){var c=a(this),e=a.extend({},d.DEFAULTS,c.data(),"object"==typeof b&&b),f=c.data("bs.validator");(f||"destroy"!=b)&&(f||c.data("bs.validator",f=new d(this,e)),"string"==typeof b&&f[b]())})}var d=function(c,e){this.options=e,this.validators=a.extend({},d.VALIDATORS,e.custom),this.$element=a(c),this.$btn=a('button[type="submit"], input[type="submit"]').filter('[form="'+this.$element.attr("id")+'"]').add(this.$element.find('input[type="submit"], button[type="submit"]')),this.update(),this.$element.on("input.bs.validator change.bs.validator focusout.bs.validator",a.proxy(this.onInput,this)),this.$element.on("submit.bs.validator",a.proxy(this.onSubmit,this)),this.$element.on("reset.bs.validator",a.proxy(this.reset,this)),this.$element.find("[data-match]").each(function(){var c=a(this),d=c.attr("data-match");a(d).on("input.bs.validator",function(){b(c)&&c.trigger("input.bs.validator")})}),this.$inputs.filter(function(){return b(a(this))&&!a(this).closest(".has-error").length}).trigger("focusout"),this.$element.attr("novalidate",!0)};d.VERSION="0.11.9",d.INPUT_SELECTOR=':input:not([type="hidden"], [type="submit"], [type="reset"], button)',d.FOCUS_OFFSET=20,d.DEFAULTS={delay:500,html:!1,disable:!0,focus:!0,custom:{},errors:{match:"Does not match",minlength:"Not long enough"},feedback:{success:"glyphicon-ok",error:"glyphicon-remove"}},d.VALIDATORS={"native":function(a){var b=a[0];return b.checkValidity?!b.checkValidity()&&!b.validity.valid&&(b.validationMessage||"error!"):void 0},match:function(b){var c=b.attr("data-match");return b.val()!==a(c).val()&&d.DEFAULTS.errors.match},minlength:function(a){var b=a.attr("data-minlength");return a.val().length").addClass("list-unstyled").append(a.map(d,function(b){return a("
  • ")[c](b)})),void 0===f.data("bs.validator.originalContent")&&f.data("bs.validator.originalContent",f.html()),f.empty().append(d),e.addClass("has-error has-danger"),e.hasClass("has-feedback")&&g.removeClass(this.options.feedback.success)&&g.addClass(this.options.feedback.error)&&e.removeClass("has-success"))},d.prototype.clearErrors=function(a){var c=a.closest(".form-group"),d=c.find(".help-block.with-errors"),e=c.find(".form-control-feedback");d.html(d.data("bs.validator.originalContent")),c.removeClass("has-error has-danger has-success"),c.hasClass("has-feedback")&&e.removeClass(this.options.feedback.error)&&e.removeClass(this.options.feedback.success)&&b(a)&&e.addClass(this.options.feedback.success)&&c.addClass("has-success")},d.prototype.hasErrors=function(){function b(){return!!(a(this).data("bs.validator.errors")||[]).length}return!!this.$inputs.filter(b).length},d.prototype.isIncomplete=function(){function c(){var c=b(a(this));return!("string"==typeof c?a.trim(c):c)}return!!this.$inputs.filter("[required]").filter(c).length},d.prototype.onSubmit=function(a){this.validate(),(this.isIncomplete()||this.hasErrors())&&a.preventDefault()},d.prototype.toggleSubmit=function(){this.options.disable&&this.$btn.toggleClass("disabled",this.isIncomplete()||this.hasErrors())},d.prototype.defer=function(b,c){return c=a.proxy(c,this,b),this.options.delay?(window.clearTimeout(b.data("bs.validator.timeout")),void b.data("bs.validator.timeout",window.setTimeout(c,this.options.delay))):c()},d.prototype.reset=function(){return this.$element.find(".form-control-feedback").removeClass(this.options.feedback.error).removeClass(this.options.feedback.success),this.$inputs.removeData(["bs.validator.errors","bs.validator.deferred"]).each(function(){var b=a(this),c=b.data("bs.validator.timeout");window.clearTimeout(c)&&b.removeData("bs.validator.timeout")}),this.$element.find(".help-block.with-errors").each(function(){var b=a(this),c=b.data("bs.validator.originalContent");b.removeData("bs.validator.originalContent").html(c)}),this.$btn.removeClass("disabled"),this.$element.find(".has-error, .has-danger, .has-success").removeClass("has-error has-danger has-success"),this},d.prototype.destroy=function(){return this.reset(),this.$element.removeAttr("novalidate").removeData("bs.validator").off(".bs.validator"),this.$inputs.off(".bs.validator"),this.options=null,this.validators=null,this.$element=null,this.$btn=null,this.$inputs=null,this};var e=a.fn.validator;a.fn.validator=c,a.fn.validator.Constructor=d,a.fn.validator.noConflict=function(){return a.fn.validator=e,this},a(window).on("load",function(){a('form[data-toggle="validator"]').each(function(){var b=a(this);c.call(b,b.data())})})}(jQuery); -------------------------------------------------------------------------------- /src/vendor/bootstrap/popper.min.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (C) Federico Zivolo 2018 3 | Distributed under the MIT License (license terms are at http://opensource.org/licenses/MIT). 4 | */(function(e,t){'object'==typeof exports&&'undefined'!=typeof module?module.exports=t():'function'==typeof define&&define.amd?define(t):e.Popper=t()})(this,function(){'use strict';function e(e){return e&&'[object Function]'==={}.toString.call(e)}function t(e,t){if(1!==e.nodeType)return[];var o=getComputedStyle(e,null);return t?o[t]:o}function o(e){return'HTML'===e.nodeName?e:e.parentNode||e.host}function n(e){if(!e)return document.body;switch(e.nodeName){case'HTML':case'BODY':return e.ownerDocument.body;case'#document':return e.body;}var i=t(e),r=i.overflow,p=i.overflowX,s=i.overflowY;return /(auto|scroll|overlay)/.test(r+s+p)?e:n(o(e))}function r(e){return 11===e?re:10===e?pe:re||pe}function p(e){if(!e)return document.documentElement;for(var o=r(10)?document.body:null,n=e.offsetParent;n===o&&e.nextElementSibling;)n=(e=e.nextElementSibling).offsetParent;var i=n&&n.nodeName;return i&&'BODY'!==i&&'HTML'!==i?-1!==['TD','TABLE'].indexOf(n.nodeName)&&'static'===t(n,'position')?p(n):n:e?e.ownerDocument.documentElement:document.documentElement}function s(e){var t=e.nodeName;return'BODY'!==t&&('HTML'===t||p(e.firstElementChild)===e)}function d(e){return null===e.parentNode?e:d(e.parentNode)}function a(e,t){if(!e||!e.nodeType||!t||!t.nodeType)return document.documentElement;var o=e.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_FOLLOWING,n=o?e:t,i=o?t:e,r=document.createRange();r.setStart(n,0),r.setEnd(i,0);var l=r.commonAncestorContainer;if(e!==l&&t!==l||n.contains(i))return s(l)?l:p(l);var f=d(e);return f.host?a(f.host,t):a(e,d(t).host)}function l(e){var t=1=o.clientWidth&&n>=o.clientHeight}),l=0a[e]&&!t.escapeWithReference&&(n=J(f[o],a[e]-('right'===e?f.width:f.height))),ae({},o,n)}};return l.forEach(function(e){var t=-1===['left','top'].indexOf(e)?'secondary':'primary';f=le({},f,m[t](e))}),e.offsets.popper=f,e},priority:['left','right','top','bottom'],padding:5,boundariesElement:'scrollParent'},keepTogether:{order:400,enabled:!0,fn:function(e){var t=e.offsets,o=t.popper,n=t.reference,i=e.placement.split('-')[0],r=Z,p=-1!==['top','bottom'].indexOf(i),s=p?'right':'bottom',d=p?'left':'top',a=p?'width':'height';return o[s]r(n[s])&&(e.offsets.popper[d]=r(n[s])),e}},arrow:{order:500,enabled:!0,fn:function(e,o){var n;if(!q(e.instance.modifiers,'arrow','keepTogether'))return e;var i=o.element;if('string'==typeof i){if(i=e.instance.popper.querySelector(i),!i)return e;}else if(!e.instance.popper.contains(i))return console.warn('WARNING: `arrow.element` must be child of its popper element!'),e;var r=e.placement.split('-')[0],p=e.offsets,s=p.popper,d=p.reference,a=-1!==['left','right'].indexOf(r),l=a?'height':'width',f=a?'Top':'Left',m=f.toLowerCase(),h=a?'left':'top',c=a?'bottom':'right',u=S(i)[l];d[c]-us[c]&&(e.offsets.popper[m]+=d[m]+u-s[c]),e.offsets.popper=g(e.offsets.popper);var b=d[m]+d[l]/2-u/2,y=t(e.instance.popper),w=parseFloat(y['margin'+f],10),E=parseFloat(y['border'+f+'Width'],10),v=b-e.offsets.popper[m]-w-E;return v=$(J(s[l]-u,v),0),e.arrowElement=i,e.offsets.arrow=(n={},ae(n,m,Q(v)),ae(n,h,''),n),e},element:'[x-arrow]'},flip:{order:600,enabled:!0,fn:function(e,t){if(W(e.instance.modifiers,'inner'))return e;if(e.flipped&&e.placement===e.originalPlacement)return e;var o=v(e.instance.popper,e.instance.reference,t.padding,t.boundariesElement,e.positionFixed),n=e.placement.split('-')[0],i=T(n),r=e.placement.split('-')[1]||'',p=[];switch(t.behavior){case he.FLIP:p=[n,i];break;case he.CLOCKWISE:p=z(n);break;case he.COUNTERCLOCKWISE:p=z(n,!0);break;default:p=t.behavior;}return p.forEach(function(s,d){if(n!==s||p.length===d+1)return e;n=e.placement.split('-')[0],i=T(n);var a=e.offsets.popper,l=e.offsets.reference,f=Z,m='left'===n&&f(a.right)>f(l.left)||'right'===n&&f(a.left)f(l.top)||'bottom'===n&&f(a.top)f(o.right),g=f(a.top)f(o.bottom),b='left'===n&&h||'right'===n&&c||'top'===n&&g||'bottom'===n&&u,y=-1!==['top','bottom'].indexOf(n),w=!!t.flipVariations&&(y&&'start'===r&&h||y&&'end'===r&&c||!y&&'start'===r&&g||!y&&'end'===r&&u);(m||b||w)&&(e.flipped=!0,(m||b)&&(n=p[d+1]),w&&(r=G(r)),e.placement=n+(r?'-'+r:''),e.offsets.popper=le({},e.offsets.popper,C(e.instance.popper,e.offsets.reference,e.placement)),e=P(e.instance.modifiers,e,'flip'))}),e},behavior:'flip',padding:5,boundariesElement:'viewport'},inner:{order:700,enabled:!1,fn:function(e){var t=e.placement,o=t.split('-')[0],n=e.offsets,i=n.popper,r=n.reference,p=-1!==['left','right'].indexOf(o),s=-1===['top','left'].indexOf(o);return i[p?'left':'top']=r[o]-(s?i[p?'width':'height']:0),e.placement=T(t),e.offsets.popper=g(i),e}},hide:{order:800,enabled:!0,fn:function(e){if(!q(e.instance.modifiers,'hide','preventOverflow'))return e;var t=e.offsets.reference,o=D(e.instance.modifiers,function(e){return'preventOverflow'===e.name}).boundaries;if(t.bottomo.right||t.top>o.bottom||t.right',a='
      ',b='';c.init=function(l){var l=e.extend({},d,l);if(e("#css-ddslick").length<=0&&l.embedCSS){e(b).appendTo("head")}return this.each(function(){var p=e(this),q=p.data("ddslick");if(!q){var n=[],o=l.data;p.find("option").each(function(){var w=e(this),v=w.data();n.push({text:e.trim(w.text()),value:w.val(),selected:w.is(":selected"),description:v.description,imageSrc:v.imagesrc})});if(l.keepJSONItemsOnTop){e.merge(l.data,n)}else{l.data=e.merge(n,l.data)}var m=p,s=e('
      ');p.replaceWith(s);p=s;p.addClass("dd-container").append(i).append(a);var n=p.find(".dd-select"),u=p.find(".dd-options");u.css({width:l.width});n.css({width:l.width,background:l.background});p.css({width:l.width});if(l.height!=null){u.css({height:l.height,overflow:"auto"})}e.each(l.data,function(v,w){if(w.selected){l.defaultSelectedIndex=v}u.append('
    • '+(w.value?' ':"")+(w.imageSrc?' ':"")+(w.text?' ":"")+(w.description?' '+w.description+"":"")+"
      • ")});var t={settings:l,original:m,selectedIndex:-1,selectedItem:null,selectedData:null};p.data("ddslick",t);if(l.selectText.length>0&&l.defaultSelectedIndex==null){p.find(".dd-selected").html(l.selectText)}else{var r=(l.defaultSelectedIndex!=null&&l.defaultSelectedIndex>=0&&l.defaultSelectedIndex':"")+(t.text?'":"")+(t.description?''+t.description+"":""))}else{r.html(t.text)}n.val(t.value);u.original.val(t.value);q.data("ddslick",u);k(q);g(q);if(typeof o.onSelected=="function"){o.onSelected.call(this,u)}}function f(p){var o=p.find(".dd-select"),m=o.siblings(".dd-options"),l=o.find(".dd-pointer"),n=m.is(":visible");e(".dd-click-off-close").not(m).slideUp(50);e(".dd-pointer").removeClass("dd-pointer-up");if(n){m.slideUp("fast");l.removeClass("dd-pointer-up")}else{m.slideDown("fast");l.addClass("dd-pointer-up")}h(p)}function k(l){l.find(".dd-options").slideUp(50);l.find(".dd-pointer").removeClass("dd-pointer-up").removeClass("dd-pointer-up")}function g(o){var n=o.find(".dd-select").css("height");var m=o.find(".dd-selected-description");var l=o.find(".dd-selected-image");if(m.length<=0&&l.length>0){o.find(".dd-selected-text").css("lineHeight",n)}}function h(l){l.find(".dd-option").each(function(){var p=e(this);var n=p.css("height");var o=p.find(".dd-option-description");var m=l.find(".dd-option-image");if(o.length<=0&&m.length>0){p.find(".dd-option-text").css("lineHeight",n)}})}})(jQuery); 2 | -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-brands-400.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-brands-400.eot -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-brands-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-brands-400.ttf -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-brands-400.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-brands-400.woff -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-brands-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-brands-400.woff2 -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-regular-400.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-regular-400.eot -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-regular-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-regular-400.ttf -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-regular-400.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-regular-400.woff -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-regular-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-regular-400.woff2 -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-solid-900.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-solid-900.eot -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-solid-900.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-solid-900.ttf -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-solid-900.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-solid-900.woff -------------------------------------------------------------------------------- /src/vendor/fontawesome/webfonts/fa-solid-900.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/fontawesome/webfonts/fa-solid-900.woff2 -------------------------------------------------------------------------------- /src/vendor/kodeized/kodeized.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * Kodeized v4.5 3 | * Coding made effortless. 4 | * This file contains works for many various kinds of tasks 5 | */ 6 | 7 | 8 | /*! 9 | Global Variables 10 | */ 11 | var htmlTag = document.getElementsByTagName("html")[0]; 12 | var bodyTag = document.getElementsByTagName("body")[0]; 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | /**!preloader**/ 21 | window.addEventListener('load', function() { 22 | console.log('✨ All assets are loaded') 23 | var preloader = document.getElementById("preloader"); 24 | var preloader__status = document.getElementById("preloader__status"); 25 | 26 | if ( document.body.contains( preloader ) && document.body.contains( preloader__status ) ) { 27 | preloader.classList.add("hide"); 28 | preloader__status.classList.remove("hide"); 29 | } else { 30 | console.warn("🌀 Preloader doesn't exsit!"); 31 | } 32 | }); 33 | /**./preloader**/ 34 | 35 | 36 | 37 | 38 | 39 | 40 | /**!hint**/ 41 | /* 42 | Ctrl + ~ for preview 43 | */ 44 | function hintFn(e) { 45 | var evtobj = window.event? event : e; 46 | if (evtobj.keyCode == 192 && evtobj.ctrlKey){ 47 | htmlTag.classList.toggle("hint"); 48 | } 49 | } 50 | 51 | document.onkeydown = hintFn; 52 | /**./hint**/ 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | /**!hint--gridized**/ 63 | /*! 64 | Ctrl + ' for preview 65 | */ 66 | function gridizedFn(e) { 67 | var evtobj = window.event? event : e; 68 | if (evtobj.keyCode == 222 && evtobj.ctrlKey) { 69 | 70 | var gridizedContent = '
      '; 71 | 72 | htmlTag.classList.toggle("hint--gridized"); 73 | 74 | /* 75 | Checking if already exist then remove it, 76 | before creating new one. 77 | */ 78 | var gridizedExist = document.getElementById("gridized"); 79 | if( document.contains( gridized ) ){ 80 | gridizedExist.remove(); 81 | } 82 | 83 | /* Creating Bootstrap Grid for hint */ 84 | var gridizedNew = document.createElement("div"); 85 | gridizedNew.setAttribute("id", "gridized"); 86 | gridizedNew.innerHTML = gridizedContent; 87 | document.body.appendChild(gridizedNew); 88 | } 89 | } 90 | 91 | document.onkeydown = gridizedFn; 92 | /**./hint--gridized**/ 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | /*! 106 | Detect orientation change of device 107 | */ 108 | window.addEventListener( "orientationchange", function() { 109 | /* 110 | get new orientation number 111 | */ 112 | bodyTag.setAttribute('data-orientation', window.orientation) 113 | }, false ); 114 | /* ./Detect orientation change of device */ 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | /**! URL added on body tag as a Class**/ 129 | document.addEventListener('DOMContentLoaded', function() { 130 | 131 | var locReal = window.location.pathname; // returns the full URL 132 | 133 | /* removing file extention i.e .html .php etc. */ 134 | function removeUrlExtFn(urlExt){ 135 | return locReal.split(urlExt)[0]; 136 | } 137 | 138 | var locReal = removeUrlExtFn(".html"); 139 | var locReal = removeUrlExtFn(".php"); 140 | 141 | var loc = locReal.replace(".", "/"); 142 | var split_loc = loc.split('/'); 143 | 144 | 145 | active_locLastParent2 = split_loc[split_loc.length-3]; 146 | active_locLastParent = split_loc[split_loc.length-2]; 147 | active_locLast = split_loc[split_loc.length-1]; 148 | 149 | 150 | bodyTag.classList.add(active_locLastParent2 + "-page"); 151 | bodyTag.classList.add(active_locLastParent + "-page"); 152 | bodyTag.classList.add(active_locLast + "-page"); 153 | 154 | 155 | var urlParameters = window.location.search; /*! returns the URL Parameters */ 156 | var split_urlParameters = urlParameters.split(/[ .=:;?!~,`"&|()<>{}\[\]\r\n/\\]+/); 157 | urlParametersLast= split_urlParameters[split_urlParameters.length-1]; 158 | urlParametersLast2= split_urlParameters[split_urlParameters.length-2]; 159 | 160 | bodyTag.classList.add("parameter--"+urlParametersLast); 161 | bodyTag.classList.add("parameter--"+urlParametersLast2); 162 | 163 | var urlHash = window.location.hash; 164 | var urlHashSplit = urlHash.split("#"); 165 | var urlHashAfterSplit = "-no-hash"; 166 | if (urlHashSplit[1] != null){ 167 | urlHashAfterSplit = urlHashSplit[1]; 168 | } 169 | bodyTag.classList.add("hashtag--"+urlHashAfterSplit); 170 | 171 | }); 172 | /**!./URL added on body tag as a Class**/ 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 | 181 | 182 | 183 | 184 | 185 | 186 | 187 | 188 | bodyTag.addEventListener("keydown", function (e) { 189 | 190 | /* 191 | ` Ctrl + / ` 192 | */ 193 | if (e.keyCode == 191 && e.ctrlKey) { 194 | 195 | // remove before create new one. 196 | var mockupMatcherExist = document.getElementById("mockupMatcher"); 197 | if( document.contains( mockupMatcherExist ) ){ 198 | mockupMatcherExist.remove(); 199 | } 200 | 201 | var fileName = "_mockup/" + active_locLast + ".jpg"; 202 | var mockupMatcherContent = '
      '; 203 | 204 | var mockupMatcherDiv = document.createElement('div'); 205 | mockupMatcherDiv.setAttribute("id", "mockupMatcher"); 206 | mockupMatcherDiv.innerHTML = mockupMatcherContent; 207 | bodyTag.appendChild(mockupMatcherDiv); 208 | 209 | htmlTag.classList.toggle("hint--mockup"); 210 | 211 | } 212 | }); 213 | 214 | 215 | 216 | 217 | 218 | 219 | 220 | 221 | /*! 222 | Scroll To View 223 | Usage: Click me 224 | */ 225 | function scrollToViewFunc(sectionId) { 226 | document.getElementById(sectionId).scrollIntoView({ 227 | behavior: 'smooth' 228 | }); 229 | } 230 | /*./Scroll To View*/ 231 | 232 | 233 | 234 | 235 | 236 | 237 | 238 | 239 | 240 | /**!scrollized**/ 241 | window.onscroll = function() { 242 | 243 | if ((window.innerHeight) >= document.body.scrollHeight) { 244 | document.body.classList.add("scrollized--1stview"); 245 | } else if (window.scrollY > 0) { 246 | document.body.classList.add("scrollized"); 247 | } else { 248 | document.body.classList.remove("scrollized"); 249 | document.body.classList.remove("scrollized--1stview"); 250 | } 251 | 252 | }; 253 | /**./scrollized**/ 254 | 255 | 256 | 257 | 258 | 259 | 260 | 261 | 262 | 263 | 264 | /**! Detecting Browser, Device & OS detail **/ 265 | function browser_and_OS(u) { 266 | var ua = u.toLowerCase(), 267 | is = function(t) { 268 | return ua.indexOf(t) > -1; 269 | }, 270 | g = "gecko", 271 | w = "webkit", 272 | s = "safari", 273 | o = "opera", 274 | m = "mobile", 275 | h = document.documentElement, 276 | b = [ 277 | !/opera|webtv/i.test(ua) && /msie\s(\d)/.test(ua) 278 | ? "ie ie" + RegExp.$1 279 | : is("firefox/2") 280 | ? g + " ff2" 281 | : is("firefox/3.5") 282 | ? g + " ff3 ff3_5" 283 | : is("firefox/3.6") 284 | ? g + " ff3 ff3_6" 285 | : is("firefox/3") 286 | ? g + " ff3" 287 | : is("gecko/") 288 | ? g 289 | : is("opera") 290 | ? o + 291 | (/version\/(\d+)/.test(ua) 292 | ? " " + o + RegExp.$1 293 | : /opera(\s|\/)(\d+)/.test(ua) 294 | ? " " + o + RegExp.$2 295 | : "") 296 | : is("konqueror") 297 | ? "konqueror" 298 | : is("blackberry") 299 | ? m + " blackberry" 300 | : is("android") 301 | ? m + " android" 302 | : is("chrome") 303 | ? w + " chrome" 304 | : is("iron") 305 | ? w + " iron" 306 | : is("applewebkit/") 307 | ? w + 308 | " " + 309 | s + 310 | (/version\/(\d+)/.test(ua) 311 | ? " " + s + RegExp.$1 312 | : "") 313 | : is("mozilla/") ? g : "", 314 | is("j2me") 315 | ? m + " j2me" 316 | : is("iphone") 317 | ? m + " iphone" 318 | : is("ipod") 319 | ? m + " ipod" 320 | : is("ipad") 321 | ? m + " ipad" 322 | : is("mac") 323 | ? "mac" 324 | : is("darwin") 325 | ? "mac" 326 | : is("webtv") 327 | ? "webtv" 328 | : is("win") 329 | ? "win" + (is("windows nt 6.0") ? " vista" : "") 330 | : is("freebsd") 331 | ? "freebsd" 332 | : is("x11") || is("linux") ? "linux" : "", 333 | "js" 334 | ]; 335 | c = b.join(" "); 336 | h.className += " " + c; 337 | return c; 338 | } 339 | browser_and_OS(navigator.userAgent); 340 | /**./Detecting Browser, Device & OS detail **/ 341 | -------------------------------------------------------------------------------- /src/vendor/lazysizes/lazysizes.min.js: -------------------------------------------------------------------------------- 1 | /*! lazysizes - v4.0.3 */ 2 | !function(a, b){var c = b(a, a.document); a.lazySizes = c, "object" == typeof module && module.exports && (module.exports = c)}(window, function(a, b){"use strict"; if (b.getElementsByClassName){var c, d, e = b.documentElement, f = a.Date, g = a.HTMLPictureElement, h = "addEventListener", i = "getAttribute", j = a[h], k = a.setTimeout, l = a.requestAnimationFrame || k, m = a.requestIdleCallback, n = /^picture$/i, o = ["load", "error", "lazyincluded", "_lazyloaded"], p = {}, q = Array.prototype.forEach, r = function(a, b){return p[b] || (p[b] = new RegExp("(\\s|^)" + b + "(\\s|$)")), p[b].test(a[i]("class") || "") && p[b]}, s = function(a, b){r(a, b) || a.setAttribute("class", (a[i]("class") || "").trim() + " " + b)}, t = function(a, b){var c; (c = r(a, b)) && a.setAttribute("class", (a[i]("class") || "").replace(c, " "))}, u = function(a, b, c){var d = c?h:"removeEventListener"; c && u(a, b), o.forEach(function(c){a[d](c, b)})}, v = function(a, d, e, f, g){var h = b.createEvent("CustomEvent"); return e || (e = {}), e.instance = c, h.initCustomEvent(d, !f, !g, e), a.dispatchEvent(h), h}, w = function(b, c){var e; !g && (e = a.picturefill || d.pf)?e({reevaluate:!0, elements:[b]}):c && c.src && (b.src = c.src)}, x = function(a, b){return(getComputedStyle(a, null) || {})[b]}, y = function(a, b, c){for (c = c || a.offsetWidth; c < d.minSize && b && !a._lazysizesWidth; )c = b.offsetWidth, b = b.parentNode; return c}, z = function(){var a, c, d = [], e = [], f = d, g = function(){var b = f; for (f = d.length?e:d, a = !0, c = !1; b.length; )b.shift()(); a = !1}, h = function(d, e){a && !e?d.apply(this, arguments):(f.push(d), c || (c = !0, (b.hidden?k:l)(g)))}; return h._lsFlush = g, h}(), A = function(a, b){return b?function(){z(a)}:function(){var b = this, c = arguments; z(function(){a.apply(b, c)})}}, B = function(a){var b, c = 0, e = d.throttleDelay, g = d.ricTimeout, h = function(){b = !1, c = f.now(), a()}, i = m && g > 49?function(){m(h, {timeout:g}), g !== d.ricTimeout && (g = d.ricTimeout)}:A(function(){k(h)}, !0); return function(a){var d; (a = a === !0) && (g = 33), b || (b = !0, d = e - (f.now() - c), 0 > d && (d = 0), a || 9 > d?i():k(i, d))}}, C = function(a){var b, c, d = 99, e = function(){b = null, a()}, g = function(){var a = f.now() - c; d > a?k(g, d - a):(m || e)(e)}; return function(){c = f.now(), b || (b = k(g, d))}}; !function(){var b, c = {lazyClass:"lazyload", loadedClass:"lazyloaded", loadingClass:"lazyloading", preloadClass:"lazypreload", errorClass:"lazyerror", autosizesClass:"lazyautosizes", srcAttr:"data-src", srcsetAttr:"data-srcset", sizesAttr:"data-sizes", minSize:40, customMedia:{}, init:!0, expFactor:1.5, hFac:.8, loadMode:2, loadHidden:!0, ricTimeout:0, throttleDelay:125}; d = a.lazySizesConfig || a.lazysizesConfig || {}; for (b in c)b in d || (d[b] = c[b]); a.lazySizesConfig = d, k(function(){d.init && F()})}(); var D = function(){var g, l, m, o, p, y, D, F, G, H, I, J, K, L, M = /^img$/i, N = /^iframe$/i, O = "onscroll"in a && !/glebot/.test(navigator.userAgent), P = 0, Q = 0, R = 0, S = - 1, T = function(a){R--, a && a.target && u(a.target, T), (!a || 0 > R || !a.target) && (R = 0)}, U = function(a, c){var d, f = a, g = "hidden" == x(b.body, "visibility") || "hidden" != x(a, "visibility"); for (F -= c, I += c, G -= c, H += c; g && (f = f.offsetParent) && f != b.body && f != e; )g = (x(f, "opacity") || 1) > 0, g && "visible" != x(f, "overflow") && (d = f.getBoundingClientRect(), g = H > d.left && G < d.right && I > d.top - 1 && F < d.bottom + 1); return g}, V = function(){var a, f, h, j, k, m, n, p, q, r = c.elements; if ((o = d.loadMode) && 8 > R && (a = r.length)){f = 0, S++, null == K && ("expand"in d || (d.expand = e.clientHeight > 500 && e.clientWidth > 500?500:370), J = d.expand, K = J * d.expFactor), K > Q && 1 > R && S > 2 && o > 2 && !b.hidden?(Q = K, S = 0):Q = o > 1 && S > 1 && 6 > R?J:P; for (; a > f; f++)if (r[f] && !r[f]._lazyRace)if (O)if ((p = r[f][i]("data-expand")) && (m = 1 * p) || (m = Q), q !== m && (y = innerWidth + m * L, D = innerHeight + m, n = - 1 * m, q = m), h = r[f].getBoundingClientRect(), (I = h.bottom) >= n && (F = h.top) <= D && (H = h.right) >= n * L && (G = h.left) <= y && (I || H || G || F) && (d.loadHidden || "hidden" != x(r[f], "visibility")) && (l && 3 > R && !p && (3 > o || 4 > S) || U(r[f], m))){if (ba(r[f]), k = !0, R > 9)break} else!k && l && !j && 4 > R && 4 > S && o > 2 && (g[0] || d.preloadAfterLoad) && (g[0] || !p && (I || H || G || F || "auto" != r[f][i](d.sizesAttr))) && (j = g[0] || r[f]); else ba(r[f]); j && !k && ba(j)}}, W = B(V), X = function(a){s(a.target, d.loadedClass), t(a.target, d.loadingClass), u(a.target, Z), v(a.target, "lazyloaded")}, Y = A(X), Z = function(a){Y({target:a.target})}, $ = function(a, b){try{a.contentWindow.location.replace(b)} catch (c){a.src = b}}, _ = function(a){var b, c = a[i](d.srcsetAttr); (b = d.customMedia[a[i]("data-media") || a[i]("media")]) && a.setAttribute("media", b), c && a.setAttribute("srcset", c)}, aa = A(function(a, b, c, e, f){var g, h, j, l, o, p; (o = v(a, "lazybeforeunveil", b)).defaultPrevented || (e && (c?s(a, d.autosizesClass):a.setAttribute("sizes", e)), h = a[i](d.srcsetAttr), g = a[i](d.srcAttr), f && (j = a.parentNode, l = j && n.test(j.nodeName || "")), p = b.firesLoad || "src"in a && (h || g || l), o = {target:a}, p && (u(a, T, !0), clearTimeout(m), m = k(T, 2500), s(a, d.loadingClass), u(a, Z, !0)), l && q.call(j.getElementsByTagName("source"), _), h?a.setAttribute("srcset", h):g && !l && (N.test(a.nodeName)?$(a, g):a.src = g), f && (h || l) && w(a, {src:g})), a._lazyRace && delete a._lazyRace, t(a, d.lazyClass), z(function(){(!p || a.complete && a.naturalWidth > 1) && (p?T(o):R--, X(o))}, !0)}), ba = function(a){var b, c = M.test(a.nodeName), e = c && (a[i](d.sizesAttr) || a[i]("sizes")), f = "auto" == e; (!f && l || !c || !a[i]("src") && !a.srcset || a.complete || r(a, d.errorClass) || !r(a, d.lazyClass)) && (b = v(a, "lazyunveilread").detail, f && E.updateElem(a, !0, a.offsetWidth), a._lazyRace = !0, R++, aa(a, b, f, e, c))}, ca = function(){if (!l){if (f.now() - p < 999)return void k(ca, 999); var a = C(function(){d.loadMode = 3, W()}); l = !0, d.loadMode = 3, W(), j("scroll", function(){3 == d.loadMode && (d.loadMode = 2), a()}, !0)}}; return{_:function(){p = f.now(), c.elements = b.getElementsByClassName(d.lazyClass), g = b.getElementsByClassName(d.lazyClass + " " + d.preloadClass), L = d.hFac, j("scroll", W, !0), j("resize", W, !0), a.MutationObserver?new MutationObserver(W).observe(e, {childList:!0, subtree:!0, attributes:!0}):(e[h]("DOMNodeInserted", W, !0), e[h]("DOMAttrModified", W, !0), setInterval(W, 999)), j("hashchange", W, !0), ["focus", "mouseover", "click", "load", "transitionend", "animationend", "webkitAnimationEnd"].forEach(function(a){b[h](a, W, !0)}), /d$|^c/.test(b.readyState)?ca():(j("load", ca), b[h]("DOMContentLoaded", W), k(ca, 2e4)), c.elements.length?(V(), z._lsFlush()):W()}, checkElems:W, unveil:ba}}(), E = function(){var a, c = A(function(a, b, c, d){var e, f, g; if (a._lazysizesWidth = d, d += "px", a.setAttribute("sizes", d), n.test(b.nodeName || ""))for (e = b.getElementsByTagName("source"), f = 0, g = e.length; g > f; f++)e[f].setAttribute("sizes", d); c.detail.dataAttr || w(a, c.detail)}), e = function(a, b, d){var e, f = a.parentNode; f && (d = y(a, f, d), e = v(a, "lazybeforesizes", {width:d, dataAttr:!!b}), e.defaultPrevented || (d = e.detail.width, d && d !== a._lazysizesWidth && c(a, f, e, d)))}, f = function(){var b, c = a.length; if (c)for (b = 0; c > b; b++)e(a[b])}, g = C(f); return{_:function(){a = b.getElementsByClassName(d.autosizesClass), j("resize", g)}, checkElems:g, updateElem:e}}(), F = function(){F.i || (F.i = !0, E._(), D._())}; return c = {cfg:d, autoSizer:E, loader:D, init:F, uP:w, aC:s, rC:t, hC:r, fire:v, gW:y, rAF:z}}}); -------------------------------------------------------------------------------- /src/vendor/material-icons/MaterialIcons.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/src/vendor/material-icons/MaterialIcons.woff2 -------------------------------------------------------------------------------- /src/vendor/material-icons/material-icons.css: -------------------------------------------------------------------------------- 1 | /* fallback */ 2 | @font-face { 3 | font-family: 'Material Icons'; 4 | font-style: normal; 5 | font-weight: 400; 6 | src: url(MaterialIcons.woff2) format('woff2'); 7 | } 8 | 9 | .material-icons { 10 | font-family: 'Material Icons'; 11 | font-weight: normal; 12 | font-style: normal; 13 | font-size: 24px; 14 | line-height: 1; 15 | letter-spacing: normal; 16 | text-transform: none; 17 | display: inline-block; 18 | white-space: nowrap; 19 | word-wrap: normal; 20 | direction: ltr; 21 | -webkit-font-feature-settings: 'liga'; 22 | -webkit-font-smoothing: antialiased; 23 | } 24 | 25 | -------------------------------------------------------------------------------- /src/vendor/polyfill/polyfill.min.js: -------------------------------------------------------------------------------- 1 | /* Disable minification (remove `.min` from URL path) for more info */ 2 | 3 | (function(undefined) {}).call('object' === typeof window && window || 'object' === typeof self && self || 'object' === typeof global && global || {}); -------------------------------------------------------------------------------- /src/vendor/swiper/iconfinder_1_Facebook2_colored_svg_5296500.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/vendor/swiper/swiper.min.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Swiper 5.2.0 3 | * Most modern mobile touch slider and framework with hardware accelerated transitions 4 | * http://swiperjs.com 5 | * 6 | * Copyright 2014-2019 Vladimir Kharlampidi 7 | * 8 | * Released under the MIT License 9 | * 10 | * Released on: October 26, 2019 11 | */ 12 | 13 | @font-face{font-family:swiper-icons;src:url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}.swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-container-multirow>.swiper-wrapper{flex-wrap:wrap}.swiper-container-multirow-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-container-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-container-3d{perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-container-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(-1 * var(--swiper-navigation-size)/ 2);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;text-transform:none;font-variant:initial}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{left:10px;right:auto}.swiper-button-prev:after,.swiper-container-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{right:10px;left:auto}.swiper-button-next:after,.swiper-container-rtl .swiper-button-prev:after{content:'next'}.swiper-button-next.swiper-button-white,.swiper-button-prev.swiper-button-white{--swiper-navigation-color:#ffffff}.swiper-button-next.swiper-button-black,.swiper-button-prev.swiper-button-black{--swiper-navigation-color:#000000}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0px,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white{--swiper-pagination-color:#ffffff}.swiper-pagination-black{--swiper-pagination-color:#000000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;animation:swiper-preloader-spin 1s infinite linear;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden} -------------------------------------------------------------------------------- /src/vendor/trip/trip.min.css: -------------------------------------------------------------------------------- 1 | @-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-webkit-keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(0.3)}50%{opacity:1;-webkit-transform:scale(1.05)}70%{-webkit-transform:scale(0.9)}100%{-webkit-transform:scale(1)}}@-webkit-keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px)}80%{-webkit-transform:translateY(-10px)}100%{-webkit-transform:translateY(0)}}@-webkit-keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px)}80%{-webkit-transform:translateY(10px)}100%{-webkit-transform:translateY(0)}}@-webkit-keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px)}80%{-webkit-transform:translateX(10px)}100%{-webkit-transform:translateX(0)}}@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px)}80%{-webkit-transform:translateX(-10px)}100%{-webkit-transform:translateX(0)}}@-webkit-keyframes flash{0%{opacity:1}25%{opacity:0}50%{opacity:1}75%{opacity:0}100%{opacity:1}}@-webkit-keyframes bounce{0%{-webkit-transform:translateY(0)}20%{-webkit-transform:translateY(0)}40%{-webkit-transform:translateY(-30px)}50%{-webkit-transform:translateY(0)}60%{-webkit-transform:translateY(-15px)}80%{-webkit-transform:translateY(0)}100%{-webkit-transform:translateY(0)}}@-webkit-keyframes shake{0%{-webkit-transform:translateX(0)}10%{-webkit-transform:translateX(-10px)}20%{-webkit-transform:translateX(10px)}30%{-webkit-transform:translateX(-10px)}40%{-webkit-transform:translateX(10px)}50%{-webkit-transform:translateX(-10px)}60%{-webkit-transform:translateX(10px)}70%{-webkit-transform:translateX(-10px)}80%{-webkit-transform:translateX(10px)}90%{-webkit-transform:translateX(-10px)}100%{-webkit-transform:translateX(0)}}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(0);opacity:1}}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(0);opacity:1}}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(0);opacity:1}}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(0);opacity:1}}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center center;-webkit-transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;-webkit-transform:rotate(0);opacity:1}}@-webkit-keyframes tada{0%{-webkit-transform:scale(1)}10%{-webkit-transform:scale(0.9) rotate(-3deg)}20%{-webkit-transform:scale(0.9) rotate(-3deg)}30%{-webkit-transform:scale(1.1) rotate(3deg)}40%{-webkit-transform:scale(1.1) rotate(-3deg)}50%{-webkit-transform:scale(1.1) rotate(3deg)}60%{-webkit-transform:scale(1.1) rotate(-3deg)}70%{-webkit-transform:scale(1.1) rotate(3deg)}80%{-webkit-transform:scale(1.1) rotate(-3deg)}90%{-webkit-transform:scale(1.1) rotate(3deg)}100%{-webkit-transform:scale(1) rotate(0)}}@-moz-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-moz-keyframes fadeInUp{0%{opacity:0;-moz-transform:translateY(20px)}100%{opacity:1;-moz-transform:translateY(0)}}@-moz-keyframes fadeInDown{0%{opacity:0;-moz-transform:translateY(-20px)}100%{opacity:1;-moz-transform:translateY(0)}}@-moz-keyframes fadeInRight{0%{opacity:0;-moz-transform:translateX(20px)}100%{opacity:1;-moz-transform:translateX(0)}}@-moz-keyframes fadeInLeft{0%{opacity:0;-moz-transform:translateX(-20px)}100%{opacity:1;-moz-transform:translateX(0)}}@-moz-keyframes fadeInUpBig{0%{opacity:0;-moz-transform:translateY(2000px)}100%{opacity:1;-moz-transform:translateY(0)}}@-moz-keyframes fadeInDownBig{0%{opacity:0;-moz-transform:translateY(-2000px)}100%{opacity:1;-moz-transform:translateY(0)}}@-moz-keyframes fadeInRightBig{0%{opacity:0;-moz-transform:translateX(2000px)}100%{opacity:1;-moz-transform:translateX(0)}}@-moz-keyframes fadeInLeftBig{0%{opacity:0;-moz-transform:translateX(-2000px)}100%{opacity:1;-moz-transform:translateX(0)}}@-moz-keyframes bounceIn{0%{opacity:0;-moz-transform:scale(0.3)}50%{opacity:1;-moz-transform:scale(1.05)}70%{-moz-transform:scale(0.9)}100%{-moz-transform:scale(1)}}@-moz-keyframes bounceInDown{0%{opacity:0;-moz-transform:translateY(-2000px)}60%{opacity:1;-moz-transform:translateY(30px)}80%{-moz-transform:translateY(-10px)}100%{-moz-transform:translateY(0)}}@-moz-keyframes bounceInUp{0%{opacity:0;-moz-transform:translateY(2000px)}60%{opacity:1;-moz-transform:translateY(-30px)}80%{-moz-transform:translateY(10px)}100%{-moz-transform:translateY(0)}}@-moz-keyframes bounceInRight{0%{opacity:0;-moz-transform:translateX(2000px)}60%{opacity:1;-moz-transform:translateX(-30px)}80%{-moz-transform:translateX(10px)}100%{-moz-transform:translateX(0)}}@-moz-keyframes bounceInLeft{0%{opacity:0;-moz-transform:translateX(-2000px)}60%{opacity:1;-moz-transform:translateX(30px)}80%{-moz-transform:translateX(-10px)}100%{-moz-transform:translateX(0)}}@-moz-keyframes flash{0%{opacity:1}25%{opacity:0}50%{opacity:1}75%{opacity:0}100%{opacity:1}}@-moz-keyframes bounce{0%{-moz-transform:translateY(0)}20%{-moz-transform:translateY(0)}40%{-moz-transform:translateY(-30px)}50%{-moz-transform:translateY(0)}60%{-moz-transform:translateY(-15px)}80%{-moz-transform:translateY(0)}100%{-moz-transform:translateY(0)}}@-moz-keyframes shake{0%{-moz-transform:translateX(0)}10%{-moz-transform:translateX(-10px)}20%{-moz-transform:translateX(10px)}30%{-moz-transform:translateX(-10px)}40%{-moz-transform:translateX(10px)}50%{-moz-transform:translateX(-10px)}60%{-moz-transform:translateX(10px)}70%{-moz-transform:translateX(-10px)}80%{-moz-transform:translateX(10px)}90%{-moz-transform:translateX(-10px)}100%{-moz-transform:translateX(0)}}@-moz-keyframes rotateInDownLeft{0%{-moz-transform-origin:left bottom;-moz-transform:rotate(-90deg);opacity:0}100%{-moz-transform-origin:left bottom;-moz-transform:rotate(0);opacity:1}}@-moz-keyframes rotateInUpLeft{0%{-moz-transform-origin:left bottom;-moz-transform:rotate(90deg);opacity:0}100%{-moz-transform-origin:left bottom;-moz-transform:rotate(0);opacity:1}}@-moz-keyframes rotateInUpRight{0%{-moz-transform-origin:right bottom;-moz-transform:rotate(-90deg);opacity:0}100%{-moz-transform-origin:right bottom;-moz-transform:rotate(0);opacity:1}}@-moz-keyframes rotateInDownRight{0%{-moz-transform-origin:right bottom;-moz-transform:rotate(90deg);opacity:0}100%{-moz-transform-origin:right bottom;-moz-transform:rotate(0);opacity:1}}@-moz-keyframes rotateIn{0%{-moz-transform-origin:center center;-moz-transform:rotate(-200deg);opacity:0}100%{-moz-transform-origin:center center;-moz-transform:rotate(0);opacity:1}}@-moz-keyframes tada{0%{-moz-transform:scale(1)}10%{-moz-transform:scale(0.9) rotate(-3deg)}20%{-moz-transform:scale(0.9) rotate(-3deg)}30%{-moz-transform:scale(1.1) rotate(3deg)}40%{-moz-transform:scale(1.1) rotate(-3deg)}50%{-moz-transform:scale(1.1) rotate(3deg)}60%{-moz-transform:scale(1.1) rotate(-3deg)}70%{-moz-transform:scale(1.1) rotate(3deg)}80%{-moz-transform:scale(1.1) rotate(-3deg)}90%{-moz-transform:scale(1.1) rotate(3deg)}100%{-moz-transform:scale(1) rotate(0)}}@-ms-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-ms-keyframes fadeInUp{0%{opacity:0;-ms-transform:translateY(20px)}100%{opacity:1;-ms-transform:translateY(0)}}@-ms-keyframes fadeInDown{0%{opacity:0;-ms-transform:translateY(-20px)}100%{opacity:1;-ms-transform:translateY(0)}}@-ms-keyframes fadeInRight{0%{opacity:0;-ms-transform:translateX(20px)}100%{opacity:1;-ms-transform:translateX(0)}}@-ms-keyframes fadeInLeft{0%{opacity:0;-ms-transform:translateX(-20px)}100%{opacity:1;-ms-transform:translateX(0)}}@-ms-keyframes fadeInUpBig{0%{opacity:0;-ms-transform:translateY(2000px)}100%{opacity:1;-ms-transform:translateY(0)}}@-ms-keyframes fadeInDownBig{0%{opacity:0;-ms-transform:translateY(-2000px)}100%{opacity:1;-ms-transform:translateY(0)}}@-ms-keyframes fadeInRightBig{0%{opacity:0;-ms-transform:translateX(2000px)}100%{opacity:1;-ms-transform:translateX(0)}}@-ms-keyframes fadeInLeftBig{0%{opacity:0;-ms-transform:translateX(-2000px)}100%{opacity:1;-ms-transform:translateX(0)}}@-ms-keyframes bounceIn{0%{opacity:0;-ms-transform:scale(0.3)}50%{opacity:1;-ms-transform:scale(1.05)}70%{-ms-transform:scale(0.9)}100%{-ms-transform:scale(1)}}@-ms-keyframes bounceInDown{0%{opacity:0;-ms-transform:translateY(-2000px)}60%{opacity:1;-ms-transform:translateY(30px)}80%{-ms-transform:translateY(-10px)}100%{-ms-transform:translateY(0)}}@-ms-keyframes bounceInUp{0%{opacity:0;-ms-transform:translateY(2000px)}60%{opacity:1;-ms-transform:translateY(-30px)}80%{-ms-transform:translateY(10px)}100%{-ms-transform:translateY(0)}}@-ms-keyframes bounceInRight{0%{opacity:0;-ms-transform:translateX(2000px)}60%{opacity:1;-ms-transform:translateX(-30px)}80%{-ms-transform:translateX(10px)}100%{-ms-transform:translateX(0)}}@-ms-keyframes bounceInLeft{0%{opacity:0;-ms-transform:translateX(-2000px)}60%{opacity:1;-ms-transform:translateX(30px)}80%{-ms-transform:translateX(-10px)}100%{-ms-transform:translateX(0)}}@-ms-keyframes flash{0%{opacity:1}25%{opacity:0}50%{opacity:1}75%{opacity:0}100%{opacity:1}}@-ms-keyframes bounce{0%{-ms-transform:translateY(0)}20%{-ms-transform:translateY(0)}40%{-ms-transform:translateY(-30px)}50%{-ms-transform:translateY(0)}60%{-ms-transform:translateY(-15px)}80%{-ms-transform:translateY(0)}100%{-ms-transform:translateY(0)}}@-ms-keyframes shake{0%{-ms-transform:translateX(0)}10%{-ms-transform:translateX(-10px)}20%{-ms-transform:translateX(10px)}30%{-ms-transform:translateX(-10px)}40%{-ms-transform:translateX(10px)}50%{-ms-transform:translateX(-10px)}60%{-ms-transform:translateX(10px)}70%{-ms-transform:translateX(-10px)}80%{-ms-transform:translateX(10px)}90%{-ms-transform:translateX(-10px)}100%{-ms-transform:translateX(0)}}@-ms-keyframes rotateInDownLeft{0%{-ms-transform-origin:left bottom;-ms-transform:rotate(-90deg);opacity:0}100%{-ms-transform-origin:left bottom;-ms-transform:rotate(0);opacity:1}}@-ms-keyframes rotateInUpLeft{0%{-ms-transform-origin:left bottom;-ms-transform:rotate(90deg);opacity:0}100%{-ms-transform-origin:left bottom;-ms-transform:rotate(0);opacity:1}}@-ms-keyframes rotateInUpRight{0%{-ms-transform-origin:right bottom;-ms-transform:rotate(-90deg);opacity:0}100%{-ms-transform-origin:right bottom;-ms-transform:rotate(0);opacity:1}}@-ms-keyframes rotateInDownRight{0%{-ms-transform-origin:right bottom;-ms-transform:rotate(90deg);opacity:0}100%{-ms-transform-origin:right bottom;-ms-transform:rotate(0);opacity:1}}@-ms-keyframes rotateIn{0%{-ms-transform-origin:center center;-ms-transform:rotate(-200deg);opacity:0}100%{-ms-transform-origin:center center;-ms-transform:rotate(0);opacity:1}}@-ms-keyframes tada{0%{-ms-transform:scale(1)}10%{-ms-transform:scale(0.9) rotate(-3deg)}20%{-ms-transform:scale(0.9) rotate(-3deg)}30%{-ms-transform:scale(1.1) rotate(3deg)}40%{-ms-transform:scale(1.1) rotate(-3deg)}50%{-ms-transform:scale(1.1) rotate(3deg)}60%{-ms-transform:scale(1.1) rotate(-3deg)}70%{-ms-transform:scale(1.1) rotate(3deg)}80%{-ms-transform:scale(1.1) rotate(-3deg)}90%{-ms-transform:scale(1.1) rotate(3deg)}100%{-ms-transform:scale(1) rotate(0)}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}100%{opacity:1;transform:translateY(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translateX(20px)}100%{opacity:1;transform:translateX(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translateX(-20px)}100%{opacity:1;transform:translateX(0)}}@keyframes fadeInUpBig{0%{opacity:0;transform:translateY(2000px)}100%{opacity:1;transform:translateY(0)}}@keyframes fadeInDownBig{0%{opacity:0;transform:translateY(-2000px)}100%{opacity:1;transform:translateY(0)}}@keyframes fadeInRightBig{0%{opacity:0;transform:translateX(2000px)}100%{opacity:1;transform:translateX(0)}}@keyframes fadeInLeftBig{0%{opacity:0;transform:translateX(-2000px)}100%{opacity:1;transform:translateX(0)}}@keyframes bounceIn{0%{opacity:0;transform:scale(0.3)}50%{opacity:1;transform:scale(1.05)}70%{transform:scale(0.9)}100%{transform:scale(1)}}@keyframes bounceInDown{0%{opacity:0;transform:translateY(-2000px)}60%{opacity:1;transform:translateY(30px)}80%{transform:translateY(-10px)}100%{transform:translateY(0)}}@keyframes bounceInUp{0%{opacity:0;transform:translateY(2000px)}60%{opacity:1;transform:translateY(-30px)}80%{transform:translateY(10px)}100%{transform:translateY(0)}}@keyframes bounceInRight{0%{opacity:0;transform:translateX(2000px)}60%{opacity:1;transform:translateX(-30px)}80%{transform:translateX(10px)}100%{transform:translateX(0)}}@keyframes bounceInLeft{0%{opacity:0;transform:translateX(-2000px)}60%{opacity:1;transform:translateX(30px)}80%{transform:translateX(-10px)}100%{transform:translateX(0)}}@keyframes flash{0%{opacity:1}25%{opacity:0}50%{opacity:1}75%{opacity:0}100%{opacity:1}}@keyframes bounce{0%{transform:translateY(0)}20%{transform:translateY(0)}40%{transform:translateY(-30px)}50%{transform:translateY(0)}60%{transform:translateY(-15px)}80%{transform:translateY(0)}100%{transform:translateY(0)}}@keyframes shake{0%{transform:translateX(0)}10%{transform:translateX(-10px)}20%{transform:translateX(10px)}30%{transform:translateX(-10px)}40%{transform:translateX(10px)}50%{transform:translateX(-10px)}60%{transform:translateX(10px)}70%{transform:translateX(-10px)}80%{transform:translateX(10px)}90%{transform:translateX(-10px)}100%{transform:translateX(0)}}@keyframes rotateInDownLeft{0%{transform-origin:left bottom;transform:rotate(-90deg);opacity:0}100%{transform-origin:left bottom;transform:rotate(0);opacity:1}}@keyframes rotateInUpLeft{0%{transform-origin:left bottom;transform:rotate(90deg);opacity:0}100%{transform-origin:left bottom;transform:rotate(0);opacity:1}}@keyframes rotateInUpRight{0%{transform-origin:right bottom;transform:rotate(-90deg);opacity:0}100%{transform-origin:right bottom;transform:rotate(0);opacity:1}}@keyframes rotateInDownRight{0%{transform-origin:right bottom;transform:rotate(90deg);opacity:0}100%{transform-origin:right bottom;transform:rotate(0);opacity:1}}@keyframes rotateIn{0%{transform-origin:center center;transform:rotate(-200deg);opacity:0}100%{transform-origin:center center;transform:rotate(0);opacity:1}}@keyframes tada{0%{transform:scale(1)}10%{transform:scale(0.9) rotate(-3deg)}20%{transform:scale(0.9) rotate(-3deg)}30%{transform:scale(1.1) rotate(3deg)}40%{transform:scale(1.1) rotate(-3deg)}50%{transform:scale(1.1) rotate(3deg)}60%{transform:scale(1.1) rotate(-3deg)}70%{transform:scale(1.1) rotate(3deg)}80%{transform:scale(1.1) rotate(-3deg)}90%{transform:scale(1.1) rotate(3deg)}100%{transform:scale(1) rotate(0)}}.trip-exposed{background:#fff}.trip-overlay{display:none;position:fixed;left:0;top:0;background:black;width:100%;height:100%;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=70);opacity:.7}.trip-block{display:none;padding:8px;position:absolute;text-align:center;min-width:100px;border-radius:3px}.trip-block:before{border:solid transparent;content:" ";height:0;width:0;position:absolute}.trip-block.n:before,.trip-block.s:before{border-width:8px;left:50%;margin-left:-8px}.trip-block.e:before,.trip-block.w:before{border-width:8px;top:50%;margin-top:-8px}.trip-block.n:before{top:100%}.trip-block.s:before{bottom:100%}.trip-block.e:before{right:100%}.trip-block.w:before{left:100%}.trip-block.screen-ne,.trip-block.screen-se,.trip-block.screen-sw,.trip-block.screen-nw,.trip-block.screen-center{position:fixed}.trip-block.animated.flash{-moz-animation:flash .5s 0s ease both;-webkit-animation:flash .5s 0s ease both;animation:flash .5s 0s ease both}.trip-block.animated.bounce{-moz-animation:bounce .5s 0s ease both;-webkit-animation:bounce .5s 0s ease both;animation:bounce .5s 0s ease both}.trip-block.animated.shake{-moz-animation:shake .5s 0s ease both;-webkit-animation:shake .5s 0s ease both;animation:shake .5s 0s ease both}.trip-block.animated.tada{-moz-animation:tada .5s 0s ease both;-webkit-animation:tada .5s 0s ease both;animation:tada .5s 0s ease both}.trip-block.animated.fadeIn{-moz-animation:fadeIn .5s 0s ease both;-webkit-animation:fadeIn .5s 0s ease both;animation:fadeIn .5s 0s ease both}.trip-block.animated.fadeInUp{-moz-animation:fadeInUp .5s 0s ease both;-webkit-animation:fadeInUp .5s 0s ease both;animation:fadeInUp .5s 0s ease both}.trip-block.animated.fadeInDown{-moz-animation:fadeInDown .5s 0s ease both;-webkit-animation:fadeInDown .5s 0s ease both;animation:fadeInDown .5s 0s ease both}.trip-block.animated.fadeInLeft{-moz-animation:fadeInLeft .5s 0s ease both;-webkit-animation:fadeInLeft .5s 0s ease both;animation:fadeInLeft .5s 0s ease both}.trip-block.animated.fadeInRight{-moz-animation:fadeInRight .5s 0s ease both;-webkit-animation:fadeInRight .5s 0s ease both;animation:fadeInRight .5s 0s ease both}.trip-block.animated.fadeInUpBig{-moz-animation:fadeInUpBig .5s 0s ease both;-webkit-animation:fadeInUpBig .5s 0s ease both;animation:fadeInUpBig .5s 0s ease both}.trip-block.animated.fadeInDownBig{-moz-animation:fadeInDownBig .5s 0s ease both;-webkit-animation:fadeInDownBig .5s 0s ease both;animation:fadeInDownBig .5s 0s ease both}.trip-block.animated.fadeInLeftBig{-moz-animation:fadeInLeftBig .5s 0s ease both;-webkit-animation:fadeInLeftBig .5s 0s ease both;animation:fadeInLeftBig .5s 0s ease both}.trip-block.animated.fadeInRightBig{-moz-animation:fadeInRightBig .5s 0s ease both;-webkit-animation:fadeInRightBig .5s 0s ease both;animation:fadeInRightBig .5s 0s ease both}.trip-block.animated.bounceIn{-moz-animation:bounceIn .5s 0s ease both;-webkit-animation:bounceIn .5s 0s ease both;animation:bounceIn .5s 0s ease both}.trip-block.animated.bounceInDown{-moz-animation:bounceInDown .5s 0s ease both;-webkit-animation:bounceInDown .5s 0s ease both;animation:bounceInDown .5s 0s ease both}.trip-block.animated.bounceInUp{-moz-animation:bounceInUp .5s 0s ease both;-webkit-animation:bounceInUp .5s 0s ease both;animation:bounceInUp .5s 0s ease both}.trip-block.animated.bounceInLeft{-moz-animation:bounceInLeft .5s 0s ease both;-webkit-animation:bounceInLeft .5s 0s ease both;animation:bounceInLeft .5s 0s ease both}.trip-block.animated.bounceInRight{-moz-animation:bounceInRight .5s 0s ease both;-webkit-animation:bounceInRight .5s 0s ease both;animation:bounceInRight .5s 0s ease both}.trip-block.animated.rotateIn{-moz-animation:rotateIn .5s 0s ease both;-webkit-animation:rotateIn .5s 0s ease both;animation:rotateIn .5s 0s ease both}.trip-block.animated.rotateInDownLeft{-moz-animation:rotateInDownLeft .5s 0s ease both;-webkit-animation:rotateInDownLeft .5s 0s ease both;animation:rotateInDownLeft .5s 0s ease both}.trip-block.animated.rotateInDownRight{-moz-animation:rotateInDownRight .5s 0s ease both;-webkit-animation:rotateInDownRight .5s 0s ease both;animation:rotateInDownRight .5s 0s ease both}.trip-block.animated.rotateInUpLeft{-moz-animation:rotateInUpLeft .5s 0s ease both;-webkit-animation:rotateInUpLeft .5s 0s ease both;animation:rotateInUpLeft .5s 0s ease both}.trip-block.animated.rotateInUpRight{-moz-animation:rotateInUpRight .5s 0s ease both;-webkit-animation:rotateInUpRight .5s 0s ease both;animation:rotateInUpRight .5s 0s ease both}.trip-block .trip-content{clear:right}.trip-block .trip-close{position:relative;font-size:80%;float:right;margin-top:-5px;z-index:1}.trip-block .trip-close:hover{text-decoration:none}.trip-block .trip-navigation{display:-webkit-flex;display:flex}.trip-block .trip-prev,.trip-block .trip-next,.trip-block .trip-skip{padding:5px 10px}.trip-block .trip-prev,.trip-block .trip-next{-webkit-flex:1;flex:1}.trip-block .trip-prev.disabled,.trip-block .trip-next.disabled{color:grey;pointer-events:none}.trip-block .trip-skip{-webkit-flex:2;flex:2}.trip-block .trip-progress-bar{height:1px;background-color:#444;width:0}.trip-block .trip-progress-steps{border:1px solid #ddd;border-width:1px 0}.trip-block .trip-progress-steps .trip-progress-step{display:inline-block;width:8px;height:8px;border-radius:100%;background:#ddd;margin:15px 5px 11px}.trip-block .trip-progress-steps .trip-progress-step.selected{background:none;border:1px solid;-moz-transform:scale(1.25, 1.25);-ms-transform:scale(1.25, 1.25);-webkit-transform:scale(1.25, 1.25);transform:scale(1.25, 1.25)}.trip-block.black{background:#333;color:#DDD;-moz-box-shadow:rgba(0,0,0,0.2) 0 2px 4px 0;-webkit-box-shadow:rgba(0,0,0,0.2) 0 2px 4px 0;box-shadow:rgba(0,0,0,0.2) 0 2px 4px 0}.trip-block.black .trip-close{color:#ddd}.trip-block.black .trip-close:hover{color:#fff}.trip-block.black.n:before{border-top-color:#333}.trip-block.black.s:before{border-bottom-color:#333}.trip-block.black.e:before{border-right-color:#333}.trip-block.black.w:before{border-left-color:#333}.trip-block.white{background:#fff;color:#333;border:1px solid #ddd}.trip-block.white .trip-close{color:#333}.trip-block.white .trip-close:hover{color:#000}.trip-block.white.n:before{border-top-color:#fff}.trip-block.white.s:before{border-bottom-color:#fff}.trip-block.white.e:before{border-right-color:#fff}.trip-block.white.w:before{border-left-color:#fff}.trip-overlay.yeti{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=20);opacity:.2}.trip-block.yeti{padding:0px;background:#008cba;color:#fff;-moz-box-shadow:rgba(0,0,0,0.39) 0 2px 2px 0;-webkit-box-shadow:rgba(0,0,0,0.39) 0 2px 2px 0;box-shadow:rgba(0,0,0,0.39) 0 2px 2px 0}.trip-block.yeti.n:before{margin-top:-1px;border-top-color:#008cba}.trip-block.yeti.s:before{border-bottom-color:#006687}.trip-block.yeti.e:before{border-right-color:#008cba}.trip-block.yeti.w:before{border-left-color:#008cba}.trip-block.yeti .trip-header{position:relative;font-size:18px;background:#006687;margin:0px;border-radius:3px 3px 0px 0px;padding:5px}.trip-block.yeti .trip-content{font-size:12px;padding:15px;max-width:450px}.trip-block.yeti .trip-close{right:0px;top:0px;margin:3px 8px 0px 0px;color:#fff;font-size:16px}.trip-block.yeti .trip-close:hover{color:#000}.trip-block.yeti .trip-prev,.trip-block.yeti .trip-next,.trip-block.yeti .trip-skip{font-size:12px;color:#fff}.trip-block.yeti .trip-prev:hover,.trip-block.yeti .trip-next:hover,.trip-block.yeti .trip-skip:hover{background:#006687}.trip-block.yeti .trip-prev.disabled,.trip-block.yeti .trip-next.disabled{color:#bfbfbf}.trip-block.yeti .trip-next{border-radius:0px 0px 5px 0px}.trip-block.yeti .trip-prev{border-radius:0px 0px 0px 5px}.trip-block.yeti .trip-progress-bar{background:#acf9ac}.trip-overlay.dark{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=20);opacity:.2}.trip-block.dark{background:#333;padding:0;color:#fff;-moz-box-shadow:rgba(0,0,0,0.39) 0 2px 2px 0;-webkit-box-shadow:rgba(0,0,0,0.39) 0 2px 2px 0;box-shadow:rgba(0,0,0,0.39) 0 2px 2px 0;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=92);opacity:.92}.trip-block.dark.n:before{margin-top:-1px;border-top-color:#333}.trip-block.dark.s:before{border-bottom-color:#555}.trip-block.dark.e:before{border-right-color:#333}.trip-block.dark.w:before{border-left-color:#333}.trip-block.dark .trip-header{position:relative;font-size:16px;background:#555;margin:0;border-radius:3px 3px 0px 0px;padding:5px}.trip-block.dark .trip-content{font-size:12px;padding:1em;max-width:450px}.trip-block.dark .trip-close{right:0;top:0;margin:3px 8px 0 0;color:#fff;font-size:16px}.trip-block.dark .trip-close:hover{color:#000}.trip-block.dark .trip-prev,.trip-block.dark .trip-next,.trip-block.dark .trip-skip{font-size:12px;color:#fff}.trip-block.dark .trip-prev:hover,.trip-block.dark .trip-next:hover,.trip-block.dark .trip-skip:hover{background:#666}.trip-block.dark .trip-prev.disabled,.trip-block.dark .trip-next.disabled{color:grey}.trip-block.dark .trip-next{border-radius:0px 0px 5px 0px}.trip-block.dark .trip-prev{border-radius:0px 0px 0px 5px}.trip-block.dark .trip-progress-bar{background:#acf9ac}.trip-block.minimalism{padding:0;background:#ffffff;min-width:400px;max-width:90vw;max-height:90vh;-moz-box-shadow:0 2px 7px 2px rgba(0,0,0,0.5);-webkit-box-shadow:0 2px 7px 2px rgba(0,0,0,0.5);box-shadow:0 2px 7px 2px rgba(0,0,0,0.5);-moz-border-radius:8px;-webkit-border-radius:8px;border-radius:8px}.trip-block.minimalism.n:before{border-top-color:#fff}.trip-block.minimalism.s:before{border-bottom-color:#fff}.trip-block.minimalism.e:before{border-right-color:#fff}.trip-block.minimalism.w:before{border-left-color:#fff}.trip-block.minimalism .trip-content{padding:5px}.trip-block.minimalism .trip-header{padding:10px}.trip-block.minimalism h1{font-size:25px;color:#1e2224;margin-bottom:10px;font-weight:bold}.trip-block.minimalism p{line-height:160%;font-size:12px;color:#bebebe}.trip-block.minimalism .trip-progress-steps{border:1px solid #212527;border-width:1px 0}.trip-block.minimalism .trip-progress-steps .trip-progress-step{background:#1e2224}.trip-block.minimalism .trip-progress-steps .trip-progress-step.selected{background:none}.trip-block.minimalism .trip-navigation{flex-direction:row;flex-wrap:wrap;justify-content:space-between}.trip-block.minimalism .trip-prev,.trip-block.minimalism .trip-next,.trip-block.minimalism .trip-skip{font-size:12px;text-decoration:none;color:#bebebe}.trip-block.minimalism .trip-prev,.trip-block.minimalism .trip-next{padding:18px 36px;margin:10px;max-width:150px}.trip-block.minimalism .trip-prev.disabled,.trip-block.minimalism .trip-next.disabled{color:#bebebe}.trip-block.minimalism .trip-next{background:#383f43;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}.trip-block.minimalism .trip-skip{display:block;border-top:1px solid #bebebe;padding:15px;flex-basis:100%} 2 | -------------------------------------------------------------------------------- /src/vendor/trip/trip.min.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Trip.js 3 | * 4 | * This is a jQuery plugin that can help you customize your tutorial trip 5 | * with full flexibilities. 6 | * 7 | * Version: 3.3.3 8 | * 9 | * Author: EragonJ 10 | * Blog: http://eragonj.me 11 | * 12 | * @preserve 13 | */ 14 | !function(root,factory){"object"==typeof exports&&"object"==typeof module?module.exports=factory(require("jquery")):"function"==typeof define&&define.amd?define("Trip",["jquery"],factory):"object"==typeof exports?exports.Trip=factory(require("jquery")):root.Trip=factory(root.jQuery)}(this,function(__WEBPACK_EXTERNAL_MODULE_1__){return function(modules){function __webpack_require__(moduleId){if(installedModules[moduleId])return installedModules[moduleId].exports;var module=installedModules[moduleId]={exports:{},id:moduleId,loaded:!1};return modules[moduleId].call(module.exports,module,module.exports,__webpack_require__),module.loaded=!0,module.exports}var installedModules={};return __webpack_require__.m=modules,__webpack_require__.c=installedModules,__webpack_require__.p="",__webpack_require__(0)}([function(module,exports,__webpack_require__){function Trip(){var userOptions,tripData,noop=function(){},tripParser=new TripParser;if(0===arguments.length)tripData=tripParser.parse("default"),userOptions={};else if(1===arguments.length)if(TripUtils.isArray(arguments[0]))tripData=arguments[0],userOptions={};else if(TripUtils.isObject(arguments[0]))tripData=tripParser.parse("default"),userOptions=arguments[0];else{if(!TripUtils.isString(arguments[0]))throw"Please check documents for passing parameters, you may pass wrong parameters into constructor function !";tripData=tripParser.parse(arguments[0]),userOptions={}}else TripUtils.isArray(arguments[0])?tripData=arguments[0]:TripUtils.isString(arguments[0])&&(tripData=tripParser.parse(arguments[0])),userOptions=arguments[1];if(this.settings=$.extend({tripClass:"",tripIndex:0,tripTheme:"black",backToTopWhenEnded:!1,overlayHolder:"body",overlayZindex:99999,delay:1e3,enableKeyBinding:!0,enableAnimation:!0,showSteps:!1,showCloseBox:!1,showHeader:!1,skipUndefinedTrip:!1,showNavigation:!1,canGoNext:!0,canGoPrev:!0,nextLabel:"Next",prevLabel:"Back",finishLabel:"Dismiss",closeBoxLabel:"×",skipLabel:"Skip",header:"Step {{tripIndex}}",onStart:noop,onEnd:noop,onTripStart:noop,onTripEnd:noop,onTripStop:noop,onTripPause:noop,onTripResume:noop,onTripChange:noop,onTripClose:noop,animation:"fadeIn"},userOptions),!this.settings.tripBlockHTML){var html=TripTheme.get(this.settings.tripTheme);html||(html=TripTheme.get("default")),this.settings.tripBlockHTML=html}this.tripData=tripData,this.$tripBlock=null,this.$overlay=null,this.$bar=null,this.$root=$("body"),this.tripDirection="next",this.timer=null,this.progressing=!1,this.hasExposedElements=!1,this.CONSTANT=TripConstant}module.exports=Trip;var $=__webpack_require__(1),TripParser=__webpack_require__(2),TripUtils=__webpack_require__(3),TripAnimation=__webpack_require__(4),TripTheme=__webpack_require__(5),TripConstant=__webpack_require__(9);Trip.prototype={showExposedElements:function(){var oldCSS,newCSS,$sel,o=this.getCurrentTripObject();$sel="string"==typeof o.expose?$(o.expose):o.expose instanceof $?o.expose:$(o.sel),this.hasExposedElements=!0,void 0!==$sel.get(0)&&(oldCSS={position:$sel.css("position"),zIndex:$sel.css("z-Index")},newCSS={position:function(){return["absolute","fixed"].indexOf(oldCSS.position)>-1?oldCSS.position:"relative"}(),zIndex:this.settings.overlayZindex+1},$sel.data("trip-old-css",oldCSS).css(newCSS).addClass("trip-exposed"))},hideExposedElements:function(){var $exposedSel=$(".trip-exposed");if(this.hasExposedElements=!1,void 0!==$exposedSel.get(0)){var oldCSS=$exposedSel.data("trip-old-css");$exposedSel.css(oldCSS).removeClass("trip-exposed")}},bindResizeEvents:function(){var timer,that=this;$(window).on("resize.Trip",function(){window.clearTimeout(timer),timer=window.setTimeout(function(){that.run()},TripConstant.RESIZE_TIMEOUT)})},unbindResizeEvents:function(){$(window).off("resize.Trip")},bindKeyEvents:function(){var that=this;$(document).on({"keydown.Trip":function(e){that.keyEvent.call(that,e)}})},unbindKeyEvents:function(){$(document).off("keydown.Trip")},keyEvent:function(e){switch(e.which){case TripConstant.ESC:this.stop();break;case TripConstant.SPACE:e.preventDefault(),this.pause();break;case TripConstant.LEFT_ARROW:case TripConstant.UP_ARROW:this.prev();break;case TripConstant.RIGHT_ARROW:case TripConstant.DOWN_ARROW:this.next()}},stop:function(){this.timer&&(this.timer.stop(),this.timer=null),this.hasExposedElements&&(this.hideExposedElements(),this.toggleExposedOverlay(!1)),this.hideTripBlock(),this.unbindKeyEvents(),this.unbindResizeEvents();var tripObject=this.getCurrentTripObject();tripObject.nextClickSelector&&$(tripObject.nextClickSelector).off("click.Trip");var tripStop=tripObject.onTripStop||this.settings.onTripStop;tripStop.call(this,this.tripIndex,tripObject),this.settings.onEnd(this.tripIndex,tripObject),this.setIndex(this.settings.tripIndex)},pauseOrResume:function(){if(this.timer){if(this.progressing)this.timer.pause(),this.pauseProgressBar();else{var remainingTime=this.timer.resume();this.resumeProgressBar(remainingTime)}this.progressing=!this.progressing}},pause:function(){this.pauseOrResume();var tripObject=this.getCurrentTripObject(),tripPause=tripObject.onTripPause||this.settings.onTripPause;tripPause.call(this,this.tripIndex,tripObject)},resume:function(){this.pauseOrResume();var tripObject=this.getCurrentTripObject(),tripResume=tripObject.onTripResume||this.settings.onTripResume;tripResume.call(this,this.tripIndex,tripObject)},next:function(tripIndex){var that=this,useDifferentIndex=!isNaN(tripIndex);if(useDifferentIndex||this.canGoNext()){this.tripDirection="next";var tripObject=this.getCurrentTripObject(),tripEnd=tripObject.onTripEnd||this.settings.onTripEnd,tripEndDefer=tripEnd.call(this,this.tripIndex,tripObject);$.when(tripEndDefer).then(function(){return useDifferentIndex?(that.timer&&that.timer.stop(),that.setIndex(tripIndex),void that.run()):void(that.isLast()?that.doLastOperation():(that.increaseIndex(),that.run()))})}},prev:function(){var that=this;if(this.canGoPrev()){this.tripDirection="prev";var tripObject=this.getCurrentTripObject(),tripEnd=tripObject.onTripEnd||this.settings.onTripEnd,tripEndDefer=tripEnd(this.tripIndex,tripObject);$.when(tripEndDefer).then(function(){that.isFirst()||that.decreaseIndex(),that.run()})}},showCurrentTrip:function(o){this.settings.enableAnimation&&this.removeAnimation(),this.timer&&(this.timer.stop(),this.timer=null),this.hasExposedElements&&(this.hideExposedElements(),o.expose||this.toggleExposedOverlay(!1)),this.progressing&&(this.hideProgressBar(),this.progressing=!1),this.setTripBlock(o),this.showTripBlock(o),this.settings.enableAnimation&&this.addAnimation(o),o.expose&&(this.showExposedElements(),this.toggleExposedOverlay(!0))},doLastOperation:function(){this.timer&&(this.timer.stop(),this.timer=null),this.settings.enableKeyBinding&&this.unbindKeyEvents(),this.hideTripBlock(),this.unbindResizeEvents(),this.hasExposedElements&&(this.hideExposedElements(),this.toggleExposedOverlay(!1)),this.settings.backToTopWhenEnded&&this.$root.animate({scrollTop:0},"slow");var tripObject=this.getCurrentTripObject();this.settings.onEnd(this.tripIndex,tripObject),this.setIndex(this.settings.tripIndex)},showProgressBar:function(delay){var that=this;this.$bar.animate({width:"100%"},delay,"linear",function(){that.$bar.width(0)})},hideProgressBar:function(){this.$bar.width(0),this.$bar.stop(!0)},pauseProgressBar:function(){this.$bar.stop(!0)},resumeProgressBar:function(remainingTime){this.showProgressBar(remainingTime)},run:function(){var that=this,tripObject=this.getCurrentTripObject(),tripStart=tripObject.onTripStart||this.settings.onTripStart,tripChange=tripObject.onTripChange||this.settings.onTripChange,delay=tripObject.delay||this.settings.delay;return this.isTripDataValid(tripObject)?(this.showCurrentTrip(tripObject),this.showProgressBar(delay),this.progressing=!0,tripChange.call(this,this.tripIndex,tripObject),tripStart.call(this,this.tripIndex,tripObject),void(delay>=0&&(this.timer=new TripUtils.Timer(function(){that.next()},delay)))):this.settings.skipUndefinedTrip===!1?(TripUtils.log("Your tripData is not valid at index: "+this.tripIndex),this.stop(),!1):this[this.tripDirection]()},isFirst:function(){return 0===this.tripIndex},isLast:function(){return this.tripIndex===this.tripData.length-1},isTripDataValid:function(o){return!!this.hasSpecialDirections()||(!o.nextClickSelector||0!==$(o.nextClickSelector).length)&&("undefined"!=typeof o.content&&"undefined"!=typeof o.sel&&null!==o.sel&&0!==o.sel.length&&0!==$(o.sel).length)},hasSpecialDirections:function(){var o=this.getCurrentTripObject(),position=o.position,specialDirections=["screen-ne","screen-se","screen-sw","screen-nw","screen-center"];return $.inArray(position,specialDirections)>=0},canGoPrev:function(){var tripObject=this.getCurrentTripObject(),canGoPrev=tripObject.canGoPrev;return"undefined"==typeof canGoPrev&&(canGoPrev=this.settings.canGoPrev),"function"==typeof canGoPrev&&(canGoPrev=canGoPrev.call(this,this.tripIndex,tripObject)),0===this.tripIndex&&(canGoPrev=!1),canGoPrev},canGoNext:function(){var tripObject=this.getCurrentTripObject(),canGoNext=tripObject.canGoNext;return"undefined"==typeof canGoNext&&(canGoNext=this.settings.canGoNext),"function"==typeof canGoNext&&(canGoNext=canGoNext.call(this,this.tripIndex,tripObject)),canGoNext},setIndex:function(tripIndex){tripIndex=Math.max(0,Math.min(tripIndex,this.tripData.length-1)),this.tripIndex=tripIndex,this.$tripBlock.attr("data-trip-step",this.tripIndex)},increaseIndex:function(){this.setIndex(this.tripIndex+1)},decreaseIndex:function(){this.setIndex(this.tripIndex-1)},getCurrentTripObject:function(){return this.tripData[this.tripIndex]},getReplacedTripContent:function(content){content=content||"";var reTripIndex=/\{\{(tripIndex)\}\}/g,reTripTotal=/\{\{(tripTotal)\}\}/g;return content=content.replace(reTripIndex,this.tripIndex+1),content=content.replace(reTripTotal,this.tripData.length)},setTripBlock:function(o){var $tripBlock=this.$tripBlock,that=this,showCloseBox=o.showCloseBox||this.settings.showCloseBox,showNavigation=o.showNavigation||this.settings.showNavigation,showHeader=o.showHeader||this.settings.showHeader,showSteps=o.showSteps||this.settings.showSteps,closeBoxLabel=o.closeBoxLabel||this.settings.closeBoxLabel,prevLabel=o.prevLabel||this.settings.prevLabel,nextLabel=o.nextLabel||this.settings.nextLabel,finishLabel=o.finishLabel||this.settings.finishLabel,skipLabel=o.skipLabel||this.settings.skipLabel,header=o.header||this.settings.header;$tripBlock.find(".trip-header").html(this.getReplacedTripContent(header)).toggle(showHeader),$tripBlock.find(".trip-content").html(this.getReplacedTripContent(o.content)),$tripBlock.find(".trip-prev").toggleClass("disabled",!this.canGoPrev()).html(prevLabel).toggle(showNavigation),$tripBlock.find(".trip-next").toggleClass("disabled",!this.canGoNext()).html(this.isLast()?finishLabel:nextLabel).toggle(showNavigation&&!o.nextClickSelector),$tripBlock.find(".trip-skip").html(skipLabel).toggle(showNavigation),$tripBlock.find(".trip-close").html(closeBoxLabel).toggle(showCloseBox),$tripBlock.find(".trip-progress-steps").toggle(showSteps).find(".trip-progress-step").not(":eq("+this.tripIndex+")").removeClass("selected").end().eq(this.tripIndex).addClass("selected"),$tripBlock.removeClass("e s w n screen-ne screen-se screen-sw screen-nw screen-center"),$tripBlock.addClass(o.position),o.nextClickSelector&&($(o.nextClickSelector).off("click.Trip"),$(o.nextClickSelector).one("click.Trip",function(e){e.preventDefault(),$(this).blur(),that.next()})),this.setTripBlockPosition(o,"horizontal"),this.setTripBlockPosition(o,"vertical")},setTripBlockPosition:function(o,horizontalOrVertical){var $tripBlock=this.$tripBlock;"horizontal"===horizontalOrVertical?$tripBlock.css({left:"",right:"",marginLeft:""}):"vertical"===horizontalOrVertical&&$tripBlock.css({top:"",bottom:"",marginTop:""});var cssHorizontal,cssVertical,$sel=$(o.sel),selWidth=$sel&&$sel.outerWidth(),selHeight=$sel&&$sel.outerHeight(),blockWidth=$tripBlock.outerWidth(),blockHeight=$tripBlock.outerHeight(),arrowHeight=10,arrowWidth=10;switch(o.position){case"screen-center":cssHorizontal="50%",cssVertical="50%";break;case"screen-ne":case"screen-se":case"screen-nw":case"screen-sw":cssHorizontal=TripConstant.TRIP_BLOCK_OFFSET_HORIZONTAL,cssVertical=TripConstant.TRIP_BLOCK_OFFSET_VERTICAL;break;case"e":cssHorizontal=$sel.offset().left+selWidth+arrowWidth,cssVertical=$sel.offset().top-(blockHeight-selHeight)/2;break;case"s":cssHorizontal=$sel.offset().left+(selWidth-blockWidth)/2,cssVertical=$sel.offset().top+selHeight+arrowHeight;break;case"w":cssHorizontal=$sel.offset().left-(arrowWidth+blockWidth),cssVertical=$sel.offset().top-(blockHeight-selHeight)/2;break;case"n":default:cssHorizontal=$sel.offset().left+(selWidth-blockWidth)/2,cssVertical=$sel.offset().top-arrowHeight-blockHeight}if("horizontal"===horizontalOrVertical)switch(o.position){case"screen-center":$tripBlock.css({left:cssHorizontal,marginLeft:-.5*blockWidth});break;case"screen-se":case"screen-ne":$tripBlock.css({right:cssHorizontal});break;case"screen-sw":case"screen-nw":case"e":case"s":case"w":case"n":default:$tripBlock.css({left:cssHorizontal})}else if("vertical"===horizontalOrVertical)switch(o.position){case"screen-center":$tripBlock.css({top:cssVertical,marginTop:-.5*blockHeight});break;case"screen-sw":case"screen-se":$tripBlock.css({bottom:cssVertical});break;case"screen-nw":case"screen-ne":case"e":case"s":case"w":case"n":default:$tripBlock.css({top:cssVertical})}},addAnimation:function(o){var animation=o.animation||this.settings.animation;TripAnimation.has(animation)&&(this.$tripBlock.addClass("animated"),this.$tripBlock.addClass(animation))},removeAnimation:function(){this.$tripBlock.removeClass(TripAnimation.getAllInString()),this.$tripBlock.removeClass("animated")},showTripBlock:function(o){this.$tripBlock.css({display:"inline-block",zIndex:this.settings.overlayZindex+1});var windowHeight=$(window).height(),windowTop=$(window).scrollTop(),tripBlockTop=this.$tripBlock.offset().top,tripBlockHeight=this.$tripBlock.height(),OFFSET=100;tripBlockTop+tripBlockHeight=windowTop||this.$root.animate({scrollTop:tripBlockTop-OFFSET},"slow")},hideTripBlock:function(){this.removeAnimation(),this.$tripBlock.fadeOut("slow")},create:function(){this.createTripBlock(),this.createOverlay()},createTripBlock:function(){if("undefined"==typeof $(".trip-block").get(0)){var that=this,tripBlockHTML=this.settings.tripBlockHTML,$tripBlock=$(tripBlockHTML);$tripBlock.addClass(this.settings.tripTheme).addClass(this.settings.tripClass).addClass("tripjs"),$("body").append($tripBlock);var $progressSteps=$tripBlock.find(".trip-progress-steps");if($progressSteps){for(var stepCache=[],$step=$('
      '),i=0;i',""].join(""),$overlay=$(html);$overlay.height($(window).height()).css({zIndex:this.settings.overlayZindex}),$(this.settings.overlayHolder).append($overlay)}},toggleExposedOverlay:function(toShow){toShow?this.$overlay.fadeIn():this.$overlay.fadeOut()},cleanup:function(){$(".trip-overlay, .trip-block").remove()},init:function(){this.settings.enableKeyBinding&&this.bindKeyEvents(),this.bindResizeEvents(),this.$tripBlock=$(".trip-block"),this.$bar=$(".trip-progress-bar"),this.$overlay=$(".trip-overlay"),this.setIndex(this.settings.tripIndex)},start:function(){this.cleanup(),this.settings.onStart.call(this),this.create(),this.init(),this.run()}}},function(module,exports){module.exports=__WEBPACK_EXTERNAL_MODULE_1__},function(module,exports){function TripParser(){this._DEFAULT_TRIP_NODES_SELECTOR="[data-trip]",this._DEFAULT_TRIP_POSITION="n",this._DEFAULT_TRIP_ANIMATION="tada"}module.exports=TripParser,TripParser.prototype={_getAllTripNodes:function(selector){return document.querySelectorAll(selector)},_parseTripData:function(node){var tripIndex=node.dataset.tripIndex,tripContent=node.dataset.tripContent,tripDelay=node.dataset.tripDelay,tripExpose="true"===node.dataset.tripExpose||(node.dataset.tripExpose||!1),tripPosition=node.dataset.tripPosition||this._DEFAULT_TRIP_POSITION;node.dataset.tripAnimation||this._DEFAULT_TRIP_ANIMATION;if(node&&"undefined"!=typeof tripIndex&&""!==tripContent){tripIndex=parseInt(tripIndex,10),tripDelay=parseInt(tripDelay,10);var tripObject={};return tripObject.sel=node,tripObject._index=tripIndex,tripObject.position=tripPosition,tripObject.content=tripContent,tripObject.expose=tripExpose,tripDelay&&!isNaN(tripDelay)&&(tripObject.delay=tripDelay),tripObject}return null},_sort:function(tripData){tripData.sort(function(dataA,dataB){return dataA._index-dataB._index})},parse:function(selector){if("string"!=typeof selector)throw"Please check your selector - "+selector+" , and make sure it is String type";selector="default"===selector?this._DEFAULT_TRIP_NODES_SELECTOR:selector;var that=this,tripData=[],nodes=this._getAllTripNodes(selector);return nodes&&[].forEach.call(nodes,function(node){var tripDataForThatNode=that._parseTripData(node);tripDataForThatNode&&tripData.push(tripDataForThatNode)}),this._sort(tripData),tripData}}},function(module,exports){var TripUtils={isArray:function(target){return"[object Array]"===Object.prototype.toString.call(target)},isObject:function(target){return"[object Object]"===Object.prototype.toString.call(target)},isString:function(target){return"string"==typeof target},log:function(){var console=window.console;"undefined"!=typeof console&&console.log&&console.log.apply(console,arguments)},Timer:function(callback,delay){var timerId,start,remaining=delay;this.pause=function(){window.clearTimeout(timerId),remaining-=new Date-start},this.resume=function(){return start=new Date,timerId=window.setTimeout(callback,remaining),remaining},this.stop=function(){window.clearTimeout(timerId)},this.resume()}};module.exports=TripUtils},function(module,exports){function TripAnimation(){}module.exports=TripAnimation;var animations=["flash","bounce","shake","tada","fadeIn","fadeInUp","fadeInDown","fadeInLeft","fadeInRight","fadeInUpBig","fadeInDownBig","fadeInLeftBig","fadeInRightBig","bounceIn","bounceInDown","bounceInUp","bounceInLeft","bounceInRight","rotateIn","rotateInDownLeft","rotateInDownRight","rotateInUpLeft","rotateInUpRight"];TripAnimation.has=function(name){return animations.indexOf(name)>=0},TripAnimation.getAllInString=function(){return animations.join(" ")}},function(module,exports,__webpack_require__){function TripTheme(){}module.exports=TripTheme;var Themes=__webpack_require__(6);TripTheme.get=function(name){var theme=Themes[name];return theme}},function(module,exports,__webpack_require__){module.exports={black:__webpack_require__(7),dark:__webpack_require__(7),white:__webpack_require__(7),yeti:__webpack_require__(7),"default":__webpack_require__(7),minimalism:__webpack_require__(8)}},function(module,exports){module.exports=['
      ','','
      ','
      ','
      ','
      ','','','',"
      ",'
      ',"
      "].join("")},function(module,exports){module.exports=['
      ','','
      ','
      ','
      ','
      ','','','',"
      ",'
      ',"
      "].join("")},function(module,exports){module.exports={LEFT_ARROW:37,UP_ARROW:38,RIGHT_ARROW:39,DOWN_ARROW:40,ESC:27,SPACE:32,TRIP_BLOCK_OFFSET_VERTICAL:10,TRIP_BLOCK_OFFSET_HORIZONTAL:10,RESIZE_TIMEOUT:200}}])}); 15 | -------------------------------------------------------------------------------- /src/vendor/viewportchecker/viewportchecker.js: -------------------------------------------------------------------------------- 1 | /**!AnimateCSS**/ 2 | jQuery(document).ready(function() { 3 | jQuery('.anime-in').addClass("hidden2").viewportChecker({ 4 | classToAdd: 'visible animated fadeIn', // Class to add to the elements when they are visible 5 | offset: 100 6 | 7 | }); 8 | 9 | jQuery('.anime-left').addClass("hidden2").viewportChecker({ 10 | classToAdd: 'visible animated fadeInLeft', // Class to add to the elements when they are visible 11 | offset: 100 12 | }); 13 | 14 | jQuery('.anime-right').addClass("hidden2").viewportChecker({ 15 | classToAdd: 'visible animated fadeInRight', // Class to add to the elements when they are visible 16 | offset: 100 17 | }); 18 | 19 | jQuery('.anime-up').addClass("hidden2").viewportChecker({ 20 | classToAdd: 'visible animated fadeInUp', // Class to add to the elements when they are visible 21 | offset: 100 22 | }); 23 | 24 | jQuery('.anime-down').addClass("hidden2").viewportChecker({ 25 | classToAdd: 'visible animated fadeInDown', // Class to add to the elements when they are visible 26 | offset: 100 27 | }); 28 | 29 | 30 | jQuery('.anime-zoomIn').addClass("hidden2").viewportChecker({ 31 | classToAdd: 'visible animated zoomIn', // Class to add to the elements when they are visible 32 | offset: 100 33 | }); 34 | 35 | 36 | 37 | jQuery('.anime-pulse').addClass("hidden2").viewportChecker({ 38 | classToAdd: 'visible animated pulse', // Class to add to the elements when they are visible 39 | offset: 100 40 | }); 41 | 42 | jQuery('.anime-flipInY').addClass("hidden2").viewportChecker({ 43 | classToAdd: 'visible animated flipInY', // Class to add to the elements when they are visible 44 | offset: 100 45 | }); 46 | 47 | jQuery('.anime-flipInX').addClass("hidden2").viewportChecker({ 48 | classToAdd: 'visible animated flipInX', // Class to add to the elements when they are visible 49 | offset: 100 50 | }); 51 | 52 | jQuery('.anime-hinge').addClass("hidden2").viewportChecker({ 53 | classToAdd: 'visible animated hinge', // Class to add to the elements when they are visible 54 | offset: 100 55 | }); 56 | 57 | 58 | jQuery('.anime-bounceInDown').addClass("hidden2").viewportChecker({ 59 | classToAdd: 'visible animated bounceInDown', // Class to add to the elements when they are visible 60 | offset: 100 61 | }); 62 | 63 | jQuery('.anime-flash').addClass("hidden2").viewportChecker({ 64 | classToAdd: 'visible animated fadeInRight', // Class to add to the elements when they are visible 65 | offset: 100 66 | }); 67 | 68 | jQuery('.bounceInDown').addClass("hidden2").viewportChecker({ 69 | classToAdd: 'visible animated bounceInDown', // Class to add to the elements when they are visible 70 | offset: 100 71 | }); 72 | }); 73 | 74 | /**!./AnimateCSS**/ 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | /* 101 | The MIT License (MIT) 102 | 103 | Copyright (c) 2014 Dirk Groenen 104 | 105 | Permission is hereby granted, free of charge, to any person obtaining a copy of 106 | this software and associated documentation files (the "Software"), to deal in 107 | the Software without restriction, including without limitation the rights to 108 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of 109 | the Software, and to permit persons to whom the Software is furnished to do so, 110 | subject to the following conditions: 111 | 112 | The above copyright notice and this permission notice shall be included in all 113 | copies or substantial portions of the Software. 114 | */ 115 | 116 | (function($){ 117 | $.fn.viewportChecker = function(useroptions){ 118 | // Define options and extend with user 119 | var options = { 120 | classToAdd: 'visible', 121 | classToRemove : 'invisible', 122 | classToAddForFullView : 'full-visible', 123 | removeClassAfterAnimation: false, 124 | offset: 100, 125 | repeat: false, 126 | invertBottomOffset: true, 127 | callbackFunction: function(elem, action){}, 128 | scrollHorizontal: false, 129 | scrollBox: window 130 | }; 131 | $.extend(options, useroptions); 132 | 133 | // Cache the given element and height of the browser 134 | var $elem = this, 135 | boxSize = {height: $(options.scrollBox).height(), width: $(options.scrollBox).width()}; 136 | 137 | /* 138 | * Main method that checks the elements and adds or removes the class(es) 139 | */ 140 | this.checkElements = function(){ 141 | var viewportStart, viewportEnd; 142 | 143 | // Set some vars to check with 144 | if (!options.scrollHorizontal){ 145 | viewportStart = Math.max( 146 | $('html').scrollTop(), 147 | $('body').scrollTop(), 148 | $(window).scrollTop() 149 | ); 150 | viewportEnd = (viewportStart + boxSize.height); 151 | } 152 | else{ 153 | viewportStart = Math.max( 154 | $('html').scrollLeft(), 155 | $('body').scrollLeft(), 156 | $(window).scrollLeft() 157 | ); 158 | viewportEnd = (viewportStart + boxSize.width); 159 | } 160 | 161 | // Loop through all given dom elements 162 | $elem.each(function(){ 163 | var $obj = $(this), 164 | objOptions = {}, 165 | attrOptions = {}; 166 | 167 | // Get any individual attribution data 168 | if ($obj.data('vp-add-class')) 169 | attrOptions.classToAdd = $obj.data('vp-add-class'); 170 | if ($obj.data('vp-remove-class')) 171 | attrOptions.classToRemove = $obj.data('vp-remove-class'); 172 | if ($obj.data('vp-add-class-full-view')) 173 | attrOptions.classToAddForFullView = $obj.data('vp-add-class-full-view'); 174 | if ($obj.data('vp-keep-add-class')) 175 | attrOptions.removeClassAfterAnimation = $obj.data('vp-remove-after-animation'); 176 | if ($obj.data('vp-offset')) 177 | attrOptions.offset = $obj.data('vp-offset'); 178 | if ($obj.data('vp-repeat')) 179 | attrOptions.repeat = $obj.data('vp-repeat'); 180 | if ($obj.data('vp-scrollHorizontal')) 181 | attrOptions.scrollHorizontal = $obj.data('vp-scrollHorizontal'); 182 | if ($obj.data('vp-invertBottomOffset')) 183 | attrOptions.scrollHorizontal = $obj.data('vp-invertBottomOffset'); 184 | 185 | // Extend objOptions with data attributes and default options 186 | $.extend(objOptions, options); 187 | $.extend(objOptions, attrOptions); 188 | 189 | // If class already exists; quit 190 | if ($obj.data('vp-animated') && !objOptions.repeat){ 191 | return; 192 | } 193 | 194 | // Check if the offset is percentage based 195 | if (String(objOptions.offset).indexOf("%") > 0) 196 | objOptions.offset = (parseInt(objOptions.offset) / 100) * boxSize.height; 197 | 198 | // Get the raw start and end positions 199 | var rawStart = (!objOptions.scrollHorizontal) ? $obj.offset().top : $obj.offset().left, 200 | rawEnd = (!objOptions.scrollHorizontal) ? rawStart + $obj.height() : rawStart + $obj.width(); 201 | 202 | // Add the defined offset 203 | var elemStart = Math.round( rawStart ) + objOptions.offset, 204 | elemEnd = (!objOptions.scrollHorizontal) ? elemStart + $obj.height() : elemStart + $obj.width(); 205 | 206 | if (objOptions.invertBottomOffset) 207 | elemEnd -= (objOptions.offset * 2); 208 | 209 | // Add class if in viewport 210 | if ((elemStart < viewportEnd) && (elemEnd > viewportStart)){ 211 | 212 | // Remove class 213 | $obj.removeClass(objOptions.classToRemove); 214 | $obj.addClass(objOptions.classToAdd); 215 | 216 | // Do the callback function. Callback wil send the jQuery object as parameter 217 | objOptions.callbackFunction($obj, "add"); 218 | 219 | // Check if full element is in view 220 | if (rawEnd <= viewportEnd && rawStart >= viewportStart) 221 | $obj.addClass(objOptions.classToAddForFullView); 222 | else 223 | $obj.removeClass(objOptions.classToAddForFullView); 224 | 225 | // Set element as already animated 226 | $obj.data('vp-animated', true); 227 | 228 | if (objOptions.removeClassAfterAnimation) { 229 | $obj.one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){ 230 | $obj.removeClass(objOptions.classToAdd); 231 | }); 232 | } 233 | 234 | // Remove class if not in viewport and repeat is true 235 | } else if ($obj.hasClass(objOptions.classToAdd) && (objOptions.repeat)){ 236 | $obj.removeClass(objOptions.classToAdd + " " + objOptions.classToAddForFullView); 237 | 238 | // Do the callback function. 239 | objOptions.callbackFunction($obj, "remove"); 240 | 241 | // Remove already-animated-flag 242 | $obj.data('vp-animated', false); 243 | } 244 | }); 245 | 246 | }; 247 | 248 | /** 249 | * Binding the correct event listener is still a tricky thing. 250 | * People have expierenced sloppy scrolling when both scroll and touch 251 | * events are added, but to make sure devices with both scroll and touch 252 | * are handles too we always have to add the window.scroll event 253 | * 254 | * @see https://github.com/dirkgroenen/jQuery-viewport-checker/issues/25 255 | * @see https://github.com/dirkgroenen/jQuery-viewport-checker/issues/27 256 | */ 257 | 258 | // Select the correct events 259 | if( 'ontouchstart' in window || 'onmsgesturechange' in window ){ 260 | // Device with touchscreen 261 | $(document).bind("touchmove MSPointerMove pointermove", this.checkElements); 262 | } 263 | 264 | // Always load on window load 265 | $(options.scrollBox).bind("load scroll", this.checkElements); 266 | 267 | // On resize change the height var 268 | $(window).resize(function(e){ 269 | boxSize = {height: $(options.scrollBox).height(), width: $(options.scrollBox).width()}; 270 | $elem.checkElements(); 271 | }); 272 | 273 | // trigger inital check if elements already visible 274 | this.checkElements(); 275 | 276 | // Default jquery plugin behaviour 277 | return this; 278 | }; 279 | })(jQuery); -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gmkhussain/frontend/06b695216ad80d8371113741c9455bbdbf5b441f/style.css --------------------------------------------------------------------------------