[
  {
    "path": ".editorconfig",
    "content": "; https://editorconfig.org\n\nroot = true\n\n[*]\ncharset = utf-8\nend_of_line = lf\nindent_size = 2\nindent_style = space\ntrim_trailing_whitespace = true\ninsert_final_newline = true\n\n[*.md]\ntrim_trailing_whitespace = false"
  },
  {
    "path": ".eslintrc.json",
    "content": "{\n  \"extends\": \"next/core-web-vitals\"\n}\n"
  },
  {
    "path": ".gitignore",
    "content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\nyarn.lock\npackage-lock.json\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n/.json\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n.pnpm-debug.log*\n\n# local env files\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\n# vercel\n.vercel\n\n# Local Netlify folder\n.netlify\n"
  },
  {
    "path": ".sitepins/config.json",
    "content": "{\n  \"media\": \"public/images\",\n  \"content\": \"content\",\n  \"code\": \"layouts\",\n  \"arrangement\": [],\n  \"public\": \"public\",\n  \"configs\": [\n    \"config\"\n  ]\n}"
  },
  {
    "path": ".sitepins/schema/posts.json",
    "content": "{\n  \"file\": \"content/posts/post-1.md\",\n  \"name\": \"posts\",\n  \"fileType\": \"md\",\n  \"fmType\": \"yaml\",\n  \"template\": [\n    {\n      \"name\": \"title\",\n      \"label\": \"Title\",\n      \"type\": \"string\",\n      \"value\": \"\",\n      \"isRequired\": true,\n      \"defaultValue\": \"\"\n    },\n    {\n      \"name\": \"date\",\n      \"label\": \"Date\",\n      \"type\": \"Date\",\n      \"value\": \"\",\n      \"isRequired\": true,\n      \"defaultValue\": \"\",\n      \"alwaysUseCurrentDate\": false\n    },\n    {\n      \"name\": \"image\",\n      \"label\": \"Image\",\n      \"type\": \"media\",\n      \"value\": \"\",\n      \"isRequired\": true,\n      \"defaultValue\": \"\"\n    },\n    {\n      \"name\": \"categories\",\n      \"label\": \"Categories\",\n      \"type\": \"Array\",\n      \"value\": [],\n      \"isRequired\": true,\n      \"defaultValue\": \"\"\n    },\n    {\n      \"name\": \"featured\",\n      \"label\": \"Featured\",\n      \"type\": \"boolean\",\n      \"value\": false,\n      \"defaultValue\": \"\"\n    },\n    {\n      \"name\": \"draft\",\n      \"label\": \"Draft\",\n      \"type\": \"boolean\",\n      \"value\": false,\n      \"defaultValue\": \"\"\n    }\n  ]\n}"
  },
  {
    "path": "README.md",
    "content": "<h1 align=center>Geeky Nextjs</h1>\n<p align=center>Geeky is a free NextJs personal blog template</p>\n<h2 align=\"center\"> <a target=\"_blank\" href=\"https://geeky-nextjs.vercel.app/\" rel=\"nofollow\">Demo</a> | <a  target=\"_blank\" href=\"https://pagespeed.web.dev/report?url=https%3A%2F%2Fgeeky-nextjs.vercel.app%2F&form_factor=desktop\">Page Speed (100%)</a>\n</h2>\n\n<p align=center>\n  <a href=\"https://github.com/vercel/next.js/releases/tag/v13.0.6\" alt=\"Contributors\">\n    <img src=\"https://img.shields.io/static/v1?label=NEXTJS&message=13.0&color=000&logo=nextjs\" />\n  </a>\n\n  <a href=\"https://github.com/statichunt/geeky-nextjs/blob/main/LICENSE\">\n    <img src=\"https://img.shields.io/github/license/statichunt/geeky-nextjs\" alt=\"license\"></a>\n\n  <img src=\"https://img.shields.io/github/languages/code-size/statichunt/geeky-nextjs\" alt=\"code size\">\n\n  <a href=\"https://github.com/statichunt/geeky-nextjs/graphs/contributors\">\n    <img src=\"https://img.shields.io/github/contributors/statichunt/geeky-nextjs\" alt=\"contributors\"></a>\n</p>\n\n---\n\n<p align=\"center\">\n \n![geeky-hugo-startup-theme](https://user-images.githubusercontent.com/17677384/140605658-0c68cf6c-d15a-4f0d-8e66-1060ce636d20.png)\n</p>\n\n---\n\n## Key Features\n\n- Google Page Speed score 100! (Desktop)\n- Supports Contact Form\n- Disqus Comment Support\n- Related Posts Suggestion\n- MDX Support with many built-in custom components\n- Semantic HTML Document Structure\n- Custom Logo Support\n- Includes All SCSS Files\n- Taxonomy Page Support\n- Images Optimized With Next/image\n\n<!-- installation -->\n## Installation\n\nAfter downloading the template, you have some prerequisites to install. Then you can run it on your localhost. You can view the package.json file to see which scripts are included.\n\n### Install prerequisites (once for a machine)\n\n- **Node Installation:** [Install node js](https://nodejs.org/en/download/) [Recommended LTS version]\n\n### Local setup\n\nAfter successfully installing those dependencies, open this template with any IDE [[VS Code](https://code.visualstudio.com/) recommended], and then open the internal terminal of IDM [vs code shortcut <code>ctrl/cmd+\\`</code>]\n\n- Install dependencies\n\n```\nnpm install\n```\n\n- Run locally\n\n```\nnpm run dev\n```\n\nAfter that, it will open up a preview of the template in your default browser, watch for changes to source files, and live-reload the browser when changes are saved.\n\n## Production Build\n\nAfter finishing all the customization, you can create a production build by running this command.\n\n```\nnpm run build\n```\n<!-- edit with sitepins -->\n\n## 📝 Edit Content with CMS\n\nThis template comes pre-configured with [**Sitepins**](https://sitepins.com), a Git-based Headless CMS designed for seamless content management. You can update your website’s text, images, and configuration without touching a single line of code.\n\n**How to get started:**\n\nClick the Edit with Sitepins button below and follow the on-screen instructions to start editing your content visually.\n\n  <a target=\"_blank\" href=\"https://app.sitepins.com/new/clone?name=Geeky%20Nextjs&repository=https://github.com/statichunt/geeky-nextjs/\">\n    <img src=\"https://sitepins.com/button.svg\" alt=\"Edit with Sitepins\">\n  </a>\n\n<!-- reporting issue -->\n## Reporting Issues\n\nWe use GitHub Issues as the official bug tracker for this Template. Please Search [existing issues](https://github.com/statichunt/geeky-nextjs/issues). It’s possible someone has already reported the same problem.\nIf your problem or idea has not been addressed yet, feel free to [open a new issue](https://github.com/statichunt/geeky-nextjs/issues).\n\n<!-- licence -->\n## License\n\nCopyright (c) 2019 - Present, Designed & Developed by [statichunt](https://statichunt.com)\n\n**Code License:** Released under the [MIT](https://github.com/statichunt/geeky-nextjs/blob/main/LICENSE) license.\n\n**Image license:** The images are only for demonstration purposes. They have their license, we don't have permission to share those images.\n"
  },
  {
    "path": "config/config.json",
    "content": "{\n  \"site\": {\n    \"title\": \"Geeky Nextjs\",\n    \"base_url\": \"/\",\n    \"favicon\": \"/images/favicon.png\",\n    \"logo\": \"/images/logo.png\",\n    \"logo_white\": \"/images/logo-light.png\",\n    \"logo_width\": \"150\",\n    \"logo_height\": \"39\",\n    \"logo_text\": \"Geeky\"\n  },\n  \"settings\": {\n    \"theme_switcher\": true,\n    \"default_theme\": \"system\",\n    \"pagination\": 6,\n    \"InnerPaginationOptions\": {\n      \"enableTop\": false,\n      \"enableBottom\": true\n    },\n    \"summary_length\": 200,\n    \"blog_folder\": \"posts\"\n  },\n  \"params\": {\n    \"tag_manager_id\": \"\",\n    \"footer_content\": \"Lorem ipsum dolor sit amt, conse adip iscing. donec iaculis tempasus laoreet. Libero ullam rgscper.\",\n    \"copyright\": \"Designed and Developed By [Statichunt](https://statichunt.com/)\"\n  },\n  \"metadata\": {\n    \"meta_author\": \"Statichunt\",\n    \"meta_image\": \"/images/og-image.png\",\n    \"meta_description\": \"Geeky Nextjs Personal Blog Template\"\n  },\n  \"widgets\": {\n    \"about\": {\n      \"enable\": true,\n      \"content\": \"Lorem ipsum dolor sit amet, conse tfctetur adipiscing elit. Vel in in donec iaculis tempasus odio nunc laoreet . Libero ullam rgscorper.\"\n    },\n    \"featured_posts\": {\n      \"enable\": true,\n      \"title\": \"Blog Categories\",\n      \"showPost\": 3\n    },\n    \"categories\": {\n      \"enable\": true,\n      \"title\": \"Blog Categories\"\n    },\n    \"newsletter\": {\n      \"enable\": true,\n      \"title\": \"Newsletter\",\n      \"content\": \"Join thousands of Tiny Salt subscribers and get our best recipes delivered each week!\",\n      \"privacy_policy_page\": \"#\",\n      \"malichipm_url\": \"\"\n    }\n  },\n  \"disqus\": {\n    \"enable\": true,\n    \"shortname\": \"themefisher-template\",\n    \"settings\": {}\n  }\n}\n"
  },
  {
    "path": "config/menu.json",
    "content": "{\n  \"main\": [\n    {\n      \"name\": \"Home\",\n      \"url\": \"/\"\n    },\n    {\n      \"name\": \"About\",\n      \"url\": \"/about\"\n    },\n    {\n      \"name\": \"Elements\",\n      \"url\": \"/elements\"\n    },\n    {\n      \"name\": \"Contact\",\n      \"url\": \"/contact\"\n    },\n    {\n      \"name\": \"Pages\",\n      \"url\": \"\",\n      \"hasChildren\": true,\n      \"children\": [\n        {\n          \"name\": \"Categories\",\n          \"url\": \"/categories\"\n        }\n      ]\n    }\n  ],\n  \"footer\": [\n    {\n      \"name\": \"Home\",\n      \"url\": \"/\"\n    },\n    {\n      \"name\": \"About\",\n      \"url\": \"/about\"\n    },\n    {\n      \"name\": \"Contact\",\n      \"url\": \"/contact\"\n    },\n    {\n      \"name\": \"Privacy Policy\",\n      \"url\": \"#\"\n    }\n  ]\n}\n"
  },
  {
    "path": "config/social.json",
    "content": "{\n  \"facebook\": \"https://facebook.com/\",\n  \"stackoverflow\": \"https://stackoverflow.com/\",\n  \"twitter\": \"https://twitter.com/\",\n  \"instagram\": \"https://instagram.com/\",\n  \"youtube\": \"\",\n  \"linkedin\": \"https://linkedin.com/\",\n  \"github\": \"https://github.com/\",\n  \"gitlab\": \"\",\n  \"discord\": \"\",\n  \"slack\": \"\",\n  \"medium\": \"\",\n  \"codepen\": \"\",\n  \"bitbucket\": \"\",\n  \"dribbble\": \"\",\n  \"behance\": \"\",\n  \"pinterest\": \"\",\n  \"soundcloud\": \"\",\n  \"tumblr\": \"\",\n  \"reddit\": \"\",\n  \"vk\": \"\",\n  \"whatsapp\": \"\",\n  \"snapchat\": \"\",\n  \"vimeo\": \"\",\n  \"tiktok\": \"\",\n  \"foursquare\": \"\",\n  \"rss\": \"\",\n  \"email\": \"\",\n  \"phone\": \"\",\n  \"address\": \"\",\n  \"skype\": \"\",\n  \"website\": \"\"\n}\n"
  },
  {
    "path": "config/theme.json",
    "content": "{\n  \"colors\": {\n    \"default\": {\n      \"theme_color\": {\n        \"primary\": \"#2ba283\",\n        \"body\": \"#fff\",\n        \"border\": \"#e1e1e1\",\n        \"theme_light\": \"#f2f2f2\",\n        \"theme_dark\": \"#1a202c\"\n      },\n      \"text_color\": {\n        \"default\": \"#555\",\n        \"dark\": \"#222\",\n        \"light\": \"#999\"\n      }\n    },\n    \"darkmode\": {\n      \"theme_color\": {\n        \"primary\": \"#059669\",\n        \"body\": \"#111\",\n        \"border\": \"#636363\",\n        \"theme_light\": \"#f4f7f7\",\n        \"theme_dark\": \"#383848\"\n      },\n      \"text_color\": {\n        \"default\": \"#a4a4a4\",\n        \"dark\": \"#ddd\",\n        \"light\": \"#fff\"\n      }\n    }\n  },\n  \"fonts\": {\n    \"font_family\": {\n      \"primary\": \"Raleway:wght@400\",\n      \"primary_type\": \"sans-serif\",\n      \"secondary\": \"Merriweather Sans:wght@400;700\",\n      \"secondary_type\": \"sans-serif\"\n    },\n    \"font_size\": {\n      \"base\": \"16\",\n      \"scale\": \"1.200\"\n    }\n  }\n}\n"
  },
  {
    "path": "content/404.md",
    "content": "---\ntitle: \"Error 404\"\nlayout: \"404\"\n---\n\n## Page Not Found\n"
  },
  {
    "path": "content/_index.md",
    "content": "---\nbanner:\n  title: Welcome **!**\n  title_small: \"to John Bravo's Blog\"\n  content: Are Developer and recently started your own business Already made website to ensure presence wants to develop.\n  image_enable: true\n  image: /images/banner-author.png\n  button:\n    enable: true\n    label: Know About Me\n    link: /about\n    rel: \"\"\n\nfeatured_posts:\n  enable: true\n  title: Featured Posts\n\npromotion:\n  enable: true\n  image: /images/promotion.png\n  link: \"#\"\n\nrecent_posts:\n  title: Recent Posts\n  enable: true\n\n---\n"
  },
  {
    "path": "content/about.md",
    "content": "---\ntitle: About The Author\nimage: /images/author.png\ndescription: \"meta description\"\nlayout: about\neducation:\n  title: Formal Education\n  degrees:\n    - university: \"Southeast University\"\n      content: \"1985 • 1991 • gravida nibh velvelit auctor alimo quet menean solli\"\n    - university: \"Northeast University\"\n      content: \"1985 • 1991 • gravida nibh velvelit auctor alimo quet menean solli\"\n    - university: \"Easteast University\"\n      content: \"1985 • 1991 • gravida nibh velvelit auctor alimo quet menean solli\"\n    - university: \"Southeast University\"\n      content: \"1985 • 1991 • gravida nibh velvelit auctor alimo quet menean solli\"  \n\nexperience:\n  title: Work Experience\n  list:\n    - Best Writer Award\n    - Best New Newel\n    - Best Book\n    - Best Article\n    - Best New Newel\n    - Best New Newel\n    - Best Book\n    - Best Article\n    - Best New Newel\n    - Best Book\n\n---\n\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi amet, ultrices scelerisue cras. Tincidunt hendrerit egestas venenatis risus sit nunc. Est esglit non in ipsum lect;aaus adipiscing et enim porttitor. Dui ultrices et volud eetpat nunc, turpis rutrum elit vestibululm ipsum. Arcu fringilla duis vitae mos dsdllis duicras interdum purus cursus massa metus. Acc umsan felaais, egsdvet nisi, viverra turpis fermentum sit suspf bafedfb ndisse fermentum consectetur. Facilisis feugiat trisique orci tempor sed masd fbsssa tristique ultrices sodales. Augue est sapien elementum facilisis. Enim tincidnt cras interdum purus ndisse. morbi quis nunc.\n\nEt dolor placerat tempus risus nunc urna, nunc a. Mattis viverra ut sapidaaen enim sed tortor. Mattis gravida fusce cras interdum purus cursus massa metus. Acc umsan felaais, eget nisi, viverra turpis fermentum sit suspf bafedfb ndisse. morbi quis nunc, at arcu quam facilisi. In in lacus aliquam dictum sagittis morbi odio. Et magnis cursus sem sed condimentum. Nibh non potenti ac amsdfet Tincidunt hendrerit egestas venenatis risus sit nunc. Est esglit non in ipsuasdm lect;aaus adipiscing et enim porttitor. Dui ultrices et volud eetpat nunc, turpis ndisse. morbi quis nunc, at arcu quam facilisi ndisse. morbi quis nunc, at arcu quam facilisi\n"
  },
  {
    "path": "content/contact.md",
    "content": "---\ntitle: \"Let’s, Talk </br> About You\"\ndescription: \"meta description\"\nphone: \"+211234565523\"\nmail: \"info@email.com\"\nlocation: \"9567 Turner Trace Apt. BC C3G8A4\"\nform_action: \"#\"\nlayout: \"contact\"\naddresses:\n  - icon: FaUserAlt\n    content: +211234565523\n    link: tel:+211234565523\n  - icon: FaMapMarkerAlt\n    content: info@email.com\n    link: mailto:info@email.com\n  - icon: FaLocation\n    content: 9567 Turner Trace Apt. BC C3G8A4\n\ndraft: false\n---\n"
  },
  {
    "path": "content/elements.md",
    "content": "---\ntitle: \"Elements\"\ndraft: false\n---\n\n# Heading 1\n\n## Heading 2\n\n### Heading 3\n\n#### Heading 4\n\n##### Heading 5\n\n###### Heading 6\n\n---\n\n### Paragraph\n\nDid you come here for something in particular or just general Riker-bashing? And blowing into maximum warp speed, you appeared for an instant to be in two places at once. We have a saboteur aboard. We know you’re dealing in stolen ore. But I wanna talk about the assassination attempt on Lieutenant Worf. Could someone survive inside a transporter buffer for 75 years? Fate. It protects fools, little children, and ships.\n\nDid you come here for something in particular or just general Riker-bashing? And blowing into maximum warp speed, you appeared for an instant to be in two places at once. We have a saboteur aboard. We know you’re dealing in stolen ore. But I wanna talk about the assassination attempt on Lieutenant Worf. Could someone survive inside a transporter buffer for 75 years? Fate. It protects fools, little children, and ships.\n\n---\n\n### Emphasis\n\n1. Did you come here for something in **particular** or just general\n\n2. Did you come here for something in <ins>particular</ins>\n\n3. _Did you come here_\n\n4. Did you come here for **something** in particular\n\n5. Did you come here for something in particular\n\n6. Did you come here for something in particular\n\n7. URLs and URLs in angle brackets will automatically get turned into links. [http://www.example.com](http://www.example.com) or\n\n8. [http://www.example.com](http://www.example.com) and sometimes example.com (but not on Github, for example).\n\n---\n\n### Link\n\n[I'm an inline-style link](https://www.google.com)\n\n[I'm an inline-style link with title](https://www.google.com \"Google's Homepage\")\n\n[I'm a reference-style link][arbitrary case-insensitive reference text]\n\n[I'm a relative reference to a repository file](../blob/master/LICENSE)\n\n[You can use numbers for reference-style link definitions][1]\n\nOr leave it empty and use the [link text itself].\n\nexample.com (but not on Github, for example).\n\nSome text to show that the reference links can follow later.\n\n[arbitrary case-insensitive reference text]: https://www.themefisher.com\n[1]: https://gethugothemes.com\n[link text itself]: https://www.getjekyllthemes.com\n\n---\n\n### Ordered List\n\n1. List item\n2. List item\n3. List item\n4. List item\n5. List item\n\n---\n\n### Unordered List\n\n- List item\n- List item\n- List item\n- List item\n- List item\n\n---\n\n### Code and Syntax Highlighting\n\n#### HTML\n\n<Code language=\"html\">\n{`<ul>\n  <li class=\"nav-item\">\n    <a class=\"nav-link\" href=\"/\">Home</a>\n  </li>\n  <li class=\"nav-item\">\n    <a class=\"nav-link\" href=\"about/\">About</a>\n  </li>\n</ul>`}\n</Code>\n\n---\n\n#### CSS\n\n<Code language=\"css\">\n{`img {\n  vertical-align: middle;\n  border: 0;\n  max-width: 100%;\n  height: auto;\n}`}\n</Code>\n\n---\n\n#### JavaScript\n\n<Code language=\"javascript\">\n{`window.addEventListener(\"load\", (e) => {\n  document.querySelector(\".preloader\").style.display = \"none\";\n})`}\n</Code>\n\n---\n\n### Button\n\n<Button href=\"#\" type=\"solid\">Button</Button>\n\n---\n\n### Quote\n\n> Did you come here for something in particular or just general Riker-bashing? And blowing into maximum warp speed, you appeared for an instant to be in two places at once.\n\n---\n\n### Notice\n\n<Notice type=\"note\">\n  This is a simple note.\n</Notice>\n\n<Notice type=\"tip\">\n  This is a simple note.\n</Notice>\n\n<Notice type=\"info\">\n  This is a simple note.\n</Notice>\n\n<Notice type=\"warning\">\n  This is a simple note.\n</Notice>\n\n---\n\n<Tabs>\n\n<Tab name=\"Tab 1\">\n\n#### Did you come here for something in particular?\n\nDid you come here for something in particular or just general Riker-bashing? And blowing into maximum warp speed, you appeared for an instant to be in two places at once. We have a saboteur aboard. We know you’re dealing in stolen ore. But I wanna talk about the assassination attempt on Lieutenant Worf.\n</Tab>\n\n<Tab name=\"Tab 2\">\n\n#### I wanna talk about the assassination attempt\n\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n</Tab>\n\n<Tab name=\"Tab 3\">\n\n#### We know you’re dealing in stolen ore\n\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.\n\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo\n</Tab>\n\n</Tabs>\n\n---\n\n### Table\n\n| #   |    First     |     Last     |       Handle |\n| :-- | :----------: | :----------: | -----------: |\n| 1   | Row:1 Cell:1 | Row:1 Cell:2 | Row:1 Cell:3 |\n| 2   | Row:2 Cell:1 | Row:2 Cell:2 | Row:2 Cell:3 |\n| 3   | Row:3 Cell:1 | Row:3 Cell:2 | Row:3 Cell:3 |\n\n---\n\n### Collapse\n\n<Accordion title=\"Why should you need to do this?\">\n\n- This is a thing.\n- This is a thing.\n- This is a thing.\n- This is a thing.\n- This is a thing.\n\n</Accordion>\n\n<Accordion title=\"How can I adjust Horizontal centering\">\n\n- This is a thing.\n- This is a thing.\n- This is a thing.\n- This is a thing.\n- This is a thing.\n\n</Accordion>\n\n<Accordion title=\"Should you use Negative margin?\">\n\n- This is a thing.\n- This is a thing.\n- This is a thing.\n- This is a thing.\n- This is a thing.\n\n</Accordion>\n\n---\n\n### Image\n\n![image](/images/post/post-1.png)\n\n---\n\n### Youtube video\n\n<Youtube id=\"ZEe-IFezQok\" title=\"Play:Youtube\"/>\n\n---\n\n### Custom video\n\n<Video width=\"100%\" src=\"https://joy1.videvo.net/videvo_files/video/free/video0467/large_watermarked/_import_61516692993d77.04238324_preview.mp4\" />\n"
  },
  {
    "path": "content/posts/_index.md",
    "content": "---\ntitle: \"Blog Posts\"\n---\n"
  },
  {
    "path": "content/posts/post-1.md",
    "content": "---\ntitle: \"How to make toys from old Olarpaper\"\ndate: 2022-04-04T01:00:00Z\nimage: /images/post/post-1.png\ncategories: [\"programming\"]\nfeatured: true\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-10.md",
    "content": "---\ntitle: \"My work from home workstation\"\ndate: 2022-04-04T10:00:00Z\nimage: /images/post/post-2.png\ncategories: [\"programming\"]\nfeatured: false\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-11.md",
    "content": "---\ntitle: \"Robotic world is growing very fast\"\ndate: 2022-04-04T11:00:00Z\nimage: /images/post/post-3.png\ncategories: [\"assistance\"]\nfeatured: false\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-12.md",
    "content": "---\ntitle: \"What is a Virtual Assistant\"\ndate: 2022-04-04T12:00:00Z\nimage: /images/post/post-4.png\ncategories: [\"github\"]\nfeatured: true\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-13.md",
    "content": "---\ntitle: \"Why you need to learn PHP\"\ndate: 2022-04-04T13:00:00Z\nimage: /images/post/post-5.png\ncategories: [\"youtube\", \"artificial-intelligence\"]\nfeatured: false\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-14.md",
    "content": "---\ntitle: \"What you need to know about Programming\"\ndate: 2022-04-04T14:00:00Z\nimage: /images/post/post-6.png\ncategories: [\"robotics\", \"youtube\"]\nfeatured: false\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-15.md",
    "content": "---\ntitle: \"How to make toys from old Olarpaper\"\ndate: 2022-04-04T15:00:00Z\nimage: /images/post/post-7.png\ncategories: [\"robotics\", \"assistance\"]\nfeatured: false\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-2.md",
    "content": "---\ntitle: My work from home workstation\ndate: 2022-04-04T02:00:00Z\nimage: /images/post/post-2.png\ncategories: [\"drone\"]\nfeatured: true\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-3.md",
    "content": "---\ntitle: What you need to know about Photography\ndate: 2022-04-02T03:00:00+00:00\nimage: /images/post/post-3.png\ncategories: [\"workstation\"]\nfeatured: true\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-4.md",
    "content": "---\ntitle: \"How to make toys from old Olarpaper\"\ndate: 2022-04-04T04:00:00Z\nimage: /images/post/post-4.png\ncategories: [\"robotics\", \"programming\"]\nfeatured: false\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-5.md",
    "content": "---\ntitle: \"How to make toys from old Olarpaper\"\ndate: 2022-04-04T05:00:00Z\nimage: /images/post/post-5.png\ncategories: [\"assistance\", \"github\"]\nfeatured: true\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Work From Home\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!quatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-6.md",
    "content": "---\ntitle: \"How to make toys from old Olarpaper\"\ndate: 2022-04-04T06:00:00Z\nimage: /images/post/post-6.png\ncategories: [\"artificial-intelligence\", \"programming\"]\nfeatured: true\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-7.md",
    "content": "---\ntitle: \"Artificial Intelligence and Robotics In A Nutshell\"\ndate: 2022-04-04T07:00:00Z\nimage: /images/post/post-7.png\ncategories: [\"programming\", \"youtube\"]\nfeatured: false\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-8.md",
    "content": "---\ntitle: \"Drone Software and Development\"\ndate: 2022-04-04T08:00:00Z\nimage: /images/post/post-8.png\ncategories: [\"drone\", \"robotics\"]\nfeatured: true\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "content/posts/post-9.md",
    "content": "---\ntitle: \"Github Repository Controls\"\ndate: 2022-04-04T09:00:00Z\nimage: /images/post/post-1.png\ncategories: [\"workstation\", \"youtube\"]\nfeatured: false\ndraft: false\n---\n\nNemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n## Covid-19 Situation\n\nNam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.\n\n> Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n\n![alter-text](/images/post/post-1.png)\n*Example Caption*\n\nLorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius! Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!\n"
  },
  {
    "path": "context/state.js",
    "content": "import { createContext, useContext } from \"react\";\nimport posts from \"../.json/posts.json\";\n\nconst SearchContext = createContext();\n\nexport const JsonContext = ({ children }) => {\n  const state = {\n    posts,\n  };\n  return (\n    <SearchContext.Provider value={state}>{children}</SearchContext.Provider>\n  );\n};\n\nexport const useSearchContext = () => {\n  return useContext(SearchContext);\n};\n"
  },
  {
    "path": "hooks/useLoadMore.js",
    "content": "import { useEffect, useState } from \"react\";\n\n// how to use\n// const { loadedItems, loadItemsHandler, loadItemsFinished } = useLoadMore(filteredWebsites,6,mounted);\n// returns {loadedItems, loadItemsHandler, loadItemsFinished}\n\nconst useLoadMore = (items, loadPerClick, mounted) => {\n  const [loadedItems, setLoadedItems] = useState([]);\n  const [next, setNext] = useState(loadPerClick);\n\n  const loadItems = (start, end) => {\n    const slicedItems = items.slice(start, end);\n    setLoadedItems([...loadedItems, ...slicedItems]);\n  };\n\n  const loadItemsHandler = () => {\n    loadItems(next, next + loadPerClick);\n    setNext(next + loadPerClick);\n  };\n\n  useEffect(() => {\n    loadItems(0, loadPerClick);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [mounted]);\n\n  const loadItemsFinished = Number(items.length) == Number(loadedItems.length);\n\n  return {\n    loadedItems,\n    loadItemsHandler,\n    loadItemsFinished,\n  };\n};\n\nexport default useLoadMore;\n"
  },
  {
    "path": "hooks/useOs.js",
    "content": "import { useEffect, useState } from \"react\";\n\n// how to use\n// const macOS = useOs()\n// returns true/false\n\nconst useOs = () => {\n  // get Os\n  const [os, setOs] = useState(false);\n  useEffect(() => {\n    setOs(navigator.platform.indexOf(\"Mac\") > -1);\n  }, []);\n\n  return os;\n};\n\nexport default useOs;\n"
  },
  {
    "path": "hooks/useWindow.js",
    "content": "import { useEffect, useState } from \"react\";\n\n// how to use\n// const mobile = useWindow(767) < 768\n// returns true/false\n\nconst useWindow = (size) => {\n  // getWindowDimensions\n  const [windowSize, setWindowSize] = useState(size || 768);\n  useEffect(() => {\n    function viewport() {\n      var width = Math.max(\n        document.documentElement.clientWidth,\n        window.innerWidth || 0\n      );\n      setWindowSize(width);\n    }\n    viewport();\n    window.onresize = viewport;\n  }, []);\n\n  return windowSize;\n};\n\nexport default useWindow;\n"
  },
  {
    "path": "jsconfig.json",
    "content": "{\n  \"compilerOptions\": {\n    \"baseUrl\": \".\",\n    \"paths\": {\n      \"@layouts/*\": [\"layouts/*\"],\n      \"@components/*\": [\"layouts/components/*\"],\n      \"@partials/*\": [\"layouts/partials/*\"],\n      \"@shortcodes/*\": [\"layouts/shortcodes/*\"],\n      \"@config/*\": [\"config/*\"],\n      \"@json/*\": [\"json/*\"],\n      \"@hooks/*\": [\"hooks/*\"],\n      \"@lib/*\": [\"lib/*\"]\n    }\n  }\n}\n"
  },
  {
    "path": "layouts/404.js",
    "content": "import { markdownify } from \"@lib/utils/textConverter\";\n\nconst NotFound = ({ data }) => {\n  const { frontmatter, content } = data;\n\n  return (\n    <section className=\"section\">\n      <div className=\"container\">\n        <div className=\"flex h-[40vh] items-center justify-center\">\n          <div className=\"text-center\">\n            <h1 className=\"mb-4\">{frontmatter.title}</h1>\n            {markdownify(content, \"div\", \"content\")}\n          </div>\n        </div>\n      </div>\n    </section>\n  );\n};\n\nexport default NotFound;\n"
  },
  {
    "path": "layouts/About.js",
    "content": "import { markdownify } from \"@lib/utils/textConverter\";\nimport shortcodes from \"@shortcodes/all\";\nimport { MDXRemote } from \"next-mdx-remote\";\nimport Image from \"next/image\";\n\nconst About = ({ data }) => {\n  const { frontmatter, mdxContent } = data;\n  const { title, image, education, experience } = frontmatter;\n\n  return (\n    <section className=\"section mt-16\">\n      <div className=\"container text-center\">\n        {image && (\n          <div className=\"mb-8\">\n            <Image\n              src={image}\n              width={1298}\n              height={616}\n              alt={title}\n              className=\"rounded-lg\"\n              priority={true}\n            />\n          </div>\n        )}\n        {markdownify(title, \"h1\", \"h1 text-left lg:text-[55px] mt-12\")}\n\n        <div className=\"content text-left\">\n          <MDXRemote {...mdxContent} components={shortcodes} />\n        </div>\n\n        <div className=\"row mt-24 text-left lg:flex-nowrap\">\n          <div className=\"lg:col-6 \">\n            <div className=\"rounded border border-border p-6 dark:border-darkmode-border \">\n              {markdownify(education.title, \"h2\", \"section-title mb-12\")}\n              <div className=\"row\">\n                {education.degrees.map((degree, index) => (\n                  <div className=\"mb-7 md:col-6\" key={\"degree-\" + index}>\n                    <h4 className=\"text-base lg:text-[25px]\">\n                      {degree.university}\n                    </h4>\n                    <p className=\"mt-2\">{degree.content}</p>\n                  </div>\n                ))}\n              </div>\n            </div>\n          </div>\n          <div className=\"experience mt-10 lg:mt-0 lg:col-6\">\n            <div className=\"rounded border border-border p-6 dark:border-darkmode-border \">\n              {markdownify(experience.title, \"h2\", \"section-title mb-12\")}\n              <ul className=\"row\">\n                {experience?.list?.map((item, index) => (\n                  <li\n                    className=\"mb-5 text-lg font-bold text-dark dark:text-darkmode-light lg:col-6\"\n                    key={\"experience-\" + index}\n                  >\n                    {item}\n                  </li>\n                ))}\n              </ul>\n            </div>\n          </div>\n        </div>\n      </div>\n    </section>\n  );\n};\n\nexport default About;\n"
  },
  {
    "path": "layouts/Baseof.js",
    "content": "import config from \"@config/config.json\";\nimport { plainify } from \"@lib/utils/textConverter\";\nimport Footer from \"@partials/Footer\";\nimport Header from \"@partials/Header\";\nimport Head from \"next/head\";\nimport { useRouter } from \"next/router\";\n\nconst Base = ({\n  title,\n  meta_title,\n  description,\n  image,\n  noindex,\n  canonical,\n  children,\n}) => {\n  const { meta_image, meta_author, meta_description } = config.metadata;\n  const { base_url } = config.site;\n  const router = useRouter();\n\n  return (\n    <>\n      <Head>\n        {/* title */}\n        <title>\n          {plainify(\n            meta_title ? meta_title : title ? title : config.site.title\n          )}\n        </title>\n\n        {/* canonical url */}\n        {canonical && <link rel=\"canonical\" href={canonical} itemProp=\"url\" />}\n\n        {/* noindex robots */}\n        {noindex && <meta name=\"robots\" content=\"noindex,nofollow\" />}\n\n        {/* meta-description */}\n        <meta\n          name=\"description\"\n          content={plainify(description ? description : meta_description)}\n        />\n\n        {/* author from config.json */}\n        <meta name=\"author\" content={meta_author} />\n\n        {/* og-title */}\n        <meta\n          property=\"og:title\"\n          content={plainify(\n            meta_title ? meta_title : title ? title : config.site.title\n          )}\n        />\n\n        {/* og-description */}\n        <meta\n          property=\"og:description\"\n          content={plainify(description ? description : meta_description)}\n        />\n        <meta property=\"og:type\" content=\"website\" />\n        <meta\n          property=\"og:url\"\n          content={`${base_url}/${router.asPath.replace(\"/\", \"\")}`}\n        />\n\n        {/* twitter-title */}\n        <meta\n          name=\"twitter:title\"\n          content={plainify(\n            meta_title ? meta_title : title ? title : config.site.title\n          )}\n        />\n\n        {/* twitter-description */}\n        <meta\n          name=\"twitter:description\"\n          content={plainify(description ? description : meta_description)}\n        />\n\n        {/* og-image */}\n        <meta\n          property=\"og:image\"\n          content={`${base_url}${image ? image : meta_image}`}\n        />\n\n        {/* twitter-image */}\n        <meta\n          name=\"twitter:image\"\n          content={`${base_url}${image ? image : meta_image}`}\n        />\n        <meta name=\"twitter:card\" content=\"summary_large_image\" />\n      </Head>\n      <Header />\n      {/* main site */}\n      <main>{children}</main>\n      <Footer />\n    </>\n  );\n};\n\nexport default Base;\n"
  },
  {
    "path": "layouts/Contact.js",
    "content": "import { markdownify } from \"@lib/utils/textConverter\";\nimport Link from \"next/link\";\nimport { BsArrowRightShort } from \"react-icons/bs\";\nimport { FaEnvelope, FaMapMarkerAlt, FaUserAlt } from \"react-icons/fa\";\nimport ImageFallback from \"./components/ImageFallback\";\n\nconst Contact = ({ data }) => {\n  const { frontmatter } = data;\n  const { title, form_action, phone, mail, location } = frontmatter;\n\n  return (\n    <section className=\"section lg:mt-16\">\n      <div className=\"container\">\n        <div className=\"row relative pb-16\">\n          <ImageFallback\n            className=\"-z-[1] object-cover object-top\"\n            src={\"/images/map.svg\"}\n            fill=\"true\"\n            alt=\"map bg\"\n            priority={true}\n          />\n          <div className=\"lg:col-6\">\n            {markdownify(\n              title,\n              \"h1\",\n              \"h1 my-10 lg:my-11 lg:pt-11 text-center lg:text-left lg:text-[64px]\"\n            )}\n          </div>\n          <div className=\"contact-form-wrapper rounded border border-border p-6 dark:border-darkmode-border lg:col-6\">\n            <h2>\n              Send Us A\n              <span className=\"ml-1.5 inline-flex items-center text-primary\">\n                Message\n                <BsArrowRightShort />\n              </span>\n            </h2>\n            <form\n              className=\"contact-form mt-12\"\n              method=\"POST\"\n              action={form_action}\n            >\n              <div className=\"mb-6\">\n                <label className=\"mb-2 block font-secondary\" htmlFor=\"name\">\n                  Full name\n                  <small className=\"font-secondary text-sm text-primary\">\n                    *\n                  </small>\n                </label>\n                <input\n                  className=\"form-input w-full\"\n                  name=\"name\"\n                  type=\"text\"\n                  placeholder=\"Thomas Milano\"\n                  required\n                />\n              </div>\n              <div className=\"mb-6\">\n                <label className=\"mb-2 block font-secondary\" htmlFor=\"email\">\n                  Email Address\n                  <small className=\"font-secondary text-sm text-primary\">\n                    *\n                  </small>\n                </label>\n                <input\n                  className=\"form-input w-full\"\n                  name=\"email\"\n                  type=\"email\"\n                  placeholder=\"example@gmail.com\"\n                  required\n                />\n              </div>\n              <div className=\"mb-6\">\n                <label className=\"mb-2 block font-secondary\" htmlFor=\"subject\">\n                  Subject\n                  <small className=\"font-secondary text-sm text-primary\">\n                    *\n                  </small>\n                </label>\n                <input\n                  className=\"form-input w-full\"\n                  name=\"subject\"\n                  type=\"text\"\n                  placeholder=\"Blog advertisement\"\n                  required\n                />\n              </div>\n              <div className=\"mb-6\">\n                <label className=\"mb-2 block font-secondary\" htmlFor=\"message\">\n                  Your Message Here\n                  <small className=\"font-secondary text-sm text-primary\">\n                    *\n                  </small>\n                </label>\n                <textarea\n                  className=\"form-textarea w-full\"\n                  placeholder=\"Hello I’m Mr ‘x’ from…………..\"\n                  rows=\"7\"\n                />\n              </div>\n              <input\n                className=\"btn btn-primary\"\n                type=\"submit\"\n                value=\"Send Now\"\n              />\n            </form>\n          </div>\n        </div>\n        <div className=\"row\">\n          {phone && (\n            <div className=\"md:col-6 lg:col-4\">\n              <Link\n                href={`tel:${phone}`}\n                className=\"my-4 flex h-[100px] items-center justify-center\n             rounded border border-border p-4 text-primary dark:border-darkmode-border\"\n              >\n                <FaUserAlt />\n                <p className=\"ml-1.5 text-lg font-bold text-dark dark:text-darkmode-light\">\n                  {phone}\n                </p>\n              </Link>\n            </div>\n          )}\n          {mail && (\n            <div className=\"md:col-6 lg:col-4\">\n              <Link\n                href={`mailto:${mail}`}\n                className=\"my-4 flex h-[100px] items-center justify-center\n             rounded border border-border p-4 text-primary dark:border-darkmode-border\"\n              >\n                <FaEnvelope />\n                <p className=\"ml-1.5 text-lg font-bold text-dark dark:text-darkmode-light\">\n                  {mail}\n                </p>\n              </Link>\n            </div>\n          )}\n          {location && (\n            <div className=\"md:col-6 lg:col-4\">\n              <span\n                className=\"my-4 flex h-[100px] items-center justify-center\n             rounded border border-border p-4 text-primary dark:border-darkmode-border\"\n              >\n                <FaMapMarkerAlt />\n                <p className=\"ml-1.5 text-lg font-bold text-dark dark:text-darkmode-light\">\n                  {location}\n                </p>\n              </span>\n            </div>\n          )}\n        </div>\n      </div>\n    </section>\n  );\n};\n\nexport default Contact;\n"
  },
  {
    "path": "layouts/Default.js",
    "content": "import { markdownify } from \"@lib/utils/textConverter\";\nimport shortcodes from \"@shortcodes/all\";\nimport { MDXRemote } from \"next-mdx-remote\";\n\nconst Default = ({ data }) => {\n  const { frontmatter, mdxContent } = data;\n  const { title } = frontmatter;\n  return (\n    <section className=\"section\">\n      <div className=\"container\">\n        {markdownify(title, \"h1\", \"h2 mb-8 text-center\")}\n        <div className=\"content\">\n          <MDXRemote {...mdxContent} components={shortcodes} />\n        </div>\n      </div>\n    </section>\n  );\n};\n\nexport default Default;\n"
  },
  {
    "path": "layouts/PostSingle.js",
    "content": "import config from \"@config/config.json\";\nimport Base from \"@layouts/Baseof\";\nimport InnerPagination from \"@layouts/components/InnerPagination\";\nimport dateFormat from \"@lib/utils/dateFormat\";\nimport { markdownify } from \"@lib/utils/textConverter\";\nimport { DiscussionEmbed } from \"disqus-react\";\nimport { MDXRemote } from \"next-mdx-remote\";\nimport { useTheme } from \"next-themes\";\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { FaRegCalendar, FaUserAlt } from \"react-icons/fa\";\nimport Post from \"./partials/Post\";\nimport Sidebar from \"./partials/Sidebar\";\nimport shortcodes from \"./shortcodes/all\";\nconst { disqus } = config;\nconst { meta_author } = config.metadata;\n\nconst PostSingle = ({\n  frontmatter,\n  content,\n  mdxContent,\n  slug,\n  posts,\n  allCategories,\n  relatedPosts,\n}) => {\n  let { description, title, date, image, categories } = frontmatter;\n  description = description ? description : content.slice(0, 120);\n\n  const { theme } = useTheme();\n  const author = frontmatter.author ? frontmatter.author : meta_author;\n  // Local copy so we don't modify global config.\n  let disqusConfig = config.disqus.settings;\n  disqusConfig.identifier = frontmatter.disqusId\n    ? frontmatter.disqusId\n    : config.settings.blog_folder + \"/\" + slug;\n\n  return (\n    <Base title={title} description={description}>\n      <section className=\"section single-blog mt-6\">\n        <div className=\"container\">\n          <div className=\"row\">\n            <div className=\"lg:col-8\">\n              <article>\n                <div className=\"relative\">\n                  {image && (\n                    <Image\n                      src={image}\n                      height=\"500\"\n                      width=\"1000\"\n                      alt={title}\n                      className=\"rounded-lg\"\n                    />\n                  )}\n                  <ul className=\"absolute top-3 left-2 flex flex-wrap items-center\">\n                    {categories.map((tag, index) => (\n                      <li\n                        className=\"mx-2 inline-flex h-7 rounded-[35px] bg-primary px-3 text-white\"\n                        key={\"tag-\" + index}\n                      >\n                        <Link\n                          className=\"capitalize\"\n                          href={`/categories/${tag.replace(\" \", \"-\")}`}\n                        >\n                          {tag}\n                        </Link>\n                      </li>\n                    ))}\n                  </ul>\n                </div>\n                {config.settings.InnerPaginationOptions.enableTop && (\n                  <div className=\"mt-4\">\n                    <InnerPagination posts={posts} date={date} />\n                  </div>\n                )}\n                {markdownify(title, \"h1\", \"lg:text-[42px] mt-4\")}\n                <ul className=\"flex items-center space-x-4\">\n                  <li>\n                    <Link\n                      className=\"inline-flex items-center font-secondary text-xs leading-3\"\n                      href=\"/about\"\n                    >\n                      <FaUserAlt className=\"mr-1.5\" />\n                      {author}\n                    </Link>\n                  </li>\n                  <li className=\"inline-flex items-center font-secondary text-xs leading-3\">\n                    <FaRegCalendar className=\"mr-1.5\" />\n                    {dateFormat(date)}\n                  </li>\n                </ul>\n                <div className=\"content mb-16\">\n                  <MDXRemote {...mdxContent} components={shortcodes} />\n                </div>\n                {config.settings.InnerPaginationOptions.enableBottom && (\n                  <InnerPagination posts={posts} date={date} />\n                )}\n              </article>\n              <div className=\"mt-16\">\n                {disqus.enable && (\n                  <DiscussionEmbed\n                    key={theme}\n                    shortname={disqus.shortname}\n                    config={disqusConfig}\n                  />\n                )}\n              </div>\n            </div>\n            <Sidebar\n              posts={posts.filter((post) => post.slug !== slug)}\n              categories={allCategories}\n            />\n          </div>\n        </div>\n\n        {/* Related posts */}\n        <div className=\"container mt-20\">\n          <h2 className=\"section-title\">Related Posts</h2>\n          <div className=\"row mt-16\">\n            {relatedPosts.slice(0, 3).map((post, index) => (\n              <div key={\"post-\" + index} className=\"mb-12 lg:col-4\">\n                <Post post={post} />\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n    </Base>\n  );\n};\n\nexport default PostSingle;\n"
  },
  {
    "path": "layouts/components/ImageFallback.js",
    "content": "/* eslint-disable jsx-a11y/alt-text */\nimport Image from \"next/image\";\nimport { useEffect, useState } from \"react\";\n\nconst ImageFallback = (props) => {\n  const { src, fallback, ...rest } = props;\n  const [imgSrc, setImgSrc] = useState(src);\n\n  useEffect(() => {\n    setImgSrc(src);\n  }, [src]);\n\n  return (\n    <Image\n      {...rest}\n      src={imgSrc}\n      onError={() => {\n        setImgSrc(fallback);\n      }}\n    />\n  );\n};\n\nexport default ImageFallback;\n"
  },
  {
    "path": "layouts/components/InnerPagination.js",
    "content": "import { sortByDate } from \"@lib/utils/sortFunctions\";\nimport Link from \"next/link\";\n\nconst InnerPagination = ({ posts, date }) => {\n  const orderedPosts = sortByDate(posts);\n  const lastIndex = orderedPosts.length - 1;\n  const postIndex = orderedPosts.findIndex(\n    (post) => post.frontmatter.date == date\n  );\n  const next = postIndex == 0 ? undefined : orderedPosts[postIndex - 1].slug;\n  const prev =\n    postIndex == lastIndex ? undefined : orderedPosts[postIndex + 1].slug;\n  const prevButton = prev && (\n    <Link href={prev} className={\"btn btn-primary\"}>\n      Prev\n    </Link>\n  );\n  const nextButton = next && (\n    <Link href={next} className={\"btn btn-primary\"}>\n      Next\n    </Link>\n  );\n\n  return (\n    <div className=\"row\">\n      <span className=\"col\">{prevButton}</span>\n      <span className=\"col-8\" />\n      <span className=\"col\">{nextButton}</span>\n    </div>\n  );\n};\n\nexport default InnerPagination;\n"
  },
  {
    "path": "layouts/components/Logo.js",
    "content": "import ImageFallback from \"@components/ImageFallback\";\nimport config from \"@config/config.json\";\nimport { useTheme } from \"next-themes\";\nimport Link from \"next/link\";\nimport { useEffect, useState } from \"react\";\n\nconst Logo = ({ src }) => {\n  // destructuring items from config object\n  const { logo, logo_white, logo_width, logo_height, logo_text, title } =\n    config.site;\n  const { theme, resolvedTheme } = useTheme();\n  const [mounted, setMounted] = useState(false);\n  useEffect(() => setMounted(true), []);\n\n  return (\n    <Link href=\"/\" className=\"navbar-brand\">\n      {src || logo ? (\n        <ImageFallback\n          width={logo_width.replace(\"px\", \"\") * 2}\n          height={logo_height.replace(\"px\", \"\") * 2}\n          src={\n            mounted && (theme === \"dark\" || resolvedTheme === \"dark\")\n              ? logo_white\n              : logo\n          }\n          alt={title}\n          priority\n          style={{\n            height: logo_height.replace(\"px\", \"\") + \"px\",\n            width: logo_width.replace(\"px\", \"\") + \"px\",\n          }}\n          className={\"m-auto\"}\n        />\n      ) : logo_text ? (\n        logo_text\n      ) : (\n        title\n      )}\n    </Link>\n  );\n};\n\nexport default Logo;\n"
  },
  {
    "path": "layouts/components/NewsLetterForm.js",
    "content": "import React, { useState } from \"react\";\nimport { FaEnvelope } from \"react-icons/fa\";\n\nfunction CustomForm({ status, message, onValidated }) {\n  const [email, setEmail] = useState(\"\");\n\n  const resetForm = () => {\n    setEmail(\"\");\n  };\n\n  const handleSubmit = (e) => {\n    e.preventDefault();\n    email && email.indexOf(\"@\") > -1 && onValidated({ EMAIL: email });\n    resetForm();\n  };\n\n  return (\n    <>\n      <form action=\"#\" className=\"py-6\" onSubmit={handleSubmit}>\n        <fieldset className=\"relative\">\n          <input\n            className=\"newsletter-input form-input h-12 w-full rounded-3xl border-none bg-theme-light px-5 py-3 pr-12 text-dark placeholder:text-xs dark:bg-darkmode-theme-dark\"\n            type=\"text\"\n            placeholder=\"Type And Hit Enter\"\n            onChange={(e) => setEmail(e.target.value)}\n          />\n          <FaEnvelope className=\"absolute top-1/2 right-5 -translate-y-1/2 text-xl transition duration-75\" />\n        </fieldset>\n        <button className=\"d-block  btn btn-primary mt-4 w-full\" type=\"submit\">\n          Sign In\n        </button>\n      </form>\n      {status === \"sending\" && (\n        <div className=\"mt-4 text-primary\">sending...</div>\n      )}\n      {status === \"error\" && (\n        <div\n          className=\"mt-4 text-red-700\"\n          dangerouslySetInnerHTML={{ __html: message }}\n        />\n      )}\n      {status === \"success\" && (\n        <div className=\"mt-4 text-green-700\">Subscribed !</div>\n      )}\n    </>\n  );\n}\n\nexport default CustomForm;\n"
  },
  {
    "path": "layouts/components/Pagination.js",
    "content": "import Link from \"next/link\";\nimport React from \"react\";\nimport { BsArrowRightShort, BsArrowLeftShort } from \"react-icons/bs\";\n\nconst Pagination = ({ section, currentPage, totalPages }) => {\n  const indexPageLink = currentPage === 2;\n  const hasPrevPage = currentPage > 1;\n  const hasNextPage = totalPages > currentPage;\n\n  let pageList = [];\n  for (let i = 1; i <= totalPages; i++) {\n    pageList.push(i);\n  }\n\n  return (\n    <>\n      {totalPages > 1 && (\n        <nav\n          className=\"item-center mb-4 flex justify-center space-x-1 lg:space-x-2\"\n          aria-label=\"Pagination\"\n        >\n          {/* previous */}\n          {hasPrevPage ? (\n            <Link\n              href={\n                indexPageLink\n                  ? `${section ? \"/\" + section : \"/\"}`\n                  : `${section ? \"/\" + section : \"\"}/page/${currentPage - 1}`\n              }\n              className=\"flex items-center rounded-full px-2 py-1 text-3xl font-bold leading-none text-dark dark:text-darkmode-light\"\n            >\n              <>\n                <BsArrowLeftShort />\n                <span className=\"ml-3 text-lg \">Previous</span>\n              </>\n            </Link>\n          ) : (\n            <span className=\"flex items-center rounded-full px-2 py-1 text-3xl font-bold text-dark dark:text-darkmode-light \">\n              <>\n                <BsArrowLeftShort />\n                <span className=\"ml-3 text-lg\">Previous</span>\n              </>\n            </span>\n          )}\n\n          {/* page index */}\n          {pageList.map((pagination, i) => (\n            <React.Fragment key={`page-${i}`}>\n              {pagination === currentPage ? (\n                <span\n                  aria-current=\"page\"\n                  className={`inline-flex h-[38px] w-[38px] items-center justify-center rounded-full bg-primary px-4 py-1 font-secondary text-lg font-bold leading-none text-dark text-white dark:text-darkmode-light`}\n                >\n                  {pagination}\n                </span>\n              ) : (\n                <Link\n                  href={\n                    i === 0\n                      ? `${section ? \"/\" + section : \"/\"}`\n                      : `${section ? \"/\" + section : \"\"}/page/${pagination}`\n                  }\n                  passHref\n                  aria-current=\"page\"\n                  className={`inline-flex h-[38px] w-[38px] items-center justify-center rounded-full px-4 py-1 font-secondary text-lg font-bold leading-none text-dark dark:text-darkmode-light`}\n                >\n                  {pagination}\n                </Link>\n              )}\n            </React.Fragment>\n          ))}\n\n          {/* next page */}\n          {hasNextPage ? (\n            <Link\n              href={`${section ? \"/\" + section : \"\"}/page/${currentPage + 1}`}\n              className=\"ml-4 flex items-center rounded-full px-2 py-1 text-3xl font-bold leading-none text-dark dark:text-darkmode-light\"\n            >\n              <>\n                <span className=\"mr-3 text-lg\">Next</span>\n                <BsArrowRightShort />\n              </>\n            </Link>\n          ) : (\n            <span className=\"ml-4 flex items-center rounded-full px-2 py-1 text-3xl font-bold text-dark dark:text-darkmode-light\">\n              <>\n                <span className=\"mr-3 text-lg\">Next</span>\n                <BsArrowRightShort />\n              </>\n            </span>\n          )}\n        </nav>\n      )}\n    </>\n  );\n};\n\nexport default Pagination;\n"
  },
  {
    "path": "layouts/components/Share.js",
    "content": "import config from \"@config/config.json\";\nimport {\n  IoLogoFacebook,\n  IoLogoLinkedin,\n  IoLogoPinterest,\n  IoLogoTwitter,\n} from \"react-icons/io5\";\n\nconst Share = ({ title, description, slug, className }) => {\n  // destructuring items from config object\n  const { base_url } = config.site;\n\n  return (\n    <ul className={`${className}`}>\n      <li className=\"inline-block\">\n        <a\n          aria-label=\"facebook share button\"\n          href={`https://facebook.com/sharer/sharer.php?u=${base_url}/${slug}`}\n          target=\"_blank\"\n          rel=\"noreferrer noopener\"\n          button=\"true\"\n        >\n          <IoLogoFacebook />\n        </a>\n      </li>\n      <li className=\"inline-block\">\n        <a\n          aria-label=\"twitter share button\"\n          href={`https://twitter.com/intent/tweet/?text=${title}&amp;url=${base_url}/${slug}`}\n          target=\"_blank\"\n          rel=\"noreferrer noopener\"\n          button=\"true\"\n        >\n          <IoLogoTwitter />\n        </a>\n      </li>\n      <li className=\"inline-block\">\n        <a\n          aria-label=\"linkedin share button\"\n          href={`https://www.linkedin.com/shareArticle?mini=true&url=${base_url}/${slug}&title=${title}&summary=${description}&source=${base_url}`}\n          target=\"_blank\"\n          rel=\"noreferrer noopener\"\n        >\n          <IoLogoLinkedin />\n        </a>\n      </li>\n      <li className=\"inline-block\">\n        <a\n          aria-label=\"pinterest share button\"\n          href={`https://pinterest.com/pin/create/button/?url=${base_url}/${slug}&media=&description=${description}`}\n          target=\"_blank\"\n          rel=\"noreferrer noopener\"\n          button=\"true\"\n        >\n          <IoLogoPinterest />\n        </a>\n      </li>\n    </ul>\n  );\n};\n\nexport default Share;\n"
  },
  {
    "path": "layouts/components/Social.js",
    "content": "import {\n  IoCall,\n  IoGlobeOutline,\n  IoLocation,\n  IoLogoBehance,\n  IoLogoBitbucket,\n  IoLogoCodepen,\n  IoLogoDiscord,\n  IoLogoDribbble,\n  IoLogoFacebook,\n  IoLogoFoursquare,\n  IoLogoGithub,\n  IoLogoGitlab,\n  IoLogoInstagram,\n  IoLogoLinkedin,\n  IoLogoMedium,\n  IoLogoPinterest,\n  IoLogoReddit,\n  IoLogoRss,\n  IoLogoSkype,\n  IoLogoSlack,\n  IoLogoSnapchat,\n  IoLogoSoundcloud,\n  IoLogoTiktok,\n  IoLogoTumblr,\n  IoLogoTwitter,\n  IoLogoVimeo,\n  IoLogoVk,\n  IoLogoWhatsapp,\n  IoLogoYoutube,\n  IoMail,\n  IoLogoStackoverflow,\n} from \"react-icons/io5\";\n\nconst Social = ({ source, className }) => {\n  const {\n    facebook,\n    stackoverflow,\n    twitter,\n    instagram,\n    youtube,\n    linkedin,\n    github,\n    gitlab,\n    discord,\n    slack,\n    medium,\n    codepen,\n    bitbucket,\n    dribbble,\n    behance,\n    pinterest,\n    soundcloud,\n    tumblr,\n    reddit,\n    vk,\n    whatsapp,\n    snapchat,\n    vimeo,\n    tiktok,\n    foursquare,\n    rss,\n    email,\n    phone,\n    address,\n    skype,\n    website,\n  } = source;\n  return (\n    <ul className={className}>\n      {facebook && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"facebook\"\n            href={facebook}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoFacebook />\n          </a>\n        </li>\n      )}\n      {stackoverflow && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"stackoverflow\"\n            href={stackoverflow}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoStackoverflow />\n          </a>\n        </li>\n      )}\n      {twitter && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"twitter\"\n            href={twitter}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoTwitter />\n          </a>\n        </li>\n      )}\n      {instagram && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"instagram\"\n            href={instagram}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoInstagram />\n          </a>\n        </li>\n      )}\n      {youtube && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"youtube\"\n            href={youtube}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoYoutube />\n          </a>\n        </li>\n      )}\n      {linkedin && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"linkedin\"\n            href={linkedin}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoLinkedin />\n          </a>\n        </li>\n      )}\n      {github && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"github\"\n            href={github}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoGithub />\n          </a>\n        </li>\n      )}\n      {gitlab && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"gitlab\"\n            href={gitlab}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoGitlab />\n          </a>\n        </li>\n      )}\n      {discord && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"discord\"\n            href={discord}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoDiscord />\n          </a>\n        </li>\n      )}\n      {slack && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"slack\"\n            href={slack}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoSlack />\n          </a>\n        </li>\n      )}\n      {medium && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"medium\"\n            href={medium}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoMedium />\n          </a>\n        </li>\n      )}\n      {codepen && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"codepen\"\n            href={codepen}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoCodepen />\n          </a>\n        </li>\n      )}\n      {bitbucket && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"bitbucket\"\n            href={bitbucket}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoBitbucket />\n          </a>\n        </li>\n      )}\n      {dribbble && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"dribbble\"\n            href={dribbble}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoDribbble />\n          </a>\n        </li>\n      )}\n      {behance && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"behance\"\n            href={behance}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoBehance />\n          </a>\n        </li>\n      )}\n      {pinterest && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"pinterest\"\n            href={pinterest}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoPinterest />\n          </a>\n        </li>\n      )}\n      {soundcloud && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"soundcloud\"\n            href={soundcloud}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoSoundcloud />\n          </a>\n        </li>\n      )}\n      {tumblr && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"tumblr\"\n            href={tumblr}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoTumblr />\n          </a>\n        </li>\n      )}\n      {reddit && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"reddit\"\n            href={reddit}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoReddit />\n          </a>\n        </li>\n      )}\n      {vk && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"vk\"\n            href={vk}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoVk />\n          </a>\n        </li>\n      )}\n      {whatsapp && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"whatsapp\"\n            href={whatsapp}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoWhatsapp />\n          </a>\n        </li>\n      )}\n      {snapchat && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"snapchat\"\n            href={snapchat}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoSnapchat />\n          </a>\n        </li>\n      )}\n      {vimeo && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"vimeo\"\n            href={vimeo}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoVimeo />\n          </a>\n        </li>\n      )}\n      {tiktok && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"tiktok\"\n            href={tiktok}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoTiktok />\n          </a>\n        </li>\n      )}\n      {foursquare && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"foursquare\"\n            href={foursquare}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoFoursquare />\n          </a>\n        </li>\n      )}\n      {skype && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"skype\"\n            href={skype}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoSkype />\n          </a>\n        </li>\n      )}\n      {website && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"website\"\n            href={website}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoGlobeOutline />\n          </a>\n        </li>\n      )}\n      {rss && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"rss feed\"\n            href={rss}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLogoRss />\n          </a>\n        </li>\n      )}\n      {email && (\n        <li className=\"inline-block\">\n          <a aria-label=\"email\" href={`mailto:${email}`}>\n            <IoMail />\n          </a>\n        </li>\n      )}\n      {phone && (\n        <li className=\"inline-block\">\n          <a aria-label=\"telephone\" href={`tel:${phone}`}>\n            <IoCall />\n          </a>\n        </li>\n      )}\n      {address && (\n        <li className=\"inline-block\">\n          <a\n            aria-label=\"location\"\n            href={address}\n            target=\"_blank\"\n            rel=\"noopener noreferrer nofollow\"\n          >\n            <IoLocation />\n          </a>\n        </li>\n      )}\n    </ul>\n  );\n};\n\nexport default Social;\n"
  },
  {
    "path": "layouts/components/ThemeSwitcher.js",
    "content": "import config from \"@config/config.json\";\nimport { useTheme } from \"next-themes\";\nimport { useEffect, useState } from \"react\";\n\nconst ThemeSwitcher = () => {\n  const { theme_switcher } = config.settings;\n  const [mounted, setMounted] = useState(false);\n  const { theme, setTheme, resolvedTheme } = useTheme();\n  useEffect(() => setMounted(true), []);\n\n  return (\n    <>\n      {theme_switcher && (\n        <button\n          aria-label=\"Toggle Theme\"\n          type=\"button\"\n          className=\"ml-1 mr-1 h-8 w-8 rounded p-1 sm:ml-4\"\n          onClick={() =>\n            setTheme(\n              theme === \"dark\" || resolvedTheme === \"dark\" ? \"light\" : \"dark\"\n            )\n          }\n        >\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 20 20\"\n            fill=\"currentColor\"\n            className=\"text-gray-900 dark:text-gray-100\"\n          >\n            {mounted && (theme === \"dark\" || resolvedTheme === \"dark\") ? (\n              <path\n                fillRule=\"evenodd\"\n                d=\"M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z\"\n                clipRule=\"evenodd\"\n              />\n            ) : (\n              <path d=\"M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z\" />\n            )}\n          </svg>\n        </button>\n      )}\n    </>\n  );\n};\n\nexport default ThemeSwitcher;\n"
  },
  {
    "path": "layouts/components/TwSizeIndicator.js",
    "content": "const TwSizeIndicator = () => {\n  if (process.env.NODE_ENV === \"development\") {\n    return (\n      <div className=\"fixed top-0 left-0 z-50 flex w-[30px] items-center justify-center bg-gray-200 py-[2.5px] text-[12px] uppercase text-black sm:bg-red-200 md:bg-yellow-200 lg:bg-green-200 xl:bg-blue-200 2xl:bg-pink-200\">\n        <span className=\"block sm:hidden\">all</span>\n        <span className=\"hidden sm:block md:hidden\">sm</span>\n        <span className=\"hidden md:block lg:hidden\">md</span>\n        <span className=\"hidden lg:block xl:hidden\">lg</span>\n        <span className=\"hidden xl:block 2xl:hidden\">xl</span>\n        <span className=\"hidden 2xl:block\">2xl</span>\n      </div>\n    );\n  } else {\n    return null;\n  }\n};\nexport default TwSizeIndicator;\n"
  },
  {
    "path": "layouts/partials/Footer.js",
    "content": "import Social from \"@components/Social\";\nimport config from \"@config/config.json\";\nimport menu from \"@config/menu.json\";\nimport social from \"@config/social.json\";\nimport ImageFallback from \"@layouts/components/ImageFallback\";\nimport Logo from \"@layouts/components/Logo\";\nimport { markdownify } from \"@lib/utils/textConverter\";\nimport Link from \"next/link\";\n\nconst Footer = () => {\n  const { copyright, footer_content } = config.params;\n  return (\n    <footer className=\"section relative mt-12 pt-[70px] pb-[50px]\">\n      <ImageFallback\n        className=\"-z-[1] object-cover object-left  md:object-top\"\n        src=\"/images/footer-bg-shape.svg\"\n        alt=\"footer background\"\n        fill={true}\n      />\n      <div className=\"container text-center\">\n        <div className=\"mb-6 inline-flex\">\n          <Logo />\n        </div>\n        {markdownify(footer_content, \"p\", \"max-w-[638px] mx-auto\")}\n\n        {/* footer menu */}\n        <ul className=\"mb-12 mt-6 flex-wrap space-x-2 lg:space-x-4\">\n          {menu.footer.map((menu) => (\n            <li className=\"inline-block\" key={menu.name}>\n              <Link\n                href={menu.url}\n                className=\"p-2 font-bold text-dark hover:text-primary dark:text-darkmode-light lg:p-4\"\n              >\n                {menu.name}\n              </Link>\n            </li>\n          ))}\n        </ul>\n        {/* social icons */}\n        <div className=\"inline-flex\">\n          <Social source={social} className=\"socials mb-12 justify-center\" />\n        </div>\n        {/* copyright */}\n        {markdownify(copyright, \"p\")}\n      </div>\n    </footer>\n  );\n};\n\nexport default Footer;\n"
  },
  {
    "path": "layouts/partials/Header.js",
    "content": "import Logo from \"@components/Logo\";\nimport menu from \"@config/menu.json\";\nimport socical from \"@config/social.json\";\nimport Social from \"@layouts/components/Social\";\nimport ThemeSwitcher from \"@layouts/components/ThemeSwitcher\";\nimport SearchModal from \"@partials/SearchModal\";\nimport Link from \"next/link\";\nimport { useRouter } from \"next/router\";\nimport React, { useEffect, useState } from \"react\";\nimport { IoSearch } from \"react-icons/io5\";\n\nconst Header = () => {\n  // distructuring the main menu from menu object\n  const { main } = menu;\n\n  // states declaration\n  const [searchModal, setSearchModal] = useState(false);\n  const [showMenu, setShowMenu] = useState(false);\n\n  // Router\n  const router = useRouter();\n\n  //stop scrolling when nav is open\n  useEffect(() => {\n    if (showMenu) {\n      document.body.classList.add(\"menu-open\");\n    } else {\n      document.body.classList.remove(\"menu-open\");\n    }\n  }, [showMenu]);\n\n  return (\n    <header className=\"header\">\n      <nav className=\"navbar container px-1 sm:px-8\">\n        <div className=\"order-0\">\n          <Logo />\n        </div>\n        <div className=\"flex items-center space-x-4 xl:space-x-8\">\n          <div\n            className={`collapse-menu ${\n              !showMenu && \"translate-x-full\"\n            } lg:flex lg:translate-x-0`}\n          >\n            <button\n              className=\"absolute right-6 top-11 lg:hidden\"\n              onClick={() => setShowMenu(false)}\n            >\n              <svg className=\"h-4 w-4 fill-current\" viewBox=\"0 0 20 20\">\n                <title>Menu Close</title>\n                <polygon\n                  points=\"11 9 22 9 22 11 11 11 11 22 9 22 9 11 -2 11 -2 9 9 9 9 -2 11 -2\"\n                  transform=\"rotate(45 10 10)\"\n                />\n              </svg>\n            </button>\n            <ul\n              id=\"nav-menu\"\n              className=\"navbar-nav w-full md:w-auto md:space-x-1 lg:flex xl:space-x-2\"\n            >\n              {main.map((menu, i) => (\n                <React.Fragment key={`menu-${i}`}>\n                  {menu.hasChildren ? (\n                    <li className=\"nav-item nav-dropdown group relative\">\n                      <span\n                        className={`nav-link ${\n                          menu.children\n                            .map((c) => c.url)\n                            .includes(router.asPath) && \"active\"\n                        } inline-flex items-center`}\n                      >\n                        {menu.name}\n                        <svg\n                          className=\"h-4 w-4 fill-current\"\n                          viewBox=\"0 0 20 20\"\n                        >\n                          <path d=\"M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z\" />\n                        </svg>\n                      </span>\n                      <ul className=\"nav-dropdown-list hidden transition-all duration-300 group-hover:top-[46px] group-hover:block md:invisible md:absolute md:top-[60px] md:block md:opacity-0 md:group-hover:visible md:group-hover:opacity-100\">\n                        {menu.children.map((child, i) => (\n                          <li\n                            className=\"nav-dropdown-item\"\n                            key={`children-${i}`}\n                          >\n                            <Link\n                              href={child.url}\n                              className={`nav-dropdown-link block ${\n                                router.asPath === child.url && \"active\"\n                              }`}\n                            >\n                              {child.name}\n                            </Link>\n                          </li>\n                        ))}\n                      </ul>\n                    </li>\n                  ) : (\n                    <li className=\"nav-item\">\n                      <Link\n                        href={menu.url}\n                        className={`nav-link block ${\n                          router.asPath === menu.url && \"active\"\n                        }`}\n                      >\n                        {menu.name}\n                      </Link>\n                    </li>\n                  )}\n                </React.Fragment>\n              ))}\n            </ul>\n            {/* header social */}\n            <Social source={socical} className=\"socials\" />\n          </div>\n          <ThemeSwitcher />\n          {/* Header search */}\n          <div\n            className=\"search-icon\"\n            onClick={() => {\n              setSearchModal(true);\n            }}\n          >\n            <IoSearch />\n          </div>\n          <button\n            onClick={() => setShowMenu(!showMenu)}\n            className=\"inline-flex h-10 w-10 items-center justify-center rounded-full bg-primary text-white lg:hidden\"\n          >\n            {showMenu ? (\n              <svg className=\"h-4 w-4 fill-current\" viewBox=\"0 0 20 20\">\n                <title>Menu Close</title>\n                <polygon\n                  points=\"11 9 22 9 22 11 11 11 11 22 9 22 9 11 -2 11 -2 9 9 9 9 -2 11 -2\"\n                  transform=\"rotate(45 10 10)\"\n                />\n              </svg>\n            ) : (\n              <svg className=\"h-4 w-4 fill-current\" viewBox=\"0 0 20 20\">\n                <title>Menu Open</title>\n                <path d=\"M0 3h20v2H0V3z m0 6h20v2H0V9z m0 6h20v2H0V0z\" />\n              </svg>\n            )}\n          </button>\n        </div>\n\n        <SearchModal\n          searchModal={searchModal}\n          setSearchModal={setSearchModal}\n        />\n      </nav>\n      {showMenu && (\n        <div className=\"header-backdrop absolute top-0 left-0 h-[100vh] w-full bg-black/50 lg:hidden\"></div>\n      )}\n    </header>\n  );\n};\n\nexport default Header;\n"
  },
  {
    "path": "layouts/partials/Post.js",
    "content": "import config from \"@config/config.json\";\nimport ImageFallback from \"@layouts/components/ImageFallback\";\nimport dateFormat from \"@lib/utils/dateFormat\";\nimport Link from \"next/link\";\nimport { FaRegCalendar, FaUserAlt } from \"react-icons/fa\";\n\nconst Post = ({ post }) => {\n  const { summary_length, blog_folder } = config.settings;\n  const { meta_author } = config.metadata;\n  const author = post.frontmatter.author ? post.frontmatter.author : meta_author;\n  return (\n    <div className=\"post\">\n      <div className=\"relative\">\n        {post.frontmatter.image && (\n          <ImageFallback\n            className=\"rounded\"\n            src={post.frontmatter.image}\n            alt={post.frontmatter.title}\n            width={405}\n            height={208}\n          />\n        )}\n        <ul className=\"absolute top-3 left-2 flex flex-wrap items-center\">\n          {post.frontmatter.categories.map((tag, index) => (\n            <li\n              className=\"mx-2 inline-flex h-7 rounded-[35px] bg-primary px-3 text-white\"\n              key={\"tag-\" + index}\n            >\n              <Link\n                className=\"capitalize\"\n                href={`/categories/${tag.replace(\" \", \"-\")}`}\n              >\n                {tag}\n              </Link>\n            </li>\n          ))}\n        </ul>\n      </div>\n      <h3 className=\"h5 mb-2 mt-4\">\n        <Link\n          href={`/${blog_folder}/${post.slug}`}\n          className=\"block hover:text-primary\"\n        >\n          {post.frontmatter.title}\n        </Link>\n      </h3>\n      <ul className=\"flex items-center space-x-4\">\n        <li>\n          <Link\n            className=\"inline-flex items-center font-secondary text-xs leading-3\"\n            href=\"/about\"\n          >\n            <FaUserAlt className=\"mr-1.5\" />\n            {author}\n          </Link>\n        </li>\n        <li className=\"inline-flex items-center font-secondary text-xs leading-3\">\n          <FaRegCalendar className=\"mr-1.5\" />\n          {dateFormat(post.frontmatter.date)}\n        </li>\n      </ul>\n      <p>{post.content.slice(0, Number(summary_length))}</p>\n      <Link\n        className=\"btn btn-outline-primary mt-4\"\n        href={`/${blog_folder}/${post.slug}`}\n      >\n        Read More\n      </Link>\n    </div>\n  );\n};\n\nexport default Post;\n"
  },
  {
    "path": "layouts/partials/SearchModal.js",
    "content": "import { useRouter } from \"next/router\";\nimport { useEffect, useState } from \"react\";\nimport { IoCloseCircleOutline } from \"react-icons/io5\";\n\nconst SearchModal = ({ searchModal, setSearchModal }) => {\n  const router = useRouter();\n  const [input, setInput] = useState(\"\");\n\n  useEffect(() => {\n    if (searchModal) {\n      document.getElementById(\"searchModal\").focus();\n      document.addEventListener(\"keydown\", (e) => {\n        if (e.key === \"Enter\") {\n          router.push({ pathname: \"/search\", query: { key: input } });\n          setSearchModal(false);\n        }\n        if (e.key === \"Escape\") {\n          setSearchModal(false);\n        }\n      });\n    }\n  });\n  return (\n    <div className={`search-modal ${searchModal ? \"open\" : \"\"}`}>\n      <button onClick={() => setSearchModal(false)} className=\"search-close\">\n        <IoCloseCircleOutline />\n      </button>\n      <input\n        type=\"text\"\n        className=\"form-input bg-body placeholder:text-base dark:bg-darkmode-body\"\n        id=\"searchModal\"\n        placeholder=\"Type and hit enter...\"\n        onChange={(e) => setInput(e.target.value)}\n      />\n    </div>\n  );\n};\n\nexport default SearchModal;\n"
  },
  {
    "path": "layouts/partials/Sidebar.js",
    "content": "import config from \"@config/config.json\";\nimport social from \"@config/social.json\";\nimport ImageFallback from \"@layouts/components/ImageFallback\";\nimport Logo from \"@layouts/components/Logo\";\nimport CustomForm from \"@layouts/components/NewsLetterForm\";\nimport Social from \"@layouts/components/Social\";\nimport dateFormat from \"@lib/utils/dateFormat\";\nimport { sortByDate } from \"@lib/utils/sortFunctions\";\nimport { markdownify } from \"@lib/utils/textConverter\";\nimport Link from \"next/link\";\nimport { useState } from \"react\";\nimport { FaRegCalendar } from \"react-icons/fa\";\nimport MailchimpSubscribe from \"react-mailchimp-subscribe\";\nconst { blog_folder } = config.settings;\nconst { about, featured_posts, newsletter } = config.widgets;\n\nconst Sidebar = ({ posts, categories, className }) => {\n  const sortPostByDate = sortByDate(posts);\n  const featuredPosts = sortPostByDate.filter(\n    (post) => post.frontmatter.featured\n  );\n\n  const [showRecent, setShowRecent] = useState(true);\n\n  return (\n    <aside className={`${className} px-0 lg:px-6 lg:col-4`}>\n      {about.enable && (\n        <div className=\"relative rounded border border-border p-6 text-center dark:border-darkmode-border\">\n          <ImageFallback\n            className=\"-z-[1]\"\n            src=\"/images/map.svg\"\n            fill={true}\n            alt=\"bg-map\"\n          />\n          <Logo />\n          {markdownify(about.content, \"p\", \"mt-8\")}\n          <Social\n            className=\"socials sidebar-socials mt-6 justify-center\"\n            source={social}\n          />\n        </div>\n      )}\n\n      {/* categories widget */}\n      {categories.enable && (\n        <div className=\"mt-6 rounded border border-border p-6 dark:border-darkmode-border\">\n          <h4 className=\"section-title mb-12 text-center\">\n            {featured_posts.title}\n          </h4>\n          <ul>\n            {categories.map((category, i) => (\n              <li\n                className={`relative mb-2 flex items-center justify-between pl-6 text-[16px] font-bold capitalize text-dark dark:text-darkmode-light ${\n                  i !== categories.length - 1 &&\n                  \"border-b border-border  dark:border-darkmode-border\"\n                }`}\n                key={i}\n              >\n                <svg\n                  className=\"absolute left-0 top-2.5\"\n                  width=\"20px\"\n                  height=\"20px\"\n                  viewBox=\"0 0 20 20\"\n                  fill=\"none\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                >\n                  <path\n                    d=\"M11.7318 9.35984C12.0854 8.93556 12.7159 8.87824 13.1402 9.2318C13.5645 9.58537 13.6218 10.2159 13.2682 10.6402L8.26825 16.6402C7.91468 17.0645 7.28412 17.1218 6.85984 16.7682C6.43556 16.4147 6.37824 15.7841 6.7318 15.3598L11.7318 9.35984Z\"\n                    fill=\"#2ba283\"\n                  />\n                  <path\n                    d=\"M6.7318 4.64021C6.37824 4.21593 6.43556 3.58537 6.85984 3.2318C7.28412 2.87824 7.91468 2.93556 8.26825 3.35984L13.2682 9.35984C13.6218 9.78412 13.5645 10.4147 13.1402 10.7682C12.7159 11.1218 12.0854 11.0645 11.7318 10.6402L6.7318 4.64021Z\"\n                    fill=\"#2ba283\"\n                  />\n                </svg>\n                <Link className=\"py-2\" href={`/categories/${category.name}`}>\n                  {category.name.replace(\"-\", \" \")}\n                  <span className=\"absolute top-1/2 right-0 -translate-y-1/2 text-[10px] text-gray-500\">\n                    {category.posts}\n                  </span>\n                </Link>\n              </li>\n            ))}\n          </ul>\n        </div>\n      )}\n\n      {/* featured widget */}\n      {featured_posts.enable && (\n        <div className=\"mt-6 rounded border border-border p-6 dark:border-darkmode-border\">\n          <h4 className=\"section-title mb-12 text-center\">Featured</h4>\n          <div className=\"mb-12 flex items-center justify-center\">\n            <button\n              className={`btn px-5 py-2 ${\n                showRecent ? \"btn-outline-primary\" : \"btn-primary\"\n              }`}\n              onClick={() => setShowRecent(false)}\n            >\n              Featured\n            </button>\n            <button\n              className={`btn ml-3  px-5 py-2 ${\n                showRecent ? \"btn-primary\" : \"btn-outline-primary\"\n              }`}\n              onClick={() => setShowRecent(true)}\n            >\n              Recent\n            </button>\n          </div>\n          {showRecent\n            ? sortPostByDate\n                .slice(0, featured_posts.showPost)\n                .map((post, i, arr) => (\n                  <div\n                    className={`flex items-center ${\n                      i !== arr.length - 1 &&\n                      \"mb-6 border-b border-border pb-6 dark:border-darkmode-border\"\n                    }`}\n                    key={`key-${i}`}\n                  >\n                    {post.frontmatter.image && (\n                      <ImageFallback\n                        className=\"mr-3 h-[85px] w-[85px] rounded-full object-cover\"\n                        src={post.frontmatter.image}\n                        alt={post.frontmatter.title}\n                        width={105}\n                        height={85}\n                      />\n                    )}\n                    <div>\n                      <h3 className=\"h5 mb-2\">\n                        <Link\n                          href={`/${blog_folder}/${post.slug}`}\n                          className=\"block hover:text-primary\"\n                        >\n                          {post.frontmatter.title}\n                        </Link>\n                      </h3>\n                      <p className=\"inline-flex items-center font-secondary text-xs\">\n                        <FaRegCalendar className=\"mr-1.5\" />\n                        {dateFormat(post.frontmatter.date)}\n                      </p>\n                    </div>\n                  </div>\n                ))\n            : featuredPosts\n                .slice(0, featured_posts.showPost)\n                .map((post, i, arr) => (\n                  <div\n                    className={`flex items-center pb-6 ${\n                      i !== arr.length - 1 &&\n                      \"mb-6 border-b dark:border-b-darkmode-border\"\n                    }`}\n                    key={`key-${i}`}\n                  >\n                    {post.frontmatter.image && (\n                      <ImageFallback\n                        className=\"mr-3 h-[85px] w-[85px] rounded-full object-cover\"\n                        src={post.frontmatter.image}\n                        alt={post.frontmatter.title}\n                        width={105}\n                        height={85}\n                      />\n                    )}\n                    <div>\n                      <h3 className=\"h5 mb-2\">\n                        <Link\n                          href={`/${blog_folder}/${post.slug}`}\n                          className=\"block hover:text-primary\"\n                        >\n                          {post.frontmatter.title}\n                        </Link>\n                      </h3>\n                      <p className=\"inline-flex items-center font-secondary text-xs\">\n                        <FaRegCalendar className=\"mr-1.5\" />\n                        {dateFormat(post.frontmatter.date)}\n                      </p>\n                    </div>\n                  </div>\n                ))}\n        </div>\n      )}\n\n      {/* newsletter */}\n      {newsletter.enable && (\n        <div className=\"mt-6  rounded border border-border p-6 text-center dark:border-darkmode-border\">\n          <h4 className=\"section-title\">{newsletter.title}</h4>\n          <p className=\"mt-10 text-xs\">{newsletter.content}</p>\n          <MailchimpSubscribe\n            url={newsletter.malichip_url}\n            render={({ subscribe, status, message }) => (\n              <CustomForm\n                onValidated={(formData) => subscribe(formData)}\n                status={status}\n                message={message}\n              />\n            )}\n          />\n          <p className=\"text-xs\">\n            By Singing Up, You Agree To\n            <Link\n              href={newsletter.privacy_policy_page}\n              className=\"ml-1 text-primary\"\n            >\n              Privacy Policy\n            </Link>\n          </p>\n        </div>\n      )}\n    </aside>\n  );\n};\n\nexport default Sidebar;\n"
  },
  {
    "path": "layouts/shortcodes/Accordion.jsx",
    "content": "import { useState } from \"react\";\n\nconst Accordion = ({ title, children, className }) => {\n  const [show, setShow] = useState(false);\n\n  return (\n    <div\n      className={`rounded border border-border dark:border-darkmode-border ${className}`}\n    >\n      <button\n        className=\"relative block w-full bg-theme-light px-4 py-3 text-left text-dark dark:bg-darkmode-theme-dark dark:text-darkmode-light\"\n        onClick={() => setShow(!show)}\n      >\n        {title}\n        <svg\n          className={`absolute right-4 top-1/2 m-0 h-4 w-4 -translate-y-1/2 ${\n            show && \"rotate-180\"\n          }`}\n          x=\"0px\"\n          y=\"0px\"\n          viewBox=\"0 0 512.011 512.011\"\n          xmlSpace=\"preserve\"\n        >\n          <path\n            fill=\"currentColor\"\n            d=\"M505.755,123.592c-8.341-8.341-21.824-8.341-30.165,0L256.005,343.176L36.421,123.592c-8.341-8.341-21.824-8.341-30.165,0 s-8.341,21.824,0,30.165l234.667,234.667c4.16,4.16,9.621,6.251,15.083,6.251c5.462,0,10.923-2.091,15.083-6.251l234.667-234.667 C514.096,145.416,514.096,131.933,505.755,123.592z\"\n          />\n        </svg>\n      </button>\n      <div className={`px-4 py-3 ${!show && \"hidden\"}`}>{children}</div>\n    </div>\n  );\n};\n\nexport default Accordion;\n"
  },
  {
    "path": "layouts/shortcodes/Button.jsx",
    "content": "import Link from \"next/link\";\n\nconst Button = ({ href, type, rel, children }) => {\n  return (\n    <Link\n      href={href}\n      target=\"_blank\"\n      rel={`noopener noreferrer ${\n        rel ? (rel === \"follow\" ? \"\" : rel) : \"nofollow\"\n      }`}\n      className={`btn me-4 mb-4 ${\n        type === \"outline\" ? \"btn-outline-primary\" : \"btn-primary\"\n      } border-primary hover:text-white hover:no-underline`}\n    >\n      {children}\n    </Link>\n  );\n};\n\nexport default Button;\n"
  },
  {
    "path": "layouts/shortcodes/Code.jsx",
    "content": "import SyntaxHighlighter from \"react-syntax-highlighter\";\nimport { a11yDark } from \"react-syntax-highlighter/dist/cjs/styles/hljs\";\n\nconst HighlightedCode = ({ children, language }) => {\n  return (\n    <SyntaxHighlighter language={language} style={a11yDark}>\n      {children}\n    </SyntaxHighlighter>\n  );\n};\n\nexport default HighlightedCode;\n"
  },
  {
    "path": "layouts/shortcodes/Notice.jsx",
    "content": "function Notice({ type, children }) {\n  return (\n    <div className={`notice ${type} relative mb-8`}>\n      <div className=\"notice-head absolute top-0 left-0 z-10 flex h-[30px] w-full items-center px-3\">\n        <svg width=\"16px\" height=\"16px\" viewBox=\"0 0 512 512\">\n          <path\n            fill=\"#fff\"\n            d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"\n          />\n        </svg>\n        <p className=\"my-0 ml-1.5 text-base capitalize text-white dark:text-white\">\n          {type}\n        </p>\n      </div>\n      <div className=\"notice-body my-0 p-3 pt-[40px] dark:text-darkmode-light\">\n        {children}\n      </div>\n    </div>\n  );\n}\n\nexport default Notice;\n"
  },
  {
    "path": "layouts/shortcodes/Tab.jsx",
    "content": "function Tab({ children }) {\n  return <li className=\"tab-item my-0 hidden\">{children}</li>;\n}\n\nexport default Tab;\n"
  },
  {
    "path": "layouts/shortcodes/Tabs.jsx",
    "content": "import { useEffect, useRef } from \"react\";\n\nfunction Tabs({ children }) {\n  //select tabItems\n  const tabItemsRef = useRef(null);\n\n  //change tab item on click\n  const handleChangTab = (event, index) => {\n    const tabLinks = [...event.currentTarget.parentElement.children];\n    const items = [...tabItemsRef.current.children];\n    const activeItem = items.find((item) => !item.classList.contains(\"hidden\"));\n    const activeTabLink = tabLinks.find((item) =>\n      item.classList.contains(\"active-tab\")\n    );\n    if (activeItem === items[index]) return;\n    activeTabLink.classList.remove(\"active-tab\");\n    event.currentTarget.classList.add(\"active-tab\");\n    activeItem.classList.add(\"hidden\");\n    items[index].classList.remove(\"hidden\");\n  };\n\n  //show first tab-item\n  useEffect(() => {\n    let allItems = [...tabItemsRef.current.children];\n    allItems[0].classList.remove(\"hidden\");\n  }, []);\n\n  return (\n    <div className=\"relative\">\n      <ul className=\"mb-0 flex list-none items-center space-x-4 pl-0\">\n        {children.map((item, index) => (\n          <li\n            key={index}\n            className={` m-0 cursor-pointer rounded px-8 py-3 font-bold  text-dark dark:text-darkmode-light ${\n              index === 0 && \"active-tab\"\n            }`}\n            onClick={(e) => handleChangTab(e, index)}\n          >\n            {item.props.name}\n          </li>\n        ))}\n      </ul>\n      <ul\n        className=\"mt-1 mb-0 list-none rounded bg-theme-light p-6 dark:bg-darkmode-theme-dark\"\n        ref={tabItemsRef}\n      >\n        {children}\n      </ul>\n    </div>\n  );\n}\n\nexport default Tabs;\n"
  },
  {
    "path": "layouts/shortcodes/Video.jsx",
    "content": "function Video({ title, width = 500, height = \"auto\", src, ...rest }) {\n  return (\n    <video\n      className=\"overflow-hidden rounded\"\n      width={width}\n      height={height}\n      controls\n      {...rest}\n    >\n      <source\n        src={src.match(/^http/) ? src : `/videos/${src}`}\n        type=\"video/mp4\"\n      />\n      {title}\n    </video>\n  );\n}\n\nexport default Video;\n"
  },
  {
    "path": "layouts/shortcodes/Youtube.jsx",
    "content": "import LiteYouTubeEmbed from \"react-lite-youtube-embed\";\nimport \"react-lite-youtube-embed/dist/LiteYouTubeEmbed.css\";\n\nconst Youtube = ({ id, title, ...rest }) => {\n  return (\n    <div className=\"overflow-hidden rounded\">\n      <LiteYouTubeEmbed id={id} title={title} {...rest} />\n    </div>\n  );\n};\n\nexport default Youtube;\n"
  },
  {
    "path": "layouts/shortcodes/all.js",
    "content": "import Accordion from \"./Accordion\";\nimport Button from \"./Button\";\nimport Code from \"./Code\";\nimport Notice from \"./Notice\";\nimport Tab from \"./Tab\";\nimport Tabs from \"./Tabs\";\nimport Video from \"./Video\";\nimport Youtube from \"./Youtube\";\n\nconst shortcodes = {\n  Button,\n  Accordion,\n  Video,\n  Tab,\n  Tabs,\n  Notice,\n  Code,\n  Youtube\n};\n\nexport default shortcodes;\n"
  },
  {
    "path": "lib/contentParser.js",
    "content": "import parseMDX from \"@lib/utils/mdxParser\";\nimport fs from \"fs\";\nimport matter from \"gray-matter\";\nimport path from \"path\";\n\n// get list page data, ex: _index.md\nexport const getListPage = async (filePath) => {\n  const pageData = fs.readFileSync(filePath, \"utf-8\");\n  const pageDataParsed = matter(pageData);\n  const notFoundPage = fs.readFileSync(\"content/404.md\", \"utf-8\");\n  const notFoundDataParsed = matter(notFoundPage);\n  let frontmatter, content;\n\n  if (pageDataParsed) {\n    content = pageDataParsed.content;\n    frontmatter = pageDataParsed.data;\n  } else {\n    content = notFoundDataParsed.content;\n    frontmatter = notFoundDataParsed.data;\n  }\n  const mdxContent = await parseMDX(content);\n\n  return {\n    frontmatter,\n    content,\n    mdxContent,\n  };\n};\n\n// get all single pages, ex: blog/post.md\nexport const getSinglePage = (folder) => {\n  const filesPath = fs.readdirSync(folder);\n  const sanitizeFiles = filesPath.filter((file) => file.endsWith(\".md\"));\n  const filterSingleFiles = sanitizeFiles.filter((file) =>\n    file.match(/^(?!_)/)\n  );\n  const singlePages = filterSingleFiles.map((filename) => {\n    const slug = filename.replace(\".md\", \"\");\n    const pageData = fs.readFileSync(path.join(folder, filename), \"utf-8\");\n    const pageDataParsed = matter(pageData);\n    const frontmatterString = JSON.stringify(pageDataParsed.data);\n    const frontmatter = JSON.parse(frontmatterString);\n    const content = pageDataParsed.content;\n    const url = frontmatter.url ? frontmatter.url.replace(\"/\", \"\") : slug;\n    return { frontmatter: frontmatter, slug: url, content: content };\n  });\n\n  const publishedPages = singlePages.filter(\n    (page) =>\n      !page.frontmatter.draft && page.frontmatter.layout !== \"404\" && page\n  );\n  const filterByDate = publishedPages.filter(\n    (page) => new Date(page.frontmatter.date || new Date()) <= new Date()\n  );\n\n  return filterByDate;\n};\n\n// get a regular page data from many pages, ex: about.md\nexport const getRegularPage = async (slug) => {\n  const publishedPages = getSinglePage(\"content\");\n  const pageData = publishedPages.filter((data) => data.slug === slug);\n  const notFoundPage = fs.readFileSync(\"content/404.md\", \"utf-8\");\n  const notFoundDataParsed = matter(notFoundPage);\n\n  let frontmatter, content;\n  if (pageData[0]) {\n    content = pageData[0].content;\n    frontmatter = pageData[0].frontmatter;\n  } else {\n    content = notFoundDataParsed.content;\n    frontmatter = notFoundDataParsed.data;\n  }\n  const mdxContent = await parseMDX(content);\n\n  return {\n    frontmatter,\n    content,\n    mdxContent,\n  };\n};\n"
  },
  {
    "path": "lib/jsonGenerator.js",
    "content": "const fs = require(\"fs\");\nconst path = require(\"path\");\nconst matter = require(\"gray-matter\");\nconst config = require(\"../config/config.json\");\nconst { blog_folder } = config.settings;\nconst jsonDir = \"./.json\";\n\n// get post data\nconst getPosts = fs.readdirSync(path.join(`content/${blog_folder}`));\nconst filterPosts = getPosts.filter((post) => post.match(/^(?!_)/));\nconst posts = filterPosts.map((filename) => {\n  const slug = filename.replace(\".md\", \"\");\n  const postData = fs.readFileSync(\n    path.join(`content/${blog_folder}/`, filename),\n    \"utf-8\"\n  );\n  const { data } = matter(postData);\n  const content = matter(postData).content;\n\n  return {\n    frontmatter: data,\n    content: content,\n    slug: slug,\n  };\n});\n\ntry {\n  if (!fs.existsSync(jsonDir)) {\n    fs.mkdirSync(jsonDir);\n  }\n  fs.writeFileSync(`${jsonDir}/posts.json`, JSON.stringify(posts));\n} catch (err) {\n  console.error(err);\n}\n"
  },
  {
    "path": "lib/taxonomyParser.js",
    "content": "import { getSinglePage } from \"@lib/contentParser\";\nimport { slugify } from \"@lib/utils/textConverter\";\n\n// get all taxonomies from frontmatter\nexport const getTaxonomy = (folder, name) => {\n  const singlePages = getSinglePage(folder);\n  const taxonomyPages = singlePages.map((page) => page.frontmatter[name]);\n  let taxonomies = [];\n  for (let i = 0; i < taxonomyPages.length; i++) {\n    if (taxonomyPages[i] === undefined) {\n        continue;\n    }\n    const isArray = Array.isArray(taxonomyPages[i]);\n    const categoryArray = isArray ? taxonomyPages[i] : [ taxonomyPages[i] ];\n    for (let j = 0; j < categoryArray.length; j++) {\n      taxonomies.push(slugify(categoryArray[j]));\n    }\n  }\n  const taxonomy = [...new Set(taxonomies)];\n  return taxonomy;\n};\n"
  },
  {
    "path": "lib/utils/dateFormat.js",
    "content": "import { formatInTimeZone } from \"date-fns-tz\";\n\nconst dateFormat = (date) => {\n  return formatInTimeZone(date, \"America/New_York\", \"dd MMM yyyy\");\n};\n\nexport default dateFormat;\n"
  },
  {
    "path": "lib/utils/mdxParser.js",
    "content": "import { serialize } from \"next-mdx-remote/serialize\";\nimport rehypeSlug from \"rehype-slug\";\nimport remarkGfm from \"remark-gfm\";\n\n// mdx content parser\nconst parseMDX = async (content) => {\n  const options = {\n    mdxOptions: {\n      rehypePlugins: [rehypeSlug],\n      remarkPlugins: [remarkGfm],\n    },\n  };\n  return await serialize(content, options);\n};\n\nexport default parseMDX;\n"
  },
  {
    "path": "lib/utils/readingTime.js",
    "content": "// content reading\nconst readingTime = (content) => {\n  const WPS = 275 / 60;\n\n  let images = 0;\n  const regex = /\\w/;\n\n  let words = content.split(\" \").filter((word) => {\n    if (word.includes(\"<img\")) {\n      images += 1;\n    }\n    return regex.test(word);\n  }).length;\n\n  let imageAdjust = images * 4;\n  let imageSecs = 0;\n  let imageFactor = 12;\n\n  while (images) {\n    imageSecs += imageFactor;\n    if (imageFactor > 3) {\n      imageFactor -= 1;\n    }\n    images -= 1;\n  }\n\n  const minutes = Math.ceil(((words - imageAdjust) / WPS + imageSecs) / 60);\n\n  if (minutes < 10) {\n    if (minutes < 2) {\n      return \"0\" + minutes + ` Min read`;\n    } else {\n      return \"0\" + minutes + ` Mins read`;\n    }\n  } else {\n    return minutes + ` Mins read`;\n  }\n};\n\nexport default readingTime;\n"
  },
  {
    "path": "lib/utils/similarItems.js",
    "content": "// similer products\nconst similerItems = (currentItem, allItems, slug) => {\n  let categories = [];\n  let tags = [];\n\n  // set categories\n  if (currentItem[0].frontmatter.categories.length > 0) {\n    categories = currentItem[0].frontmatter.categories;\n  }\n\n  // set tags\n  if (currentItem[0].frontmatter.tags.length > 0) {\n    tags = currentItem[0].frontmatter.tags;\n  }\n\n  // filter by categories\n  const filterByCategories = allItems.filter((item) =>\n    categories.find((category) =>\n      item.frontmatter.categories.includes(category)\n    )\n  );\n\n  // filter by tags\n  const filterByTags = allItems.filter((item) =>\n    tags.find((tag) => item.frontmatter.tags.includes(tag))\n  );\n\n  // merged after filter\n  const mergedItems = [...new Set([...filterByCategories, ...filterByTags])];\n\n  // filter by slug\n  const filterBySlug = mergedItems.filter((product) => product.slug !== slug);\n\n  return filterBySlug;\n};\n\nexport default similerItems;\n"
  },
  {
    "path": "lib/utils/sortFunctions.js",
    "content": "// sort by date\nexport const sortByDate = (array) => {\n  const sortedArray = array.sort(\n    (a, b) =>\n      new Date(b.frontmatter.date && b.frontmatter.date) -\n      new Date(a.frontmatter.date && a.frontmatter.date)\n  );\n  return sortedArray;\n};\n\n// sort product by weight\nexport const sortByWeight = (array) => {\n  const withWeight = array.filter((item) => item.frontmatter.weight);\n  const withoutWeight = array.filter((item) => !item.frontmatter.weight);\n  const sortedWeightedArray = withWeight.sort(\n    (a, b) => a.frontmatter.weight - b.frontmatter.weight\n  );\n  const sortedArray = [...new Set([...sortedWeightedArray, ...withoutWeight])];\n  return sortedArray;\n};\n"
  },
  {
    "path": "lib/utils/textConverter.js",
    "content": "import { slug } from \"github-slugger\";\nimport { marked } from \"marked\";\n\n// slugify\nexport const slugify = (content) => {\n  if (!content) return null;\n\n  return slug(content);\n};\n\n// markdownify\nexport const markdownify = (content, tag, className) => {\n  if (!content) return null;\n\n  const Tag = tag;\n  return tag ? (\n    <Tag\n      className={className}\n      dangerouslySetInnerHTML={{\n        __html:\n          tag === \"div\" ? marked.parse(content) : marked.parseInline(content),\n      }}\n    />\n  ) : (\n    <span\n      className={className}\n      dangerouslySetInnerHTML={{\n        __html: marked.parseInline(content),\n      }}\n    />\n  );\n};\n\n// humanize\nexport const humanize = (content) => {\n  if (!content) return null;\n\n  return content\n    .replace(/^[\\s_]+|[\\s_]+$/g, \"\")\n    .replace(/[_\\s]+/g, \" \")\n    .replace(/^[a-z]/, function (m) {\n      return m.toUpperCase();\n    });\n};\n\n// plainify\nexport const plainify = (content) => {\n  if (!content) return null;\n\n  const mdParsed = marked.parseInline(String(content));\n  const filterBrackets = mdParsed.replace(/<\\/?[^>]+(>|$)/gm, \"\");\n  const filterSpaces = filterBrackets.replace(/[\\r\\n]\\s*[\\r\\n]/gm, \"\");\n  const stripHTML = htmlEntityDecoder(filterSpaces);\n  return stripHTML;\n};\n\n// strip entities for plainify\nconst htmlEntityDecoder = (htmlWithEntities) => {\n  let entityList = {\n    \"&nbsp;\": \" \",\n    \"&lt;\": \"<\",\n    \"&gt;\": \">\",\n    \"&amp;\": \"&\",\n    \"&quot;\": '\"',\n    \"&#39;\": \"'\",\n  };\n  let htmlWithoutEntities = htmlWithEntities.replace(\n    /(&amp;|&lt;|&gt;|&quot;|&#39;)/g,\n    (entity) => {\n      return entityList[entity];\n    }\n  );\n  return htmlWithoutEntities;\n};\n"
  },
  {
    "path": "netlify.toml",
    "content": "[functions]\nincluded_files = [\"content/**\"]\n"
  },
  {
    "path": "next.config.js",
    "content": "/**\n * @type {import('next').NextConfig}\n */\n\nconst nextConfig = {\n  reactStrictMode: true,\n};\n\nmodule.exports = nextConfig;\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"next-tailwind-boilerplate\",\n  \"description\": \"a nextjs and tailwindcss boilerplate by themefisher.com\",\n  \"version\": \"1.0.5\",\n  \"private\": true,\n  \"license\": \"UNLICENSED\",\n  \"scripts\": {\n    \"dev\": \"node lib/jsonGenerator.js && next dev\",\n    \"build\": \"node lib/jsonGenerator.js && next build\",\n    \"export\": \"npm run build && next export\",\n    \"lint\": \"next lint\",\n    \"start\": \"next start\"\n  },\n  \"dependencies\": {\n    \"disqus-react\": \"^1.1.5\",\n    \"github-slugger\": \"^2.0.0\",\n    \"gray-matter\": \"^4.0.3\",\n    \"marked\": \"^4.2.12\",\n    \"next\": \"13.1.5\",\n    \"next-mdx-remote\": \"^4.3.0\",\n    \"next-themes\": \"^0.2.1\",\n    \"react\": \"18.2.0\",\n    \"react-dom\": \"18.2.0\",\n    \"react-gtm-module\": \"^2.0.11\",\n    \"react-icons\": \"^4.7.1\",\n    \"react-lite-youtube-embed\": \"^2.3.52\",\n    \"react-mailchimp-subscribe\": \"^2.1.3\",\n    \"react-syntax-highlighter\": \"^15.5.0\",\n    \"rehype-slug\": \"^5.1.0\",\n    \"remark-gfm\": \"^3.0.1\"\n  },\n  \"devDependencies\": {\n    \"@tailwindcss/forms\": \"^0.5.3\",\n    \"@tailwindcss/typography\": \"^0.5.9\",\n    \"autoprefixer\": \"^10.4.13\",\n    \"date-fns\": \"^2.29.3\",\n    \"date-fns-tz\": \"^1.3.7\",\n    \"eslint\": \"8.32.0\",\n    \"eslint-config-next\": \"13.1.5\",\n    \"jshint\": \"^2.13.6\",\n    \"postcss\": \"^8.4.21\",\n    \"prettier\": \"^2.8.3\",\n    \"prettier-plugin-tailwindcss\": \"^0.2.2\",\n    \"sass\": \"^1.57.1\",\n    \"sharp\": \"^0.31.3\",\n    \"tailwind-bootstrap-grid\": \"^5.0.1\",\n    \"tailwind-scrollbar\": \"^2.1.0\",\n    \"tailwindcss\": \"^3.2.4\"\n  }\n}\n"
  },
  {
    "path": "pages/404.js",
    "content": "import NotFound from \"@layouts/404\";\nimport Base from \"@layouts/Baseof\";\nimport { getRegularPage } from \"@lib/contentParser\";\n\nconst notFound = ({ data }) => {\n  return (\n    <Base>\n      <NotFound data={data} />\n    </Base>\n  );\n};\n\n// get 404 page data\nexport const getStaticProps = async () => {\n  const notFoundData = await getRegularPage(\"404\");\n  return {\n    props: {\n      data: notFoundData,\n    },\n  };\n};\n\nexport default notFound;\n"
  },
  {
    "path": "pages/[regular].js",
    "content": "import NotFound from \"@layouts/404\";\nimport About from \"@layouts/About\";\nimport Base from \"@layouts/Baseof\";\nimport Contact from \"@layouts/Contact\";\nimport Default from \"@layouts/Default\";\nimport { getRegularPage, getSinglePage } from \"@lib/contentParser\";\n\n// for all regular pages\nconst RegularPages = ({ data }) => {\n  const { title, meta_title, description, image, noindex, canonical, layout } =\n    data.frontmatter;\n  const { content } = data;\n\n  return (\n    <Base\n      title={title}\n      description={description ? description : content.slice(0, 120)}\n      meta_title={meta_title}\n      image={image}\n      noindex={noindex}\n      canonical={canonical}\n    >\n      {layout === \"404\" ? (\n        <NotFound data={data} />\n      ) : layout === \"about\" ? (\n        <About data={data} />\n      ) : layout === \"contact\" ? (\n        <Contact data={data} />\n      ) : (\n        <Default data={data} />\n      )}\n    </Base>\n  );\n};\nexport default RegularPages;\n\n// for regular page routes\nexport const getStaticPaths = async () => {\n  const slugs = getSinglePage(\"content\");\n  const paths = slugs.map((item) => ({\n    params: {\n      regular: item.slug,\n    },\n  }));\n\n  return {\n    paths,\n    fallback: false,\n  };\n};\n\n// for regular page data\nexport const getStaticProps = async ({ params }) => {\n  const { regular } = params;\n  const allPages = await getRegularPage(regular);\n  return {\n    props: {\n      slug: regular,\n      data: allPages,\n    },\n  };\n};\n"
  },
  {
    "path": "pages/_app.js",
    "content": "import config from \"@config/config.json\";\nimport theme from \"@config/theme.json\";\nimport { JsonContext } from \"context/state\";\nimport { ThemeProvider } from \"next-themes\";\nimport Head from \"next/head\";\nimport { useEffect, useState } from \"react\";\nimport TagManager from \"react-gtm-module\";\nimport \"styles/style.scss\";\n\nconst App = ({ Component, pageProps }) => {\n  // default theme setup\n  const { default_theme } = config.settings;\n\n  // import google font css\n  const pf = theme.fonts.font_family.primary;\n  const sf = theme.fonts.font_family.secondary;\n  const [fontcss, setFontcss] = useState();\n  useEffect(() => {\n    fetch(\n      `https://fonts.googleapis.com/css2?family=${pf}${\n        sf ? \"&family=\" + sf : \"\"\n      }&display=swap`\n    ).then((res) => res.text().then((css) => setFontcss(css)));\n  }, [pf, sf]);\n\n  // google tag manager (gtm)\n  const tagManagerArgs = {\n    gtmId: config.params.tag_manager_id,\n  };\n  useEffect(() => {\n    setTimeout(() => {\n      process.env.NODE_ENV === \"production\" &&\n        config.params.tag_manager_id &&\n        TagManager.initialize(tagManagerArgs);\n    }, 5000);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <JsonContext>\n      <Head>\n        {/* google font css */}\n        <link\n          rel=\"preconnect\"\n          href=\"https://fonts.gstatic.com\"\n          crossOrigin=\"true\"\n        />\n        <style\n          dangerouslySetInnerHTML={{\n            __html: `${fontcss}`,\n          }}\n        />\n        {/* responsive meta */}\n        <meta\n          name=\"viewport\"\n          content=\"width=device-width, initial-scale=1, maximum-scale=5\"\n        />\n      </Head>\n      <ThemeProvider attribute=\"class\" defaultTheme={default_theme}>\n        <Component {...pageProps} />\n      </ThemeProvider>\n    </JsonContext>\n  );\n};\n\nexport default App;\n"
  },
  {
    "path": "pages/_document.js",
    "content": "import TwSizeIndicator from \"@components/TwSizeIndicator\";\nimport config from \"@config/config.json\";\nimport { Head, Html, Main, NextScript } from \"next/document\";\n\nconst Document = () => {\n  // destructuring items from config object\n  const { favicon } = config.site;\n  return (\n    <Html lang=\"en\">\n      <Head>\n        {/* favicon */}\n        <link rel=\"shortcut icon\" href={favicon} />\n        {/* theme meta */}\n        <meta name=\"theme-name\" content=\"geeky-nextjs\" />\n        <meta name=\"msapplication-TileColor\" content=\"#000000\" />\n        <meta\n          name=\"theme-color\"\n          media=\"(prefers-color-scheme: light)\"\n          content=\"#fff\"\n        />\n        <meta\n          name=\"theme-color\"\n          media=\"(prefers-color-scheme: dark)\"\n          content=\"#000\"\n        />\n      </Head>\n      <body>\n        <Main />\n        <TwSizeIndicator />\n        <NextScript />\n      </body>\n    </Html>\n  );\n};\n\nexport default Document;\n"
  },
  {
    "path": "pages/categories/[category].js",
    "content": "import config from \"@config/config.json\";\nimport Base from \"@layouts/Baseof\";\nimport Sidebar from \"@layouts/partials/Sidebar\";\nimport { getSinglePage } from \"@lib/contentParser\";\nimport { getTaxonomy } from \"@lib/taxonomyParser\";\nimport { slugify } from \"@lib/utils/textConverter\";\nimport Post from \"@partials/Post\";\nconst { blog_folder } = config.settings;\n\n// category page\nconst Category = ({ postsByCategories, category, posts, categories }) => {\n  return (\n    <Base title={category}>\n      <div className=\"section mt-16\">\n        <div className=\"container\">\n          <h1 className=\"h2 mb-12\">\n            Showing posts from\n            <span className=\"section-title ml-1 inline-block capitalize\">\n              {category.replace(\"-\", \" \")}\n            </span>\n          </h1>\n          <div className=\"row\">\n            <div className=\"lg:col-8\">\n              <div className=\"row rounded border border-border p-4 px-3 dark:border-darkmode-border lg:p-6\">\n                {postsByCategories.map((post, i) => (\n                  <div key={`key-${i}`} className=\"col-12 mb-8 sm:col-6\">\n                    <Post post={post} />\n                  </div>\n                ))}\n              </div>\n            </div>\n            <Sidebar posts={posts} categories={categories} />\n          </div>\n        </div>\n      </div>\n    </Base>\n  );\n};\n\nexport default Category;\n\n// category page routes\nexport const getStaticPaths = () => {\n  const allCategories = getTaxonomy(`content/${blog_folder}`, \"categories\");\n\n  const paths = allCategories.map((category) => ({\n    params: {\n      category: category,\n    },\n  }));\n\n  return { paths, fallback: false };\n};\n\n// category page data\nexport const getStaticProps = ({ params }) => {\n  const posts = getSinglePage(`content/${blog_folder}`);\n  const filterPosts = posts.filter((post) =>\n    post.frontmatter.categories.find((category) =>\n      slugify(category).includes(params.category)\n    )\n  );\n  const categories = getTaxonomy(`content/${blog_folder}`, \"categories\");\n\n  const categoriesWithPostsCount = categories.map((category) => {\n    const filteredPosts = posts.filter((post) =>\n      post.frontmatter.categories.map(e => slugify(e)).includes(category)\n    );\n    return {\n      name: category,\n      posts: filteredPosts.length,\n    };\n  });\n\n  return {\n    props: {\n      posts,\n      postsByCategories: filterPosts,\n      category: params.category,\n      categories: categoriesWithPostsCount,\n    },\n  };\n};\n"
  },
  {
    "path": "pages/categories/index.js",
    "content": "import config from \"@config/config.json\";\nimport Base from \"@layouts/Baseof\";\nimport { getTaxonomy } from \"@lib/taxonomyParser\";\nimport { humanize, markdownify } from \"@lib/utils/textConverter\";\nimport Link from \"next/link\";\nconst { blog_folder } = config.settings;\nimport { getSinglePage } from \"@lib/contentParser\";\nimport { FaFolder } from \"react-icons/fa\";\nimport { slugify } from \"@lib/utils/textConverter\";\n\nconst Categories = ({ categories }) => {\n  return (\n    <Base title={\"categories\"}>\n      <section className=\"section pt-0\">\n        {markdownify(\n          \"Categories\",\n          \"h1\",\n          \"h2 mb-16 bg-theme-light dark:bg-darkmode-theme-dark py-12 text-center lg:text-[55px]\"\n        )}\n        <div className=\"container pt-12 text-center\">\n          <ul className=\"row\">\n            {categories.map((category, i) => (\n              <li\n                key={`category-${i}`}\n                className=\"mt-4 block lg:col-4 xl:col-3\"\n              >\n                <Link\n                  href={`/categories/${category.name}`}\n                  className=\"flex w-full items-center justify-center rounded-lg bg-theme-light px-4 py-4 font-bold text-dark transition hover:bg-primary hover:text-white  dark:bg-darkmode-theme-dark dark:text-darkmode-light dark:hover:bg-primary dark:hover:text-white\"\n                >\n                  <FaFolder className=\"mr-1.5\" />\n                  {humanize(category.name)} ({category.posts})\n                </Link>\n              </li>\n            ))}\n          </ul>\n        </div>\n      </section>\n    </Base>\n  );\n};\n\nexport default Categories;\n\nexport const getStaticProps = () => {\n  const posts = getSinglePage(`content/${blog_folder}`);\n  const categories = getTaxonomy(`content/${blog_folder}`, \"categories\");\n  const categoriesWithPostsCount = categories.map((category) => {\n    const filteredPosts = posts.filter((post) =>\n      post.frontmatter.categories.map(e => slugify(e)).includes(category)\n    );\n    return {\n      name: category,\n      posts: filteredPosts.length,\n    };\n  });\n  return {\n    props: {\n      categories: categoriesWithPostsCount,\n    },\n  };\n};\n"
  },
  {
    "path": "pages/index.js",
    "content": "import config from \"@config/config.json\";\nimport Base from \"@layouts/Baseof\";\nimport ImageFallback from \"@layouts/components/ImageFallback\";\nimport Pagination from \"@layouts/components/Pagination\";\nimport Post from \"@layouts/partials/Post\";\nimport Sidebar from \"@layouts/partials/Sidebar\";\nimport { getListPage, getSinglePage } from \"@lib/contentParser\";\nimport { getTaxonomy } from \"@lib/taxonomyParser\";\nimport dateFormat from \"@lib/utils/dateFormat\";\nimport { sortByDate } from \"@lib/utils/sortFunctions\";\nimport { markdownify } from \"@lib/utils/textConverter\";\nimport Link from \"next/link\";\nimport { FaRegCalendar } from \"react-icons/fa\";\nconst { blog_folder, pagination } = config.settings;\n\nconst Home = ({\n  banner,\n  posts,\n  featured_posts,\n  recent_posts,\n  categories,\n  promotion,\n}) => {\n  // define state\n  const sortPostByDate = sortByDate(posts);\n  const featuredPosts = sortPostByDate.filter(\n    (post) => post.frontmatter.featured\n  );\n  const showPosts = pagination;\n\n  return (\n    <Base>\n      {/* Banner */}\n      <section className=\"section banner relative pb-0\">\n        <ImageFallback\n          className=\"absolute bottom-0 left-0 z-[-1] w-full\"\n          src={\"/images/banner-bg-shape.svg\"}\n          width={1905}\n          height={295}\n          alt=\"banner-shape\"\n          priority\n        />\n\n        <div className=\"container\">\n          <div className=\"row flex-wrap-reverse items-center justify-center lg:flex-row\">\n            <div className={banner.image_enable ? \"mt-12 text-center lg:mt-0 lg:text-left lg:col-6\" : \"mt-12 text-center lg:mt-0 lg:text-left lg:col-12\"}>\n              <div className=\"banner-title\">\n                {markdownify(banner.title, \"h1\")}\n                {markdownify(banner.title_small, \"span\")}\n              </div>\n              {markdownify(banner.content, \"p\", \"mt-4\")}\n              {banner.button.enable && (\n                  <Link\n                    className=\"btn btn-primary mt-6\"\n                    href={banner.button.link}\n                    rel={banner.button.rel}\n                  >\n                    {banner.button.label}\n                  </Link>\n              )}\n            </div>\n            {banner.image_enable && (\n                <div className=\"col-9 lg:col-6\">\n                  <ImageFallback\n                    className=\"mx-auto object-contain\"\n                    src={banner.image}\n                    width={548}\n                    height={443}\n                    priority={true}\n                    alt=\"Banner Image\"\n                  />\n                </div>\n            )}\n          </div>\n        </div>\n      </section>\n\n      {/* Home main */}\n      <section className=\"section\">\n        <div className=\"container\">\n          <div className=\"row items-start\">\n            <div className=\"mb-12 lg:mb-0 lg:col-8\">\n              {/* Featured posts */}\n              {featured_posts.enable && (\n                <div className=\"section\">\n                  {markdownify(featured_posts.title, \"h2\", \"section-title\")}\n                  <div className=\"rounded border border-border p-6 dark:border-darkmode-border\">\n                    <div className=\"row\">\n                      <div className=\"md:col-6\">\n                        <Post post={featuredPosts[0]} />\n                      </div>\n                      <div className=\"scrollbar-w-[10px] mt-8 max-h-[480px] scrollbar-thin scrollbar-track-gray-100 scrollbar-thumb-border dark:scrollbar-track-gray-800 dark:scrollbar-thumb-darkmode-theme-dark md:mt-0 md:col-6\">\n                        {featuredPosts\n                          .slice(1, featuredPosts.length)\n                          .map((post, i, arr) => (\n                            <div\n                              className={`mb-6 flex items-center pb-6 ${\n                                i !== arr.length - 1 &&\n                                \"border-b border-border dark:border-darkmode-border\"\n                              }`}\n                              key={`key-${i}`}\n                            >\n                              {post.frontmatter.image && (\n                                <ImageFallback\n                                  className=\"mr-3 h-[85px] rounded object-cover\"\n                                  src={post.frontmatter.image}\n                                  alt={post.frontmatter.title}\n                                  width={105}\n                                  height={85}\n                                />\n                              )}\n                              <div>\n                                <h3 className=\"h5 mb-2\">\n                                  <Link\n                                    href={`/${blog_folder}/${post.slug}`}\n                                    className=\"block hover:text-primary\"\n                                  >\n                                    {post.frontmatter.title}\n                                  </Link>\n                                </h3>\n                                <p className=\"inline-flex items-center font-bold\">\n                                  <FaRegCalendar className=\"mr-1.5\" />\n                                  {dateFormat(post.frontmatter.date)}\n                                </p>\n                              </div>\n                            </div>\n                          ))}\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              )}\n\n              {/* Promotion */}\n              {promotion.enable && (\n                <Link href={promotion.link} className=\"section block pt-0\">\n                  <ImageFallback\n                    className=\"h-full w-full\"\n                    height=\"115\"\n                    width=\"800\"\n                    src={promotion.image}\n                    alt=\"promotion\"\n                  />\n                </Link>\n              )}\n\n              {/* Recent Posts */}\n              {recent_posts.enable && (\n                <div className=\"section pt-0\">\n                  {markdownify(recent_posts.title, \"h2\", \"section-title\")}\n                  <div className=\"rounded border border-border px-6 pt-6 dark:border-darkmode-border\">\n                    <div className=\"row\">\n                      {sortPostByDate.slice(0, showPosts).map((post) => (\n                        <div className=\"mb-8 md:col-6\" key={post.slug}>\n                          <Post post={post} />\n                        </div>\n                      ))}\n                    </div>\n                  </div>\n                </div>\n              )}\n\n              <Pagination\n                totalPages={Math.ceil(posts.length / showPosts)}\n                currentPage={1}\n              />\n            </div>\n            {/* sidebar */}\n            <Sidebar\n              className={\"lg:mt-[9.5rem]\"}\n              posts={posts}\n              categories={categories}\n            />\n          </div>\n        </div>\n      </section>\n    </Base>\n  );\n};\n\nexport default Home;\n\n// for homepage data\nexport const getStaticProps = async () => {\n  const homepage = await getListPage(\"content/_index.md\");\n  const { frontmatter } = homepage;\n  const { banner, featured_posts, recent_posts, promotion } = frontmatter;\n  const posts = getSinglePage(`content/${blog_folder}`);\n  const categories = getTaxonomy(`content/${blog_folder}`, \"categories\");\n\n  const categoriesWithPostsCount = categories.map((category) => {\n    const filteredPosts = posts.filter((post) =>\n      post.frontmatter.categories.includes(category)\n    );\n    return {\n      name: category,\n      posts: filteredPosts.length,\n    };\n  });\n\n  return {\n    props: {\n      banner: banner,\n      posts: posts,\n      featured_posts,\n      recent_posts,\n      promotion,\n      categories: categoriesWithPostsCount,\n    },\n  };\n};\n"
  },
  {
    "path": "pages/page/[slug].js",
    "content": "import config from \"@config/config.json\";\nimport Base from \"@layouts/Baseof\";\nimport Pagination from \"@layouts/components/Pagination\";\nimport { getListPage, getSinglePage } from \"@lib/contentParser\";\nimport { markdownify } from \"@lib/utils/textConverter\";\nimport { sortByDate } from \"@lib/utils/sortFunctions\";\nimport Post from \"@partials/Post\";\nconst { blog_folder, summary_length } = config.settings;\n\n// blog pagination\nconst BlogPagination = ({ postIndex, posts, currentPage, pagination }) => {\n  const indexOfLastPost = currentPage * pagination;\n  const indexOfFirstPost = indexOfLastPost - pagination;\n  const orderedPosts = sortByDate(posts);\n  const currentPosts = orderedPosts.slice(indexOfFirstPost, indexOfLastPost);\n  const { frontmatter } = postIndex;\n  const { title } = frontmatter;\n  const totalPages = Math.ceil(posts.length / pagination);\n\n  return (\n    <Base title={title}>\n      <section className=\"section\">\n        <div className=\"container\">\n          {markdownify(title, \"h1\", \"h2 mb-8 text-center\")}\n          <div className=\"row mb-16\">\n            {currentPosts.map((post, i) => (\n              <div className=\"mt-16 lg:col-6\" key={post.slug}>\n                <Post post={post} />\n              </div>\n            ))}\n          </div>\n          <Pagination totalPages={totalPages} currentPage={currentPage} />\n        </div>\n      </section>\n    </Base>\n  );\n};\n\nexport default BlogPagination;\n\n// get blog pagination slug\nexport const getStaticPaths = () => {\n  const getAllSlug = getSinglePage(`content/${blog_folder}`);\n  const allSlug = getAllSlug.map((item) => item.slug);\n  const { pagination } = config.settings;\n  const totalPages = Math.ceil(allSlug.length / pagination);\n  let paths = [];\n\n  for (let i = 1; i < totalPages; i++) {\n    paths.push({\n      params: {\n        slug: (i + 1).toString(),\n      },\n    });\n  }\n\n  return {\n    paths,\n    fallback: false,\n  };\n};\n\n// get blog pagination content\nexport const getStaticProps = async ({ params }) => {\n  const currentPage = parseInt((params && params.slug) || 1);\n  const { pagination } = config.settings;\n  const posts = getSinglePage(`content/${blog_folder}`);\n  const postIndex = await getListPage(`content/${blog_folder}/_index.md`);\n\n  return {\n    props: {\n      pagination: pagination,\n      posts: posts,\n      currentPage: currentPage,\n      postIndex: postIndex,\n    },\n  };\n};\n"
  },
  {
    "path": "pages/posts/[single].js",
    "content": "import config from \"@config/config.json\";\nimport PostSingle from \"@layouts/PostSingle\";\nimport { getSinglePage } from \"@lib/contentParser\";\nimport { getTaxonomy } from \"@lib/taxonomyParser\";\nimport parseMDX from \"@lib/utils/mdxParser\";\nconst { blog_folder } = config.settings;\n\n// post single layout\nconst Article = ({\n  post,\n  mdxContent,\n  slug,\n  allCategories,\n  relatedPosts,\n  posts,\n}) => {\n  const { frontmatter, content } = post;\n\n  return (\n    <PostSingle\n      frontmatter={frontmatter}\n      content={content}\n      mdxContent={mdxContent}\n      slug={slug}\n      allCategories={allCategories}\n      relatedPosts={relatedPosts}\n      posts={posts}\n    />\n  );\n};\n\n// get post single slug\nexport const getStaticPaths = () => {\n  const allSlug = getSinglePage(`content/${blog_folder}`);\n  const paths = allSlug.map((item) => ({\n    params: {\n      single: item.slug,\n    },\n  }));\n\n  return {\n    paths,\n    fallback: false,\n  };\n};\n\n// get post single content\nexport const getStaticProps = async ({ params }) => {\n  const { single } = params;\n  const posts = getSinglePage(`content/${blog_folder}`);\n  const post = posts.find((p) => p.slug == single);\n  const mdxContent = await parseMDX(post.content);\n  // related posts\n  const relatedPosts = posts.filter((p) =>\n    post.frontmatter.categories.some((cate) =>\n      p.frontmatter.categories.includes(cate)\n    )\n  );\n\n  //all categories\n  const categories = getTaxonomy(`content/${blog_folder}`, \"categories\");\n  const categoriesWithPostsCount = categories.map((category) => {\n    const filteredPosts = posts.filter((post) =>\n      post.frontmatter.categories.includes(category)\n    );\n    return {\n      name: category,\n      posts: filteredPosts.length,\n    };\n  });\n  return {\n    props: {\n      post: post,\n      mdxContent: mdxContent,\n      slug: single,\n      allCategories: categoriesWithPostsCount,\n      relatedPosts: relatedPosts,\n      posts: posts,\n    },\n  };\n};\n\nexport default Article;\n"
  },
  {
    "path": "pages/posts/index.js",
    "content": "import BlogPagination, { getStaticProps } from \"../page/[slug]\";\n\nexport { getStaticProps };\nexport default BlogPagination;\n"
  },
  {
    "path": "pages/search.js",
    "content": "import Base from \"@layouts/Baseof\";\nimport { slugify } from \"@lib/utils/textConverter\";\nimport Post from \"@partials/Post\";\nimport { useSearchContext } from \"context/state\";\nimport { useRouter } from \"next/router\";\n\nconst SearchPage = () => {\n  const router = useRouter();\n  const { query } = router;\n  const keyword = slugify(query.key);\n  const { posts } = useSearchContext();\n\n  const searchResults = posts.filter((product) => {\n    if (product.frontmatter.draft) {\n      return !product.frontmatter.draft;\n    }\n    if (slugify(product.frontmatter.title).includes(keyword)) {\n      return product;\n    } else if (\n      product.frontmatter.categories.find((category) =>\n        slugify(category).includes(keyword)\n      )\n    ) {\n      return product;\n    } else if (slugify(product.content).includes(keyword)) {\n      return product;\n    }\n  });\n\n  return (\n    <Base title={`Search results for ${query.key}`}>\n      <div className=\"section\">\n        <div className=\"container\">\n          <h1 className=\"h2 mb-8 text-center\">\n            Search results for <span className=\"text-primary\">{query.key}</span>\n          </h1>\n          {searchResults.length > 0 ? (\n            <div className=\"row\">\n              {searchResults.map((post, i) => (\n                <div key={`key-${i}`} className=\"col-12 mb-8 sm:col-6\">\n                  <Post post={post} />\n                </div>\n              ))}\n            </div>\n          ) : (\n            <div className=\"py-24 text-center text-h3 shadow\">\n              No Search Found\n            </div>\n          )}\n        </div>\n      </div>\n    </Base>\n  );\n};\n\nexport default SearchPage;\n"
  },
  {
    "path": "postcss.config.js",
    "content": "module.exports = {\n  plugins: {\n    tailwindcss: {},\n    autoprefixer: {},\n  },\n};\n"
  },
  {
    "path": "public/.htaccess",
    "content": "##### Optimize default expiration time - BEGIN\r\n<IfModule mod_expires.c>\r\n  \r\n  ## Enable expiration control\r\n  ExpiresActive On\r\n\r\n  ## CSS and JS expiration: 1 week after request\r\n  ExpiresByType text/css \"now plus 1 week\"\r\n  ExpiresByType application/javascript \"now plus 1 week\"\r\n  ExpiresByType application/x-javascript \"now plus 1 week\"\r\n\r\n  ## Image files expiration: 1 month after request\r\n  ExpiresByType image/bmp \"now plus 1 month\"\r\n  ExpiresByType image/gif \"now plus 1 month\"\r\n  ExpiresByType image/jpeg \"now plus 1 month\"\r\n  ExpiresByType image/webp \"now plus 1 month\"\r\n  ExpiresByType image/jp2 \"now plus 1 month\"\r\n  ExpiresByType image/pipeg \"now plus 1 month\"\r\n  ExpiresByType image/png \"now plus 1 month\"\r\n  ExpiresByType image/svg+xml \"now plus 1 month\"\r\n  ExpiresByType image/tiff \"now plus 1 month\"\r\n  ExpiresByType image/x-icon \"now plus 1 month\"\r\n  ExpiresByType image/ico \"now plus 1 month\"\r\n  ExpiresByType image/icon \"now plus 1 month\"\r\n  ExpiresByType text/ico \"now plus 1 month\"\r\n  ExpiresByType application/ico \"now plus 1 month\"\r\n  ExpiresByType image/vnd.wap.wbmp \"now plus 1 month\"\r\n\r\n  ## Font files expiration: 1 month after request\r\n  ExpiresByType application/x-font-ttf \"now plus 1 month\"\r\n  ExpiresByType application/x-font-opentype \"now plus 1 month\"\r\n  ExpiresByType application/x-font-woff \"now plus 1 month\"\r\n  ExpiresByType font/woff2 \"now plus 1 month\"\r\n  ExpiresByType image/svg+xml \"now plus 1 month\"\r\n\r\n  ## Audio files expiration: 1 month after request\r\n  ExpiresByType audio/ogg \"now plus 1 month\"\r\n  ExpiresByType application/ogg \"now plus 1 month\"\r\n  ExpiresByType audio/basic \"now plus 1 month\"\r\n  ExpiresByType audio/mid \"now plus 1 month\"\r\n  ExpiresByType audio/midi \"now plus 1 month\"\r\n  ExpiresByType audio/mpeg \"now plus 1 month\"\r\n  ExpiresByType audio/mp3 \"now plus 1 month\"\r\n  ExpiresByType audio/x-aiff \"now plus 1 month\"\r\n  ExpiresByType audio/x-mpegurl \"now plus 1 month\"\r\n  ExpiresByType audio/x-pn-realaudio \"now plus 1 month\"\r\n  ExpiresByType audio/x-wav \"now plus 1 month\"\r\n\r\n  ## Movie files expiration: 1 month after request\r\n  ExpiresByType application/x-shockwave-flash \"now plus 1 month\"\r\n  ExpiresByType x-world/x-vrml \"now plus 1 month\"\r\n  ExpiresByType video/x-msvideo \"now plus 1 month\"\r\n  ExpiresByType video/mpeg \"now plus 1 month\"\r\n  ExpiresByType video/mp4 \"now plus 1 month\"\r\n  ExpiresByType video/quicktime \"now plus 1 month\"\r\n  ExpiresByType video/x-la-asf \"now plus 1 month\"\r\n  ExpiresByType video/x-ms-asf \"now plus 1 month\"\r\n</IfModule>\r\n##### Optimize default expiration time - END\r\n\r\n##### 1 Month for most static resources\r\n<filesMatch \".(css|jpg|jpeg|png|webp|gif|js|ico|woff|woff2|eot|ttf)$\">\r\n  Header set Cache-Control \"max-age=2592000, public\"\r\n</filesMatch>\r\n\r\n##### Enable gzip compression for resources\r\n<ifModule mod_gzip.c>\r\n  mod_gzip_on Yes\r\n  mod_gzip_dechunk Yes\r\n  mod_gzip_item_include file .(html?|txt|css|js|php)$\r\n  mod_gzip_item_include handler ^cgi-script$\r\n  mod_gzip_item_include mime ^text/.*\r\n  mod_gzip_item_include mime ^application/x-javascript.*\r\n  mod_gzip_item_exclude mime ^image/.*\r\n  mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*\r\n</ifModule>\r\n\r\n##### Or, compress certain file types by extension:\r\n<FilesMatch \".(html|css|jpg|jpeg|webp|png|gif|js|ico)\">\r\n  SetOutputFilter DEFLATE\r\n</FilesMatch>\r\n\r\n##### Set Header Vary: Accept-Encoding\r\n<IfModule mod_headers.c>\r\n  <FilesMatch \".(js|css|xml|gz|html)$\">\r\n    Header append Vary: Accept-Encoding\r\n  </FilesMatch>\r\n</IfModule>"
  },
  {
    "path": "public/.well-known/sitepins.json",
    "content": "{\n  \"cms\": \"Sitepins\",\n  \"generator\": \"Sitepins CMS\",\n  \"version\": \"1.0.0\"\n}"
  },
  {
    "path": "public/robots.txt",
    "content": "User-agent: *\nAllow: /\n\nDisallow: /api/*"
  },
  {
    "path": "public/sitepins-manifest.json",
    "content": "{\n  \"name\": \"Sitepins CMS\",\n  \"description\": \"Git-based CMS detection file\",\n  \"cms\": \"Sitepins\",\n  \"generator\": \"nextjs\",\n  \"html\": \"<meta name=\\\"generator\\\" content=\\\"Sitepins\",\n  \"headers\": {\n    \"x-powered-by\": \"Sitepins\"\n  }\n}"
  },
  {
    "path": "styles/base.scss",
    "content": "html {\n  @apply text-base;\n}\n\nbody {\n  @apply bg-body font-primary font-normal leading-relaxed text-text dark:bg-darkmode-body dark:text-darkmode-light;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  @apply font-secondary font-bold leading-tight text-black dark:text-darkmode-light;\n}\n\nh1,\n.h1 {\n  @apply text-h1-sm md:text-h1;\n}\n\nh2,\n.h2 {\n  @apply text-h2-sm md:text-h2;\n}\n\nh3,\n.h3 {\n  @apply text-h3-sm md:text-h3;\n}\n\nh4,\n.h4 {\n  @apply text-h4;\n}\n\nh5,\n.h5 {\n  @apply text-h5;\n}\n\nh6,\n.h6 {\n  @apply text-h6;\n}\n"
  },
  {
    "path": "styles/buttons.scss",
    "content": ".btn {\n  @apply font-secondary inline-block border px-5 py-2.5 font-bold transition;\n}\n\n.btn-primary {\n  @apply bg-primary text-white rounded-[50px] px-8 py-2.5  relative border-0 overflow-hidden h-12;\n\n  &::before {\n    @apply content-[''] absolute  h-full right-0  bg-black/5 w-0 top-0 transition-all duration-500 rounded-[50px] ease-[cubic-bezier(.42,0,.58,1)];\n  }\n\n  &:hover {\n     &::before {\n      @apply w-full right-auto left-0;\n    }\n  }\n}\n\n.btn-outline-primary {\n  @apply border-primary bg-transparent hover:bg-primary hover:text-white  rounded-[50px] text-primary font-bold relative transition-all ease-[cubic-bezier(.42,0,.58,1)] duration-75 overflow-hidden h-12;\n\n  &::before {\n    @apply content-[''] absolute  h-full right-0  bg-black/5 w-0 top-0 transition-all duration-500 rounded-[50px];\n  }\n\n  &:hover {\n     &::before {\n      @apply w-full right-auto left-0;\n    }\n  }\n}\n"
  },
  {
    "path": "styles/components.scss",
    "content": "// section style\n.section {\n  @apply py-16;\n}\n\n// container\n.container {\n  @apply mx-auto max-w-[1320px];\n}\n\n// form style\n.form-inputs * {\n  @apply mb-5 leading-10;\n}\n\n// social icon style\n.social-icons {\n  @apply space-x-4;\n  li {\n    @apply inline-block;\n    a {\n      @apply block h-9 w-9 rounded-full border bg-primary text-center text-white;\n      svg {\n        @apply m-auto h-9;\n      }\n    }\n  }\n}\n\n// form style\n.form-input,\n.form-textarea {\n  @apply border-0 border-b border-border bg-transparent px-0 placeholder:text-xs placeholder:text-light  focus:border-primary focus:ring-transparent dark:border-darkmode-border dark:text-darkmode-light dark:placeholder:text-darkmode-light;\n}\n\n// content style\n.content {\n  @apply prose max-w-none;\n  @apply prose-headings:mt-[.5em] prose-headings:mb-[.9em] prose-headings:font-bold prose-headings:text-dark prose-headings:dark:text-white;\n  @apply prose-h1:text-h1-sm md:prose-h1:text-h1;\n  @apply prose-h2:text-h2-sm md:prose-h2:text-h2;\n  @apply prose-h3:text-h3-sm md:prose-h3:text-h3;\n  @apply prose-hr:border-border prose-hr:dark:border-darkmode-border;\n  @apply prose-p:text-base prose-p:text-text prose-p:dark:text-darkmode-light;\n  @apply prose-blockquote:mb-12 prose-blockquote:rounded prose-blockquote:border-0 prose-blockquote:bg-theme-light prose-blockquote:py-1 prose-blockquote:px-12 prose-blockquote:not-italic prose-blockquote:dark:bg-theme-dark prose-blockquote:lg:px-16;\n  @apply prose-code:px-1 prose-code:text-primary;\n  @apply prose-pre:rounded;\n  @apply prose-img:rounded;\n  @apply prose-table:rounded;\n  @apply prose-strong:text-dark prose-strong:dark:text-darkmode-light;\n  @apply prose-a:text-primary prose-a:no-underline hover:prose-a:underline;\n  @apply prose-li:text-text prose-li:dark:text-darkmode-light;\n  @apply prose-table:overflow-hidden prose-table:border prose-table:border-border prose-table:dark:border-darkmode-border;\n  @apply prose-thead:border-border prose-thead:bg-theme-light prose-th:py-4 prose-th:px-4 prose-th:text-dark prose-thead:dark:border-darkmode-border prose-thead:dark:bg-theme-dark prose-th:dark:text-darkmode-light;\n  @apply prose-tr:border-border prose-tr:dark:border-darkmode-border;\n  @apply prose-td:px-3 prose-td:py-4 prose-td:dark:text-darkmode-light;\n  @apply prose-li:marker:dark:text-darkmode-light;\n\n  img + em {\n    @apply -mt-4 block text-center text-gray-500;\n  }\n  blockquote {\n    & > p {\n      @apply relative text-2xl text-black;\n      &::after,\n      &::before {\n        @apply absolute inline-block h-5 w-5 bg-[url('/images/quote.svg')] bg-[length:20px_20px] bg-no-repeat content-[''] lg:h-8 lg:w-8 lg:bg-[length:32px_32px];\n      }\n\n      &::before {\n        @apply -left-10 top-0 lg:-left-10;\n      }\n\n      &::after {\n        @apply bottom-0 right-0 rotate-180;\n      }\n    }\n  }\n}\n\n//banner\n.banner {\n  &-title {\n    h1 {\n      @apply font-bold leading-[1] lg:text-[72px];\n    }\n\n    strong {\n      @apply text-primary;\n    }\n\n    span {\n      @apply font-normal font-bold text-dark dark:text-darkmode-light lg:text-[55px];\n    }\n  }\n}\n\n//section-title\n.section-title {\n  @apply mb-12 underline decoration-primary decoration-wavy decoration-2 underline-offset-[.5em];\n}\n\n//socials\n.socials {\n  @apply mx-3 flex items-center justify-center  space-x-3 px-4 lg:justify-start lg:border-x 2xl:space-x-4;\n  li {\n    @apply inline-flex;\n  }\n  a {\n    @apply inline-block px-2 py-1 text-lg text-dark  hover:text-primary dark:text-darkmode-light dark:hover:text-primary;\n  }\n}\n\n.newsletter-input:focus + svg {\n  opacity: 0;\n}\n\n.sidebar-socials,\nfooter .socials {\n  @apply border-primary;\n}\n\n//experience\n.experience {\n  ul li {\n    @apply relative pl-7;\n\n    &::before {\n      @apply absolute left-1 top-2.5 h-[9px] w-[9px] rounded-full border-2 border-body bg-primary shadow-[0px_0px_0px_2px] shadow-primary content-[''] dark:border-darkmode-body;\n    }\n  }\n}\n\n// notice\n.notice {\n  @apply rounded overflow-x-hidden;\n  .notice-body {\n    @apply text-[#666666] dark:text-darkmode-light;\n    p {\n      @apply my-0 text-[#666666] dark:text-darkmode-light;\n    }\n  }\n\n  &.note {\n    .notice-head {\n      @apply bg-[#6ab0de] dark:bg-[#97d6ffcc];\n    }\n    .notice-body {\n      @apply bg-[rgb(227,244,255)] dark:bg-[#97d6ff26];\n    }\n  }\n\n  &.tip {\n    .notice-head {\n      @apply bg-[#78c578] dark:bg-[#96ff96cc];\n    }\n    .notice-body {\n      @apply bg-[#e2ffe2] dark:bg-[#96ff9626];\n    }\n  }\n\n  &.info {\n    .notice-head {\n      @apply bg-[#f0b37e] dark:bg-[#ffc392cc];\n    }\n    .notice-body {\n      @apply bg-[#ffedde] dark:bg-[#ffc39226];\n    }\n  }\n\n  &.warning {\n    .notice-head {\n      @apply bg-[#e06f6c] dark:bg-[#ff918ccc];\n    }\n    .notice-body {\n      @apply bg-[#ffdad8] dark:bg-[#ff918c26];\n    }\n  }\n}\n\n.active-tab {\n  @apply bg-theme-light dark:bg-darkmode-theme-dark;\n}\n\n.post {\n  img {\n    width: 100%;\n    height: auto;\n  }\n}\n\n.single-blog {\n  blockquote {\n    @apply px-12 lg:px-[105px];\n\n    & > p {\n      @apply lg:text-[24px];\n      @apply relative text-2xl text-black;\n      &::after,\n      &::before {\n        @apply absolute inline-block h-8 w-8 bg-[url('/images/quote.svg')] bg-[length:32px_32px] bg-no-repeat content-[''];\n      }\n\n      &::before {\n        @apply left-0 top-0;\n        @apply -left-10 lg:-left-12;\n      }\n\n      &::after {\n        @apply bottom-0 right-0 rotate-180;\n        @apply -right-10 lg:-right-8;\n      }\n    }\n  }\n}\n\n.embed-refresh body {\n  background-color: black !important;\n}\n\n#disqus_thread {\n  color-scheme: none;\n}\n"
  },
  {
    "path": "styles/navigation.scss",
    "content": "body.menu-open {\n  @apply overflow-hidden pr-0;\n}\n\n.header {\n  @apply top-0 z-50 border-b bg-body py-[33px] dark:border-darkmode-border dark:bg-darkmode-body;\n}\n\n// navbar items\n.navbar {\n  @apply relative flex flex-wrap items-center justify-between;\n}\n\n.collapse-menu {\n  @apply fixed right-0 top-0 z-10 mx-0 h-[100vh] w-full max-w-[400px] items-center border-l border-l-dark  bg-body p-6 transition-transform duration-300 ease-in-out dark:bg-darkmode-body lg:static lg:flex lg:h-auto lg:w-auto lg:max-w-full lg:space-x-4 lg:border-l-0 lg:bg-transparent lg:p-0 xl:space-x-8;\n}\n\n.navbar-brand {\n  @apply text-xl font-semibold text-dark;\n  image {\n    @apply max-h-full max-w-full;\n  }\n}\n\n.navbar-nav {\n  @apply mt-16 lg:mt-0;\n}\n\n.nav-item {\n  @apply mb-5 text-left lg:mb-0;\n\n  &.active {\n    @apply bg-primary text-white;\n  }\n}\n\n.nav-link {\n  @apply rounded-[30px] px-6 py-2.5 text-left font-secondary text-[13.5px] capitalize  text-dark transition hover:bg-primary hover:text-white dark:text-darkmode-light md:px-3 md:py-3 lg:text-center xl:px-5;\n\n  &.active {\n    @apply bg-primary text-white;\n  }\n}\n\n.nav-dropdown {\n  @apply mr-0;\n}\n\n.nav-dropdown-list {\n  @apply z-10 rounded-lg  border border-transparent bg-body p-4 shadow dark:border-darkmode-border dark:bg-black;\n}\n\n.nav-dropdown-item {\n  @apply mb-1.5;\n}\n\n.nav-dropdown-link {\n  @apply min-w-[150px] rounded py-2.5 px-3.5 text-base font-semibold  text-dark transition hover:bg-primary/10 hover:text-primary dark:text-darkmode-light;\n\n  &.active {\n    @apply bg-primary/10 text-primary;\n  }\n}\n\n// search style\n.search-icon {\n  @apply inline-block h-10 w-10 cursor-pointer rounded-full bg-primary p-2.5 text-xl text-white;\n}\n.search-modal {\n  @apply invisible absolute top-0 left-0 right-0 z-10 h-10 bg-body opacity-0 transition dark:bg-black md:h-full;\n  .form-input {\n    @apply h-full w-full border-0 px-4 text-lg;\n  }\n  .search-close {\n    @apply absolute top-1/2 right-2 -translate-y-1/2 p-3 text-h4;\n  }\n  &.open {\n    @apply visible opacity-100;\n  }\n}\n\n.light .menu-open {\n  .border-border,\n  &.border-border {\n    @apply border-darkmode-border;\n  }\n}\n"
  },
  {
    "path": "styles/style.scss",
    "content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n@layer base {\n  @import \"base\";\n}\n\n@layer components {\n  @import \"components\";\n  @import \"navigation\";\n  @import \"buttons\";\n}\n\n@layer utilities {\n  @import \"utilities\";\n}\n"
  },
  {
    "path": "styles/utilities.scss",
    "content": "b,\nstrong {\n  @apply font-semibold;\n}\n"
  },
  {
    "path": "tailwind.config.js",
    "content": "const theme = require(\"./config/theme.json\");\n\nlet font_base = Number(theme.fonts.font_size.base.replace(\"px\", \"\"));\nlet font_scale = Number(theme.fonts.font_size.scale);\nlet h6 = font_base / font_base;\nlet h5 = h6 * font_scale;\nlet h4 = h5 * font_scale;\nlet h3 = h4 * font_scale;\nlet h2 = h3 * font_scale;\nlet h1 = h2 * font_scale;\nlet fontPrimary, fontPrimaryType, fontSecondary, fontSecondaryType;\nif (theme.fonts.font_family.primary) {\n  fontPrimary = theme.fonts.font_family.primary\n    .replace(/\\+/g, \" \")\n    .replace(/:[ital,]*[ital@]*[wght@]*[0-9,;]+/gi, \"\");\n  fontPrimaryType = theme.fonts.font_family.primary_type;\n}\nif (theme.fonts.font_family.secondary) {\n  fontSecondary = theme.fonts.font_family.secondary\n    .replace(/\\+/g, \" \")\n    .replace(/:[ital,]*[ital@]*[wght@]*[0-9,;]+/gi, \"\");\n  fontSecondaryType = theme.fonts.font_family.secondary_type;\n}\n\n/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n  darkMode: \"class\",\n  content: [\n    \"./pages/**/*.{js,ts,jsx,tsx}\",\n    \"./layouts/**/*.{js,ts,jsx,tsx}\",\n    \"./content/**/*.{md,mdx}\",\n  ],\n  theme: {\n    screens: {\n      sm: \"540px\",\n      md: \"768px\",\n      lg: \"992px\",\n      xl: \"1280px\",\n      \"2xl\": \"1536px\",\n    },\n    container: {\n      center: true,\n      padding: \"2rem\",\n    },\n    extend: {\n      colors: {\n        text: theme.colors.default.text_color.default,\n        dark: theme.colors.default.text_color.dark,\n        primary: theme.colors.default.theme_color.primary,\n        body: theme.colors.default.theme_color.body,\n        border: theme.colors.default.theme_color.border,\n        light: theme.colors.default.text_color.light,\n        \"theme-light\": theme.colors.default.theme_color.theme_light,\n        \"theme-dark\": theme.colors.default.theme_color.theme_dark,\n        darkmode: {\n          text: theme.colors.darkmode.text_color.default,\n          light: theme.colors.darkmode.text_color.light,\n          dark: theme.colors.darkmode.text_color.dark,\n          primary: theme.colors.darkmode.theme_color.primary,\n          secondary: theme.colors.darkmode.theme_color.secondary,\n          body: theme.colors.darkmode.theme_color.body,\n          border: theme.colors.darkmode.theme_color.border,\n          \"theme-light\": theme.colors.darkmode.theme_color.theme_light,\n          \"theme-dark\": theme.colors.darkmode.theme_color.theme_dark,\n        },\n      },\n      fontSize: {\n        base: font_base + \"px\",\n        h1: h1 + \"rem\",\n        \"h1-sm\": h1 * 0.8 + \"rem\",\n        h2: h2 + \"rem\",\n        \"h2-sm\": h2 * 0.8 + \"rem\",\n        h3: h3 + \"rem\",\n        \"h3-sm\": h3 * 0.8 + \"rem\",\n        h4: h4 + \"rem\",\n        h5: h5 + \"rem\",\n        h6: h6 + \"rem\",\n      },\n      fontFamily: {\n        primary: [fontPrimary, fontPrimaryType],\n        secondary: [fontSecondary, fontSecondaryType],\n      },\n    },\n  },\n  plugins: [\n    require(\"@tailwindcss/typography\"),\n    require(\"tailwind-scrollbar\"),\n    require(\"@tailwindcss/forms\"),\n    require(\"tailwind-bootstrap-grid\")({ generateContainer: false }),\n  ],\n};\n"
  }
]