├── .browserslistrc ├── .editorconfig ├── .eslintrc.js ├── .gitignore ├── README.md ├── babel.config.js ├── package-lock.json ├── package.json ├── public ├── favicon.ico └── index.html ├── src ├── App.vue ├── assets │ ├── fonts │ │ ├── Arial.woff │ │ ├── Helvetica-Bold.ttf │ │ ├── Helvetica-BoldOblique.ttf │ │ ├── Helvetica-Oblique.ttf │ │ ├── Helvetica.ttf │ │ ├── helvetica-compressed-5871d14b6903a.otf │ │ ├── helvetica-light-587ebe5a59211.ttf │ │ └── helvetica-rounded-bold-5871d05ead8de.otf │ ├── images │ │ ├── arrow-right.svg │ │ ├── bg-alert.svg │ │ ├── community.png │ │ ├── connections.png │ │ ├── gamification.png │ │ └── hero.png │ └── scss │ │ ├── MediaQueries │ │ ├── media1168px.scss │ │ ├── media480px.scss │ │ └── media870px.scss │ │ ├── custom.scss │ │ ├── fonts.scss │ │ ├── scrollBar.scss │ │ ├── style.scss │ │ └── variables.scss ├── components │ ├── Companies │ │ ├── Globo.vue │ │ ├── Neon.vue │ │ ├── VanHack.vue │ │ ├── Zenvia.vue │ │ └── Zup.vue │ ├── Footer │ │ └── Footer.vue │ ├── Navigation │ │ ├── Logo.vue │ │ └── Navbar.vue │ ├── SVG │ │ ├── Alert.vue │ │ └── ToTop.vue │ ├── Sections │ │ ├── Account.vue │ │ ├── Achievements.vue │ │ ├── BetterDevs.vue │ │ ├── Connections.vue │ │ ├── Hero.vue │ │ ├── Journey.vue │ │ ├── Spoiler.vue │ │ └── Trust.vue │ └── Social │ │ ├── Facebook.vue │ │ ├── Instagram.vue │ │ ├── Twitter.vue │ │ └── YouTube.vue ├── main.js ├── router │ └── index.js ├── store │ └── index.js └── views │ ├── About.vue │ └── Home.vue ├── vue.config.js └── webpack.config.js /.browserslistrc: -------------------------------------------------------------------------------- 1 | > 1% 2 | last 2 versions 3 | not dead 4 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | [*.{js,jsx,ts,tsx,vue}] 2 | indent_style = space 3 | indent_size = 2 4 | end_of_line = lf 5 | trim_trailing_whitespace = true 6 | insert_final_newline = true 7 | max_line_length = 100 8 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | env: { 4 | node: true, 5 | }, 6 | extends: [ 7 | 'plugin:vue/essential', 8 | '@vue/airbnb', 9 | ], 10 | parserOptions: { 11 | parser: 'babel-eslint', 12 | }, 13 | rules: { 14 | 'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off', 15 | 'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off', 16 | }, 17 | }; 18 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /dist 4 | 5 | 6 | # local env files 7 | .env.local 8 | .env.*.local 9 | 10 | # Log files 11 | npm-debug.log* 12 | yarn-debug.log* 13 | yarn-error.log* 14 | pnpm-debug.log* 15 | 16 | # Editor directories and files 17 | .idea 18 | .vscode 19 | *.suo 20 | *.ntvs* 21 | *.njsproj 22 | *.sln 23 | *.sw? 24 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # rocketseat 2 | 3 | ## Project setup 4 | ``` 5 | npm install 6 | ``` 7 | 8 | ### Compiles and hot-reloads for development 9 | ``` 10 | npm run serve 11 | ``` 12 | 13 | ### Compiles and minifies for production 14 | ``` 15 | npm run build 16 | ``` 17 | 18 | ### Lints and fixes files 19 | ``` 20 | npm run lint 21 | ``` 22 | 23 | ### Customize configuration 24 | See [Configuration Reference](https://cli.vuejs.org/config/). 25 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | '@vue/cli-plugin-babel/preset', 4 | ], 5 | }; 6 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "rocketseat", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "serve": "vue-cli-service serve", 7 | "build": "vue-cli-service build", 8 | "lint": "vue-cli-service lint" 9 | }, 10 | "dependencies": { 11 | "aos": "^2.3.4", 12 | "bootstrap": "^4.6.0", 13 | "bootstrap-vue": "^2.21.2", 14 | "core-js": "^3.6.5", 15 | "vue": "^2.6.12", 16 | "vue-router": "^3.2.0", 17 | "vuex": "^3.4.0" 18 | }, 19 | "devDependencies": { 20 | "@vue/cli-plugin-babel": "~4.5.0", 21 | "@vue/cli-plugin-eslint": "~4.5.0", 22 | "@vue/cli-plugin-router": "~4.5.0", 23 | "@vue/cli-plugin-vuex": "~4.5.0", 24 | "@vue/cli-service": "~4.5.0", 25 | "@vue/eslint-config-airbnb": "^5.0.2", 26 | "babel-eslint": "^10.1.0", 27 | "eslint": "^6.7.2", 28 | "eslint-plugin-import": "^2.20.2", 29 | "eslint-plugin-vue": "^6.2.2", 30 | "node-sass": "^4.12.0", 31 | "sass-loader": "^8.0.2", 32 | "vue-loader": "^15.9.6", 33 | "vue-template-compiler": "^2.6.12" 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/public/favicon.ico -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | <%= htmlWebpackPlugin.options.title %> 9 | 10 | 11 | 14 |
15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | 16 | -------------------------------------------------------------------------------- /src/assets/fonts/Arial.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/fonts/Arial.woff -------------------------------------------------------------------------------- /src/assets/fonts/Helvetica-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/fonts/Helvetica-Bold.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Helvetica-BoldOblique.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/fonts/Helvetica-BoldOblique.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Helvetica-Oblique.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/fonts/Helvetica-Oblique.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Helvetica.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/fonts/Helvetica.ttf -------------------------------------------------------------------------------- /src/assets/fonts/helvetica-compressed-5871d14b6903a.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/fonts/helvetica-compressed-5871d14b6903a.otf -------------------------------------------------------------------------------- /src/assets/fonts/helvetica-light-587ebe5a59211.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/fonts/helvetica-light-587ebe5a59211.ttf -------------------------------------------------------------------------------- /src/assets/fonts/helvetica-rounded-bold-5871d05ead8de.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/fonts/helvetica-rounded-bold-5871d05ead8de.otf -------------------------------------------------------------------------------- /src/assets/images/arrow-right.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /src/assets/images/bg-alert.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 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | -------------------------------------------------------------------------------- /src/assets/images/community.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/images/community.png -------------------------------------------------------------------------------- /src/assets/images/connections.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/images/connections.png -------------------------------------------------------------------------------- /src/assets/images/gamification.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/images/gamification.png -------------------------------------------------------------------------------- /src/assets/images/hero.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Lucas98Fernando/rocketseat-clone-vue/fb10d1782f0726f0c1617a77dd23484cda50fa5f/src/assets/images/hero.png -------------------------------------------------------------------------------- /src/assets/scss/MediaQueries/media1168px.scss: -------------------------------------------------------------------------------- 1 | @media (max-width: 1168px) { 2 | #connections, #betterDevs { 3 | .description { 4 | margin-left: 40px !important; 5 | 6 | h2 { 7 | font-size: 40px !important; 8 | } 9 | } 10 | } 11 | 12 | #achievements { 13 | .description { 14 | h2 { 15 | font-size: 40px !important; 16 | } 17 | } 18 | } 19 | 20 | #journey { 21 | padding: 0 30px !important; 22 | 23 | .cards-grid { 24 | grid-template-columns: repeat(2,minmax(0,1fr)) !important; 25 | grid-auto-flow: row !important; 26 | } 27 | } 28 | 29 | #footer { 30 | .footer-content { 31 | padding: 0 26px !important; 32 | } 33 | } 34 | } -------------------------------------------------------------------------------- /src/assets/scss/MediaQueries/media480px.scss: -------------------------------------------------------------------------------- 1 | @media (max-width: 480px) { 2 | .navbar { 3 | .logo { 4 | max-width: 140px !important; 5 | } 6 | } 7 | 8 | #hero { 9 | padding: 5rem 1rem !important; 10 | 11 | .hero-content { 12 | -webkit-flex-direction: column; 13 | -ms-flex-direction: column; 14 | flex-direction: column; 15 | padding: 16px 0 48px 0; 16 | } 17 | 18 | h1 { 19 | font-size: 35px; 20 | line-height: 40px; 21 | max-width: 275px; 22 | } 23 | 24 | p { 25 | font-size: 15px; 26 | max-width: 260px; 27 | margin-bottom: 16px; 28 | } 29 | 30 | .btn__primary { 31 | max-width: 280px !important; 32 | font-size: 15px; 33 | height: 56px; 34 | } 35 | } 36 | 37 | #trust { 38 | margin: 5rem 0 !important; 39 | 40 | .companies { 41 | display: -webkit-box; 42 | display: -webkit-flex; 43 | display: -ms-flexbox; 44 | display: flex; 45 | -webkit-box-pack: center; 46 | -webkit-justify-content: center; 47 | -ms-flex-pack: center; 48 | justify-content: center; 49 | -webkit-align-items: center; 50 | -webkit-box-align: center; 51 | -ms-flex-align: center; 52 | align-items: center; 53 | -webkit-flex-wrap: wrap; 54 | -ms-flex-wrap: wrap; 55 | flex-wrap: wrap; 56 | grid-row-gap: 0; 57 | max-width: 100%; 58 | margin: 0 auto; 59 | padding-top: 40px; 60 | 61 | & div { 62 | height: 55px; 63 | width: calc((100% / 3)); 64 | } 65 | 66 | .icons-svg { 67 | max-width: 85px; 68 | } 69 | } 70 | } 71 | 72 | #connections, 73 | #achievements, 74 | #betterDevs { 75 | .content { 76 | flex-direction: column; 77 | align-items: flex-start; 78 | padding: 0 10px !important; 79 | 80 | .image { 81 | order: 2; 82 | margin-top: 64px; 83 | } 84 | 85 | .description { 86 | max-width: 287px; 87 | margin-left: 0 !important; 88 | 89 | h2 { 90 | font-size: 30px !important; 91 | line-height: 117%; 92 | padding: 24px 0 16px 0; 93 | } 94 | 95 | p { 96 | font-size: 15px !important; 97 | } 98 | } 99 | } 100 | } 101 | 102 | .outside { 103 | #spoiler { 104 | h2 { 105 | font-size: 30px; 106 | line-height: 35px; 107 | padding-top: 16px; 108 | } 109 | } 110 | } 111 | 112 | #journey { 113 | .journey-header { 114 | .journey-header-content { 115 | h2 { 116 | font-size: 30px; 117 | max-width: 250px; 118 | } 119 | 120 | p { 121 | font-size: 15px; 122 | margin-top: 16px; 123 | max-width: 310px; 124 | } 125 | } 126 | 127 | .cards-grid { 128 | grid-template-columns: repeat(1, minmax(0, 1fr)) !important; 129 | } 130 | } 131 | } 132 | 133 | .card-account { 134 | padding: 40px !important; 135 | max-width: calc(100% - 48px) !important; 136 | 137 | .card-account-header { 138 | h2 { 139 | max-width: 183px; 140 | margin-right: auto; 141 | font-size: 30px !important; 142 | line-height: 35px !important; 143 | } 144 | } 145 | 146 | .card-account-description { 147 | flex-direction: column; 148 | } 149 | } 150 | } -------------------------------------------------------------------------------- /src/assets/scss/MediaQueries/media870px.scss: -------------------------------------------------------------------------------- 1 | @media (max-width: 870px) { 2 | #footer { 3 | 4 | .logo { 5 | -webkit-align-self: flex-start; 6 | -ms-flex-item-align: start; 7 | align-self: flex-start; 8 | grid-area: 1 / 1; 9 | } 10 | 11 | .footer-content { 12 | grid-template-columns: repeat(2, 1fr); 13 | grid-column-gap: 0; 14 | padding: 0 40px !important; 15 | -webkit-align-items: center; 16 | -webkit-box-align: center; 17 | -ms-flex-align: center; 18 | align-items: center; 19 | 20 | .footer-links { 21 | grid-area: 2 / 1; 22 | -webkit-flex-direction: column; 23 | -ms-flex-direction: column; 24 | flex-direction: column; 25 | -webkit-align-items: flex-start; 26 | -webkit-box-align: flex-start; 27 | -ms-flex-align: flex-start; 28 | align-items: flex-start; 29 | margin: 0px; 30 | padding: 0px; 31 | 32 | li { 33 | margin-left: 0; 34 | } 35 | } 36 | 37 | .social-icons { 38 | width: auto; 39 | grid-template-columns: repeat(2, 40px); 40 | grid-auto-flow: row; 41 | grid-area: 1 / 2; 42 | justify-self: flex-end; 43 | } 44 | 45 | .help { 46 | grid-area: 1 / 1; 47 | font-size: 14px; 48 | justify-self: flex-start; 49 | -webkit-align-self: flex-end; 50 | -ms-flex-item-align: end; 51 | align-self: flex-end; 52 | } 53 | 54 | .boost { 55 | grid-area: 2 / 2; 56 | } 57 | } 58 | } 59 | } -------------------------------------------------------------------------------- /src/assets/scss/custom.scss: -------------------------------------------------------------------------------- 1 | @import './variables.scss'; 2 | @import './fonts.scss'; 3 | 4 | html, 5 | body { 6 | overflow-x: hidden; 7 | scroll-behavior: smooth; 8 | } 9 | 10 | h1, h2, h3 { 11 | font-family: 'HelveticaBold', sans-serif; 12 | } 13 | 14 | body { 15 | background: $black !important; 16 | font-family: "Arial", sans-serif !important; 17 | } 18 | 19 | #connections, 20 | #achievements, 21 | #betterDevs { 22 | overflow: hidden; 23 | 24 | .content { 25 | margin: 5rem auto; 26 | display: -webkit-box; 27 | display: -webkit-flex; 28 | display: -ms-flexbox; 29 | display: flex; 30 | -webkit-box-pack: justify; 31 | -webkit-justify-content: space-between; 32 | -ms-flex-pack: justify; 33 | justify-content: space-between; 34 | -webkit-align-items: center; 35 | -webkit-box-align: center; 36 | -ms-flex-align: center; 37 | align-items: center; 38 | 39 | .image { 40 | position: relative; 41 | width: 100%; 42 | height: 100%; 43 | max-width: 580px; 44 | 45 | &:before { 46 | content: ""; 47 | position: absolute; 48 | top: -64px; 49 | left: 0; 50 | width: 100%; 51 | height: 48px; 52 | background: url("../../assets/images/arrow-right.svg") center no-repeat; 53 | } 54 | 55 | &:after { 56 | content: ""; 57 | position: absolute; 58 | bottom: -64px; 59 | left: 0; 60 | width: 100%; 61 | height: 48px; 62 | transform: rotate(180deg); 63 | background: url("../../assets/images/arrow-right.svg") center no-repeat; 64 | } 65 | } 66 | 67 | .profile-image, 68 | .gamification-image 69 | .devs-image { 70 | display: block; 71 | overflow: hidden; 72 | position: relative; 73 | box-sizing: border-box; 74 | margin: 0; 75 | } 76 | 77 | .description { 78 | position: relative; 79 | width: 100%; 80 | height: 100%; 81 | max-width: 460px; 82 | 83 | &.devs { 84 | max-width: 560px !important; 85 | } 86 | 87 | .divider { 88 | background-color: $green; 89 | width: 40px; 90 | height: 2px; 91 | } 92 | 93 | h2 { 94 | font-size: 54px; 95 | line-height: 107%; 96 | color: $white; 97 | font-weight: 700; 98 | padding: 40px 0 24px 0; 99 | width: 100%; 100 | } 101 | 102 | p { 103 | font-size: 18px; 104 | line-height: 167%; 105 | color: $gray; 106 | } 107 | } 108 | } 109 | } -------------------------------------------------------------------------------- /src/assets/scss/fonts.scss: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "Arial"; 3 | src: url("../../assets/fonts/Arial.woff") format("woff"), 4 | url("../../assets/fonts/Arial.woff") format("woff"); 5 | } 6 | 7 | @font-face { 8 | font-family: "HelveticaBold"; 9 | src: url("../../assets/fonts/Helvetica-Bold.ttf") format("woff"), 10 | url("../../assets/fonts/Helvetica-Bold.ttf") format("woff"); 11 | } -------------------------------------------------------------------------------- /src/assets/scss/scrollBar.scss: -------------------------------------------------------------------------------- 1 | @import './variables.scss'; 2 | 3 | /* width */ 4 | ::-webkit-scrollbar { 5 | width: 14px; 6 | } 7 | 8 | /* Track */ 9 | ::-webkit-scrollbar-track { 10 | box-shadow: inset 0 0 5px grey; 11 | border-radius: 2px; 12 | } 13 | 14 | /* Handle */ 15 | ::-webkit-scrollbar-thumb { 16 | background: $primary; 17 | border-radius: 2px; 18 | } 19 | 20 | /* Handle on hover */ 21 | ::-webkit-scrollbar-thumb:hover { 22 | background: #330066; 23 | } -------------------------------------------------------------------------------- /src/assets/scss/style.scss: -------------------------------------------------------------------------------- 1 | @import './variables.scss'; 2 | @import './custom.scss'; 3 | @import './scrollBar.scss'; 4 | 5 | // Media Queries for responsive 6 | @import './MediaQueries/media1168px.scss'; 7 | @import './MediaQueries/media870px.scss'; 8 | @import './MediaQueries/media480px.scss'; 9 | 10 | // Then import Bootstrap an BootstrapVue SCSS files (order is important) 11 | @import 'node_modules/bootstrap/scss/bootstrap.scss'; 12 | @import 'node_modules/bootstrap-vue/src/index.scss'; -------------------------------------------------------------------------------- /src/assets/scss/variables.scss: -------------------------------------------------------------------------------- 1 | $primary: #9466ff; 2 | $black: #121214; 3 | $white: #E1E1E6; 4 | $gray: #a8a8b3; 5 | $green: #04d361; 6 | $orange: #fd951f; 7 | 8 | $theme-colors: ( 9 | "primary": $primary, 10 | "black": $black, 11 | "white": $white, 12 | "gray": $gray, 13 | "green": $green, 14 | "orange": $orange 15 | ); -------------------------------------------------------------------------------- /src/components/Companies/Globo.vue: -------------------------------------------------------------------------------- 1 | 2 | 18 | 19 | 24 | -------------------------------------------------------------------------------- /src/components/Companies/Neon.vue: -------------------------------------------------------------------------------- 1 | 2 | 20 | 21 | 26 | -------------------------------------------------------------------------------- /src/components/Companies/VanHack.vue: -------------------------------------------------------------------------------- 1 | 2 | 31 | 32 | 37 | -------------------------------------------------------------------------------- /src/components/Companies/Zenvia.vue: -------------------------------------------------------------------------------- 1 | 2 | 26 | 27 | 32 | -------------------------------------------------------------------------------- /src/components/Companies/Zup.vue: -------------------------------------------------------------------------------- 1 | 2 | 35 | 36 | 41 | -------------------------------------------------------------------------------- /src/components/Footer/Footer.vue: -------------------------------------------------------------------------------- 1 | 34 | 35 | 55 | 56 | 215 | -------------------------------------------------------------------------------- /src/components/Navigation/Logo.vue: -------------------------------------------------------------------------------- 1 | 2 | 22 | 23 | 28 | 29 | 40 | -------------------------------------------------------------------------------- /src/components/Navigation/Navbar.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 34 | 35 | 77 | -------------------------------------------------------------------------------- /src/components/SVG/Alert.vue: -------------------------------------------------------------------------------- 1 | 2 | 19 | 20 | 34 | -------------------------------------------------------------------------------- /src/components/SVG/ToTop.vue: -------------------------------------------------------------------------------- 1 | 14 | -------------------------------------------------------------------------------- /src/components/Sections/Account.vue: -------------------------------------------------------------------------------- 1 | 2 | 18 | 19 | 24 | 25 | 143 | -------------------------------------------------------------------------------- /src/components/Sections/Achievements.vue: -------------------------------------------------------------------------------- 1 | 2 | 23 | 24 | 35 | -------------------------------------------------------------------------------- /src/components/Sections/BetterDevs.vue: -------------------------------------------------------------------------------- 1 | 2 | 23 | 24 | 29 | 30 | 46 | -------------------------------------------------------------------------------- /src/components/Sections/Connections.vue: -------------------------------------------------------------------------------- 1 | 2 | 23 | 24 | 29 | 30 | 34 | -------------------------------------------------------------------------------- /src/components/Sections/Hero.vue: -------------------------------------------------------------------------------- 1 | 25 | 26 | 31 | 32 | 128 | -------------------------------------------------------------------------------- /src/components/Sections/Journey.vue: -------------------------------------------------------------------------------- 1 | 48 | 49 | 54 | 55 | 229 | -------------------------------------------------------------------------------- /src/components/Sections/Spoiler.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 27 | 28 | 86 | -------------------------------------------------------------------------------- /src/components/Sections/Trust.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 34 | 35 | 84 | -------------------------------------------------------------------------------- /src/components/Social/Facebook.vue: -------------------------------------------------------------------------------- 1 | 2 | 18 | -------------------------------------------------------------------------------- /src/components/Social/Instagram.vue: -------------------------------------------------------------------------------- 1 | 2 | 18 | -------------------------------------------------------------------------------- /src/components/Social/Twitter.vue: -------------------------------------------------------------------------------- 1 | 2 | 18 | -------------------------------------------------------------------------------- /src/components/Social/YouTube.vue: -------------------------------------------------------------------------------- 1 | 2 | 18 | -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue'; 2 | import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'; 3 | import AOS from 'aos'; 4 | import App from './App.vue'; 5 | import router from './router'; 6 | import store from './store'; 7 | import 'aos/dist/aos.css'; 8 | 9 | // Custom SCSS with Bootstrap 10 | import './assets/scss/style.scss'; 11 | 12 | Vue.config.productionTip = false; 13 | 14 | // Make BootstrapVue available throughout your project 15 | Vue.use(BootstrapVue); 16 | // Optionally install the BootstrapVue icon components plugin 17 | Vue.use(IconsPlugin); 18 | 19 | new Vue({ 20 | created() { 21 | AOS.init(); 22 | }, 23 | router, 24 | store, 25 | render: (h) => h(App), 26 | }).$mount('#app'); 27 | -------------------------------------------------------------------------------- /src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue'; 2 | import VueRouter from 'vue-router'; 3 | import Home from '../views/Home.vue'; 4 | 5 | Vue.use(VueRouter); 6 | 7 | const routes = [ 8 | { 9 | path: '/', 10 | name: 'Home', 11 | component: Home, 12 | }, 13 | { 14 | path: '/about', 15 | name: 'About', 16 | // route level code-splitting 17 | // this generates a separate chunk (about.[hash].js) for this route 18 | // which is lazy-loaded when the route is visited. 19 | component: () => import(/* webpackChunkName: "about" */ '../views/About.vue'), 20 | }, 21 | ]; 22 | 23 | const router = new VueRouter({ 24 | routes, 25 | }); 26 | 27 | export default router; 28 | -------------------------------------------------------------------------------- /src/store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue'; 2 | import Vuex from 'vuex'; 3 | 4 | Vue.use(Vuex); 5 | 6 | export default new Vuex.Store({ 7 | state: { 8 | }, 9 | mutations: { 10 | }, 11 | actions: { 12 | }, 13 | modules: { 14 | }, 15 | }); 16 | -------------------------------------------------------------------------------- /src/views/About.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/views/Home.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 45 | -------------------------------------------------------------------------------- /vue.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable no-param-reassign */ 2 | module.exports = { 3 | chainWebpack: (config) => { 4 | config.module 5 | .rule('vue') 6 | .use('vue-loader') 7 | .loader('vue-loader') 8 | .tap((options) => { 9 | options.transformAssetUrls = { 10 | img: 'src', 11 | image: 'xlink:href', 12 | 'b-avatar': 'src', 13 | 'b-img': 'src', 14 | 'b-img-lazy': ['src', 'blank-src'], 15 | 'b-card': 'img-src', 16 | 'b-card-img': 'src', 17 | 'b-card-img-lazy': ['src', 'blank-src'], 18 | 'b-carousel-slide': 'img-src', 19 | 'b-embed': 'src', 20 | }; 21 | 22 | return options; 23 | }); 24 | }, 25 | }; 26 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | // webpack.config.js 2 | const VueLoaderPlugin = require('vue-loader/lib/plugin'); 3 | 4 | module.exports = { 5 | module: { 6 | rules: [ 7 | // ... other rules 8 | { 9 | test: /\.vue$/, 10 | loader: 'vue-loader', 11 | }, 12 | { 13 | test: /\.js$/, 14 | loader: 'babel-loader', 15 | }, 16 | ], 17 | }, 18 | plugins: [ 19 | // make sure to include the plugin! 20 | new VueLoaderPlugin(), 21 | ], 22 | }; 23 | --------------------------------------------------------------------------------