feat: Redesign the tutorial page according to the theme.Issue(#1107)

[rishika105]

Title of the Pull Request

• Have you renamed the PR Title in a meaningful way?

Related Issue

Closes: #1107

Description

I have made changes in the website according to a theme that was there. I think according to the canvas website that gradient design really suits well.

How Has This Been Tested? ⚙️

I have done changes in tutorial.html you can check.

Screenshots 📷

Recording.2024-11-01.181529.mp4

Type of change

What sort of changes have you made:

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Code style update (formatting, local variables)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

Checklist

• My code follows the code style of this project.
• I have followed the contribution guidelines
• I have performed a self-review of my own code.
• I have ensured my changes don't generate any new warnings or errors.
• I have updated the documentation (if necessary).
• I have resolved all merge conflicts.

[netlify]

✅ Deploy Preview for tourmaline-bavarois-d21f10 ready!

Name	Link
🔨 Latest commit	c2ab4c8
🔍 Latest deploy log	https://app.netlify.com/sites/tourmaline-bavarois-d21f10/deploys/6724cee31b1c070008431e84
😎 Deploy Preview	https://deploy-preview-1144--tourmaline-bavarois-d21f10.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[github-actions]

🎉 Thank you @rishika105 for your contribution! Your pull request has been submitted successfully. A maintainer will review it as soon as possible. We appreciate your support in making this project better