diff --git a/README.md b/README.md index 2298efc..84fa513 100644 --- a/README.md +++ b/README.md @@ -356,6 +356,9 @@ const config = { '--rounded-btn': '3rem', }, }, + + // Optional Footer. Supports plain text or HTML. + footer: `Copyright © 2023 John Doe`, }; ``` @@ -367,7 +370,7 @@ The default theme can be specified. ```js // gitprofile.config.js -module.exports = { +const config = { // ... themeConfig: { defaultTheme: 'light', @@ -384,7 +387,7 @@ You can create your own custom theme by modifying these values. Theme `procyon` ```js // gitprofile.config.js -module.exports = { +const config = { // ... themeConfig: { customTheme: { @@ -407,7 +410,7 @@ module.exports = { ```js // gitprofile.config.js -module.exports = { +const config = { // ... googleAnalytics: { id: '', @@ -423,7 +426,7 @@ Besides tracking visitors, it will track `click events` on projects and blog pos ```js // gitprofile.config.js -module.exports = { +const config = { // ... hotjar: { id: '', @@ -446,7 +449,7 @@ You can link your social media services you're using, including LinkedIn, Twitte ```js // gitprofile.config.js -module.exports = { +const config = { // ... social: { linkedin: 'ariful-alam', @@ -471,7 +474,7 @@ To showcase your skills provide them here. ```js // gitprofile.config.js -module.exports = { +const config = { // ... skills: ['JavaScript', 'React.js'], }; @@ -485,7 +488,7 @@ Provide your job history in `experiences`. ```js // gitprofile.config.js -module.exports = { +const config = { // ... experiences: [ { @@ -514,7 +517,7 @@ Provide your education history in `education`. ```js // gitprofile.config.js -module.exports = { +const config = { // ... education: [ { @@ -541,7 +544,7 @@ Provide your industry certifications in `certifications`. ```js // gitprofile.config.js -module.exports = { +const config = { // ... certifications: [ { @@ -564,7 +567,7 @@ Your public repo from GitHub will be displayed in the `Github Projects` section ```js // gitprofile.config.js -module.exports = { +const config = { // ... github: { username: 'arifszn', @@ -584,7 +587,7 @@ In this section you can showcase your external/personal projects. ```js // gitprofile.config.js -module.exports = { +const config = { // ... externalProjects: [ { @@ -603,7 +606,7 @@ If you have [medium](https://medium.com) or [dev](https://dev.to) account, you c ```js // gitprofile.config.js -module.exports = { +const config = { // ... blog: { source: 'dev', diff --git a/gitprofile.config.js b/gitprofile.config.js index 3a96094..32e626f 100644 --- a/gitprofile.config.js +++ b/gitprofile.config.js @@ -100,7 +100,6 @@ const config = { link: 'https://example.com', }, ], - // Display blog posts from your medium or dev account. (Optional) blog: { source: 'dev', // medium | dev @@ -116,7 +115,7 @@ const config = { snippetVersion: 6, }, themeConfig: { - defaultTheme: 'business', + defaultTheme: 'winter', // Hides the switch in the navbar // Useful if you want to support a single color mode @@ -174,6 +173,13 @@ const config = { '--rounded-btn': '3rem', }, }, + + // Optional Footer. Supports plain text or HTML. + footer: `Made with GitProfile and ❤️`, }; export default config; diff --git a/package.json b/package.json index 4835769..a537d07 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@arifszn/gitprofile", "description": "Create an automatic portfolio based on GitHub profile", - "version": "2.2.1", + "version": "2.2.2", "license": "MIT", "author": "arifszn", "repository": { diff --git a/src/components/GitProfile.jsx b/src/components/GitProfile.jsx index 93b7630..a63054e 100644 --- a/src/components/GitProfile.jsx +++ b/src/components/GitProfile.jsx @@ -11,6 +11,7 @@ import Certification from './certification'; import Education from './education'; import Project from './project'; import Blog from './blog'; +import Footer from './footer'; import { genericError, getInitialTheme, @@ -19,7 +20,6 @@ import { setupHotjar, tooManyRequestError, sanitizeConfig, - skeleton, } from '../helpers/utils'; import { HelmetProvider } from 'react-helmet-async'; import PropTypes from 'prop-types'; @@ -221,24 +221,7 @@ const GitProfile = ({ config }) => { className={`p-4 footer ${bgColor} text-base-content footer-center`} >
- -
- {loading ? ( - skeleton({ width: 'w-52', height: 'h-6' }) - ) : ( -

- Made with{' '} - GitProfile and - ❤️ -

- )} -
-
+
@@ -274,6 +257,9 @@ GitProfile.propTypes = { phone: PropTypes.string, email: PropTypes.string, }), + resume: PropTypes.shape({ + fileUrl: PropTypes.string, + }), skills: PropTypes.array, externalProjects: PropTypes.arrayOf( PropTypes.shape({ @@ -335,6 +321,7 @@ GitProfile.propTypes = { '--rounded-btn': PropTypes.string, }), }), + footer: PropTypes.string, }).isRequired, }; diff --git a/src/components/footer/index.jsx b/src/components/footer/index.jsx new file mode 100644 index 0000000..fa4c62c --- /dev/null +++ b/src/components/footer/index.jsx @@ -0,0 +1,24 @@ +import PropTypes from 'prop-types'; + +import { skeleton } from '../../helpers/utils'; + +const Footer = ({ content, loading }) => { + if (!content) return null; + + return ( +
+ {loading ? ( + skeleton({ width: 'w-52', height: 'h-6' }) + ) : ( +
+ )} +
+ ); +}; + +Footer.propTypes = { + content: PropTypes.string, + loading: PropTypes.bool.isRequired, +}; + +export default Footer; diff --git a/src/helpers/utils.jsx b/src/helpers/utils.jsx index 7a3c22d..ae508c6 100644 --- a/src/helpers/utils.jsx +++ b/src/helpers/utils.jsx @@ -187,6 +187,7 @@ export const sanitizeConfig = (config) => { themes: themes, customTheme: customTheme, }, + footer: config?.footer, }; }; @@ -208,7 +209,7 @@ export const tooManyRequestError = (reset) => { target="_blank" rel="noopener noreferrer" > - rate limit. + rate limit ! Try again later{` ${reset}`}.

diff --git a/types/index.d.ts b/types/index.d.ts index e8b4482..90b3b47 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -299,6 +299,11 @@ export interface Config { * Theme config */ themeConfig?: ThemeConfig; + + /** + * Custom footer + */ + footer?: string; } export interface GitProfileProps {