├── .gitignore ├── package-lock.json ├── package.json ├── public ├── favicon.ico └── index.html ├── readme.md ├── src ├── App.vue ├── Assets │ ├── custom.css │ ├── font-logo.png │ ├── logo.svg │ ├── normalize.css │ └── webflow.css ├── components │ ├── Footer │ │ └── Footer.vue │ ├── Main │ │ ├── Content │ │ │ ├── APAC │ │ │ │ ├── AllApac.vue │ │ │ │ └── Content │ │ │ │ │ ├── China.vue │ │ │ │ │ ├── HongKong.vue │ │ │ │ │ ├── India.vue │ │ │ │ │ ├── Japan.vue │ │ │ │ │ ├── SouthKorea.vue │ │ │ │ │ └── SriLanka.vue │ │ │ ├── AllContent.vue │ │ │ ├── Americas │ │ │ │ ├── AllAmericas.vue │ │ │ │ └── Content │ │ │ │ │ ├── Argentina.vue │ │ │ │ │ ├── Brazil.vue │ │ │ │ │ ├── Canada.vue │ │ │ │ │ ├── Mexico.vue │ │ │ │ │ ├── Peru.vue │ │ │ │ │ └── USA.vue │ │ │ ├── EMEA │ │ │ │ ├── AllEmea.vue │ │ │ │ └── Content │ │ │ │ │ ├── Denmark.vue │ │ │ │ │ ├── Europe.vue │ │ │ │ │ ├── France.vue │ │ │ │ │ ├── Germany.vue │ │ │ │ │ ├── Poland.vue │ │ │ │ │ └── UK.vue │ │ │ ├── Futures │ │ │ │ ├── AllFutures.vue │ │ │ │ └── Content │ │ │ │ │ ├── Americas │ │ │ │ │ └── Table.vue │ │ │ │ │ ├── Asia │ │ │ │ │ └── Table.vue │ │ │ │ │ └── Europe │ │ │ │ │ └── Table.vue │ │ │ ├── Notification.vue │ │ │ ├── Overview │ │ │ │ ├── AllOverall.vue │ │ │ │ └── Content │ │ │ │ │ ├── AmericaContent │ │ │ │ │ ├── Graph │ │ │ │ │ │ ├── GraphContent.vue │ │ │ │ │ │ └── GraphContentData.js │ │ │ │ │ ├── GraphFilter.vue │ │ │ │ │ ├── SectionContent.vue │ │ │ │ │ └── Table.vue │ │ │ │ │ ├── AsiaContent │ │ │ │ │ ├── Graph │ │ │ │ │ │ ├── GraphContent.vue │ │ │ │ │ │ └── GraphContentData.js │ │ │ │ │ ├── GraphFilter.vue │ │ │ │ │ ├── SectionContent.vue │ │ │ │ │ └── Table.vue │ │ │ │ │ └── EuropeContent │ │ │ │ │ ├── Graph │ │ │ │ │ ├── GraphContent.vue │ │ │ │ │ └── GraphContentData.js │ │ │ │ │ ├── GraphFilter.vue │ │ │ │ │ ├── SectionContent.vue │ │ │ │ │ └── Table.vue │ │ │ └── SectionTabs.vue │ │ ├── Main.vue │ │ └── SideBar │ │ │ ├── SectionLeft │ │ │ ├── LatestList.vue │ │ │ ├── SearchBox.vue │ │ │ └── SectionOne.vue │ │ │ └── SideBar.vue │ └── Navbar │ │ ├── MainNav.vue │ │ └── TopNav.vue ├── main.js └── routes.js └── yarn.lock /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /dist 4 | 5 | # local env files 6 | .env.local 7 | .env.*.local 8 | 9 | # Log files 10 | npm-debug.log* 11 | yarn-debug.log* 12 | yarn-error.log* 13 | 14 | # Editor directories and files 15 | .idea 16 | .vscode 17 | *.suo 18 | *.ntvs* 19 | *.njsproj 20 | *.sln 21 | -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "stock-trader", 3 | "version": "0.1.0", 4 | "lockfileVersion": 1, 5 | "requires": true, 6 | "dependencies": { 7 | "vue-awesome": { 8 | "version": "3.0.0", 9 | "resolved": "https://registry.npmjs.org/vue-awesome/-/vue-awesome-3.0.0.tgz", 10 | "integrity": "sha512-SD3x/t9s/vfIVucIMcILGOOqQ9gk4dfVClx8BWaqGLcB1/hgCiemQ2GDYyu2j3bxtiq1Ad6tz6AZTYINDbnung==" 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "stock-trader", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "serve": "vue-cli-service serve --open", 7 | "build": "vue-cli-service build", 8 | "lint": "vue-cli-service lint" 9 | }, 10 | "dependencies": { 11 | "amcharts3": "amcharts/amcharts3", 12 | "babel-preset-stage-2": "^6.24.1", 13 | "chart.js": "^2.7.2", 14 | "copy-webpack-plugin": "^4.5.1", 15 | "vue": "^2.5.13", 16 | "vue-awesome": "^3.0.0", 17 | "vue-chartjs": "^3.3.1", 18 | "vue-router": "^3.0.1", 19 | "vuex": "^3.0.1" 20 | }, 21 | "devDependencies": { 22 | "@vue/cli-plugin-babel": "^3.0.0-beta.6", 23 | "@vue/cli-plugin-eslint": "^3.0.0-beta.6", 24 | "@vue/cli-service": "^3.0.0-beta.6", 25 | "vue-template-compiler": "^2.5.13" 26 | }, 27 | "babel": { 28 | "presets": [ 29 | "@vue/app" 30 | ] 31 | }, 32 | "eslintConfig": { 33 | "root": true, 34 | "extends": [ 35 | "plugin:vue/essential", 36 | "eslint:recommended" 37 | ] 38 | }, 39 | "postcss": { 40 | "plugins": { 41 | "autoprefixer": {} 42 | } 43 | }, 44 | "browserslist": [ 45 | "> 1%", 46 | "last 2 versions", 47 | "not ie <= 8" 48 | ] 49 | } 50 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pysi17/vue_stock-trader/2ac59c3cc1f1658e38939774141d92038348b4c5/public/favicon.ico -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | stock-trader 9 | 10 | 11 | 14 |
15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /readme.md: -------------------------------------------------------------------------------- 1 | # Bloomberg Markets Stock Page 2 | 3 | This project is a Front-End clone of the [Bloomberg Markets Stock Page](https://www.bloomberg.com/markets/stocks) landing page (04/2018) built with [Vue JS](https://vuejs.org/) and [Charts JS](http://www.chartjs.org/). 4 | 5 | A Tool used to aid the Front-End Design - [Webflow](https://webflow.com/). 6 | 7 | ## Usage 8 | 9 | > A Vue.js project, built with the Vue CLI. 10 | > This project was bootstrapped with [vue-cli](https://github.com/vuejs/vue-cli) 11 | 12 | ### Deployed 13 | Deployed via [Surge](https://surge.sh/) at https://bloomberg-markets.surge.sh/ 14 | 15 | ## Instructions 16 | ### Build Setup 17 | 18 | ``` bash 19 | # install dependencies 20 | yarn install 21 | 22 | # serve with hot reload at localhost:8080 23 | yarn serve 24 | 25 | # build for production with minification 26 | yarn build 27 | ``` 28 | 29 | For a detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 30 | 31 | ### Note 32 | > Mobile & Tablet responsive designs have not been done yet. 33 | 34 | #### Resources 35 | * Vue Awesome Icons - https://github.com/Justineo/vue-awesome 36 | * Font-Awesome icon gallery - https://fontawesome.com/icons?d=gallery 37 | * Amcharts with Vue JS - https://www.amcharts.com/kbase/using-amcharts-vue-js-webpack/ - (path: `node_modules/@vue/cli-service/webpack.config.js`). 38 | * Chart JS - https://alligator.io/vuejs/vue-chart-js/ -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 30 | 31 | -------------------------------------------------------------------------------- /src/Assets/custom.css: -------------------------------------------------------------------------------- 1 | .top-nav { 2 | height: 2.5em; 3 | background-color: transparent; 4 | } 5 | 6 | .link { 7 | display: inline-block; 8 | margin-top: 9px; 9 | margin-right: 10px; 10 | padding-top: 0px; 11 | font-family: Montserrat, sans-serif; 12 | color: #fff; 13 | font-size: 12px; 14 | text-decoration: none; 15 | } 16 | 17 | .link.link-br { 18 | padding-right: 10px; 19 | border-width: 1px; 20 | border-color: #fff; 21 | border-right-style: solid; 22 | font-family: Montserrat, sans-serif; 23 | font-size: 12px; 24 | } 25 | 26 | .nav-menu { 27 | top: 0px; 28 | right: 0px; 29 | bottom: 0px; 30 | display: inline-block; 31 | height: 4em; 32 | margin-right: 30px; 33 | padding-right: 0px; 34 | padding-bottom: 0px; 35 | float: right; 36 | } 37 | 38 | .menu-bar-items { 39 | display: block; 40 | margin-top: 0px; 41 | margin-right: auto; 42 | margin-left: auto; 43 | float: right; 44 | clear: right; 45 | font-family: Lato, sans-serif; 46 | color: #fff; 47 | font-size: 11px; 48 | line-height: 15px; 49 | font-weight: 400; 50 | } 51 | 52 | .container { 53 | display: inline-block; 54 | } 55 | 56 | .container.logo { 57 | display: block; 58 | margin-right: auto; 59 | margin-left: auto; 60 | padding-right: 0px; 61 | padding-left: 10px; 62 | -webkit-box-pack: start; 63 | -webkit-justify-content: flex-start; 64 | -ms-flex-pack: start; 65 | justify-content: flex-start; 66 | } 67 | 68 | .link-block { 69 | margin-left: 30px; 70 | } 71 | 72 | .container-2 { 73 | display: block; 74 | margin-right: auto; 75 | margin-left: auto; 76 | padding-left: 0px; 77 | } 78 | 79 | .link-block-2 { 80 | width: 5em; 81 | height: 4em; 82 | } 83 | 84 | .div-block { 85 | display: inline-block; 86 | width: 36em; 87 | height: 4em; 88 | margin-left: 85px; 89 | } 90 | 91 | .main-nav-link { 92 | display: inline-block; 93 | margin-top: 20px; 94 | margin-right: 30px; 95 | margin-left: auto; 96 | font-family: Lato, sans-serif; 97 | color: hsla(0, 0%, 100%, .5); 98 | font-size: 13px; 99 | font-weight: 900; 100 | text-decoration: none; 101 | } 102 | 103 | .unordered-list { 104 | margin-top: 12px; 105 | margin-right: auto; 106 | padding-left: 0px; 107 | } 108 | 109 | .brand { 110 | display: block; 111 | margin-right: 10px; 112 | } 113 | 114 | .div-block-2 { 115 | display: inline-block; 116 | width: 23em; 117 | padding-right: 0px; 118 | } 119 | 120 | .section-front-box { 121 | display: block; 122 | height: 1em; 123 | margin-top: 15px; 124 | background-color: #fb8b1e; 125 | } 126 | 127 | .section-front-box.light-box { 128 | background-color: hsla(28, 93%, 72%, .5); 129 | } 130 | 131 | .heading { 132 | margin-top: 10px; 133 | margin-bottom: 5px; 134 | color: #fb8b1e; 135 | font-weight: 500; 136 | } 137 | 138 | .heading-2 { 139 | margin-top: 10px; 140 | } 141 | 142 | .div-block-3 { 143 | display: inline-block; 144 | width: 59.5em; 145 | margin-top: 0px; 146 | margin-left: 0px; 147 | float: right; 148 | clear: none; 149 | } 150 | 151 | .text-block { 152 | display: inline-block; 153 | margin-top: 15px; 154 | margin-left: 0px; 155 | padding: 5px 10px; 156 | float: right; 157 | background-color: #000; 158 | font-family: Montserrat, sans-serif; 159 | color: #fff; 160 | font-size: 11px; 161 | font-weight: 300; 162 | } 163 | 164 | .heading-3 { 165 | display: inline-block; 166 | margin-top: 10px; 167 | margin-right: 39px; 168 | } 169 | 170 | .heading-3.main-tabs { 171 | position: static; 172 | top: 0px; 173 | right: 0px; 174 | bottom: 0px; 175 | display: inline; 176 | overflow: visible; 177 | width: 5em; 178 | margin-right: 5.7em; 179 | float: none; 180 | -webkit-box-orient: horizontal; 181 | -webkit-box-direction: normal; 182 | -webkit-flex-direction: row; 183 | -ms-flex-direction: row; 184 | flex-direction: row; 185 | -webkit-box-pack: start; 186 | -webkit-justify-content: flex-start; 187 | -ms-flex-pack: start; 188 | justify-content: flex-start; 189 | -webkit-box-align: center; 190 | -webkit-align-items: center; 191 | -ms-flex-align: center; 192 | align-items: center; 193 | border-bottom: 1px solid #000; 194 | font-family: 'Droid Serif', serif; 195 | font-size: 20.8px; 196 | line-height: 30px; 197 | font-weight: 700; 198 | } 199 | 200 | .heading-3.selected-tab { 201 | font-family: Merriweather, serif; 202 | font-weight: 900; 203 | } 204 | 205 | .div-block-4 { 206 | margin-top: 0px; 207 | } 208 | 209 | .div-block-4.main-tab-div { 210 | margin-top: 50px; 211 | } 212 | 213 | .div-block-5 { 214 | height: 1.5em; 215 | margin-top: 25px; 216 | } 217 | 218 | .div-block-5.pattern-div { 219 | background-color: hsla(28, 93%, 72%, .5); 220 | } 221 | 222 | .pattern-box-border { 223 | margin-top: 35px; 224 | border-style: solid; 225 | border-width: 18px; 226 | border-color: hsla(28, 93%, 72%, .5); 227 | } 228 | 229 | .pattern-box-border.chart-box { 230 | margin-top: 20px; 231 | } 232 | 233 | .text-field { 234 | padding-right: 30px; 235 | padding-left: 30px; 236 | font-size: 1.5rem; 237 | } 238 | 239 | .text-field.quote-search { 240 | margin-right: 0px; 241 | padding-right: 0px; 242 | padding-left: 0px; 243 | float: none; 244 | border-style: none; 245 | font-family: Lato, sans-serif; 246 | color: #fb8b1e; 247 | font-style: normal; 248 | font-weight: 700; 249 | text-align: left; 250 | } 251 | 252 | .div-block-6 { 253 | display: block; 254 | margin: 15px; 255 | } 256 | 257 | .display-block { 258 | margin-top: 0px; 259 | } 260 | 261 | .div-block-7 { 262 | width: 15em; 263 | height: 3em; 264 | border: 1px solid #000; 265 | } 266 | 267 | .div-block-7.time-frame-box { 268 | display: inline-block; 269 | width: auto; 270 | height: 2.6em; 271 | margin-right: 15px; 272 | -webkit-box-pack: start; 273 | -webkit-justify-content: flex-start; 274 | -ms-flex-pack: start; 275 | justify-content: flex-start; 276 | border-color: #cacaca; 277 | } 278 | 279 | .div-block-7.time-frame-box.time-frame-box-two { 280 | width: 10em; 281 | margin-top: 7px; 282 | margin-bottom: 9px; 283 | } 284 | 285 | .div-block-7.time-frame-box.time-frame-box-two.time-frame-box-three { 286 | width: 8em; 287 | } 288 | 289 | .div-block-7.time-frame-box.time-frame-box-two.input-box { 290 | width: 11.5em; 291 | } 292 | 293 | .div-block-8 { 294 | height: 25em; 295 | } 296 | 297 | .div-block-9 { 298 | position: static; 299 | top: 0px; 300 | right: 0px; 301 | display: inline-block; 302 | width: 1em; 303 | height: 1em; 304 | margin-bottom: -39px; 305 | padding-bottom: 24px; 306 | float: right; 307 | clear: right; 308 | -webkit-box-align: stretch; 309 | -webkit-align-items: stretch; 310 | -ms-flex-align: stretch; 311 | align-items: stretch; 312 | } 313 | 314 | .latest-list { 315 | margin-top: 10px; 316 | padding-left: 0px; 317 | list-style-type: none; 318 | } 319 | 320 | .latest-list-item-time { 321 | background-color: transparent; 322 | font-family: Lato, sans-serif; 323 | color: #818181; 324 | font-size: 0.63rem; 325 | font-weight: 300; 326 | text-transform: none; 327 | } 328 | 329 | .div-block-10 { 330 | display: block; 331 | } 332 | 333 | .heading-4 { 334 | margin-top: 5px; 335 | margin-bottom: 5px; 336 | font-family: Exo, sans-serif; 337 | font-weight: 800; 338 | } 339 | 340 | .list-item { 341 | margin-bottom: 10px; 342 | border-style: dotted dotted dotted none; 343 | border-width: 0px 0px 0.5px; 344 | border-color: #000 #000 #aaa; 345 | } 346 | 347 | .table-div { 348 | margin-top: 20px; 349 | } 350 | 351 | .footer { 352 | display: block; 353 | margin-top: 10px; 354 | margin-bottom: 10px; 355 | border: 1px none #000; 356 | } 357 | 358 | .footer-container { 359 | margin-top: 20px; 360 | border-top: 1px solid #000; 361 | } 362 | 363 | .main-body { 364 | /* border-bottom: 1px solid #000; */ 365 | } 366 | 367 | .container-3 { 368 | margin-top: 0px; 369 | margin-bottom: 0px; 370 | } 371 | 372 | .div-block-11 { 373 | border-style: none; 374 | } 375 | 376 | .div-block-11.footer-div.footer-left { 377 | float: left; 378 | } 379 | 380 | .div-block-11.footer-div.footer-right { 381 | float: right; 382 | } 383 | 384 | .footer-item { 385 | padding-right: 15px; 386 | font-family: Lato, sans-serif; 387 | color: #747474; 388 | font-size: 12px; 389 | font-weight: 300; 390 | text-decoration: none; 391 | } 392 | 393 | .footer-item.footer-item-two { 394 | position: static; 395 | top: 0px; 396 | right: 0px; 397 | display: block; 398 | float: right; 399 | clear: none; 400 | -webkit-justify-content: space-around; 401 | -ms-flex-pack: distribute; 402 | justify-content: space-around; 403 | -webkit-box-align: stretch; 404 | -webkit-align-items: stretch; 405 | -ms-flex-align: stretch; 406 | align-items: stretch; 407 | } 408 | 409 | .time-box-one { 410 | display: inline-block; 411 | width: 7em; 412 | height: 0px; 413 | margin-top: 0px; 414 | float: none; 415 | text-align: left; 416 | } 417 | 418 | .time-box-one.time-box-header { 419 | display: inline; 420 | } 421 | 422 | .time-box-one.b-r { 423 | width: 3em; 424 | height: 2.5em; 425 | max-height: 2.5em; 426 | min-height: 2em; 427 | margin-bottom: 10px; 428 | padding-bottom: 0px; 429 | border-right: 0.1px solid lightgray; 430 | } 431 | 432 | .time-box-one.time-label-box { 433 | height: 2.5em; 434 | margin-top: 0px; 435 | margin-bottom: 10px; 436 | padding-bottom: 0px; 437 | background-color: #fb8b1e; 438 | color: #fff; 439 | } 440 | 441 | .text-block-2 { 442 | display: block; 443 | margin-top: 0px; 444 | margin-bottom: 0px; 445 | text-align: center; 446 | } 447 | 448 | .top-nav-section { 449 | background-color: #000; 450 | color: #fff; 451 | } 452 | 453 | .nav-bar { 454 | background-color: #fb8e1e; 455 | } 456 | 457 | .success-message { 458 | color: #fb8b1e; 459 | } 460 | 461 | .form { 462 | color: #fb8b1e; 463 | } 464 | 465 | .text-block-3 { 466 | font-family: Lato, sans-serif; 467 | color: #818181; 468 | font-size: 16px; 469 | font-weight: 300; 470 | } 471 | 472 | .text-block-4 { 473 | font-family: Montserrat, sans-serif; 474 | font-weight: 700; 475 | } 476 | 477 | .text-block-5 { 478 | font-family: Lato, sans-serif; 479 | color: #888787; 480 | font-size: 13px; 481 | font-weight: 300; 482 | } 483 | 484 | .text-block-6 { 485 | position: relative; 486 | display: -webkit-box; 487 | display: -webkit-flex; 488 | display: -ms-flexbox; 489 | display: flex; 490 | margin-top: 0px; 491 | margin-bottom: 0px; 492 | padding: 10px 0px 0px 10px; 493 | float: left; 494 | clear: right; 495 | -webkit-box-pack: center; 496 | -webkit-justify-content: center; 497 | -ms-flex-pack: center; 498 | justify-content: center; 499 | color: #868686; 500 | font-weight: 700; 501 | } 502 | 503 | .text-block-6.text-label { 504 | display: block; 505 | margin-top: 0px; 506 | margin-right: auto; 507 | margin-left: auto; 508 | padding-top: 9px; 509 | padding-bottom: 0px; 510 | padding-left: 9px; 511 | color: #fff; 512 | } 513 | 514 | .text-block-7 { 515 | display: block; 516 | margin-top: -1px; 517 | padding-top: 8px; 518 | padding-left: 5px; 519 | float: left; 520 | font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; 521 | color: #969696; 522 | font-weight: 700; 523 | } 524 | 525 | .text-block-7.text-drop-down { 526 | padding-top: 9px; 527 | padding-left: 14px; 528 | color: #fb8b1e; 529 | } 530 | 531 | .div-block-13 { 532 | display: inline-block; 533 | width: 2.5em; 534 | height: 2.5em; 535 | float: right; 536 | background-color: #fb8b1e; 537 | } 538 | 539 | @media (max-width: 991px) { 540 | .div-block-3 { 541 | float: none; 542 | text-align: center; 543 | } 544 | .text-block { 545 | float: none; 546 | } 547 | .main-body { 548 | text-align: center; 549 | } 550 | .container-3 { 551 | text-align: center; 552 | } 553 | .top-nav-section { 554 | display: none; 555 | } 556 | } 557 | 558 | @media (max-width: 479px) { 559 | .top-nav { 560 | display: none; 561 | } 562 | .div-block { 563 | display: none; 564 | text-align: center; 565 | } 566 | .div-block-2 { 567 | padding-right: 0px; 568 | padding-left: 0px; 569 | } 570 | .div-block-3 { 571 | display: inline-block; 572 | width: 100%; 573 | float: none; 574 | clear: none; 575 | } 576 | .text-block { 577 | display: none; 578 | float: none; 579 | text-align: center; 580 | } 581 | .heading-3.selected-tab { 582 | margin-right: 0px; 583 | } 584 | .div-block-4.main-tab-div { 585 | position: static; 586 | display: -webkit-box; 587 | display: -webkit-flex; 588 | display: -ms-flexbox; 589 | display: flex; 590 | width: 120%; 591 | float: none; 592 | clear: none; 593 | -webkit-box-orient: vertical; 594 | -webkit-box-direction: normal; 595 | -webkit-flex-direction: column; 596 | -ms-flex-direction: column; 597 | flex-direction: column; 598 | -webkit-box-pack: center; 599 | -webkit-justify-content: center; 600 | -ms-flex-pack: center; 601 | justify-content: center; 602 | -webkit-box-align: center; 603 | -webkit-align-items: center; 604 | -ms-flex-align: center; 605 | align-items: center; 606 | text-align: center; 607 | } 608 | .div-block-8 { 609 | padding-right: 0px; 610 | } 611 | .latest-list { 612 | padding-right: 10px; 613 | padding-left: 10px; 614 | } 615 | .footer { 616 | display: -webkit-box; 617 | display: -webkit-flex; 618 | display: -ms-flexbox; 619 | display: flex; 620 | -webkit-box-align: center; 621 | -webkit-align-items: center; 622 | -ms-flex-align: center; 623 | align-items: center; 624 | } 625 | .footer-container { 626 | display: -webkit-box; 627 | display: -webkit-flex; 628 | display: -ms-flexbox; 629 | display: flex; 630 | clear: none; 631 | -webkit-box-orient: vertical; 632 | -webkit-box-direction: normal; 633 | -webkit-flex-direction: column; 634 | -ms-flex-direction: column; 635 | flex-direction: column; 636 | -webkit-box-pack: start; 637 | -webkit-justify-content: flex-start; 638 | -ms-flex-pack: start; 639 | justify-content: flex-start; 640 | -webkit-flex-wrap: nowrap; 641 | -ms-flex-wrap: nowrap; 642 | flex-wrap: nowrap; 643 | -webkit-box-align: stretch; 644 | -webkit-align-items: stretch; 645 | -ms-flex-align: stretch; 646 | align-items: stretch; 647 | } 648 | .main-body { 649 | padding-right: 3px; 650 | padding-left: 3px; 651 | } 652 | .div-block-11.footer-div.footer-right { 653 | display: none; 654 | } 655 | .div-block-12 { 656 | display: none; 657 | } 658 | } -------------------------------------------------------------------------------- /src/Assets/font-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pysi17/vue_stock-trader/2ac59c3cc1f1658e38939774141d92038348b4c5/src/Assets/font-logo.png -------------------------------------------------------------------------------- /src/Assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | -------------------------------------------------------------------------------- /src/Assets/normalize.css: -------------------------------------------------------------------------------- 1 | /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ 2 | /** 3 | * 1. Set default font family to sans-serif. 4 | * 2. Prevent iOS and IE text size adjust after device orientation change, 5 | * without disabling user zoom. 6 | */ 7 | html { 8 | font-family: sans-serif; 9 | /* 1 */ 10 | -ms-text-size-adjust: 100%; 11 | /* 2 */ 12 | -webkit-text-size-adjust: 100%; 13 | /* 2 */ 14 | } 15 | /** 16 | * Remove default margin. 17 | */ 18 | body { 19 | margin: 0; 20 | } 21 | /* HTML5 display definitions 22 | ========================================================================== */ 23 | /** 24 | * Correct `block` display not defined for any HTML5 element in IE 8/9. 25 | * Correct `block` display not defined for `details` or `summary` in IE 10/11 26 | * and Firefox. 27 | * Correct `block` display not defined for `main` in IE 11. 28 | */ 29 | article, 30 | aside, 31 | details, 32 | figcaption, 33 | figure, 34 | footer, 35 | header, 36 | hgroup, 37 | main, 38 | menu, 39 | nav, 40 | section, 41 | summary { 42 | display: block; 43 | } 44 | /** 45 | * 1. Correct `inline-block` display not defined in IE 8/9. 46 | * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. 47 | */ 48 | audio, 49 | canvas, 50 | progress, 51 | video { 52 | display: inline-block; 53 | /* 1 */ 54 | vertical-align: baseline; 55 | /* 2 */ 56 | } 57 | /** 58 | * Prevent modern browsers from displaying `audio` without controls. 59 | * Remove excess height in iOS 5 devices. 60 | */ 61 | audio:not([controls]) { 62 | display: none; 63 | height: 0; 64 | } 65 | /** 66 | * Address `[hidden]` styling not present in IE 8/9/10. 67 | * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22. 68 | */ 69 | [hidden], 70 | template { 71 | display: none; 72 | } 73 | /* Links 74 | ========================================================================== */ 75 | /** 76 | * Remove the gray background color from active links in IE 10. 77 | */ 78 | a { 79 | background-color: transparent; 80 | } 81 | /** 82 | * Improve readability of focused elements when they are also in an 83 | * active/hover state. 84 | */ 85 | a:active, 86 | a:hover { 87 | outline: 0; 88 | } 89 | /* Text-level semantics 90 | ========================================================================== */ 91 | /** 92 | * Address styling not present in IE 8/9/10/11, Safari, and Chrome. 93 | */ 94 | abbr[title] { 95 | border-bottom: 1px dotted; 96 | } 97 | /** 98 | * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. 99 | */ 100 | b, 101 | strong { 102 | font-weight: bold; 103 | } 104 | /** 105 | * Address styling not present in Safari and Chrome. 106 | */ 107 | dfn { 108 | font-style: italic; 109 | } 110 | /** 111 | * Address variable `h1` font-size and margin within `section` and `article` 112 | * contexts in Firefox 4+, Safari, and Chrome. 113 | */ 114 | h1 { 115 | font-size: 2em; 116 | margin: 0.67em 0; 117 | } 118 | /** 119 | * Address styling not present in IE 8/9. 120 | */ 121 | mark { 122 | background: #ff0; 123 | color: #000; 124 | } 125 | /** 126 | * Address inconsistent and variable font size in all browsers. 127 | */ 128 | small { 129 | font-size: 80%; 130 | } 131 | /** 132 | * Prevent `sub` and `sup` affecting `line-height` in all browsers. 133 | */ 134 | sub, 135 | sup { 136 | font-size: 75%; 137 | line-height: 0; 138 | position: relative; 139 | vertical-align: baseline; 140 | } 141 | sup { 142 | top: -0.5em; 143 | } 144 | sub { 145 | bottom: -0.25em; 146 | } 147 | /* Embedded content 148 | ========================================================================== */ 149 | /** 150 | * Remove border when inside `a` element in IE 8/9/10. 151 | */ 152 | img { 153 | border: 0; 154 | } 155 | /** 156 | * Correct overflow not hidden in IE 9/10/11. 157 | */ 158 | svg:not(:root) { 159 | overflow: hidden; 160 | } 161 | /* Grouping content 162 | ========================================================================== */ 163 | /** 164 | * Address margin not present in IE 8/9 and Safari. 165 | */ 166 | figure { 167 | margin: 1em 40px; 168 | } 169 | /** 170 | * Address differences between Firefox and other browsers. 171 | */ 172 | hr { 173 | box-sizing: content-box; 174 | height: 0; 175 | } 176 | /** 177 | * Contain overflow in all browsers. 178 | */ 179 | pre { 180 | overflow: auto; 181 | } 182 | /** 183 | * Address odd `em`-unit font size rendering in all browsers. 184 | */ 185 | code, 186 | kbd, 187 | pre, 188 | samp { 189 | font-family: monospace, monospace; 190 | font-size: 1em; 191 | } 192 | /* Forms 193 | ========================================================================== */ 194 | /** 195 | * Known limitation: by default, Chrome and Safari on OS X allow very limited 196 | * styling of `select`, unless a `border` property is set. 197 | */ 198 | /** 199 | * 1. Correct color not being inherited. 200 | * Known issue: affects color of disabled elements. 201 | * 2. Correct font properties not being inherited. 202 | * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. 203 | */ 204 | button, 205 | input, 206 | optgroup, 207 | select, 208 | textarea { 209 | color: inherit; 210 | /* 1 */ 211 | font: inherit; 212 | /* 2 */ 213 | margin: 0; 214 | /* 3 */ 215 | } 216 | /** 217 | * Address `overflow` set to `hidden` in IE 8/9/10/11. 218 | */ 219 | button { 220 | overflow: visible; 221 | } 222 | /** 223 | * Address inconsistent `text-transform` inheritance for `button` and `select`. 224 | * All other form control elements do not inherit `text-transform` values. 225 | * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. 226 | * Correct `select` style inheritance in Firefox. 227 | */ 228 | button, 229 | select { 230 | text-transform: none; 231 | } 232 | /** 233 | * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` 234 | * and `video` controls. 235 | * 2. Correct inability to style clickable `input` types in iOS. 236 | * 3. Improve usability and consistency of cursor style between image-type 237 | * `input` and others. 238 | * 4. CUSTOM FOR WEBFLOW: Removed the input[type="submit"] selector to reduce 239 | * specificity and defer to the .w-button selector 240 | */ 241 | button, 242 | html input[type="button"], 243 | input[type="reset"] { 244 | -webkit-appearance: button; 245 | /* 2 */ 246 | cursor: pointer; 247 | /* 3 */ 248 | } 249 | /** 250 | * Re-set default cursor for disabled elements. 251 | */ 252 | button[disabled], 253 | html input[disabled] { 254 | cursor: default; 255 | } 256 | /** 257 | * Remove inner padding and border in Firefox 4+. 258 | */ 259 | button::-moz-focus-inner, 260 | input::-moz-focus-inner { 261 | border: 0; 262 | padding: 0; 263 | } 264 | /** 265 | * Address Firefox 4+ setting `line-height` on `input` using `!important` in 266 | * the UA stylesheet. 267 | */ 268 | input { 269 | line-height: normal; 270 | } 271 | /** 272 | * It's recommended that you don't attempt to style these elements. 273 | * Firefox's implementation doesn't respect box-sizing, padding, or width. 274 | * 275 | * 1. Address box sizing set to `content-box` in IE 8/9/10. 276 | * 2. Remove excess padding in IE 8/9/10. 277 | */ 278 | input[type="checkbox"], 279 | input[type="radio"] { 280 | box-sizing: border-box; 281 | /* 1 */ 282 | padding: 0; 283 | /* 2 */ 284 | } 285 | /** 286 | * Fix the cursor style for Chrome's increment/decrement buttons. For certain 287 | * `font-size` values of the `input`, it causes the cursor style of the 288 | * decrement button to change from `default` to `text`. 289 | */ 290 | input[type="number"]::-webkit-inner-spin-button, 291 | input[type="number"]::-webkit-outer-spin-button { 292 | height: auto; 293 | } 294 | /** 295 | * 1. CUSTOM FOR WEBFLOW: changed from `textfield` to `none` to normalize iOS rounded input 296 | * 2. CUSTOM FOR WEBFLOW: box-sizing: content-box rule removed 297 | * (similar to normalize.css >=4.0.0) 298 | */ 299 | input[type="search"] { 300 | -webkit-appearance: none; 301 | /* 1 */ 302 | } 303 | /** 304 | * Remove inner padding and search cancel button in Safari and Chrome on OS X. 305 | * Safari (but not Chrome) clips the cancel button when the search input has 306 | * padding (and `textfield` appearance). 307 | */ 308 | input[type="search"]::-webkit-search-cancel-button, 309 | input[type="search"]::-webkit-search-decoration { 310 | -webkit-appearance: none; 311 | } 312 | /** 313 | * Define consistent border, margin, and padding. 314 | */ 315 | fieldset { 316 | border: 1px solid #c0c0c0; 317 | margin: 0 2px; 318 | padding: 0.35em 0.625em 0.75em; 319 | } 320 | /** 321 | * 1. Correct `color` not being inherited in IE 8/9/10/11. 322 | * 2. Remove padding so people aren't caught out if they zero out fieldsets. 323 | */ 324 | legend { 325 | border: 0; 326 | /* 1 */ 327 | padding: 0; 328 | /* 2 */ 329 | } 330 | /** 331 | * Remove default vertical scrollbar in IE 8/9/10/11. 332 | */ 333 | textarea { 334 | overflow: auto; 335 | } 336 | /** 337 | * Don't inherit the `font-weight` (applied by a rule above). 338 | * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. 339 | */ 340 | optgroup { 341 | font-weight: bold; 342 | } 343 | /* Tables 344 | ========================================================================== */ 345 | /** 346 | * Remove most spacing between table cells. 347 | */ 348 | table { 349 | border-collapse: collapse; 350 | border-spacing: 0; 351 | } 352 | td, 353 | th { 354 | padding: 0; 355 | } 356 | -------------------------------------------------------------------------------- /src/Assets/webflow.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'webflow-icons'; 3 | src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg6SAy0AAAC8AAAAYGNtYXAaVcxaAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5ZgscV1gAAAFwAAABhGhlYWQCkFKvAAAC9AAAADZoaGVhB0MDyQAAAywAAAAkaG10eBIAA10AAANQAAAAIGxvY2EBMADyAAADcAAAABJtYXhwAAwATQAAA4QAAAAgbmFtZWTuiIAAAAOkAAABe3Bvc3QAAwAAAAAFIAAAACAAAwQAAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADmAwPA/8D/wAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIOYD//3//wAAAAAAIOYA//3//wAB/+MaBAADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQEgAAADIAOAAAUAAAkBBwkBFwMg/kBAAYD+gEABwAHAQP6A/oBAAAEA4AAAAuADgAAFAAATARcJAQfgAcBA/oABgEABwAHAQP6A/oBAAAADAMAA4ANAAsAAGAAxAEoAAAEhIg4CHQEUHgIzITI+Aj0BNC4CIxUhIg4CHQEUHgIzITI+Aj0BNC4CIxUhIg4CHQEUHgIzITI+Aj0BNC4CIwMg/cAHCwkFBQkLBwJABwsJBQUJCwf9wAcLCQUFCQsHAkAHCwkFBQkLB/3ABwsJBQUJCwcCQAcLCQUFCQsHAsAFCQsHIAcLCQUFCQsHIAcLCQXABQkLByAHCwkFBQkLByAHCwkFwAUJCwcgBwsJBQUJCwcgBwsJBQAAAAABAJ0AtAOBApUABQAACQIHCQEDJP7r/upcAXEBcgKU/usBFFv+egGGAAAAAAEAAAABAADSLAJOXw889QALBAAAAAAAz/iHGQAAAADP+IcZAAAAAAOBA4AAAAAIAAIAAAAAAAAAAQAAA8D/wAAABAAAAAAAA4EAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAACAAAABAABIAQAAOAEAADABAAAnQAAAAAACgAUAB4AMgBGAKwAwgAAAAEAAAAIAEsAAwAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAaAAAAAQAAAAAAAgAOAHEAAQAAAAAAAwAaADAAAQAAAAAABAAaAH8AAQAAAAAABQAWABoAAQAAAAAABgANAEoAAQAAAAAACgA0AJkAAwABBAkAAQAaAAAAAwABBAkAAgAOAHEAAwABBAkAAwAaADAAAwABBAkABAAaAH8AAwABBAkABQAWABoAAwABBAkABgAaAFcAAwABBAkACgA0AJkAdwBlAGIAZgBsAG8AdwAtAGkAYwBvAG4AcwBWAGUAcgBzAGkAbwBuACAAMQAuADAAdwBlAGIAZgBsAG8AdwAtAGkAYwBvAG4Ac3dlYmZsb3ctaWNvbnMAdwBlAGIAZgBsAG8AdwAtAGkAYwBvAG4AcwBSAGUAZwB1AGwAYQByAHcAZQBiAGYAbABvAHcALQBpAGMAbwBuAHMARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAAVcAAoAAAAABRQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAZMAAAGTuzUomU9TLzIAAAKIAAAAYAAAAGAOkgMtY21hcAAAAugAAABMAAAATBpVzFpnYXNwAAADNAAAAAgAAAAIAAAAEGhlYWQAAAM8AAAANgAAADYCkFKvaGhlYQAAA3QAAAAkAAAAJAdDA8lobXR4AAADmAAAACAAAAAgEgADXW1heHAAAAO4AAAABgAAAAYACFAAbmFtZQAAA8AAAAF7AAABe2TuiIBwb3N0AAAFPAAAACAAAAAgAAMAAAEABAQAAQEBDndlYmZsb3ctaWNvbnMAAQIAAQA6+BwC+BsD+BgEHgoACXf/i4seCgAJd/+LiwwHi0v6lPpUBR0AAACaDx0AAACfER0AAAAJHQAAAYoSAAkBAQ4bHR8iJywxNndlYmZsb3ctaWNvbnN3ZWJmbG93LWljb25zdTB1MXUyMHVFNjAwdUU2MDF1RTYwMnVFNjAzAAACAYkABgAIAQEEBwoNJDvH4P6UDv6UDv6UDvyUDvm0+FQV/FT4VEtL+BT8FPwU/BTLSwUO93T4VBX4VPhUy0v8FPwU+BT8FEtLBQ75tPlUFfzUiwV5i319i3kIi2sFi3mZfZ2LCPjUiwWdi5mZi50Ii6sFi519mXmLCIv7VBX81IsFeYt9fYt5CItrBYt5mX2diwj41IsFnYuZmYudCIurBYudfZl5iwiL+1QV/NSLBXmLfX2LeQiLawWLeZl9nYsI+NSLBZ2LmZmLnQiLqwWLnX2ZeYsIDvm4+SkV+6n7qvuq96ovLvgG/Bj4BvgYBQ76lBT6lBWLDAoAAAMEAAGQAAUAAAKZAswAAACPApkCzAAAAesAMwEJAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA5gMDwP/A/8ADwABAAAAAAQAAAAAAAAAAAAAAIAAAAAAAAgAAAAMAAAAUAAMAAQAAABQABAA4AAAACgAIAAIAAgABACDmA//9//8AAAAAACDmAP/9//8AAf/jGgQAAwABAAAAAAAAAAAAAAABAAH//wAPAAEAAAABAAC1pQTjXw889QALBAAAAAAAz/iHGQAAAADP+IcZAAAAAAOBA4AAAAAIAAIAAAAAAAAAAQAAA8D/wAAABAAAAAAAA4EAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAACAAAABAABIAQAAOAEAADABAAAnQAAUAAACAAAAAAADgCuAAEAAAAAAAEAGgAAAAEAAAAAAAIADgBxAAEAAAAAAAMAGgAwAAEAAAAAAAQAGgB/AAEAAAAAAAUAFgAaAAEAAAAAAAYADQBKAAEAAAAAAAoANACZAAMAAQQJAAEAGgAAAAMAAQQJAAIADgBxAAMAAQQJAAMAGgAwAAMAAQQJAAQAGgB/AAMAAQQJAAUAFgAaAAMAAQQJAAYAGgBXAAMAAQQJAAoANACZAHcAZQBiAGYAbABvAHcALQBpAGMAbwBuAHMAVgBlAHIAcwBpAG8AbgAgADEALgAwAHcAZQBiAGYAbABvAHcALQBpAGMAbwBuAHN3ZWJmbG93LWljb25zAHcAZQBiAGYAbABvAHcALQBpAGMAbwBuAHMAUgBlAGcAdQBsAGEAcgB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==) format('woff'); 4 | font-weight: normal; 5 | font-style: normal; 6 | } 7 | [class^="w-icon-"], 8 | [class*=" w-icon-"] { 9 | font-family: 'webflow-icons'; 10 | speak: none; 11 | font-style: normal; 12 | font-weight: normal; 13 | font-variant: normal; 14 | text-transform: none; 15 | line-height: 1; 16 | -webkit-font-smoothing: antialiased; 17 | -moz-osx-font-smoothing: grayscale; 18 | } 19 | .w-icon-slider-right:before { 20 | content: "\e600"; 21 | } 22 | .w-icon-slider-left:before { 23 | content: "\e601"; 24 | } 25 | .w-icon-nav-menu:before { 26 | content: "\e602"; 27 | } 28 | .w-icon-arrow-down:before, 29 | .w-icon-dropdown-toggle:before { 30 | content: "\e603"; 31 | } 32 | * { 33 | -webkit-box-sizing: border-box; 34 | -moz-box-sizing: border-box; 35 | box-sizing: border-box; 36 | } 37 | html { 38 | height: 100%; 39 | } 40 | body { 41 | margin: 0; 42 | min-height: 100%; 43 | background-color: #fff; 44 | font-family: Arial, sans-serif; 45 | font-size: 14px; 46 | line-height: 20px; 47 | color: #333; 48 | } 49 | img { 50 | max-width: 100%; 51 | vertical-align: middle; 52 | display: inline-block; 53 | } 54 | html.w-mod-touch * { 55 | background-attachment: scroll !important; 56 | } 57 | .w-block { 58 | display: block; 59 | } 60 | .w-inline-block { 61 | max-width: 100%; 62 | display: inline-block; 63 | } 64 | .w-clearfix:before, 65 | .w-clearfix:after { 66 | content: " "; 67 | display: table; 68 | } 69 | .w-clearfix:after { 70 | clear: both; 71 | } 72 | .w-hidden { 73 | display: none; 74 | } 75 | .w-button { 76 | display: inline-block; 77 | padding: 9px 15px; 78 | background-color: #3898EC; 79 | color: white; 80 | border: 0; 81 | line-height: inherit; 82 | text-decoration: none; 83 | cursor: pointer; 84 | border-radius: 0; 85 | } 86 | input.w-button { 87 | -webkit-appearance: button; 88 | } 89 | html[data-w-dynpage] [data-w-cloak] { 90 | color: transparent !important; 91 | } 92 | .w-webflow-badge, 93 | .w-webflow-badge * { 94 | position: static; 95 | left: auto; 96 | top: auto; 97 | right: auto; 98 | bottom: auto; 99 | z-index: auto; 100 | display: block; 101 | visibility: visible; 102 | overflow: visible; 103 | overflow-x: visible; 104 | overflow-y: visible; 105 | box-sizing: border-box; 106 | width: auto; 107 | height: auto; 108 | max-height: none; 109 | max-width: none; 110 | min-height: 0; 111 | min-width: 0; 112 | margin: 0; 113 | padding: 0; 114 | float: none; 115 | clear: none; 116 | border: 0 none transparent; 117 | border-radius: 0; 118 | background: none; 119 | background-image: none; 120 | background-position: 0% 0%; 121 | background-size: auto auto; 122 | background-repeat: repeat; 123 | background-origin: padding-box; 124 | background-clip: border-box; 125 | background-attachment: scroll; 126 | background-color: transparent; 127 | box-shadow: none; 128 | opacity: 1.0; 129 | transform: none; 130 | transition: none; 131 | direction: ltr; 132 | font-family: inherit; 133 | font-weight: inherit; 134 | color: inherit; 135 | font-size: inherit; 136 | line-height: inherit; 137 | font-style: inherit; 138 | font-variant: inherit; 139 | text-align: inherit; 140 | letter-spacing: inherit; 141 | text-decoration: inherit; 142 | text-indent: 0; 143 | text-transform: inherit; 144 | list-style-type: disc; 145 | text-shadow: none; 146 | font-smoothing: auto; 147 | vertical-align: baseline; 148 | cursor: inherit; 149 | white-space: inherit; 150 | word-break: normal; 151 | word-spacing: normal; 152 | word-wrap: normal; 153 | } 154 | .w-webflow-badge { 155 | position: fixed !important; 156 | display: inline-block !important; 157 | visibility: visible !important; 158 | opacity: 1 !important; 159 | z-index: 2147483647 !important; 160 | top: auto !important; 161 | right: 12px !important; 162 | bottom: 12px !important; 163 | left: auto !important; 164 | color: #AAADB0 !important; 165 | background-color: #fff !important; 166 | border-radius: 3px !important; 167 | padding: 6px 8px 6px 6px !important; 168 | font-size: 12px !important; 169 | opacity: 1.0 !important; 170 | line-height: 14px !important; 171 | text-decoration: none !important; 172 | transform: none !important; 173 | margin: 0 !important; 174 | width: auto !important; 175 | height: auto !important; 176 | overflow: visible !important; 177 | white-space: nowrap; 178 | box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0px 1px 3px rgba(0, 0, 0, 0.1); 179 | } 180 | .w-webflow-badge > img { 181 | display: inline-block !important; 182 | visibility: visible !important; 183 | opacity: 1 !important; 184 | vertical-align: middle !important; 185 | } 186 | h1, 187 | h2, 188 | h3, 189 | h4, 190 | h5, 191 | h6 { 192 | font-weight: bold; 193 | margin-bottom: 10px; 194 | } 195 | h1 { 196 | font-size: 38px; 197 | line-height: 44px; 198 | margin-top: 20px; 199 | } 200 | h2 { 201 | font-size: 32px; 202 | line-height: 36px; 203 | margin-top: 20px; 204 | } 205 | h3 { 206 | font-size: 24px; 207 | line-height: 30px; 208 | margin-top: 20px; 209 | } 210 | h4 { 211 | font-size: 18px; 212 | line-height: 24px; 213 | margin-top: 10px; 214 | } 215 | h5 { 216 | font-size: 14px; 217 | line-height: 20px; 218 | margin-top: 10px; 219 | } 220 | h6 { 221 | font-size: 12px; 222 | line-height: 18px; 223 | margin-top: 10px; 224 | } 225 | p { 226 | margin-top: 0; 227 | margin-bottom: 10px; 228 | } 229 | blockquote { 230 | margin: 0 0 10px 0; 231 | padding: 10px 20px; 232 | border-left: 5px solid #E2E2E2; 233 | font-size: 18px; 234 | line-height: 22px; 235 | } 236 | figure { 237 | margin: 0; 238 | margin-bottom: 10px; 239 | } 240 | figcaption { 241 | margin-top: 5px; 242 | text-align: center; 243 | } 244 | ul, 245 | ol { 246 | margin-top: 0px; 247 | margin-bottom: 10px; 248 | padding-left: 40px; 249 | } 250 | .w-list-unstyled { 251 | padding-left: 0; 252 | list-style: none; 253 | } 254 | .w-embed:before, 255 | .w-embed:after { 256 | content: " "; 257 | display: table; 258 | } 259 | .w-embed:after { 260 | clear: both; 261 | } 262 | .w-video { 263 | width: 100%; 264 | position: relative; 265 | padding: 0; 266 | } 267 | .w-video iframe, 268 | .w-video object, 269 | .w-video embed { 270 | position: absolute; 271 | top: 0; 272 | left: 0; 273 | width: 100%; 274 | height: 100%; 275 | } 276 | fieldset { 277 | padding: 0; 278 | margin: 0; 279 | border: 0; 280 | } 281 | button, 282 | html input[type="button"], 283 | input[type="reset"] { 284 | border: 0; 285 | cursor: pointer; 286 | -webkit-appearance: button; 287 | } 288 | .w-form { 289 | margin: 0 0 15px; 290 | } 291 | .w-form-done { 292 | display: none; 293 | padding: 20px; 294 | text-align: center; 295 | background-color: #dddddd; 296 | } 297 | .w-form-fail { 298 | display: none; 299 | margin-top: 10px; 300 | padding: 10px; 301 | background-color: #ffdede; 302 | } 303 | label { 304 | display: block; 305 | margin-bottom: 5px; 306 | font-weight: bold; 307 | } 308 | .w-input, 309 | .w-select { 310 | display: block; 311 | width: 100%; 312 | height: 38px; 313 | padding: 8px 12px; 314 | margin-bottom: 10px; 315 | font-size: 14px; 316 | line-height: 1.428571429; 317 | color: #333333; 318 | vertical-align: middle; 319 | background-color: #ffffff; 320 | border: 1px solid #cccccc; 321 | } 322 | .w-input:-moz-placeholder, 323 | .w-select:-moz-placeholder { 324 | color: #999; 325 | } 326 | .w-input::-moz-placeholder, 327 | .w-select::-moz-placeholder { 328 | color: #999; 329 | opacity: 1; 330 | } 331 | .w-input:-ms-input-placeholder, 332 | .w-select:-ms-input-placeholder { 333 | color: #999; 334 | } 335 | .w-input::-webkit-input-placeholder, 336 | .w-select::-webkit-input-placeholder { 337 | color: #999; 338 | } 339 | .w-input:focus, 340 | .w-select:focus { 341 | border-color: #3898EC; 342 | outline: 0; 343 | } 344 | .w-input[disabled], 345 | .w-select[disabled], 346 | .w-input[readonly], 347 | .w-select[readonly], 348 | fieldset[disabled] .w-input, 349 | fieldset[disabled] .w-select { 350 | cursor: not-allowed; 351 | background-color: #eeeeee; 352 | } 353 | textarea.w-input, 354 | textarea.w-select { 355 | height: auto; 356 | } 357 | .w-select { 358 | background-image: -webkit-linear-gradient(white 0%, #f3f3f3 100%); 359 | background-image: linear-gradient(white 0%, #f3f3f3 100%); 360 | } 361 | .w-select[multiple] { 362 | height: auto; 363 | } 364 | .w-form-label { 365 | display: inline-block; 366 | cursor: pointer; 367 | font-weight: normal; 368 | margin-bottom: 0px; 369 | } 370 | .w-checkbox, 371 | .w-radio { 372 | display: block; 373 | margin-bottom: 5px; 374 | padding-left: 20px; 375 | } 376 | .w-checkbox:before, 377 | .w-radio:before, 378 | .w-checkbox:after, 379 | .w-radio:after { 380 | content: " "; 381 | display: table; 382 | } 383 | .w-checkbox:after, 384 | .w-radio:after { 385 | clear: both; 386 | } 387 | .w-checkbox-input, 388 | .w-radio-input { 389 | margin: 4px 0 0; 390 | margin-top: 1px \9; 391 | line-height: normal; 392 | float: left; 393 | margin-left: -20px; 394 | } 395 | .w-radio-input { 396 | margin-top: 3px; 397 | } 398 | .w-container { 399 | margin-left: auto; 400 | margin-right: auto; 401 | max-width: 1200px; 402 | } 403 | .w-container:before, 404 | .w-container:after { 405 | content: " "; 406 | display: table; 407 | } 408 | .w-container:after { 409 | clear: both; 410 | } 411 | .w-container .w-row { 412 | margin-left: -10px; 413 | margin-right: -10px; 414 | } 415 | .w-row:before, 416 | .w-row:after { 417 | content: " "; 418 | display: table; 419 | } 420 | .w-row:after { 421 | clear: both; 422 | } 423 | .w-row .w-row { 424 | margin-left: 0; 425 | margin-right: 0; 426 | } 427 | .w-col { 428 | position: relative; 429 | float: left; 430 | width: 100%; 431 | min-height: 1px; 432 | padding-left: 10px; 433 | padding-right: 10px; 434 | } 435 | .w-col .w-col { 436 | padding-left: 0; 437 | padding-right: 0; 438 | } 439 | .w-col-1 { 440 | width: 8.33333333%; 441 | } 442 | .w-col-2 { 443 | width: 16.66666667%; 444 | } 445 | .w-col-3 { 446 | width: 25%; 447 | } 448 | .w-col-4 { 449 | width: 33.33333333%; 450 | } 451 | .w-col-5 { 452 | width: 41.66666667%; 453 | } 454 | .w-col-6 { 455 | width: 50%; 456 | } 457 | .w-col-7 { 458 | width: 58.33333333%; 459 | } 460 | .w-col-8 { 461 | width: 66.66666667%; 462 | } 463 | .w-col-9 { 464 | width: 75%; 465 | } 466 | .w-col-10 { 467 | width: 83.33333333%; 468 | } 469 | .w-col-11 { 470 | width: 91.66666667%; 471 | } 472 | .w-col-12 { 473 | width: 100%; 474 | } 475 | .w-hidden-main { 476 | display: none !important; 477 | } 478 | @media screen and (max-width: 991px) { 479 | .w-container { 480 | max-width: 728px; 481 | } 482 | .w-hidden-main { 483 | display: inherit !important; 484 | } 485 | .w-hidden-medium { 486 | display: none !important; 487 | } 488 | .w-col-medium-1 { 489 | width: 8.33333333%; 490 | } 491 | .w-col-medium-2 { 492 | width: 16.66666667%; 493 | } 494 | .w-col-medium-3 { 495 | width: 25%; 496 | } 497 | .w-col-medium-4 { 498 | width: 33.33333333%; 499 | } 500 | .w-col-medium-5 { 501 | width: 41.66666667%; 502 | } 503 | .w-col-medium-6 { 504 | width: 50%; 505 | } 506 | .w-col-medium-7 { 507 | width: 58.33333333%; 508 | } 509 | .w-col-medium-8 { 510 | width: 66.66666667%; 511 | } 512 | .w-col-medium-9 { 513 | width: 75%; 514 | } 515 | .w-col-medium-10 { 516 | width: 83.33333333%; 517 | } 518 | .w-col-medium-11 { 519 | width: 91.66666667%; 520 | } 521 | .w-col-medium-12 { 522 | width: 100%; 523 | } 524 | .w-col-stack { 525 | width: 100%; 526 | left: auto; 527 | right: auto; 528 | } 529 | } 530 | @media screen and (max-width: 767px) { 531 | .w-hidden-main { 532 | display: inherit !important; 533 | } 534 | .w-hidden-medium { 535 | display: inherit !important; 536 | } 537 | .w-hidden-small { 538 | display: none !important; 539 | } 540 | .w-row, 541 | .w-container .w-row { 542 | margin-left: 0; 543 | margin-right: 0; 544 | } 545 | .w-col { 546 | width: 100%; 547 | left: auto; 548 | right: auto; 549 | } 550 | .w-col-small-1 { 551 | width: 8.33333333%; 552 | } 553 | .w-col-small-2 { 554 | width: 16.66666667%; 555 | } 556 | .w-col-small-3 { 557 | width: 25%; 558 | } 559 | .w-col-small-4 { 560 | width: 33.33333333%; 561 | } 562 | .w-col-small-5 { 563 | width: 41.66666667%; 564 | } 565 | .w-col-small-6 { 566 | width: 50%; 567 | } 568 | .w-col-small-7 { 569 | width: 58.33333333%; 570 | } 571 | .w-col-small-8 { 572 | width: 66.66666667%; 573 | } 574 | .w-col-small-9 { 575 | width: 75%; 576 | } 577 | .w-col-small-10 { 578 | width: 83.33333333%; 579 | } 580 | .w-col-small-11 { 581 | width: 91.66666667%; 582 | } 583 | .w-col-small-12 { 584 | width: 100%; 585 | } 586 | } 587 | @media screen and (max-width: 479px) { 588 | .w-container { 589 | max-width: none; 590 | } 591 | .w-hidden-main { 592 | display: inherit !important; 593 | } 594 | .w-hidden-medium { 595 | display: inherit !important; 596 | } 597 | .w-hidden-small { 598 | display: inherit !important; 599 | } 600 | .w-hidden-tiny { 601 | display: none !important; 602 | } 603 | .w-col { 604 | width: 100%; 605 | } 606 | .w-col-tiny-1 { 607 | width: 8.33333333%; 608 | } 609 | .w-col-tiny-2 { 610 | width: 16.66666667%; 611 | } 612 | .w-col-tiny-3 { 613 | width: 25%; 614 | } 615 | .w-col-tiny-4 { 616 | width: 33.33333333%; 617 | } 618 | .w-col-tiny-5 { 619 | width: 41.66666667%; 620 | } 621 | .w-col-tiny-6 { 622 | width: 50%; 623 | } 624 | .w-col-tiny-7 { 625 | width: 58.33333333%; 626 | } 627 | .w-col-tiny-8 { 628 | width: 66.66666667%; 629 | } 630 | .w-col-tiny-9 { 631 | width: 75%; 632 | } 633 | .w-col-tiny-10 { 634 | width: 83.33333333%; 635 | } 636 | .w-col-tiny-11 { 637 | width: 91.66666667%; 638 | } 639 | .w-col-tiny-12 { 640 | width: 100%; 641 | } 642 | } 643 | .w-widget { 644 | position: relative; 645 | } 646 | .w-widget-map { 647 | width: 100%; 648 | height: 400px; 649 | } 650 | .w-widget-map label { 651 | width: auto; 652 | display: inline; 653 | } 654 | .w-widget-map img { 655 | max-width: inherit; 656 | } 657 | .w-widget-map .gm-style-iw { 658 | width: 90% !important; 659 | height: auto !important; 660 | top: 7px !important; 661 | left: 6% !important; 662 | display: inline; 663 | text-align: center; 664 | overflow: hidden; 665 | } 666 | .w-widget-map .gm-style-iw + div { 667 | display: none; 668 | } 669 | .w-widget-twitter { 670 | overflow: hidden; 671 | } 672 | .w-widget-twitter-count-shim { 673 | display: inline-block; 674 | vertical-align: top; 675 | position: relative; 676 | width: 28px; 677 | height: 20px; 678 | text-align: center; 679 | background: white; 680 | border: #758696 solid 1px; 681 | border-radius: 3px; 682 | } 683 | .w-widget-twitter-count-shim * { 684 | pointer-events: none; 685 | -webkit-user-select: none; 686 | -moz-user-select: none; 687 | -ms-user-select: none; 688 | user-select: none; 689 | } 690 | .w-widget-twitter-count-shim .w-widget-twitter-count-inner { 691 | position: relative; 692 | font-size: 15px; 693 | line-height: 12px; 694 | text-align: center; 695 | color: #999; 696 | font-family: serif; 697 | } 698 | .w-widget-twitter-count-shim .w-widget-twitter-count-clear { 699 | position: relative; 700 | display: block; 701 | } 702 | .w-widget-twitter-count-shim.w--large { 703 | width: 36px; 704 | height: 28px; 705 | margin-left: 7px; 706 | } 707 | .w-widget-twitter-count-shim.w--large .w-widget-twitter-count-inner { 708 | font-size: 18px; 709 | line-height: 18px; 710 | } 711 | .w-widget-twitter-count-shim:not(.w--vertical) { 712 | margin-left: 5px; 713 | margin-right: 8px; 714 | } 715 | .w-widget-twitter-count-shim:not(.w--vertical).w--large { 716 | margin-left: 6px; 717 | } 718 | .w-widget-twitter-count-shim:not(.w--vertical):before, 719 | .w-widget-twitter-count-shim:not(.w--vertical):after { 720 | top: 50%; 721 | left: 0; 722 | border: solid transparent; 723 | content: " "; 724 | height: 0; 725 | width: 0; 726 | position: absolute; 727 | pointer-events: none; 728 | } 729 | .w-widget-twitter-count-shim:not(.w--vertical):before { 730 | border-color: rgba(117, 134, 150, 0); 731 | border-right-color: #5d6c7b; 732 | border-width: 4px; 733 | margin-left: -9px; 734 | margin-top: -4px; 735 | } 736 | .w-widget-twitter-count-shim:not(.w--vertical).w--large:before { 737 | border-width: 5px; 738 | margin-left: -10px; 739 | margin-top: -5px; 740 | } 741 | .w-widget-twitter-count-shim:not(.w--vertical):after { 742 | border-color: rgba(255, 255, 255, 0); 743 | border-right-color: white; 744 | border-width: 4px; 745 | margin-left: -8px; 746 | margin-top: -4px; 747 | } 748 | .w-widget-twitter-count-shim:not(.w--vertical).w--large:after { 749 | border-width: 5px; 750 | margin-left: -9px; 751 | margin-top: -5px; 752 | } 753 | .w-widget-twitter-count-shim.w--vertical { 754 | width: 61px; 755 | height: 33px; 756 | margin-bottom: 8px; 757 | } 758 | .w-widget-twitter-count-shim.w--vertical:before, 759 | .w-widget-twitter-count-shim.w--vertical:after { 760 | top: 100%; 761 | left: 50%; 762 | border: solid transparent; 763 | content: " "; 764 | height: 0; 765 | width: 0; 766 | position: absolute; 767 | pointer-events: none; 768 | } 769 | .w-widget-twitter-count-shim.w--vertical:before { 770 | border-color: rgba(117, 134, 150, 0); 771 | border-top-color: #5d6c7b; 772 | border-width: 5px; 773 | margin-left: -5px; 774 | } 775 | .w-widget-twitter-count-shim.w--vertical:after { 776 | border-color: rgba(255, 255, 255, 0); 777 | border-top-color: white; 778 | border-width: 4px; 779 | margin-left: -4px; 780 | } 781 | .w-widget-twitter-count-shim.w--vertical .w-widget-twitter-count-inner { 782 | font-size: 18px; 783 | line-height: 22px; 784 | } 785 | .w-widget-twitter-count-shim.w--vertical.w--large { 786 | width: 76px; 787 | } 788 | .w-widget-gplus { 789 | overflow: hidden; 790 | } 791 | .w-background-video { 792 | position: relative; 793 | overflow: hidden; 794 | height: 500px; 795 | color: white; 796 | } 797 | .w-background-video > video { 798 | background-size: cover; 799 | background-position: 50% 50%; 800 | position: absolute; 801 | right: -100%; 802 | bottom: -100%; 803 | top: -100%; 804 | left: -100%; 805 | margin: auto; 806 | min-width: 100%; 807 | min-height: 100%; 808 | z-index: -100; 809 | } 810 | .w-background-video > video::-webkit-media-controls-start-playback-button { 811 | display: none !important; 812 | -webkit-appearance: none; 813 | } 814 | .w-slider { 815 | position: relative; 816 | height: 300px; 817 | text-align: center; 818 | background: #dddddd; 819 | clear: both; 820 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 821 | tap-highlight-color: rgba(0, 0, 0, 0); 822 | } 823 | .w-slider-mask { 824 | position: relative; 825 | display: block; 826 | overflow: hidden; 827 | z-index: 1; 828 | left: 0; 829 | right: 0; 830 | height: 100%; 831 | white-space: nowrap; 832 | } 833 | .w-slide { 834 | position: relative; 835 | display: inline-block; 836 | vertical-align: top; 837 | width: 100%; 838 | height: 100%; 839 | white-space: normal; 840 | text-align: left; 841 | } 842 | .w-slider-nav { 843 | position: absolute; 844 | z-index: 2; 845 | top: auto; 846 | right: 0; 847 | bottom: 0; 848 | left: 0; 849 | margin: auto; 850 | padding-top: 10px; 851 | height: 40px; 852 | text-align: center; 853 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 854 | tap-highlight-color: rgba(0, 0, 0, 0); 855 | } 856 | .w-slider-nav.w-round > div { 857 | border-radius: 100%; 858 | } 859 | .w-slider-nav.w-num > div { 860 | width: auto; 861 | height: auto; 862 | padding: 0.2em 0.5em; 863 | font-size: inherit; 864 | line-height: inherit; 865 | } 866 | .w-slider-nav.w-shadow > div { 867 | box-shadow: 0 0 3px rgba(51, 51, 51, 0.4); 868 | } 869 | .w-slider-nav-invert { 870 | color: #fff; 871 | } 872 | .w-slider-nav-invert > div { 873 | background-color: rgba(34, 34, 34, 0.4); 874 | } 875 | .w-slider-nav-invert > div.w-active { 876 | background-color: #222; 877 | } 878 | .w-slider-dot { 879 | position: relative; 880 | display: inline-block; 881 | width: 1em; 882 | height: 1em; 883 | background-color: rgba(255, 255, 255, 0.4); 884 | cursor: pointer; 885 | margin: 0 3px 0.5em; 886 | transition: background-color 100ms, color 100ms; 887 | } 888 | .w-slider-dot.w-active { 889 | background-color: #fff; 890 | } 891 | .w-slider-arrow-left, 892 | .w-slider-arrow-right { 893 | position: absolute; 894 | width: 80px; 895 | top: 0; 896 | right: 0; 897 | bottom: 0; 898 | left: 0; 899 | margin: auto; 900 | cursor: pointer; 901 | overflow: hidden; 902 | color: white; 903 | font-size: 40px; 904 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 905 | tap-highlight-color: rgba(0, 0, 0, 0); 906 | -webkit-user-select: none; 907 | -moz-user-select: none; 908 | -ms-user-select: none; 909 | user-select: none; 910 | } 911 | .w-slider-arrow-left [class^="w-icon-"], 912 | .w-slider-arrow-right [class^="w-icon-"], 913 | .w-slider-arrow-left [class*=" w-icon-"], 914 | .w-slider-arrow-right [class*=" w-icon-"] { 915 | position: absolute; 916 | } 917 | .w-slider-arrow-left { 918 | z-index: 3; 919 | right: auto; 920 | } 921 | .w-slider-arrow-right { 922 | z-index: 4; 923 | left: auto; 924 | } 925 | .w-icon-slider-left, 926 | .w-icon-slider-right { 927 | top: 0; 928 | right: 0; 929 | bottom: 0; 930 | left: 0; 931 | margin: auto; 932 | width: 1em; 933 | height: 1em; 934 | } 935 | .w-dropdown { 936 | display: inline-block; 937 | position: relative; 938 | text-align: left; 939 | margin-left: auto; 940 | margin-right: auto; 941 | z-index: 900; 942 | } 943 | .w-dropdown-btn, 944 | .w-dropdown-toggle, 945 | .w-dropdown-link { 946 | position: relative; 947 | vertical-align: top; 948 | text-decoration: none; 949 | color: #222222; 950 | padding: 20px; 951 | text-align: left; 952 | margin-left: auto; 953 | margin-right: auto; 954 | white-space: nowrap; 955 | } 956 | .w-dropdown-toggle { 957 | -webkit-user-select: none; 958 | -moz-user-select: none; 959 | -ms-user-select: none; 960 | user-select: none; 961 | display: inline-block; 962 | cursor: pointer; 963 | padding-right: 40px; 964 | } 965 | .w-icon-dropdown-toggle { 966 | position: absolute; 967 | top: 0; 968 | right: 0; 969 | bottom: 0; 970 | margin: auto; 971 | margin-right: 20px; 972 | width: 1em; 973 | height: 1em; 974 | } 975 | .w-dropdown-list { 976 | position: absolute; 977 | background: #dddddd; 978 | display: none; 979 | min-width: 100%; 980 | } 981 | .w-dropdown-list.w--open { 982 | display: block; 983 | } 984 | .w-dropdown-link { 985 | padding: 10px 20px; 986 | display: block; 987 | color: #222222; 988 | } 989 | .w-dropdown-link.w--current { 990 | color: #0082f3; 991 | } 992 | .w-nav[data-collapse="all"] .w-dropdown, 993 | .w-nav[data-collapse="all"] .w-dropdown-toggle { 994 | display: block; 995 | } 996 | .w-nav[data-collapse="all"] .w-dropdown-list { 997 | position: static; 998 | } 999 | @media screen and (max-width: 991px) { 1000 | .w-nav[data-collapse="medium"] .w-dropdown, 1001 | .w-nav[data-collapse="medium"] .w-dropdown-toggle { 1002 | display: block; 1003 | } 1004 | .w-nav[data-collapse="medium"] .w-dropdown-list { 1005 | position: static; 1006 | } 1007 | } 1008 | @media screen and (max-width: 767px) { 1009 | .w-nav[data-collapse="small"] .w-dropdown, 1010 | .w-nav[data-collapse="small"] .w-dropdown-toggle { 1011 | display: block; 1012 | } 1013 | .w-nav[data-collapse="small"] .w-dropdown-list { 1014 | position: static; 1015 | } 1016 | .w-nav-brand { 1017 | padding-left: 10px; 1018 | } 1019 | } 1020 | @media screen and (max-width: 479px) { 1021 | .w-nav[data-collapse="tiny"] .w-dropdown, 1022 | .w-nav[data-collapse="tiny"] .w-dropdown-toggle { 1023 | display: block; 1024 | } 1025 | .w-nav[data-collapse="tiny"] .w-dropdown-list { 1026 | position: static; 1027 | } 1028 | } 1029 | /** 1030 | * ## Note 1031 | * Safari (on both iOS and OS X) does not handle viewport units (vh, vw) well. 1032 | * For example percentage units do not work on descendants of elements that 1033 | * have any dimensions expressed in viewport units. It also doesn’t handle them at 1034 | * all in `calc()`. 1035 | */ 1036 | /** 1037 | * Wrapper around all lightbox elements 1038 | * 1039 | * 1. Since the lightbox can receive focus, IE also gives it an outline. 1040 | * 2. Fixes flickering on Chrome when a transition is in progress 1041 | * underneath the lightbox. 1042 | */ 1043 | .w-lightbox-backdrop { 1044 | color: #000; 1045 | cursor: auto; 1046 | font-family: serif; 1047 | font-size: medium; 1048 | font-style: normal; 1049 | font-variant: normal; 1050 | font-weight: normal; 1051 | letter-spacing: normal; 1052 | line-height: normal; 1053 | list-style: disc; 1054 | text-align: start; 1055 | text-indent: 0; 1056 | text-shadow: none; 1057 | text-transform: none; 1058 | visibility: visible; 1059 | white-space: normal; 1060 | word-break: normal; 1061 | word-spacing: normal; 1062 | word-wrap: normal; 1063 | position: fixed; 1064 | top: 0; 1065 | right: 0; 1066 | bottom: 0; 1067 | left: 0; 1068 | color: #fff; 1069 | font-family: "Helvetica Neue", Helvetica, Ubuntu, "Segoe UI", Verdana, sans-serif; 1070 | font-size: 17px; 1071 | line-height: 1.2; 1072 | font-weight: 300; 1073 | text-align: center; 1074 | background: rgba(0, 0, 0, 0.9); 1075 | z-index: 2000; 1076 | outline: 0; 1077 | /* 1 */ 1078 | opacity: 0; 1079 | -webkit-user-select: none; 1080 | -moz-user-select: none; 1081 | -ms-user-select: none; 1082 | -webkit-tap-highlight-color: transparent; 1083 | -webkit-transform: translate(0, 0); 1084 | /* 2 */ 1085 | } 1086 | /** 1087 | * Neat trick to bind the rubberband effect to our canvas instead of the whole 1088 | * document on iOS. It also prevents a bug that causes the document underneath to scroll. 1089 | */ 1090 | .w-lightbox-backdrop, 1091 | .w-lightbox-container { 1092 | height: 100%; 1093 | overflow: auto; 1094 | -webkit-overflow-scrolling: touch; 1095 | } 1096 | .w-lightbox-content { 1097 | position: relative; 1098 | height: 100vh; 1099 | overflow: hidden; 1100 | } 1101 | .w-lightbox-view { 1102 | position: absolute; 1103 | width: 100vw; 1104 | height: 100vh; 1105 | opacity: 0; 1106 | } 1107 | .w-lightbox-view:before { 1108 | content: ""; 1109 | height: 100vh; 1110 | } 1111 | /* .w-lightbox-content */ 1112 | .w-lightbox-group, 1113 | .w-lightbox-group .w-lightbox-view, 1114 | .w-lightbox-group .w-lightbox-view:before { 1115 | height: 86vh; 1116 | } 1117 | .w-lightbox-frame, 1118 | .w-lightbox-view:before { 1119 | display: inline-block; 1120 | vertical-align: middle; 1121 | } 1122 | /* 1123 | * 1. Remove default margin set by user-agent on the
element. 1124 | */ 1125 | .w-lightbox-figure { 1126 | position: relative; 1127 | margin: 0; 1128 | /* 1 */ 1129 | } 1130 | .w-lightbox-group .w-lightbox-figure { 1131 | cursor: pointer; 1132 | } 1133 | /** 1134 | * IE adds image dimensions as width and height attributes on the IMG tag, 1135 | * but we need both width and height to be set to auto to enable scaling. 1136 | */ 1137 | .w-lightbox-img { 1138 | width: auto; 1139 | height: auto; 1140 | max-width: none; 1141 | } 1142 | /** 1143 | * 1. Reset if style is set by user on "All Images" 1144 | */ 1145 | .w-lightbox-image { 1146 | display: block; 1147 | float: none; 1148 | /* 1 */ 1149 | max-width: 100vw; 1150 | max-height: 100vh; 1151 | } 1152 | .w-lightbox-group .w-lightbox-image { 1153 | max-height: 86vh; 1154 | } 1155 | .w-lightbox-caption { 1156 | position: absolute; 1157 | right: 0; 1158 | bottom: 0; 1159 | left: 0; 1160 | padding: .5em 1em; 1161 | background: rgba(0, 0, 0, 0.4); 1162 | text-align: left; 1163 | text-overflow: ellipsis; 1164 | white-space: nowrap; 1165 | overflow: hidden; 1166 | } 1167 | .w-lightbox-embed { 1168 | position: absolute; 1169 | top: 0; 1170 | right: 0; 1171 | bottom: 0; 1172 | left: 0; 1173 | width: 100%; 1174 | height: 100%; 1175 | } 1176 | .w-lightbox-control { 1177 | position: absolute; 1178 | top: 0; 1179 | width: 4em; 1180 | background-size: 24px; 1181 | background-repeat: no-repeat; 1182 | background-position: center; 1183 | cursor: pointer; 1184 | -webkit-transition: all .3s; 1185 | transition: all .3s; 1186 | } 1187 | .w-lightbox-left { 1188 | display: none; 1189 | bottom: 0; 1190 | left: 0; 1191 | /* */ 1192 | background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0yMCAwIDI0IDQwIiB3aWR0aD0iMjQiIGhlaWdodD0iNDAiPjxnIHRyYW5zZm9ybT0icm90YXRlKDQ1KSI+PHBhdGggZD0ibTAgMGg1djIzaDIzdjVoLTI4eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDN2MjNoMjN2M2gtMjZ6IiBmaWxsPSIjZmZmIi8+PC9nPjwvc3ZnPg=="); 1193 | } 1194 | .w-lightbox-right { 1195 | display: none; 1196 | right: 0; 1197 | bottom: 0; 1198 | /* */ 1199 | background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMjQgNDAiIHdpZHRoPSIyNCIgaGVpZ2h0PSI0MCI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMC0waDI4djI4aC01di0yM2gtMjN6IiBvcGFjaXR5PSIuNCIvPjxwYXRoIGQ9Im0xIDFoMjZ2MjZoLTN2LTIzaC0yM3oiIGZpbGw9IiNmZmYiLz48L2c+PC9zdmc+"); 1200 | } 1201 | /* 1202 | * Without specifying the with and height inside the SVG, all versions of IE render the icon too small. 1203 | * The bug does not seem to manifest itself if the elements are tall enough such as the above arrows. 1204 | * (http://stackoverflow.com/questions/16092114/background-size-differs-in-internet-explorer) 1205 | */ 1206 | .w-lightbox-close { 1207 | right: 0; 1208 | height: 2.6em; 1209 | /* */ 1210 | background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMTggMTciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxNyI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMCAwaDd2LTdoNXY3aDd2NWgtN3Y3aC01di03aC03eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDd2LTdoM3Y3aDd2M2gtN3Y3aC0zdi03aC03eiIgZmlsbD0iI2ZmZiIvPjwvZz48L3N2Zz4="); 1211 | background-size: 18px; 1212 | } 1213 | /** 1214 | * 1. All IE versions add extra space at the bottom without this. 1215 | */ 1216 | .w-lightbox-strip { 1217 | position: absolute; 1218 | bottom: 0; 1219 | left: 0; 1220 | right: 0; 1221 | padding: 0 1vh; 1222 | line-height: 0; 1223 | /* 1 */ 1224 | white-space: nowrap; 1225 | overflow-x: auto; 1226 | overflow-y: hidden; 1227 | } 1228 | /* 1229 | * 1. We use content-box to avoid having to do `width: calc(10vh + 2vw)` 1230 | * which doesn’t work in Safari anyway. 1231 | * 2. Chrome renders images pixelated when switching to GPU. Making sure 1232 | * the parent is also rendered on the GPU (by setting translate3d for 1233 | * example) fixes this behavior. 1234 | */ 1235 | .w-lightbox-item { 1236 | display: inline-block; 1237 | width: 10vh; 1238 | padding: 2vh 1vh; 1239 | box-sizing: content-box; 1240 | /* 1 */ 1241 | cursor: pointer; 1242 | -webkit-transform: translate3d(0, 0, 0); 1243 | /* 2 */ 1244 | } 1245 | .w-lightbox-active { 1246 | opacity: .3; 1247 | } 1248 | .w-lightbox-thumbnail { 1249 | position: relative; 1250 | height: 10vh; 1251 | background: #222; 1252 | overflow: hidden; 1253 | } 1254 | .w-lightbox-thumbnail-image { 1255 | position: absolute; 1256 | top: 0; 1257 | left: 0; 1258 | } 1259 | .w-lightbox-thumbnail .w-lightbox-tall { 1260 | top: 50%; 1261 | width: 100%; 1262 | -webkit-transform: translate(0, -50%); 1263 | -ms-transform: translate(0, -50%); 1264 | transform: translate(0, -50%); 1265 | } 1266 | .w-lightbox-thumbnail .w-lightbox-wide { 1267 | left: 50%; 1268 | height: 100%; 1269 | -webkit-transform: translate(-50%, 0); 1270 | -ms-transform: translate(-50%, 0); 1271 | transform: translate(-50%, 0); 1272 | } 1273 | /* 1274 | * Spinner 1275 | * 1276 | * Absolute pixel values are used to avoid rounding errors that would cause 1277 | * the white spinning element to be misaligned with the track. 1278 | */ 1279 | .w-lightbox-spinner { 1280 | position: absolute; 1281 | top: 50%; 1282 | left: 50%; 1283 | box-sizing: border-box; 1284 | width: 40px; 1285 | height: 40px; 1286 | margin-top: -20px; 1287 | margin-left: -20px; 1288 | border: 5px solid rgba(0, 0, 0, 0.4); 1289 | border-radius: 50%; 1290 | -webkit-animation: spin .8s infinite linear; 1291 | animation: spin .8s infinite linear; 1292 | } 1293 | .w-lightbox-spinner:after { 1294 | content: ""; 1295 | position: absolute; 1296 | top: -4px; 1297 | right: -4px; 1298 | bottom: -4px; 1299 | left: -4px; 1300 | border: 3px solid transparent; 1301 | border-bottom-color: #fff; 1302 | border-radius: 50%; 1303 | } 1304 | /* 1305 | * Utility classes 1306 | */ 1307 | .w-lightbox-hide { 1308 | display: none; 1309 | } 1310 | .w-lightbox-noscroll { 1311 | overflow: hidden; 1312 | } 1313 | @media (min-width: 768px) { 1314 | .w-lightbox-content { 1315 | height: 96vh; 1316 | margin-top: 2vh; 1317 | } 1318 | .w-lightbox-view, 1319 | .w-lightbox-view:before { 1320 | height: 96vh; 1321 | } 1322 | /* .w-lightbox-content */ 1323 | .w-lightbox-group, 1324 | .w-lightbox-group .w-lightbox-view, 1325 | .w-lightbox-group .w-lightbox-view:before { 1326 | height: 84vh; 1327 | } 1328 | .w-lightbox-image { 1329 | max-width: 96vw; 1330 | max-height: 96vh; 1331 | } 1332 | .w-lightbox-group .w-lightbox-image { 1333 | max-width: 82.3vw; 1334 | max-height: 84vh; 1335 | } 1336 | .w-lightbox-left, 1337 | .w-lightbox-right { 1338 | display: block; 1339 | opacity: .5; 1340 | } 1341 | .w-lightbox-close { 1342 | opacity: .8; 1343 | } 1344 | .w-lightbox-control:hover { 1345 | opacity: 1; 1346 | } 1347 | } 1348 | .w-lightbox-inactive, 1349 | .w-lightbox-inactive:hover { 1350 | opacity: 0; 1351 | } 1352 | .w-richtext:before, 1353 | .w-richtext:after { 1354 | content: " "; 1355 | display: table; 1356 | } 1357 | .w-richtext:after { 1358 | clear: both; 1359 | } 1360 | .w-richtext[contenteditable="true"]:before, 1361 | .w-richtext[contenteditable="true"]:after { 1362 | white-space: initial; 1363 | } 1364 | .w-richtext ol, 1365 | .w-richtext ul { 1366 | overflow: hidden; 1367 | } 1368 | .w-richtext .w-richtext-figure-selected.w-richtext-figure-type-video div:before, 1369 | .w-richtext .w-richtext-figure-selected[data-rt-type="video"] div:before { 1370 | outline: 2px solid #2895f7; 1371 | } 1372 | .w-richtext .w-richtext-figure-selected.w-richtext-figure-type-image div, 1373 | .w-richtext .w-richtext-figure-selected[data-rt-type="image"] div { 1374 | outline: 2px solid #2895f7; 1375 | } 1376 | .w-richtext figure.w-richtext-figure-type-video > div:before, 1377 | .w-richtext figure[data-rt-type="video"] > div:before { 1378 | content: ''; 1379 | position: absolute; 1380 | display: none; 1381 | left: 0; 1382 | top: 0; 1383 | right: 0; 1384 | bottom: 0; 1385 | z-index: 1; 1386 | } 1387 | .w-richtext figure { 1388 | position: relative; 1389 | max-width: 60%; 1390 | } 1391 | .w-richtext figure > div:before { 1392 | cursor: default!important; 1393 | } 1394 | .w-richtext figure img { 1395 | width: 100%; 1396 | } 1397 | .w-richtext figure figcaption.w-richtext-figcaption-placeholder { 1398 | opacity: 0.6; 1399 | } 1400 | .w-richtext figure div { 1401 | /* fix incorrectly sized selection border in the data manager */ 1402 | font-size: 0px; 1403 | color: transparent; 1404 | } 1405 | .w-richtext figure.w-richtext-figure-type-image, 1406 | .w-richtext figure[data-rt-type="image"] { 1407 | display: table; 1408 | } 1409 | .w-richtext figure.w-richtext-figure-type-image > div, 1410 | .w-richtext figure[data-rt-type="image"] > div { 1411 | display: inline-block; 1412 | } 1413 | .w-richtext figure.w-richtext-figure-type-image > figcaption, 1414 | .w-richtext figure[data-rt-type="image"] > figcaption { 1415 | display: table-caption; 1416 | caption-side: bottom; 1417 | } 1418 | .w-richtext figure.w-richtext-figure-type-video, 1419 | .w-richtext figure[data-rt-type="video"] { 1420 | width: 60%; 1421 | height: 0; 1422 | } 1423 | .w-richtext figure.w-richtext-figure-type-video iframe, 1424 | .w-richtext figure[data-rt-type="video"] iframe { 1425 | position: absolute; 1426 | top: 0; 1427 | left: 0; 1428 | width: 100%; 1429 | height: 100%; 1430 | } 1431 | .w-richtext figure.w-richtext-figure-type-video > div, 1432 | .w-richtext figure[data-rt-type="video"] > div { 1433 | width: 100%; 1434 | } 1435 | .w-richtext figure.w-richtext-align-center { 1436 | margin-right: auto; 1437 | margin-left: auto; 1438 | clear: both; 1439 | } 1440 | .w-richtext figure.w-richtext-align-center.w-richtext-figure-type-image > div, 1441 | .w-richtext figure.w-richtext-align-center[data-rt-type="image"] > div { 1442 | max-width: 100%; 1443 | } 1444 | .w-richtext figure.w-richtext-align-normal { 1445 | clear: both; 1446 | } 1447 | .w-richtext figure.w-richtext-align-fullwidth { 1448 | width: 100%; 1449 | max-width: 100%; 1450 | text-align: center; 1451 | clear: both; 1452 | display: block; 1453 | margin-right: auto; 1454 | margin-left: auto; 1455 | } 1456 | .w-richtext figure.w-richtext-align-fullwidth > div { 1457 | display: inline-block; 1458 | /* padding-bottom is used for aspect ratios in video figures 1459 | we want the div to inherit that so hover/selection borders in the designer-canvas 1460 | fit right*/ 1461 | padding-bottom: inherit; 1462 | } 1463 | .w-richtext figure.w-richtext-align-fullwidth > figcaption { 1464 | display: block; 1465 | } 1466 | .w-richtext figure.w-richtext-align-floatleft { 1467 | float: left; 1468 | margin-right: 15px; 1469 | clear: none; 1470 | } 1471 | .w-richtext figure.w-richtext-align-floatright { 1472 | float: right; 1473 | margin-left: 15px; 1474 | clear: none; 1475 | } 1476 | .w-nav { 1477 | position: relative; 1478 | background: #dddddd; 1479 | z-index: 1000; 1480 | } 1481 | .w-nav:before, 1482 | .w-nav:after { 1483 | content: " "; 1484 | display: table; 1485 | } 1486 | .w-nav:after { 1487 | clear: both; 1488 | } 1489 | .w-nav-brand { 1490 | position: relative; 1491 | float: left; 1492 | text-decoration: none; 1493 | color: #333333; 1494 | } 1495 | .w-nav-link { 1496 | position: relative; 1497 | display: inline-block; 1498 | vertical-align: top; 1499 | text-decoration: none; 1500 | color: #222222; 1501 | padding: 20px; 1502 | text-align: left; 1503 | margin-left: auto; 1504 | margin-right: auto; 1505 | } 1506 | .w-nav-link.w--current { 1507 | color: #0082f3; 1508 | } 1509 | .w-nav-menu { 1510 | position: relative; 1511 | float: right; 1512 | } 1513 | .w--nav-menu-open { 1514 | display: block !important; 1515 | position: absolute; 1516 | top: 100%; 1517 | left: 0; 1518 | right: 0; 1519 | background: #C8C8C8; 1520 | text-align: center; 1521 | overflow: visible; 1522 | min-width: 200px; 1523 | } 1524 | .w--nav-link-open { 1525 | display: block; 1526 | position: relative; 1527 | } 1528 | .w-nav-overlay { 1529 | position: absolute; 1530 | overflow: hidden; 1531 | display: none; 1532 | top: 100%; 1533 | left: 0; 1534 | right: 0; 1535 | width: 100%; 1536 | } 1537 | .w-nav-overlay .w--nav-menu-open { 1538 | top: 0; 1539 | } 1540 | .w-nav[data-animation="over-left"] .w-nav-overlay { 1541 | width: auto; 1542 | } 1543 | .w-nav[data-animation="over-left"] .w-nav-overlay, 1544 | .w-nav[data-animation="over-left"] .w--nav-menu-open { 1545 | right: auto; 1546 | z-index: 1; 1547 | top: 0; 1548 | } 1549 | .w-nav[data-animation="over-right"] .w-nav-overlay { 1550 | width: auto; 1551 | } 1552 | .w-nav[data-animation="over-right"] .w-nav-overlay, 1553 | .w-nav[data-animation="over-right"] .w--nav-menu-open { 1554 | left: auto; 1555 | z-index: 1; 1556 | top: 0; 1557 | } 1558 | .w-nav-button { 1559 | position: relative; 1560 | float: right; 1561 | padding: 18px; 1562 | font-size: 24px; 1563 | display: none; 1564 | cursor: pointer; 1565 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 1566 | tap-highlight-color: rgba(0, 0, 0, 0); 1567 | -webkit-user-select: none; 1568 | -moz-user-select: none; 1569 | -ms-user-select: none; 1570 | user-select: none; 1571 | } 1572 | .w-nav-button.w--open { 1573 | background-color: #C8C8C8; 1574 | color: white; 1575 | } 1576 | .w-nav[data-collapse="all"] .w-nav-menu { 1577 | display: none; 1578 | } 1579 | .w-nav[data-collapse="all"] .w-nav-button { 1580 | display: block; 1581 | } 1582 | @media screen and (max-width: 991px) { 1583 | .w-nav[data-collapse="medium"] .w-nav-menu { 1584 | display: none; 1585 | } 1586 | .w-nav[data-collapse="medium"] .w-nav-button { 1587 | display: block; 1588 | } 1589 | } 1590 | @media screen and (max-width: 767px) { 1591 | .w-nav[data-collapse="small"] .w-nav-menu { 1592 | display: none; 1593 | } 1594 | .w-nav[data-collapse="small"] .w-nav-button { 1595 | display: block; 1596 | } 1597 | .w-nav-brand { 1598 | padding-left: 10px; 1599 | } 1600 | } 1601 | @media screen and (max-width: 479px) { 1602 | .w-nav[data-collapse="tiny"] .w-nav-menu { 1603 | display: none; 1604 | } 1605 | .w-nav[data-collapse="tiny"] .w-nav-button { 1606 | display: block; 1607 | } 1608 | } 1609 | .w-tabs { 1610 | position: relative; 1611 | } 1612 | .w-tabs:before, 1613 | .w-tabs:after { 1614 | content: " "; 1615 | display: table; 1616 | } 1617 | .w-tabs:after { 1618 | clear: both; 1619 | } 1620 | .w-tab-menu { 1621 | position: relative; 1622 | } 1623 | .w-tab-link { 1624 | position: relative; 1625 | display: inline-block; 1626 | vertical-align: top; 1627 | text-decoration: none; 1628 | padding: 9px 30px; 1629 | text-align: left; 1630 | cursor: pointer; 1631 | color: #222222; 1632 | background-color: #dddddd; 1633 | } 1634 | .w-tab-link.w--current { 1635 | background-color: #C8C8C8; 1636 | } 1637 | .w-tab-content { 1638 | position: relative; 1639 | display: block; 1640 | overflow: hidden; 1641 | } 1642 | .w-tab-pane { 1643 | position: relative; 1644 | display: none; 1645 | } 1646 | .w--tab-active { 1647 | display: block; 1648 | } 1649 | @media screen and (max-width: 479px) { 1650 | .w-tab-link { 1651 | display: block; 1652 | } 1653 | } 1654 | .w-ix-emptyfix:after { 1655 | content: ""; 1656 | } 1657 | @keyframes spin { 1658 | 0% { 1659 | transform: rotate(0deg); 1660 | } 1661 | 100% { 1662 | transform: rotate(360deg); 1663 | } 1664 | } 1665 | .w-dyn-empty { 1666 | padding: 10px; 1667 | background-color: #dddddd; 1668 | } 1669 | .w-dyn-bind-empty { 1670 | display: none !important; 1671 | } 1672 | .w-condition-invisible { 1673 | display: none !important; 1674 | } 1675 | -------------------------------------------------------------------------------- /src/components/Footer/Footer.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 29 | 30 | 33 | -------------------------------------------------------------------------------- /src/components/Main/Content/APAC/AllApac.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 41 | 42 | -------------------------------------------------------------------------------- /src/components/Main/Content/APAC/Content/China.vue: -------------------------------------------------------------------------------- 1 | 67 | 68 | 73 | 74 | 75 | 124 | -------------------------------------------------------------------------------- /src/components/Main/Content/APAC/Content/HongKong.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/APAC/Content/India.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/APAC/Content/Japan.vue: -------------------------------------------------------------------------------- 1 | 91 | 92 | 97 | 98 | 99 | 148 | -------------------------------------------------------------------------------- /src/components/Main/Content/APAC/Content/SouthKorea.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/APAC/Content/SriLanka.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/AllContent.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 33 | 34 | -------------------------------------------------------------------------------- /src/components/Main/Content/Americas/AllAmericas.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 41 | 42 | -------------------------------------------------------------------------------- /src/components/Main/Content/Americas/Content/Argentina.vue: -------------------------------------------------------------------------------- 1 | 91 | 92 | 97 | 98 | 99 | 148 | -------------------------------------------------------------------------------- /src/components/Main/Content/Americas/Content/Brazil.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/Americas/Content/Canada.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/Americas/Content/Mexico.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/Americas/Content/Peru.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/Americas/Content/USA.vue: -------------------------------------------------------------------------------- 1 | 187 | 188 | 193 | 194 | 195 | 244 | -------------------------------------------------------------------------------- /src/components/Main/Content/EMEA/AllEmea.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 41 | 42 | -------------------------------------------------------------------------------- /src/components/Main/Content/EMEA/Content/Denmark.vue: -------------------------------------------------------------------------------- 1 | 67 | 68 | 73 | 74 | 75 | 124 | -------------------------------------------------------------------------------- /src/components/Main/Content/EMEA/Content/Europe.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/EMEA/Content/France.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/EMEA/Content/Germany.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/EMEA/Content/Poland.vue: -------------------------------------------------------------------------------- 1 | 55 | 56 | 61 | 62 | 63 | 112 | -------------------------------------------------------------------------------- /src/components/Main/Content/EMEA/Content/UK.vue: -------------------------------------------------------------------------------- 1 | 91 | 92 | 97 | 98 | 99 | 148 | -------------------------------------------------------------------------------- /src/components/Main/Content/Futures/AllFutures.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 31 | 32 | -------------------------------------------------------------------------------- /src/components/Main/Content/Futures/Content/Americas/Table.vue: -------------------------------------------------------------------------------- 1 | 78 | 79 | 84 | 85 | 86 | 131 | -------------------------------------------------------------------------------- /src/components/Main/Content/Futures/Content/Asia/Table.vue: -------------------------------------------------------------------------------- 1 | 78 | 79 | 84 | 85 | 86 | 131 | -------------------------------------------------------------------------------- /src/components/Main/Content/Futures/Content/Europe/Table.vue: -------------------------------------------------------------------------------- 1 | 78 | 79 | 84 | 85 | 86 | 131 | -------------------------------------------------------------------------------- /src/components/Main/Content/Notification.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 21 | 22 | 41 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/AllOverall.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 28 | 29 | 30 | 33 | 34 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AmericaContent/Graph/GraphContent.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 33 | 34 | 44 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AmericaContent/Graph/GraphContentData.js: -------------------------------------------------------------------------------- 1 | export const planetChartData = { 2 | type: 'line', 3 | data: { 4 | labels: ['11a', '12p', '1p', '2p', '3p', '4p', '5p'], 5 | datasets: [ 6 | { // first line graph 7 | label: 'INDU:IND', 8 | data: [0.74, 0.62, 0.58, 0.43, 0.31, 0.34, 0.51, 0.47], 9 | fill: false, 10 | backgroundColor: [ 11 | '#fb8b1e', // Orange 12 | ], 13 | borderColor: [ 14 | '#fb8b1e', 15 | ], 16 | borderWidth: 3 17 | }, 18 | { // another line graph 19 | label: 'SPX:IND', 20 | data: [0.78, 0.64, 0.61, 0.28, 0.37, 0.42, 0.27, 0.38], 21 | fill: false, 22 | backgroundColor: [ 23 | '#5e80e5' // Blue 24 | ], 25 | borderColor: [ 26 | '#5e80e5', 27 | ], 28 | borderWidth: 3 29 | }, 30 | { // another line graph 31 | label: 'CCMP:IND', 32 | data: [0.64, 0.52, 0.52, 0.48, 0.35, 0.54, 0.50, 0.49], 33 | fill: false, 34 | backgroundColor: [ 35 | '#ee5c78', // Red 36 | ], 37 | borderColor: [ 38 | '#ee5c78', 39 | ], 40 | borderWidth: 3 41 | } 42 | ] 43 | }, 44 | options: { 45 | responsive: true, 46 | lineTension: 1, 47 | scales: { 48 | yAxes: [{ 49 | ticks: { 50 | beginAtZero: true, 51 | padding: 25, 52 | } 53 | }] 54 | } 55 | } 56 | } 57 | 58 | export default planetChartData; -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AmericaContent/GraphFilter.vue: -------------------------------------------------------------------------------- 1 | 56 | 57 | 86 | 87 | 124 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AmericaContent/SectionContent.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 34 | 35 | 36 | 46 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AmericaContent/Table.vue: -------------------------------------------------------------------------------- 1 | 75 | 76 | 81 | 82 | 83 | 128 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AsiaContent/Graph/GraphContent.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 33 | 34 | 44 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AsiaContent/Graph/GraphContentData.js: -------------------------------------------------------------------------------- 1 | export const planetChartData = { 2 | type: 'line', 3 | data: { 4 | labels: ['11a', '12p', '1p', '2p', '3p', '4p', '5p'], 5 | datasets: [ 6 | { // first line graph 7 | label: 'INDU:IND', 8 | data: [0.74, 0.62, 0.58, 0.43, 0.31, 0.34, 0.51, 0.47], 9 | fill: false, 10 | backgroundColor: [ 11 | '#fb8b1e', // Orange 12 | ], 13 | borderColor: [ 14 | '#fb8b1e', 15 | ], 16 | borderWidth: 3 17 | }, 18 | { // another line graph 19 | label: 'SPX:IND', 20 | data: [0.78, 0.64, 0.61, 0.28, 0.37, 0.42, 0.27, 0.38], 21 | fill: false, 22 | backgroundColor: [ 23 | '#5e80e5' // Blue 24 | ], 25 | borderColor: [ 26 | '#5e80e5', 27 | ], 28 | borderWidth: 3 29 | }, 30 | { // another line graph 31 | label: 'CCMP:IND', 32 | data: [0.64, 0.52, 0.52, 0.48, 0.35, 0.54, 0.50, 0.49], 33 | fill: false, 34 | backgroundColor: [ 35 | '#ee5c78', // Red 36 | ], 37 | borderColor: [ 38 | '#ee5c78', 39 | ], 40 | borderWidth: 3 41 | } 42 | ] 43 | }, 44 | options: { 45 | responsive: true, 46 | lineTension: 1, 47 | scales: { 48 | yAxes: [{ 49 | ticks: { 50 | beginAtZero: true, 51 | padding: 25, 52 | } 53 | }] 54 | } 55 | } 56 | } 57 | 58 | export default planetChartData; -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AsiaContent/GraphFilter.vue: -------------------------------------------------------------------------------- 1 | 36 | 37 | 49 | 50 | 87 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AsiaContent/SectionContent.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 34 | 35 | 36 | 46 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/AsiaContent/Table.vue: -------------------------------------------------------------------------------- 1 | 75 | 76 | 81 | 82 | 83 | 128 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/EuropeContent/Graph/GraphContent.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 33 | 34 | 44 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/EuropeContent/Graph/GraphContentData.js: -------------------------------------------------------------------------------- 1 | export const planetChartData = { 2 | type: 'line', 3 | data: { 4 | labels: ['11a', '12p', '1p', '2p', '3p', '4p', '5p'], 5 | datasets: [ 6 | { // first line graph 7 | label: 'INDU:IND', 8 | data: [0.74, 0.62, 0.58, 0.43, 0.31, 0.34, 0.51, 0.47], 9 | fill: false, 10 | backgroundColor: [ 11 | '#fb8b1e', // Orange 12 | ], 13 | borderColor: [ 14 | '#fb8b1e', 15 | ], 16 | borderWidth: 3 17 | }, 18 | { // another line graph 19 | label: 'SPX:IND', 20 | data: [0.78, 0.64, 0.61, 0.28, 0.37, 0.42, 0.27, 0.38], 21 | fill: false, 22 | backgroundColor: [ 23 | '#5e80e5' // Blue 24 | ], 25 | borderColor: [ 26 | '#5e80e5', 27 | ], 28 | borderWidth: 3 29 | }, 30 | { // another line graph 31 | label: 'CCMP:IND', 32 | data: [0.64, 0.52, 0.52, 0.48, 0.35, 0.54, 0.50, 0.49], 33 | fill: false, 34 | backgroundColor: [ 35 | '#ee5c78', // Red 36 | ], 37 | borderColor: [ 38 | '#ee5c78', 39 | ], 40 | borderWidth: 3 41 | } 42 | ] 43 | }, 44 | options: { 45 | responsive: true, 46 | lineTension: 1, 47 | scales: { 48 | yAxes: [{ 49 | ticks: { 50 | beginAtZero: true, 51 | padding: 25, 52 | } 53 | }] 54 | } 55 | } 56 | } 57 | 58 | export default planetChartData; -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/EuropeContent/GraphFilter.vue: -------------------------------------------------------------------------------- 1 | 36 | 37 | 49 | 50 | 87 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/EuropeContent/SectionContent.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 34 | 35 | 36 | 46 | -------------------------------------------------------------------------------- /src/components/Main/Content/Overview/Content/EuropeContent/Table.vue: -------------------------------------------------------------------------------- 1 | 75 | 76 | 81 | 82 | 83 | 128 | -------------------------------------------------------------------------------- /src/components/Main/Content/SectionTabs.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 26 | 27 | 43 | -------------------------------------------------------------------------------- /src/components/Main/Main.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 23 | 24 | -------------------------------------------------------------------------------- /src/components/Main/SideBar/SectionLeft/LatestList.vue: -------------------------------------------------------------------------------- 1 | 49 | 50 | 61 | 62 | 82 | -------------------------------------------------------------------------------- /src/components/Main/SideBar/SectionLeft/SearchBox.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 29 | 30 | 31 | 47 | -------------------------------------------------------------------------------- /src/components/Main/SideBar/SectionLeft/SectionOne.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 27 | 28 | 29 | 45 | 46 | -------------------------------------------------------------------------------- /src/components/Main/SideBar/SideBar.vue: -------------------------------------------------------------------------------- 1 | 5 | 6 | 17 | 18 | -------------------------------------------------------------------------------- /src/components/Navbar/MainNav.vue: -------------------------------------------------------------------------------- 1 | 41 | 42 | 52 | 53 | 109 | 110 | 111 | -------------------------------------------------------------------------------- /src/components/Navbar/TopNav.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 23 | 24 | 25 | 39 | -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import VueRouter from 'vue-router' 3 | import App from './App.vue' 4 | 5 | import {routes} from './routes.js' 6 | 7 | Vue.config.productionTip = false 8 | 9 | Vue.use(VueRouter); 10 | 11 | const router = new VueRouter ({ 12 | mode: 'history', 13 | routes: routes 14 | }); 15 | 16 | new Vue({ 17 | router: router, 18 | render: h => h(App) 19 | }).$mount('#app') 20 | -------------------------------------------------------------------------------- /src/routes.js: -------------------------------------------------------------------------------- 1 | // Set up our routes 2 | 3 | import Overall from './components/Main/Content/Overview/AllOverall.vue' 4 | import Futures from './components/Main/Content/Futures/AllFutures.vue' 5 | import Americas from './components/Main/Content/Americas/AllAmericas.vue' 6 | import EMEA from './components/Main/Content/EMEA/AllEmea.vue' 7 | import APAC from './components/Main/Content/APAC/AllApac.vue' 8 | 9 | export const routes = [ 10 | { 11 | path: '/', 12 | component: Overall 13 | }, 14 | { 15 | path: '/stocks', 16 | component: Overall 17 | }, 18 | { 19 | path: '/futures', 20 | component: Futures 21 | }, 22 | { 23 | path: '/world-indexes/americas', 24 | component: Americas 25 | }, 26 | { 27 | path: '/world-indexes/europe-africa-middle-east', 28 | component: EMEA 29 | }, 30 | { 31 | path:'/world-indexes/asia-pacific', 32 | component: APAC 33 | } 34 | ] --------------------------------------------------------------------------------