Added Handles for Twitter, Linkedin and Medium to GitFolio (#84)

* Added Handles for Twitter, Linkedin and Medium to GitFolio

* Updates README

* Updates README

.github/ISSUE_TEMPLATE/feature-request.md

@@ -5,8 +5,8 @@ about: Request a new feature.
 
 # What feature should be added?
 
-<!-- Explain what the feature is here -->
+This feature adds Twitter, Linkedin and Medium links to your profile.
 
 # Why should this feature be added?
 
-<!-- Provide information on what improvements this feature brings -->
+Since a portfolio is being made, adding these links help improve the profile better.

README.md

@@ -86,7 +86,12 @@ $ gitfolio build <username> --background https://images.unsplash.com/photo-15572
 
 You could also add in your custom CSS inside `index.css` to give it a more personal feel.
 
+### Add Twitter, LinkedIn and Medium Links on your profile
 
+Twitter, LinkedIn and Medium Links to your profile while building
+```sh
+gitfolio build <username> --twitter <twitter_username> --linkedin <linkedin_username> --medium <medium_username>
+```
 ### Let's Publish
 
 Head over to GitHub and create a new repository named `username.github.io`, where username is your username. Push the files inside`/dist` folder to repo you just created.

assets/index.css

@@ -337,6 +337,11 @@ body{
     font-size:15px;
 }
 
+.socials {
+    color: #fff;
+    text-decoration: none;
+}
+
 #blog_section {
     margin:2vh 0px;
     padding:2vh 0px !important;

bin/gitfolio.js

@@ -18,6 +18,9 @@ program
     .option('-f, --fork', 'includes forks with repos')
     .option('-s, --sort [sort]', 'set default sort for repository', 'created')
     .option('-o, --order [order]', 'set default order on sort', 'asc')
+    .option('-w, --twitter [handle]', 'set Twitter handle')
+    .option('-l, --linkedin [username]', 'specify LinkedIn username')
+    .option('-m, --medium [username]', 'specify Medium username')
     .action(buildCommand)
 
 program

build.js

@@ -63,11 +63,14 @@ async function populateCSS({
     await fs.writeFileAsync(config, JSON.stringify(data, null, ' '));
 }
 
-async function populateConfig(sort, order, includeFork) {
+async function populateConfig(sort, order, includeFork, twitter, linkedin, medium) {
     const data = await getConfig();
     data[0].sort = sort;
     data[0].order = order;
     data[0].includeFork = includeFork;
+    data[0].twitter = twitter; // added twitter
+    data[0].linkedin = linkedin; // added linkedin
+    data[0].medium = medium; // added medium
     await fs.writeFileAsync(config, JSON.stringify(data, null, ' '));
 }
 
@@ -76,8 +79,11 @@ async function buildCommand(username, program) {
     let sort = program.sort ? program.sort : 'created';
     let order = program.order ? program.order : "asc";
     let includeFork = program.fork ? true : false;
-    await populateConfig(sort, order, includeFork);
-    updateHTML(('%s', username), sort, order, includeFork);
+    let twitter = program.twitter ? program.twitter : null;
+    let linkedin = program.linkedin ? program.linkedin : null;
+    let medium = program.medium ? program.medium : null;
+    await populateConfig(sort, order, includeFork, twitter, linkedin, medium);
+    updateHTML(('%s', username), sort, order, includeFork, twitter, linkedin, medium);
 }
 
 module.exports = {

populate.js

@@ -29,7 +29,7 @@ function convertToEmoji(text) {
     }
 }
 
-module.exports.updateHTML = (username, sort, order, includeFork) => {
+module.exports.updateHTML = (username, sort, order, includeFork, twitter, linkedin, medium) => {
     //add data to assets/index.html
     jsdom.fromFile(`${__dirname}/assets/index.html`, options).then(function (dom) {
         let window = dom.window, document = window.document;
@@ -114,6 +114,9 @@ module.exports.updateHTML = (username, sort, order, includeFork) => {
                 <span style="display:${user.company == null || !user.company ? 'none' : 'block'};"><i class="fas fa-users"></i> &nbsp; ${user.company}</span>
                 <span style="display:${user.email == null || !user.email ? 'none' : 'block'};"><i class="fas fa-envelope"></i> &nbsp; ${user.email}</span>
                 <span style="display:${user.blog == null || !user.blog ? 'none' : 'block'};"><i class="fas fa-link"></i> &nbsp; <a href="${user.blog}">${user.blog}</a></span>
+                <span style="display:${twitter == null ? 'none' : 'block'};"><i class="fab fa-twitter-square"></i> &nbsp;&nbsp; <a href="https://www.twitter.com/${twitter}" target="_blank" class="socials"> Twitter</a></span>
+                <span style="display:${linkedin == null ? 'none' : 'block'};"><i class="fab fa-linkedin"></i> &nbsp;&nbsp; <a href="https://www.linkedin.com/in/${linkedin}/" target="_blank" class="socials"> LinkedIn</a></span>
+                <span style="display:${medium == null ? 'none' : 'block'};"><i class="fab fa-medium"></i> &nbsp;&nbsp; <a href="https://www.medium.com/@${medium}/" target="_blank" class="socials"> Medium</a></span>
                 <span style="display:${user.location == null || !user.location ? 'none' : 'block'};"><i class="fas fa-map-marker-alt"></i> &nbsp;&nbsp; ${user.location}</span>
                 <span style="display:${user.hireable == false || !user.hireable ? 'none' : 'block'};"><i class="fas fa-user-tie"></i> &nbsp;&nbsp; Available for hire</span>`;
                 //add data to config.json

update.js

@@ -7,11 +7,14 @@ async function updateCommand() {
     var sort = data[0].sort;
     var order = data[0].order;
     var includeFork = data[0].includeFork;
+    var twitter = data[0].twitter;
+    var linkedin = data[0].linkedin;
+    var medium = data[0].medium;
     if(username == null || sort == null || order == null || includeFork == null){
         console.log("username not found in config.json, please run build command before using update");
         return;
     }
-    updateHTML(username, sort, order, includeFork);
+    updateHTML(username, sort, order, includeFork, twitter, linkedin, medium);
 }
 
 module.exports = {