Added capability to add css class and id to images + links + refactoring

[arelstone]

Summary

• Added the capability to add css class and id to images
• Added the capability to add css class and id to links
• Rearranged guide -> helpers to have an image section

What kind of change does this PR introduce? (check at least one)

• Bugfix
• Feature
• Code style update
• Refactor
• Docs
• Build-related changes
• Other, please describe:

If changing the UI of default theme, please provide the before/after screenshot:

Does this PR introduce a breaking change? (check one)

• Yes
• No

If yes, please describe the impact and migration path for existing applications:

The PR fulfills these requirements:

• When resolving a specific issue, it's referenced in the PR's title (e.g. fix #xxx[,#xxx], where "xxx" is the issue number)

You have tested in the following browsers: (Providing a detailed version will be better.)

• Chrome
• Firefox
• Safari
• Edge
• IE

If adding a new feature, the PR's description includes:

• A convincing reason for adding this feature
• Related documents have been updated
• Related tests have been updated

To avoid wasting your time, it's best to open a feature request issue first and wait for approval before working on it.

Other information:

---

• DO NOT include files inside lib directory.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[anikethsaha]

@arelstone can you please resolve the conflicts and try to simplify the diff if possible. I will review this soon. Its a good enhancement.

[arelstone]

@anikethsaha I've resolved the conflicts that is suppose to come after 10 months of idling on any pr.
Took me some time to get into what was up and down. When i submitted this PR god and I knew what was going on.... Today i felt that at somepoint only god knew - Oh well I managed 😄 👏
To get up and running with the code I started writing unit tests for the mess I've created
I see that the e2e test is 🔴. I've tried to run these on my own computer and they are all 💚

I'm not really sure how to simplify the diff any more. I know it seems like a lot of changes, but it really isn't. I basically just copy-pasted each of the methods into a new file.

I've been thinking about doing some kind of attribute parser, but this parser will need to have a lot of special cases for attrs like: size, disabled, no-zoom. These cases is what I could come up with on the top of my mind, there will surely be plenty more. I'm not sure that this will. Such a parser could look something like this:

export const attributeParser = config => {
  return Object.entries(config)
    .map(([attr, value]) => {
      if (attr === 'size') {
        return convertSizeAttr(value)
      }

      return `${attr}="${value}"`
    })
}

const convertSizeAttr = size => {
  const [width, height] = size.split('x')
  if (height && width) {
    return `width="${width}" height="${height}"`
  }

  return `width="${width}" height="${width}"`
}

...of-course this needs to have added a lot more rules for the ones listed above. Again I'm not sure that this is the way to do it. It would just be to move some business logic into a new file..

[anikethsaha]

Looks good to me , left few suggestions

[anikethsaha]

@arelstone this PR is so good 🎉 . And many thanks for adding unit tests. 💯

About the CI error, it needs some changes with new test cases in e2e. if you want to update them, you can go ahead (refer other test cases) else I will do it after merging this.

tests are failing cause you removed the header link in docs/helper and added few more which is supposed to be like this as per this PR. To fix this, remove this line https://github.com/docsifyjs/docsify/blob/develop/cypress/integration/sidebar/config.spec.js#L242 and remove this file

also, if would be nice if you can do this type of refactoring for other parts of the code as well.
and also if you can help us adding more tests (unit preferable) to this project.

[jthegedus]

As @anikethsaha said, this is a good PR. Cheers for the effort.

[anikethsaha]

Awesome work.... 💯

looking forward to more contributions from you🎉

[trusktr]

If this works for anchors too, then it feels as if this documentation should be in a section that covers both.

[arelstone]

I supporse it works for anchors too. Havn't testes it. This pr wasnt with anchors in mind. If it works, Feel free to update the docs