[
  {
    "path": ".github/FUNDING.yml",
    "content": "# These are supported funding model platforms\n\ngithub: [hbollon]\nko_fi: hugobollon\ncustom: ['paypal.me/hugobollon']\n"
  },
  {
    "path": ".gitignore",
    "content": ".DS_Store\nnode_modules\n/dist\n\n# local env files\n.env.local\n.env.*.local\n\n# Log files\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\npnpm-debug.log*\n\n# Editor directories and files\n.idea\n.vscode\n*.suo\n*.ntvs*\n*.njsproj\n*.sln\n*.sw?\n"
  },
  {
    "path": ".python-version",
    "content": "portfolio-vuejs\n"
  },
  {
    "path": "LICENSE",
    "content": "MIT License\n\nCopyright (c) 2020 Hugo Bollon\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
  },
  {
    "path": "README.md",
    "content": "<h1 align=\"center\">VueJS portfolio template</h1>\n\n> Portfolio template using VueJs framework, CosmicJS API and Bootstrap\n\n<p align=\"center\"><strong> Live demo with my personnal data <a href=\"https://hugobollon.me\">here</a> ! </strong></p>\n\n<img align=\"center\" src=\"doc/portfolio-vuejs_demo.gif\" alt=\"portfolio-vuejs preview\"></img>\n\n---\n\n## Table of Contents\n\n- [Features](#features)\n- [Setup](#project-setup)\n- [Edit Content](#how-to-edit-content)\n- [Author](#author)\n- [Contributing](#-contributing)\n- [License](#-license)\n\n---\n\n## Features\n- Builded with VueJs framework ✨\n- One page layout ✨\n- Material design ✨\n- Bootstrap 4.5 & SCSS ✨\n- Responsive ✨\n- Animated layout ✨\n- Content managed with CosmicJS API ✨\n\n## Project setup\n```\nnpm install\n```\n### Compiles and hot-reloads for development\n```\nnpm run serve\n```\n### Compiles and minifies for production\n```\nnpm run build\n```\n### Lints and fixes files\n```\nnpm run lint\n```\n### Customize configuration\nSee [Configuration Reference](https://cli.vuejs.org/config/).\n\n## How to edit content\nThis template have a CMS support with CosmicJS. You can easily put your content there by creating and linking your CosmicJS account. \n\nIn order to customize your portfolio, you must create a CosmicJS account and a new fresh bucket on it. Once done, you must update credentials of the **.env** file.\n\nTo do this, you just have to modify the variables contained in the ENV file (API token, bucket slug and read key).\n\n```env\n# CosmicJS \nVUE_APP_COSMICJS_TOKEN=\" \"\nVUE_APP_COSMICJS_BUCKET_SLUG=\" \"\nVUE_APP_COSMICJS_BUCKET_READ_KEY=\" \"\n```\n\nAfter that, you need to create the object type and data we will use. To do that properly and easily, you can import the json file, located [inside the data folder of this repo](https://github.com/hbollon/portfolio-vuejs/blob/master/data/portfolio-vuejs_import.json), by accessing import/export settings inside your bucket settings page.\n\nNow, you can customize it with your data through CosmicJS interface!\n## Author\n\n👤 **Hugo Bollon**\n\n* Github: [@hbollon](https://github.com/hbollon)\n* LinkedIn: [@Hugo Bollon](https://www.linkedin.com/in/hugobollon/)\n* Portfolio: [hugobollon.me](https://www.hugobollon.me)\n\n## 🤝 Contributing\n\nContributions, issues and feature requests are welcome!<br />Feel free to check [issues page](https://github.com/hbollon/portfolio-vuejs/issues). \n\n## Show your support\n\nGive a ⭐️ if this project helped you!\n\n## 📝 License\n\nThis project is under [MIT](https://github.com/hbollon/portfolio-vuesjs/blob/master/LICENSE) license."
  },
  {
    "path": "babel.config.js",
    "content": "module.exports = {\n  presets: [\n    '@vue/cli-plugin-babel/preset'\n  ]\n}\n"
  },
  {
    "path": "data/portfolio-vuejs_import.json",
    "content": "{\"bucket\":{\"_id\":\"5f00bd777c62a200080e8faf\",\"slug\":\"hugobollonme\",\"title\":\"hugobollon.me\",\"object_types\":[{\"title\":\"portfolio-contents\",\"slug\":\"portfolio-contents\",\"singular\":\"portfolio-content\",\"metafields\":[],\"options\":{\"slug_field\":1,\"content_editor\":1},\"preview_link\":\"\",\"priority_locale\":null,\"extensions\":null,\"order\":2}],\"objects\":[{\"_id\":\"5f011c5b90e9e00007825ea8\",\"order\":5,\"slug\":\"experiences\",\"title\":\"experiences\",\"content\":\"\",\"metafields\":[{\"children\":null,\"type\":\"text\",\"title\":\"description\",\"key\":\"description\",\"id\":\"rab2gb3ikerouxtvpewn\",\"value\":\"Professional and academic\"},{\"children\":null,\"type\":\"text\",\"title\":\"title\",\"key\":\"title\",\"id\":\"drnw6zxqjxpxagtmntqc\",\"value\":\"Experience\"},{\"children\":null,\"type\":\"json\",\"title\":\"professional\",\"key\":\"professional\",\"id\":\"FtSwl0XI9C\",\"value\":[{\"year\":\"01.2020 - 05.2020\",\"title\":\"Urbalog LAET Project\",\"content\":\"Digitizing the Urbalog board game on Android with the Nearby Connection API\"},{\"year\":\"07.2019\",\"title\":\"Pfeiffer Vacuum SAS, Annecy\",\"content\":\"Interim IT mission: implementation of a new Qlickview access management program + Laravel development\"},{\"year\":\"07.2018\",\"title\":\"Pfeiffer Vacuum SAS, Annecy\",\"content\":\"Interim IT mission: Management of SAP tables and inventory of sub-programs.\"}],\"required\":true},{\"children\":null,\"type\":\"json\",\"title\":\"academic\",\"key\":\"academic\",\"id\":\"b2a969sy7g\",\"value\":[{\"year\":\"From September 2020\",\"title\":\"Computer Science Master at USMB\",\"content\":\"Specialized in artificial intelligence and collaborative systems\"},{\"year\":\"2017 - 2020\",\"title\":\"IT License\",\"content\":\"University Savoie Mont-Blanc, France\"},{\"year\":\"2013 - 2017\",\"title\":\"Scientific Baccalaureate\",\"content\":\"Lycée de l'Albanais at Rumilly, France\"}],\"required\":true}],\"bucket\":\"5f00bd777c62a200080e8faf\",\"type_slug\":\"portfolio-contents\",\"created_at\":\"2020-07-05T00:18:35.583Z\",\"created_by\":\"5f00bd137c62a200080e8fae\",\"modified_at\":\"2020-07-05T17:32:57.155Z\",\"created\":\"2020-07-05T00:18:35.583Z\",\"user_id\":\"5f00bd137c62a200080e8fae\",\"options\":{\"content_editor\":1,\"slug_field\":1},\"status\":\"published\",\"published_at\":\"2020-07-05T17:32:57.155Z\",\"modified_by\":\"5f00bd137c62a200080e8fae\",\"publish_at\":null,\"unpublish_at\":null},{\"_id\":\"5f01fd8350006f00083229f5\",\"order\":4,\"slug\":\"description\",\"title\":\"description\",\"content\":\"\",\"metafields\":[{\"children\":null,\"type\":\"text\",\"title\":\"pres_second\",\"key\":\"pres_second\",\"id\":\"Igv3UdzOfX\",\"value\":\"I always liked to get into projects using the skills that I did not have or were even spare pure programming like web design, 3D modeling ect...  This allowed me to learn to be autonomous and to learn on my own, certainly not without difficulties far from it, but I always managed to overcome the obstacles and solve the problems I encountered !\"},{\"children\":null,\"type\":\"text\",\"title\":\"pres_first\",\"key\":\"pres_first\",\"id\":\"d6tIa0Bibt\",\"value\":\"I'm a Full-Stack Developer student. Actually, I have a Licence BAC+3 in IT and I just started a computer science Master specialized in artificial intelligence and collaborative systems. IT is not only my professional background. It is also and above all a passion that has grown since I was 16 years old.\"},{\"children\":null,\"type\":\"text\",\"title\":\"pres_title\",\"key\":\"pres_title\",\"id\":\"IqVCE1U7Qb\",\"value\":\"Who am I ?\"},{\"children\":null,\"type\":\"text\",\"title\":\"description\",\"key\":\"description\",\"id\":\"68UNnxOFq7\",\"value\":\"Hope to know you after\"},{\"children\":null,\"type\":\"text\",\"title\":\"title\",\"key\":\"title\",\"id\":\"OhyFWRR6Xn\",\"value\":\"About Me\"}],\"bucket\":\"5f00bd777c62a200080e8faf\",\"type_slug\":\"portfolio-contents\",\"created_at\":\"2020-07-05T16:19:15.848Z\",\"created_by\":\"5f00bd137c62a200080e8fae\",\"modified_at\":\"2020-11-06T14:31:39.945Z\",\"created\":\"2020-07-05T16:19:15.848Z\",\"user_id\":\"5f00bd137c62a200080e8fae\",\"options\":{\"content_editor\":1,\"slug_field\":1},\"status\":\"published\",\"published_at\":\"2020-11-06T14:31:39.945Z\",\"modified_by\":\"5f00bd137c62a200080e8fae\",\"publish_at\":null,\"unpublish_at\":null},{\"_id\":\"5f01fee250006f00083229f7\",\"order\":3,\"slug\":\"user-data\",\"title\":\"user-data\",\"content\":\"\",\"metafields\":[{\"children\":null,\"type\":\"text\",\"title\":\"name\",\"key\":\"name\",\"id\":\"OEkbevb9ch\",\"value\":\"Hugo Bollon\"},{\"children\":null,\"type\":\"text\",\"title\":\"status\",\"key\":\"status\",\"id\":\"NX8v723S0G\",\"value\":\"Full-Stack Developer\"},{\"children\":null,\"type\":\"text\",\"title\":\"email\",\"key\":\"email\",\"id\":\"2VhiCIosBh\",\"value\":\"hugo.bollon@gmail.com\"},{\"children\":null,\"type\":\"text\",\"title\":\"phone\",\"key\":\"phone\",\"id\":\"zSqJFpvOeE\",\"value\":\"+33 6 51 99 80 78\"},{\"children\":null,\"type\":\"text\",\"title\":\"city\",\"key\":\"city\",\"id\":\"eePnSPzpxY\",\"value\":\"Chambéry, France\"},{\"children\":null,\"type\":\"text\",\"title\":\"lang\",\"key\":\"lang\",\"id\":\"jh95I8Z7VB\",\"value\":\"French, English\"},{\"children\":null,\"type\":\"text\",\"title\":\"photo\",\"key\":\"photo\",\"id\":\"D4LfrSKbrc\",\"value\":\"photo.jpg\"}],\"bucket\":\"5f00bd777c62a200080e8faf\",\"type_slug\":\"portfolio-contents\",\"created_at\":\"2020-07-05T16:25:06.834Z\",\"created_by\":\"5f00bd137c62a200080e8fae\",\"modified_at\":\"2020-07-05T20:33:36.208Z\",\"created\":\"2020-07-05T16:25:06.834Z\",\"user_id\":\"5f00bd137c62a200080e8fae\",\"options\":{\"content_editor\":1,\"slug_field\":1},\"status\":\"published\",\"published_at\":\"2020-07-05T20:33:36.208Z\",\"modified_by\":\"5f00bd137c62a200080e8fae\",\"publish_at\":null,\"unpublish_at\":null},{\"_id\":\"5f0204d6ea1bf90007ad680f\",\"order\":2,\"slug\":\"links\",\"title\":\"links\",\"content\":\"\",\"metafields\":[{\"children\":null,\"type\":\"text\",\"title\":\"facebook\",\"key\":\"facebook\",\"id\":\"gLDrzR50ta\",\"value\":\"https://www.facebook.com/hugo.bollon\"},{\"children\":null,\"type\":\"text\",\"title\":\"instagram\",\"key\":\"instagram\",\"id\":\"KMi8FlOyrI\",\"value\":\"https://www.instagram.com/_hbollon\"},{\"children\":null,\"type\":\"text\",\"title\":\"linkedin\",\"key\":\"linkedin\",\"id\":\"qVc8Mh2S5A\",\"value\":\"https://www.linkedin.com/in/hugobollon\"},{\"children\":null,\"type\":\"text\",\"title\":\"github\",\"key\":\"github\",\"id\":\"NPDNo7uSc9\",\"value\":\"https://github.com/hbollon\"}],\"bucket\":\"5f00bd777c62a200080e8faf\",\"type_slug\":\"portfolio-contents\",\"created_at\":\"2020-07-05T16:50:30.087Z\",\"created_by\":\"5f00bd137c62a200080e8fae\",\"modified_at\":\"2020-11-06T14:30:59.357Z\",\"created\":\"2020-07-05T16:50:30.087Z\",\"user_id\":\"5f00bd137c62a200080e8fae\",\"options\":{\"content_editor\":1,\"slug_field\":1},\"status\":\"published\",\"published_at\":\"2020-11-06T14:30:59.357Z\",\"modified_by\":\"5f00bd137c62a200080e8fae\",\"publish_at\":null,\"unpublish_at\":null},{\"_id\":\"5f02127c1b1b930007b5896c\",\"order\":1,\"slug\":\"skills\",\"title\":\"skills\",\"content\":\"\",\"metafields\":[{\"children\":null,\"type\":\"json\",\"title\":\"items\",\"key\":\"items\",\"id\":\"IEBchE5swc\",\"value\":[{\"title\":\"C\",\"img\":\"C.png\"},{\"title\":\"C++\",\"img\":\"cplusplus.png\"},{\"title\":\"C#\",\"img\":\"Csharp.png\"},{\"title\":\"Java\",\"img\":\"java.png\"},{\"title\":\"Unity\",\"img\":\"unity.png\"},{\"title\":\"HTML\",\"img\":\"html.png\"},{\"title\":\"CSS\",\"img\":\"css.png\"},{\"title\":\"PHP\",\"img\":\"php.png\"},{\"title\":\"Laravel\",\"img\":\"laravel.png\"},{\"title\":\"VueJS\",\"img\":\"vuejs.png\"},{\"title\":\"Android\",\"img\":\"android.png\"},{\"title\":\"Linux\",\"img\":\"linux.png\"},{\"title\":\"Git/Github\",\"img\":\"Octocat.png\"},{\"title\":\"Go\",\"img\":\"go.png\"},{\"title\":\"VPS/Web Hosting\",\"img\":\"ovh.png\"}]},{\"children\":null,\"type\":\"text\",\"title\":\"title\",\"key\":\"title\",\"id\":\"YtRf42YCsn\",\"value\":\"Skills\"},{\"children\":null,\"type\":\"text\",\"title\":\"description\",\"key\":\"description\",\"id\":\"QTsdJU1QcF\",\"value\":\"Here is my armament\"}],\"bucket\":\"5f00bd777c62a200080e8faf\",\"type_slug\":\"portfolio-contents\",\"created_at\":\"2020-07-05T17:48:44.602Z\",\"created_by\":\"5f00bd137c62a200080e8fae\",\"modified_at\":\"2020-11-06T13:55:46.187Z\",\"created\":\"2020-07-05T17:48:44.602Z\",\"user_id\":\"5f00bd137c62a200080e8fae\",\"options\":{\"content_editor\":1,\"slug_field\":1},\"status\":\"published\",\"published_at\":\"2020-11-06T13:55:46.187Z\",\"modified_by\":\"5f00bd137c62a200080e8fae\",\"publish_at\":null,\"unpublish_at\":null},{\"_id\":\"5f023635b7e93b000741a246\",\"order\":0,\"slug\":\"projects\",\"title\":\"projects\",\"content\":\"\",\"metafields\":[{\"children\":null,\"type\":\"json\",\"title\":\"items\",\"key\":\"items\",\"id\":\"nPhh7RXJaN\",\"value\":[{\"title\":\"IG_Automation_Bot (Work in progress)\",\"content\":\"Python script for Instagram automation using Instaloader. Used for auto following and DM. Easily configurable through Yaml config files!<br><br>Link : <a href='https://github.com/hbollon/IG_Automation_Bot'>https://github.com/hbollon/IG_Automation_Bot</a>\",\"link\":\"https://github.com/hbollon/IG_Automation_Bot\",\"image\":\"ig.gif\",\"tag\":\"Software\",\"color\":\"red\",\"date\":\"2020-11-02\"},{\"title\":\"Go-edlib\",\"content\":\"Golang string comparison and edit distance algorithms library, featuring : Levenshtein, LCS, Hamming, Damerau levenshtein (OSA and Adjacent transpositions algorithms), Jaro-Winkler, Cosine, etc.<br><br>Link : <a href='https://github.com/hbollon/go-edlib'>https://github.com/hbollon/go-edlib</a>\",\"link\":\"https://github.com/hbollon/go-edlib\",\"image\":\"edlib.jpg\",\"tag\":\"Library\",\"color\":\"blue\",\"date\":\"2020-08-25\"},{\"title\":\"Gyro'Ball\",\"content\":\"3D labyrinth game project for Android using Unity. Use device gyroscope.<br><br>Link : <a href='https://play.google.com/store/apps/details?id=com.BitsPlease.GyroBall&hl=fr&fbclid=IwAR0itwUAcbpAl3TgkFGiSrQz_CHTRpWjSXTQZqNGPESikdOJWZ6DIrk5qAA'>Google Play</a>\",\"link\":\"https://play.google.com/store/apps/details?id=com.BitsPlease.GyroBall&hl=fr&fbclid=IwAR0itwUAcbpAl3TgkFGiSrQz_CHTRpWjSXTQZqNGPESikdOJWZ6DIrk5qAA\",\"image\":\"gyroball.jpg\",\"tag\":\"Video Game\",\"color\":\"purple\",\"date\":\"2020-07-28\"},{\"title\":\"GyroscopeControl\",\"content\":\"Unity script used for smooth and customizable object rotation with gyroscope. It include initial calibration with offset, rotation speed, smoothing parameter editable in Unity inspector and debug overlay.<br><br>Link : <a href='https://github.com/hbollon/GyroscopeControl'>https://github.com/hbollon/GyroscopeControl</a>\",\"link\":\"https://github.com/hbollon/GyroscopeControl\",\"image\":\"\",\"tag\":\"Script\",\"color\":\"green\",\"date\":\"2020-06-17\"},{\"title\":\"Urbalog\",\"content\":\"Android adaptation of board game using Nearby Connections API and Java for the LAET<br><br>Link : <a href='https://github.com/hbollon/Urbalog'>https://github.com/hbollon/Urbalog</a>\",\"link\":\"https://github.com/hbollon/Urbalog\",\"image\":\"urba.jpg\",\"tag\":\"Video Game\",\"color\":\"purple\",\"date\":\"2020-05-19\"},{\"title\":\"android-sqlite-toolbox\",\"content\":\"Android java package designed to manage any sqlite database. Includes creation of the db and interactions with it (CRUD), import and export in several file formats (easily adaptable to any other format) and synchronization in http.<br><br>Link : <a href='https://github.com/hbollon/android-sqlite-toolbox'>https://github.com/hbollon/android-sqlite-toolbox</a>\",\"link\":\"https://github.com/hbollon/android-sqlite-toolbox\",\"image\":\"\",\"tag\":\"Library\",\"color\":\"blue\",\"date\":\"2020-05-08\"},{\"title\":\"Le-Parrainage-Boursorama\",\"content\":\"Website built with Laravel. Used to promote and manage sponsorships for a online bank. Hosted on personnal vps.<br><br>Link : <a href='https://le-parrainage-boursorama.fr'>https://le-parrainage-boursorama.fr</a>\",\"link\":\"https://le-parrainage-boursorama.fr\",\"image\":\"boursoweb.jpg\",\"tag\":\"Website\",\"color\":\"orange\",\"date\":\"2019-09-15\"}]},{\"children\":null,\"type\":\"text\",\"title\":\"title\",\"key\":\"title\",\"id\":\"Di7UyvvoeZ\",\"value\":\"My projects\"},{\"children\":null,\"type\":\"text\",\"title\":\"description\",\"key\":\"description\",\"id\":\"Cc6brPtb2p\",\"value\":\"This is my story\"}],\"bucket\":\"5f00bd777c62a200080e8faf\",\"type_slug\":\"portfolio-contents\",\"created_at\":\"2020-07-05T20:21:09.882Z\",\"created_by\":\"5f00bd137c62a200080e8fae\",\"modified_at\":\"2020-11-09T10:16:41.986Z\",\"created\":\"2020-07-05T20:21:09.882Z\",\"user_id\":\"5f00bd137c62a200080e8fae\",\"options\":{\"content_editor\":1,\"slug_field\":1},\"status\":\"published\",\"published_at\":\"2020-11-09T10:16:41.986Z\",\"modified_by\":\"5f00bd137c62a200080e8fae\",\"publish_at\":null,\"unpublish_at\":null}],\"media\":[]}}"
  },
  {
    "path": "package.json",
    "content": "{\n    \"name\": \"portfolio-vuejs\",\n    \"version\": \"0.1.0\",\n    \"private\": true,\n    \"scripts\": {\n        \"serve\": \"vue-cli-service serve\",\n        \"build\": \"vue-cli-service build\",\n        \"lint\": \"vue-cli-service lint\"\n    },\n    \"dependencies\": {\n        \"@cosmicjs/sdk\": \"^1.2.0\",\n        \"@fortawesome/fontawesome-svg-core\": \"^1.2.36\",\n        \"@fortawesome/free-brands-svg-icons\": \"^5.15.4\",\n        \"@fortawesome/free-solid-svg-icons\": \"^5.15.4\",\n        \"@fortawesome/vue-fontawesome\": \"^2.0.10\",\n        \"@growthbunker/vuetimeline\": \"^0.1.17\",\n        \"bootstrap\": \"^4.6.2\",\n        \"core-js\": \"^3.38.1\",\n        \"css-loader\": \"^5.2.7\",\n        \"vue\": \"^2.7.16\",\n        \"vue-carousel\": \"^0.18.0\",\n        \"vue-style-loader\": \"^4.1.3\",\n        \"vue2-animate\": \"^2.1.4\"\n    },\n    \"devDependencies\": {\n        \"@vue/cli-plugin-babel\": \"^4.5.19\",\n        \"@vue/cli-plugin-eslint\": \"^4.5.19\",\n        \"@vue/cli-service\": \"^4.5.19\",\n        \"babel-eslint\": \"^10.1.0\",\n        \"bootstrap-vue\": \"^2.23.1\",\n        \"eslint\": \"^7.32.0\",\n        \"eslint-plugin-vue\": \"^7.20.0\",\n        \"node-sass\": \"^5.0.0\",\n        \"sass-loader\": \"^10.5.2\",\n        \"style-loader\": \"^2.0.0\",\n        \"vue-template-compiler\": \"^2.7.16\"\n    },\n    \"eslintConfig\": {\n        \"root\": true,\n        \"env\": {\n            \"node\": true\n        },\n        \"extends\": [\n            \"plugin:vue/essential\",\n            \"eslint:recommended\"\n        ],\n        \"parserOptions\": {\n            \"parser\": \"babel-eslint\"\n        },\n        \"rules\": {}\n    },\n    \"browserslist\": [\n        \"> 1%\",\n        \"last 2 versions\",\n        \"not dead\"\n    ]\n}\n"
  },
  {
    "path": "public/.htaccess",
    "content": "<IfModule mod_rewrite.c>\n    <IfModule mod_negotiation.c>\n        Options -MultiViews -Indexes\n    </IfModule>\n\n    RewriteEngine On\n\n    # Handle Authorization Header\n    RewriteCond %{HTTP:Authorization} .\n    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]\n\n    # Redirect Trailing Slashes If Not A Folder...\n    RewriteCond %{REQUEST_FILENAME} !-d\n    RewriteCond %{REQUEST_URI} (.+)/$\n    RewriteRule ^ %1 [L,R=301]\n\n    # Handle Front Controller...\n    RewriteCond %{REQUEST_FILENAME} !-d\n    RewriteCond %{REQUEST_FILENAME} !-f\n    RewriteRule ^ index.php [L]\n\n    RewriteCond %{HTTP_HOST} ^www\\.(.*)$ [NC]\n    RewriteRule ^(.*)$ https://%1/$1 [R=301,L]\n\n    RewriteCond %{HTTPS} !on\n    RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]\n</IfModule>"
  },
  {
    "path": "public/index.html",
    "content": "<!DOCTYPE html>\n<html lang=\"en\" style=\"height: 100%;\">\n\n<head>\n\t<!-- Global site tag (gtag.js) - Google Analytics -->\n\t<script async src=\"https://www.googletagmanager.com/gtag/js?id=UA-148902588-2\"></script>\n\t<script>\n\t\twindow.dataLayer = window.dataLayer || [];\n\t\tfunction gtag() { dataLayer.push(arguments); }\n\t\tgtag('js', new Date());\n\n\t\tgtag('config', 'UA-148902588-2');\n\t</script>\n\n\t<meta charset=\"utf-8\">\n\t<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n\t<meta name=\"viewport\" content=\"width=device-width,initial-scale=1.0\">\n\t<meta name=\"description\" content=\"Welcome to my personnal portfolio builded with VueJS !\" />\n\n\t<meta property=\"og:title\" content=\"Hugo Bollon Portfolio\" />\n\t<meta property=\"og:type\" content=\"website\" />\n\t<meta property=\"og:url\" content=\"https://hugobollon.me/\" />\n\t<meta property=\"og:locale\" content=\"en_US\" />\n\t<meta property=\"og:image\" content=\"<%= BASE_URL %>og.png\" />\n\t<meta property=\"og:description\" content=\"Welcome to my personnal portfolio builded with VueJS !\" />\n\n\t<link rel=\"icon\" href=\"<%= BASE_URL %>favicon.ico\">\n\n\t<title>Hugo Bollon Portfolio</title>\n</head>\n\n<body style=\"height: 100%;\">\n\t<noscript>\n\t\t<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.\n\t\t\tPlease enable it to continue.</strong>\n\t</noscript>\n\t<div id=\"app\"></div>\n\t<!-- built files will be auto injected -->\n</body>\n\n</html>"
  },
  {
    "path": "src/App.vue",
    "content": "<template>\n  <transition name=\"fade\" tag=\"div\" class=\"wrapper\" mode=\"out-in\">\n    <div class=\"wrapper\" v-if=\"isLoaded\" id=\"app\">\n      <LandingPage :user=\"user\" />\n      <Description :user=\"user\" :content=\"description\" :links=\"links\" />\n      <Experience :content=\"experiences\" />\n      <Skills :content=\"skills\" />\n      <Projects :content=\"projects\" />\n      <Footer :user=\"user\" :links=\"links\" />\n    </div>\n  </transition>\n</template>\n\n<script>\nimport LandingPage from \"./components/LandingPage.vue\";\nimport Description from \"./components/Description.vue\";\nimport Experience from \"./components/Experience.vue\";\nimport Skills from \"./components/Skills.vue\";\nimport Projects from \"./components/Projects.vue\";\nimport Footer from \"./components/Footer.vue\";\n\nimport { cosmic } from \"./cosmic.js\";\n\nexport default {\n  name: \"App\",\n  components: {\n    LandingPage,\n    Description,\n    Experience,\n    Skills,\n    Projects,\n    Footer,\n  },\n  data: () => ({\n    isLoaded: false,\n    user: {},\n    description: {},\n    links: {},\n    experiences: {},\n    skills: {},\n    projects: {},\n  }),\n  methods: {\n    async fetchObject(slug) {\n      return await cosmic.objects.findOne({\n        type: slug,\n        slug: slug\n      }).props(\"slug,title,metadata\")\n      .depth(1)\n    },\n    extractFirstObject(objects) {\n      if(objects.objects == null)\n        return void 0;\n      else\n        return objects.objects[0];\n    }\n  },\n  created() {\n    document.body.classList.add(\"loading\");\n    Promise.all([\n      this.fetchObject('user-data'),\n      this.fetchObject('description'),\n      this.fetchObject('links'),\n      this.fetchObject('experiences'),\n      this.fetchObject('skills'),\n      this.fetchObject('projects')\n    ]).then(([\n      user_data,\n      description,\n      links,\n      experiences,\n      skills,\n      projects\n    ]) => {\n      this.user = {\n        name: user_data.object.metadata.name,\n        status: user_data.object.metadata.status,\n        email: user_data.object.metadata.email,\n        phone: user_data.object.metadata.phone,\n        city: user_data.object.metadata.city,\n        lang: user_data.object.metadata.lang,\n        photo: user_data.object.metadata.photo,\n      }\n      this.description = description\n      this.links = links\n      this.experiences = experiences\n      this.skills = skills\n      this.projects = projects\n      this.isLoaded = true;\n      this.$nextTick(() => document.body.classList.remove(\"loading\"));\n    });\n  },\n};\n</script>\n\n<style scoped lang=\"scss\">\n@import \"@/styles/constants.scss\";\n\n#app {\n  font-family: Montserrat-Regular, serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  color: #2c3e50;\n}\n\n.wrapper {\n  height: 100%;\n}\n</style>\n"
  },
  {
    "path": "src/components/AnimateOnVisible.vue",
    "content": "<template>\n  <div>\n    <transition :name=\"name\" :appear=\"appear\">\n      <div v-if=\"isVisible\" :style=\"{ animationDuration: `${duration}s`, transitionDuration: `${duration}s` }\">\n        <slot></slot>\n      </div>\n    </transition>\n  </div>\n</template>\n\n<script>\nlet isPassiveSupported = false;\ntry {\n  const options = Object.defineProperty({}, 'passive', {\n    get: () => isPassiveSupported = true\n  });\n  window.addEventListener('test', null, options);\n} catch (err) {\n\tconsole.log(\"Passive not supported\");\n}\n\nexport default {\n  props: {\n    name: String,\n    appear: { type: Boolean, default: false },\n    offsetTop: { type: Number, default: 0 },\n    duration: { type: Number, default: 1 }\n  },\n\n  data: () => ({\n    isVisible: false\n  }),\n\n  methods: {\n    inViewport() {\n      const rect = this.$el.getBoundingClientRect()\n      return rect.top <= (window.innerHeight - this.offsetTop) && rect.left <= window.innerWidth\n    },\n    detectVisibility() {\n      this.isVisible = this.inViewport()\n    }\n  },\n\n  mounted() {\n    this.$nextTick(this.detectVisibility)\n    window.addEventListener('scroll', this.detectVisibility, isPassiveSupported ? { passive: true } : false)\n    window.addEventListener('resize', this.detectVisibility, isPassiveSupported ? { passive: true } : false)\n    window.addEventListener('orientationchange', this.detectVisibility, isPassiveSupported ? { passive: true } : false)\n  },\n  \n  destroyed() {\n    window.removeEventListener('scroll', this.detectVisibility)\n    window.removeEventListener('resize', this.detectVisibility)\n    window.removeEventListener('orientationchange', this.detectVisibility)\n  }\n}\n</script>"
  },
  {
    "path": "src/components/Description.vue",
    "content": "<template>\n    <section id=\"about\">\n        <AnimateOnVisible name=\"fadeDown\" :duration=\"1\">\n            <Title :title=\"content.object.metadata.title\" :description=\"content.object.metadata.description\" />\n        </AnimateOnVisible>\n\n        <AnimateOnVisible name=\"fadeRight\" :duration=\"1\">\n            <div class=\"section-content\">\n                <div class=\"container-fluid\">\n                    <div class=\"row justify-content-center\">\n                        <Photo :user=\"user\"/>\n                    </div>\n                    <div class=\"row\">\n                        <div class=\"col-md-7 mr-auto card-mobile\">\n                            <Presentation :content=\"content\"/>\n                        </div>\n                        <div class=\"col-md-4 card-mobile\">\n                            <PersonnalCard :user=\"user\" :links=\"links\"/>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </AnimateOnVisible>\n    </section>\n</template>\n\n<script>\n    import Title from './Title.vue'\n    import PersonnalCard from './PersonnalCard.vue'\n    import Presentation from './Presentation.vue'\n    import Photo from './Photo.vue'\n\n    export default {\n        name: 'AboutMe',\n        props: ['user', 'content', 'links'],\n        components: {\n            Title,\n            PersonnalCard,\n            Presentation,\n            Photo\n        },\n    }\n</script>\n\n<style scoped lang=\"scss\">\n    @import '@/styles/constants.scss';\n\n    #about {\n        background-color: lighten(map-get($colors, dark), 100%);\n    }\n\n    @media(min-width: #{map-get($breakpoints, medium)}) {\n        .section-content {\n            width: 80%;\n            margin: 0 auto;\n        }\n    }\n\n    @media(max-width: #{map-get($breakpoints, medium)}) {\n        .card-mobile {\n            text-align: center !important;\n            margin-top: 20px;\n        }\n    }\n</style>\n"
  },
  {
    "path": "src/components/Experience.vue",
    "content": "<template>\n  <section id=\"experience\">\n    <AnimateOnVisible name=\"fadeDown\" :duration=\"1\">\n      <Title\n        class=\"title\"\n        :title=\"content.object.metadata.title\"\n        :description=\"content.object.metadata.description\"\n      />\n    </AnimateOnVisible>\n\n\t<AnimateOnVisible name=\"fadeUp\" :duration=\"1\">\n\t\t<div class=\"container-fluid\">\n\t\t\t<div class=\"row\">\n\t\t\t\t<ExperienceColumn\n\t\t\t\t\t:posts=\"content.object.metadata.academic\"\n\t\t\t\t\ttitle=\"Education\"\n\t\t\t\t\tclass=\"col-12 col-md left\"\n\t\t\t\t/>\n\t\t\t\t<ExperienceColumn\n\t\t\t\t\t:posts=\"content.object.metadata.professional\"\n\t\t\t\t\ttitle=\"Professional\"\n\t\t\t\t\tclass=\"col-12 col-md right\"\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t</AnimateOnVisible>\n  </section>\n</template>\n\n<script>\nimport Title from \"./Title.vue\";\nimport ExperienceColumn from \"./ExperienceColumn.vue\";\n\nexport default {\n  name: \"Experience\",\n  props: [\"content\"],\n  components: {\n    Title,\n    ExperienceColumn\n  }\n};\n</script>\n\n<style scoped lang=\"scss\">\n@import \"@/styles/constants.scss\";\n\n$linear: map-get($colors, dark);\n\n#experience {\n  background-color: lighten(map-get($colors, primary), 5%);\n}\n\n.title {\n  color: map-get($colors, light);\n}\n\n.row {\n  padding-top: 20px;\n  text-align: center;\n}\n\n@media (min-width: #{map-get($breakpoints, small)}) {\n  .left {\n    text-align: right;\n    border-right: 2px solid $linear;\n  }\n  .right {\n    text-align: left;\n  }\n}\n\n@media (max-width: #{map-get($breakpoints, small)}) {\n  .right {\n    margin-top: 20px;\n  }\n  .left:before {\n    content : \"\";\n    position: absolute;\n    left    : 20%;\n    bottom  : 0;\n    height  : 2px;\n    width   : 60%;  /* or 100px */\n    border-bottom:2px solid $linear;\n}\n}\n\n/deep/ .text-wrapper {\n  &:after {\n    border-bottom: 1px solid map-get($colors, dark);\n  }\n}\n</style>\n"
  },
  {
    "path": "src/components/ExperienceColumn.vue",
    "content": "<template>\n  <div>\n    <h3 class=\"color-light\">{{ title }}</h3>\n    <div class=\"resume-item\" v-for=\"(post, index) in posts\" :key=\"index\">\n      <div class=\"year color-darker\">{{ post.year }}</div>\n      <div class=\"resume-description\">\n        <strong class=\"color-light\" v-html=\"post.title\"></strong>\n      </div>\n      <div class=\"color-darker\" v-html=\"post.content\"></div>\n    </div>\n  </div>\n</template>\n\n<script>\nexport default {\n  name: \"ExperienceColumn\",\n  props: [\"posts\", \"title\"],\n};\n</script>\n\n<style scoped lang=\"scss\">\n@import \"@/styles/constants.scss\";\n\n.resume-item {\n  margin-bottom: 25px;\n  p {\n    font-size: 1.5rem;\n    margin-top: 0;\n  }\n  .resume-description {\n    font-size: 1.7rem;\n  }\n  .year {\n    font-weight: 600;\n    margin-bottom: 5px;\n  }\n}\n.color-light {\n  color: map-get($colors, light);\n}\n.color-darker {\n  color: map-get($colors, dark);\n}\n</style>\n"
  },
  {
    "path": "src/components/Footer.vue",
    "content": "<template>\n  <footer class=\"footer\">\n    <div>\n        <font-awesome-icon class=\"copyright-icon\" icon=\"copyright\"/> \n        2020 {{user.name}}\n        | Get this template <a href=\"https://github.com/hbollon/portfolio-vuejs\" target=\"_blank\">here</a> ! \n    </div>\n    <SocialBar :links=\"links\"/>\n  </footer>\n</template>\n\n<script>\nimport SocialBar from './SocialBar'\nexport default {\n  name: 'Footer',\n  props: ['user', 'links'],\n  components: {\n    SocialBar,\n  },\n}\n</script>\n\n<style scoped lang=\"scss\">\n  @import '@/styles/constants.scss';\n\n  $bg-footer: map-get($colors, primary) !default;\n\n  .footer {\n    padding: 10px 20px 10px 20px;\n    background-color: $bg-footer;\n    color: map-get($colors, light);\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  }\n\n  .copyright-icon{\n      font-size: 1.5rem;\n      vertical-align: middle;\n  }\n\n  /deep/ .social-wrap {\n    float: right;\n    .icon {\n      font-size: 2.8rem;\n      &:hover {\n        color: map-get($colors, light);\n      }\n    }\n  }\n\n  /deep/ li{\n      margin-bottom: 0 !important;\n  }\n\n</style>"
  },
  {
    "path": "src/components/LandingPage.vue",
    "content": " <template>\n  <header class=\"header parallax\">\n    <div class=\"name\">\n      <div class=\"wrapper-name\">\n        <AnimateOnVisible name=\"fadeDown\" ::duration=\"1\">\n          <h1>{{ user.name }}</h1>\n        </AnimateOnVisible>\n        <hr />\n        <AnimateOnVisible name=\"fadeUp\" ::duration=\"1\">\n          <p>{{ user.status }}</p>\n        </AnimateOnVisible>\n      </div>\n    </div>\n  </header>\n</template>\n\n<script>\nexport default {\n  name: \"LandingPage\",\n  props: [\"user\"]\n};\n</script>\n\n<style scoped lang=\"scss\">\n@import \"@/styles/constants.scss\";\n\n.header {\n  padding: 20px;\n  background-color: map-get($colors, dark);\n}\n\n.parallax {\n  background-image: url(\"../assets/img/bg.jpg\");\n  background-attachment: fixed;\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: cover;\n  height: 100%;\n}\n\n.name {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100%;\n  margin: 0 auto;\n  z-index: 400;\n\n  .wrapper-name {\n    width: 250px;\n  }\n\n  h1 {\n    font-size: 2.3rem;\n    padding: 2px 10px;\n    text-align: center;\n    text-transform: uppercase;\n    color: whitesmoke;\n  }\n\n  p {\n    font-size: 1.5rem;\n    text-align: center;\n    margin: 5px auto;\n    color: whitesmoke;\n  }\n\n  hr {\n    border: 1px solid whitesmoke;\n  }\n}\n\n@media (min-width: #{map-get($breakpoints, small)}) {\n  .name {\n    .wrapper-name {\n      width: 55%;\n    }\n    h1 {\n      font-size: 2.8rem;\n      padding: 4% 8%;\n    }\n    p {\n      font-size: 2rem;\n    }\n  }\n}\n@media (min-width: #{map-get($breakpoints, medium)}) {\n  .name {\n    .wrapper-name {\n      width: 450px;\n    }\n    h1 {\n      font-size: 4rem;\n      padding: 4% 10%;\n    }\n    p {\n      font-size: 2.5rem;\n    }\n  }\n}\n@media only screen and (max-device-width: 1024px) {\n  .parallax {\n    background-attachment: scroll;\n  }\n}\n</style>"
  },
  {
    "path": "src/components/PersonnalCard.vue",
    "content": "<template>\n  <div>\n    <h3>{{ user.name }}</h3>\n    <div class=\"data\"><strong>E-mail:</strong> {{ user.email }}</div>\n    <div class=\"data\"><strong>Phone:</strong> {{ user.phone }}</div>\n    <div class=\"data\"><strong>City:</strong> {{ user.city }}</div>\n    <div class=\"data\"><strong>Languages:</strong> {{ user.lang }}</div>\n    <SocialBar :links=\"links\"/>\n  </div>\n</template>\n\n<script>\nimport SocialBar from './SocialBar.vue'\n\nexport default {\n    name: 'PersonnalCard',\n    props: ['user', 'links'],\n    components: {\n        SocialBar,\n    }\n}\n</script>\n\n<style scoped lang=\"scss\">\n    @import '@/styles/constants.scss';\n\n    .data {\n        margin-bottom: 15px;\n    }\n</style>"
  },
  {
    "path": "src/components/Photo.vue",
    "content": "<template>\n  <div>\n    <div class=\"photo\">\n      <a>\n        <img :src=\"getImgUrl(user.photo)\" alt=\"photo\" />\n      </a>\n    </div>\n  </div>\n</template>\n\n<script>\nexport default {\n  name: \"Photo\",\n  props: [\"user\"],\n  methods: {\n    getImgUrl(img) {\n      if (img == undefined || img == \"\") return \"\";\n      else if (/^https:\\/\\/cdn\\.cosmicjs\\.com\\/.+\\.(jpg|png|gif)$/.test(img))\n        return img;\n      return require(\"../assets/img/projects/\" + img);\n    },\n  },\n};\n</script>\n\n<style scoped lang=\"scss\">\n.photo {\n  a:focus {\n    outline: none;\n  }\n  img {\n    width: 200px;\n    height: 200px;\n    border-radius: 50%;\n    display: inline-block;\n  }\n}\nimg {\n  max-width: 100%;\n}\n</style>\n"
  },
  {
    "path": "src/components/Presentation.vue",
    "content": "<template>\n  <div class=\"paragraph\">\n    <h3>{{content.object.metadata.pres_title}}</h3>\n    <div class=\"begin\">{{content.object.metadata.pres_first}}</div>\n    <p>{{content.object.metadata.pres_second}}</p>\n  </div>\n</template>\n\n<script>\nexport default {\n    name: 'Description',\n    props: ['content']\n}\n</script>\n\n<style scoped lang=\"scss\">\n    @import '@/styles/constants.scss';\n\n    .paragraph {\n        color: map-get($colors, primary);\n        .begin {\n            color: map-get($colors, secondary);\n        }\n    }\n</style>\n"
  },
  {
    "path": "src/components/Projects.vue",
    "content": "<template>\n  <section id=\"projects\">\n    <AnimateOnVisible name=\"fadeDown\" :duration=\"1\">\n\t\t<Title\n\t\tclass=\"title\"\n\t\t:title=\"content.object.metadata.title\"\n\t\t:description=\"content.object.metadata.description\"\n\t\t/>\n    </AnimateOnVisible>\n\n    <div class=\"container-fluid center-block\">\n      <article class=\"content text-center\">\n\n\t\t<AnimateOnVisible class=\"timeline mx-auto\" v-for=\"(post, index) in content.object.metadata.items\" :key=\"index\" name=\"fadeLeft\" :duration=\"0.5\">\n\t\t\t<vue-timeline-update\n        :date=\"new Date(post.date)\"\n        :title=\"post.title\"\n        :description=\"post.content\"\n        :thumbnail=\"getImgUrl(post.image)\"\n        :color=\"post.color\"\n        :category=\"post.tag\"\n        icon=\"code\"\n      />\n\t\t</AnimateOnVisible>\n      </article>\n    </div>\n  </section>\n</template>\n\n<script>\nimport Title from \"./Title.vue\";\n\nexport default {\n  name: \"Projects\",\n  props: ['content'],\n  components: {\n    Title\n  },\n  methods: {\n    getImgUrl(img) {\n      if(img == undefined || img == \"\")\n        return \"\"\n      else if(/^https:\\/\\/cdn\\.cosmicjs\\.com\\/.+\\.(jpg|png|gif)$/.test(img))\n        return img\n      return require('../assets/img/projects/'+img)\n    },\n  },\n};\n</script>\n\n<style scoped lang=\"scss\">\n@import \"@/styles/constants.scss\";\n\n$linear: map-get($colors, dark);\n\n#projects {\n  background-color: lighten(map-get($colors, primary), 5%);\n\n}\n\n.title {\n  color: map-get($colors, light);\n}\n\n/deep/ .text-wrapper {\n  &:after {\n    border-bottom: 1px solid map-get($colors, dark);\n  }\n}\n\narticle .inner {\n    position: relative;\n    display: inline-block;\n    vertical-align: middle;\n    z-index: 1;\n}\n\n.content {\n    color: map-get($colors, light);\n    margin-top: 30px;\n    header {\n        height: 100%;\n        width: 70%;\n    }\n    h1{\n        font-size: 3rem;\n    }\n}\n\n.vertical-center {\n    display: flex;\n    align-items: center;\n}\n\nh1 {\n    margin-top: 10px;\n    margin-bottom: 20px;\n}\n</style>\n"
  },
  {
    "path": "src/components/Skills.vue",
    "content": "<template>\n    <section id=\"skills\">\n        <AnimateOnVisible name=\"fadeDown\" :duration=\"1\">\n            <Title :title=\"content.object.metadata.title\" :description=\"content.object.metadata.description\" />\n        </AnimateOnVisible>\n\n        <div class=\"section-content\">\n            <div class=\"container-fluid\">\n                <div class=\"row d-flex flex-wrap align-items-center\">\n                    <div class=\"col-md-2 m-auto pb-4\" v-for=\"(post, index) in this.content.object.metadata.items\" :key=\"index\">\n                        <AnimateOnVisible name=\"bounce\">\n                            <img id=\"imgLogo\" class=\"img-responsive mx-auto d-block\" :src=\"getImgUrl(post.img)\" :alt=\"post.title\"/>\n                            <div id=\"divAlt\" class=\"altCaption text-center\">{{post.title}}</div>\n                        </AnimateOnVisible>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </section>\n</template>\n\n<script>\n    import Title from './Title.vue'\n\n    export default {\n        name: 'Skills',\n        components: {\n            Title,\n        },\n        props: ['content'],\n        methods: {\n            getImgUrl(img) {\n                return require('../assets/img/logo/'+img);\n            },\n        },\n    }\n</script>\n\n<style scoped lang=\"scss\">\n    @import '@/styles/constants.scss';\n\n    #skills {\n        background-color: lighten(map-get($colors, dark), 100%);\n    }\n\n    @media(min-width: #{map-get($breakpoints, medium)}) {\n        .section-content {\n            width: 80%;\n            margin: 0 auto;\n        }\n    }\n\n    img{\n        max-width: 120px;\n    }\n\n    .altCaption{\n        color: map-get($colors, secondary);\n        margin-top: 1rem;\n    }\n</style>\n"
  },
  {
    "path": "src/components/SocialBar.vue",
    "content": " <template>\n  <div class=\"social-wrap\">\n    <ul>\n      <li>\n        <a :href=\"links.object.metadata.facebook\" target=\"_blank\">\n          <font-awesome-icon class=\"icon\" :icon=\"['fab', 'facebook-square']\" />\n        </a>\n      </li>\n      <li>\n        <a :href=\"links.object.metadata.instagram\" target=\"_blank\">\n          <font-awesome-icon class=\"icon\" :icon=\"['fab', 'instagram-square']\" />\n        </a>\n      </li>\n      <li>\n        <a :href=\"links.object.metadata.linkedin\" target=\"_blank\">\n          <font-awesome-icon class=\"icon\" :icon=\"['fab', 'linkedin']\" />\n        </a>\n      </li>\n      <li>\n        <a :href=\"links.object.metadata.github\" target=\"_blank\">\n          <font-awesome-icon class=\"icon\" :icon=\"['fab', 'github-square']\" />\n        </a>\n      </li>\n    </ul>\n  </div>\n</template>\n\n<script>\n    export default {\n        name: 'SocialBar',\n        props: ['links'],\n    }\n</script>\n\n<style scoped lang=\"scss\">\n  @import '@/styles/constants.scss';\n .social-wrap {\n    li {\n      display: inline-block;\n      margin-right: 10px;\n    }\n    .icon {\n      font-size: 3rem;\n    }\n  }\n</style>\n"
  },
  {
    "path": "src/components/Title.vue",
    "content": "<template>\n    <div class=\"title\">\n      <h2>{{ title }}</h2>\n      <div class=\"wrapper\">\n        <div class=\"text-wrapper\">{{ description }}</div>\n      </div>\n    </div>\n</template>\n\n<script>\n  export default {\n    name: 'Title',\n    props: [\n      'title',\n      'description'\n    ]\n  }\n</script>\n\n<style scoped lang=\"scss\">\n  @import '@/styles/constants.scss';\n\n  .title {\n    text-align: center;\n    color: map-get($colors, primary);\n    h2 {\n      font-size: 4rem;\n      text-transform: uppercase;\n    }\n  }\n\n  .text-wrapper {\n    text-transform: uppercase;\n    &:after {\n      content: \"\";\n      width: 150px;\n      display: block;\n      margin: 20px auto;\n      border-bottom: 1px solid map-get($colors, primary);\n    }\n  }\n</style>"
  },
  {
    "path": "src/cosmic.js",
    "content": "import { createBucketClient } from '@cosmicjs/sdk';\n\nexport const cosmic = createBucketClient({\n  bucketSlug: process.env.VUE_APP_COSMICJS_BUCKET_SLUG,\n  readKey: process.env.VUE_APP_COSMICJS_BUCKET_READ_KEY,\n});\n"
  },
  {
    "path": "src/main.js",
    "content": "import Vue from 'vue'\nimport BootstrapVue from 'bootstrap-vue';\nimport App from './App.vue'\n\nimport AnimateOnVisible from \"./components/AnimateOnVisible.vue\"\n\nVue.use(BootstrapVue)\n\nimport VueTimeline from \"@growthbunker/vuetimeline\";\n\nVue.use(VueTimeline);\n\nimport { library } from '@fortawesome/fontawesome-svg-core'\nimport { faCopyright} from '@fortawesome/free-solid-svg-icons'\nimport { faFacebookSquare, faInstagramSquare, faLinkedin, faGithubSquare } from '@fortawesome/free-brands-svg-icons'\nimport { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'\n\nlibrary.add(faCopyright, faFacebookSquare, faInstagramSquare, faLinkedin, faGithubSquare)\n\nVue.component('font-awesome-icon', FontAwesomeIcon)\nVue.component('AnimateOnVisible', AnimateOnVisible)\nVue.config.productionTip = false\n\nnew Vue({\n  render: h => h(App),\n}).$mount('#app')\n\nimport 'bootstrap/dist/css/bootstrap.css'\nimport 'bootstrap-vue/dist/bootstrap-vue.css'\nimport './styles/global.scss'\n"
  },
  {
    "path": "src/styles/animation.scss",
    "content": "$animationDuration: 1s !default;\n\n@import \"~vue2-animate/src/sass/vue2-animate.scss\";"
  },
  {
    "path": "src/styles/constants.scss",
    "content": "$colors: (\n  primary: #353535,\n  secondary: #3C6E71,\n  complementary: #284B63,\n  light: whitesmoke,\n  dark: #D9D9D9,\n  error: #ff2818,\n);\n\n$breakpoints: (\n  small: 767px,\n  medium: 992px,\n  large: 1200px,\n);\n\n@font-face {\n    font-family: \"Montserrat-Regular\";\n    src: url(\"~@/assets/fonts/Montserrat-Medium.ttf\");\n}"
  },
  {
    "path": "src/styles/global.scss",
    "content": "@import './constants';\n@import './animation.scss';\n\nbody,\nhtml {\n  height: 100%;\n  font-size: 10px;\n}\n\nbody {\n  font-size: 14px;\n  min-width: 320px;\n  position: relative;\n  line-height: 1.4;\n  font-weight: normal;\n  color: lighten(map-get($colors, primary), 100%);\n\n  &.loading {\n    overflow: scroll;\n  }\n}\n\n\nsection {\n  padding: 50px 0;\n  overflow: hidden;\n\n  h3 {\n    text-transform: uppercase;\n    font-weight: 600;\n    margin-bottom: 30px;\n  }\n}\n\nul {\n  margin: 0;\n  padding: 0;\n  list-style-type: none;\n}\n\na {\n  color: map-get($colors, secondary);\n\n  &:hover {\n    color: map-get($colors, dark);\n    text-decoration: none;\n  }\n}\n\nli {\n  margin-bottom: 10px;\n}\n\n.timeline {\n  @media (max-width: #{map-get($breakpoints, medium)}) {\n    width: 100%;\n  }\n\n  @media (min-width: #{map-get($breakpoints, medium)}) {\n    width: 60%\n  }\n}\n\n[class^=\"gb-\"]:not(.gb-base-icon) {\n  font-family: Montserrat-Regular, Helvetica, sans-serif !important;\n}\n"
  }
]