{"id":20609441,"url":"https://github.com/nirjan-dev/gatsby-theme-teranova","last_synced_at":"2025-04-15T04:30:45.684Z","repository":{"id":57245171,"uuid":"200007835","full_name":"nirjan-dev/gatsby-theme-teranova","owner":"nirjan-dev","description":"A gatsby theme for responsive landing pages","archived":false,"fork":false,"pushed_at":"2023-05-06T10:40:24.000Z","size":4022,"stargazers_count":8,"open_issues_count":5,"forks_count":6,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-28T15:51:57.922Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/nirjan-dev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-08-01T08:15:01.000Z","updated_at":"2023-03-08T15:52:44.000Z","dependencies_parsed_at":"2024-11-21T12:30:58.974Z","dependency_job_id":null,"html_url":"https://github.com/nirjan-dev/gatsby-theme-teranova","commit_stats":null,"previous_names":["nk-webdev/gatsby-theme-teranova"],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nirjan-dev%2Fgatsby-theme-teranova","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nirjan-dev%2Fgatsby-theme-teranova/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nirjan-dev%2Fgatsby-theme-teranova/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nirjan-dev%2Fgatsby-theme-teranova/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nirjan-dev","download_url":"https://codeload.github.com/nirjan-dev/gatsby-theme-teranova/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249006306,"owners_count":21197248,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-16T10:13:35.176Z","updated_at":"2025-04-15T04:30:45.668Z","avatar_url":"https://github.com/nirjan-dev.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Gatsby Theme Teranova\n\n*Warning*: Not actively developed anymore\n\nTeranova is a free open-source gatsby theme which you can use to make a simple, modern and customizable responsive landing page.\n\nYou can view the [live demo](https://teranova.netlify.com/) to see how it looks.\n\n## Features\n\n- 4 different sections (header, about us, services, contact) by default\n- Easy to customize styles with [theme UI](https://theme-ui.com/)\n- Google map embed and Google analytics\n- Smooth scrolling links\n- MDX support\n- Good SEO support with React Helmet and a default seo component\n- PWA\n- Sitemap (in case you want to add extra pages)\n- Responsive design\n- Emotion for styling\n- Prefetched google fonts\n- Supports any google font \n\n## Installation\n\nTo use this theme in your Gatsby sites, follow these instructions:\n\n1.  Install the theme\n\n    ```sh\n    npm i gatsby-theme-teranova\n    ```\n\n    or\n\n    ```sh\n    yarn add gatsby-theme-teranova\n    ```\n\n2.  Add the theme to your `gatsby-config.js` with any of the following options. Every option has a default value which is given below so there are no required options.\n\n    ```js\n    module.exports = {\n      plugins: [\n        {\n          resolve: \"gatsby-theme-teranova\",\n          options: {\n            title: 'Teranova',\n            description: 'A single page gatsby theme created by Nirjan Khadka',\n            image: '/images/banner.png', // for image meta tag (lmage location within the static folder)\n            twitterUsername: '@nk13_codes', // the site link (eg: https://twitter.com/) will be added for all social links so just put the profile name here\n            facebookUsername: 'nk13_codes',\n            instagramUsername: 'nk13_codes',\n            phone: '555 219 619',\n            email: 'info@teranova.com',\n            address: 'Stewart Street, Marks Avenue, California',\n            mapUrl: 'https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3306.033277112893!2d-118.26944278515673!3d34.04301748060843!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80c2c7b85dea2a93%3A0x1ff47c3ceb7bb2d5!2sSTAPLES+Center!5e0!3m2!1sen!2snp!4v1564632144369!5m2!1sen!2snp', // google maps iframe url\n            logo: '/images/logo.svg', // link from the static folder\n            trackingId: 'UA-135638651-2', // GA key\n            // options for gatsby plugin manifest (go to there docs to learn more)\n            shortName: 'teranova',\n            pathPrefix: '/',\n            backgroundColor: '#F9F9F9',\n            themeColor: '#FFD700',\n            favicon: 'static/images/favicon.png', // path from the root\n            // gatsby sitemap plugin needs this\n            siteUrl: 'https://teranova.netlify.com',\n          \n            // font options\n            headingFont:  'Vollkorn', // accepts any google font name \n            bodyFont: 'Roboto',\n\n            // content direcoty name\n            contentFolder: 'teranova-theme-data',\n                    \n            // navbar links\n            navLinks: [\n                {\n                    label: 'About',\n                    link: '#about'\n                },\n                {\n                    label: 'Services',\n                    link: '#services'\n                },\n                {\n                    label: 'Contact',\n                    link: '#contact'\n                }\n            ]\n          }\n        }\n      ]\n    };\n    ```\n\n3.  There are mdx files and images for intro, services and about blocks in the content directory (teranova-theme-data by default). You can edit them to change the content of the site.\n\n    1. `intro.mdx` with content that looks like this:\n\n    ```mdx\n    ---\n    type: intro\n    img: ./banner.jpg\n    ---\n\n    ## Making good times Better\n\n    We are a company dedicated to making your\n    satisfaction into our goals. You don’t need to worry about a single thing.And\n    now we are offering special discounts right now.\n    ```\n\n    2.  `about.mdx` with content that looks like this:\n\n    ```mdx\n    ---\n    type: about\n    img: ./about.jpg\n    title: About us\n    ---\n\n    We Believe in a stronger community and a chance for redemption for every one and provide the opportunities that can lead to a better life for everyone. So, What are you waiting for? Join us today and be your best self. No more waiting, Join us before march to win exclusive prizes and a chance to win a million dollars.\n\n    We Believe in a stronger community and a chance for redemption for every one and provide the opportunities that can lead to a better life for everyone. So, What are you waiting for? Join us today and be your best self. No more waiting, Join us before march to win exclusive prizes and a chance to win a million dollars.\n\n    We Believe in a stronger community and a chance for redemption for every one and provide the opportunities that can lead to a better life for everyone. So, What are you waiting for? Join us today and be your best self. No more waiting, Join us before march to win exclusive prizes and a chance to win a million dollars.\n    ```\n\n    3.  A service mdx file with looks like this:\n\n    ```mdx\n    ---\n    title: Branding\n    type: service\n    ---\n\n    We provide the best branding solutions and optimized designs to go along with a rangle of supporting features for companies of all sizes.\n    ```\n\n4.  Add static/images/favicon.png to your project. The gatsby-plugin-manifest needs this image.\n\n5.  Start your site\n\n    ```sh\n    gatsby develop\n    ```\n\n6.  You can override colors by creating a `src/gatsby-theme-teranova/theme.js` file and exporting an object with the following properties:\n    ```js\n    export const theme = {\n      fonts: {\n        // only use the fonts that have been set in the theme options\n        families: [\"Roboto\", \"Vollkorn\"],\n        body: '\"Roboto\",sans-serif',\n        heading: '\"Vollkorn\",serif'\n      },\n      fontSizes: [0.75, 1, 1.33, 1.77, 2.369, 3.157],\n      fontWeights: {\n        body: 400,\n        heading: \"700\",\n        bold: 700\n      },\n      spacing: [0.618, 1, 1.618, 2.618, 4.236, 6.854, 11.089],\n      lineHeights: {\n        body: 1.7,\n        heading: 1.2\n      },\n      letterSpacings: {\n        body: \"normal\",\n        caps: \"0.2rem\"\n      },\n      colors: {\n        primary: \"#FFD700\",\n        dark: \"#333\",\n        grey: \"#B2AB99\",\n        secondaryLight: \"#00FFD8\",\n        secondary: \"#03866e\",\n        darkLight: \"#5A5751\",\n        greyLight: \"#F9F9F9\",\n        white: \"#FEFEFE\",\n        secondaryDark: \"#065648\",\n        primaryGradient:\n          \"linear-gradient(to right, rgba(242, 153, 74,0.9), rgba(242, 201, 76,0.4))\"\n      }\n    };\n    ```\n7. You can use [gatsby theme shadowing](https://www.gatsbyjs.org/docs/themes/shadowing/) to change any of the default components. You might want to change the layout component which orders the sections and provides some global css rules. To shadow that component create a src/gatsby-theme-teranova/components/layout.js. The default layout.js file looks like this\n\n  ```jsx\n  import React from 'react';\n  import Header from 'gatsby-theme-teranova/src/components/header';\n  import SEO from 'gatsby-theme-teranova/src/components/seo';\n  import 'normalize.css';\n  import { theme } from 'gatsby-theme-teranova/src/theme';\n  import { ThemeProvider } from 'theme-ui';\n  import { Global, css } from '@emotion/core';\n  import Footer from 'gatsby-theme-teranova/src/components/footer';\n  import Intro from 'gatsby-theme-teranova/src/components/intro';\n  import About from 'gatsby-theme-teranova/src/components/about';\n  import Services from 'gatsby-theme-teranova/src/components/services';\n  import Contact from 'gatsby-theme-teranova/src/components/contact';\n\n  function Layout() {\n    return (\n      \u003cThemeProvider theme={theme}\u003e\n        \u003cGlobal\n          styles={css`\n            * {\n              margin: 0;\n              padding: 0;\n              box-sizing: border-box;\n            }\n            body {\n              line-height: ${theme.lineHeights.body};\n\n              font-family: ${theme.fonts.body};\n              color: ${theme.colors.dark};\n            }\n            h1,\n            h2,\n            h3,\n            h4,\n            h5,\n            h6 {\n              line-height: ${theme.lineHeights.heading};\n              font-weight: ${theme.fontWeights.heading};\n              font-family: ${theme.fonts.heading};\n            }\n            h1 {\n              font-size: ${theme.fontSizes[5]}rem;\n            }\n            h2 {\n              font-size: ${theme.fontSizes[4]}rem;\n            }\n            h3 {\n              font-size: ${theme.fontSizes[3]}rem;\n            }\n            h4 {\n              font-size: ${theme.fontSizes[2]}rem;\n            }\n            h5 {\n              font-size: ${theme.fontSizes[1]}rem;\n            }\n            a {\n              text-decoration: none;\n              color: ${theme.colors.secondary};\n              transition: color 200ms ease-out;\n              \u0026:hover,\n              \u0026:focus {\n                color: ${theme.colors.primary};\n              }\n            }\n          `}\n        /\u003e\n        \u003cSEO /\u003e\n        \u003cHeader /\u003e\n        \u003cmain\u003e\n          \u003cIntro /\u003e\n\n          \u003cAbout /\u003e\n\n          \u003cServices /\u003e\n\n          \u003cContact /\u003e\n        \u003c/main\u003e\n        \u003cFooter /\u003e\n      \u003c/ThemeProvider\u003e\n    );\n  }\n\n  export default Layout;\n  ```\n\nIf you get stuck then take a look at the examples in [this repo](http://github.com/NK-WebDev/gatsby-theme-teranova) or [create an issue](https://github.com/NK-WebDev/gatsby-theme-teranova/issues/new) with sufficient info on the problem. Collaborators are welcomed.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnirjan-dev%2Fgatsby-theme-teranova","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnirjan-dev%2Fgatsby-theme-teranova","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnirjan-dev%2Fgatsby-theme-teranova/lists"}