diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS deleted file mode 100644 index b9d7f7c2..00000000 --- a/.github/CODEOWNERS +++ /dev/null @@ -1,7 +0,0 @@ -# Lines starting with '#' are comments - -* @recursivezero - -## You can also use email addresses if you prefer - -docs/* recursivezero@outlook.com diff --git a/.github/CODE_OF_CONDUCT.md b/.github/CODE_OF_CONDUCT.md deleted file mode 100644 index e98ea5f5..00000000 --- a/.github/CODE_OF_CONDUCT.md +++ /dev/null @@ -1,153 +0,0 @@ -# Contributor Covenant Code of Conduct - -**Table of Contents:** - -- [Contributor Covenant Code of Conduct](#contributor-covenant-code-of-conduct) - - [Summary](#summary) - - [Our Pledge](#our-pledge) - - [Our Standards](#our-standards) - - [Enforcement Responsibilities](#enforcement-responsibilities) - - [Scope](#scope) - - [Enforcement](#enforcement) - - [Enforcement Guidelines](#enforcement-guidelines) - - [1. Correction](#1-correction) - - [2. Warning](#2-warning) - - [3. Temporary Ban](#3-temporary-ban) - - [4. Permanent Ban](#4-permanent-ban) - - [Attribution](#attribution) - -**Version**: 1.0.0 - -## Summary - -As contributors and maintainers of this projects, we will respect everyone who contributes by posting issues, updating documentation, submitting pull requests, providing feedback in comments, and any other activities. - -Communication regarding the projects through any channel must be constructive and never resort to personal attacks, trolling, public or private harassment, insults, or other unprofessional conduct. Courtesy and respect shall be extended to -everyone involved in this project. Our experiences as individuals differs widely, and as such contributors are expected to be respectful of differing viewpoints and ideas. - -We expect all contributors to uphold our standards of conduct. If any member of the community violates this code of conduct, the Embedded Artistry team and project maintainers will take action. We reserve the right to remove issues, comments, -and PRs that do not comply with our conduct standards. Repeated or significant offenses will result in blocked accounts and disassociation with our projects and the Embedded Artistry community. - -If you are subject to or witness unacceptable behavior, or have any other concerns, please [email us][contact]. - -## Our Pledge - -We as members, contributors, and leaders pledge to make participation in our community a harassment-free experience for everyone, regardless of age, body size, visible or invisible disability, ethnicity, sex characteristics, gender identity -and expression, level of experience, education, socio-economic status, nationality, personal appearance, race, religion, or sexual identity and orientation. - -We pledge to act and interact in ways that contribute to an open, welcoming, diverse, inclusive, and healthy community. - -## Our Standards - -Examples of behavior that contributes to a positive environment for our -community include: - -- Demonstrating empathy and kindness toward other people -- Being respectful of differing opinions, viewpoints, and experiences -- Giving and gracefully accepting constructive feedback -- Accepting responsibility and apologizing to those affected by our mistakes, - and learning from the experience -- Focusing on what is best not just for us as individuals, but for the - overall community - -Examples of unacceptable behavior include: - -- The use of sexualized language or imagery, and sexual attention or - advances of any kind -- Trolling, insulting or derogatory comments, and personal or political attacks -- Public or private harassment -- Publishing others' private information, such as a physical or email - address, without their explicit permission -- Other conduct which could reasonably be considered inappropriate in a - professional setting - -## Enforcement Responsibilities - -Community leaders are responsible for clarifying and enforcing our standards of -acceptable behavior and will take appropriate and fair corrective action in -response to any behavior that they deem inappropriate, threatening, offensive, -or harmful. - -Community leaders have the right and responsibility to remove, edit, or reject -comments, commits, code, wiki edits, issues, and other contributions that are -not aligned to this Code of Conduct, and will communicate reasons for moderation -decisions when appropriate. - -## Scope - -This Code of Conduct applies within all community spaces, and also applies when -an individual is officially representing the community in public spaces. -Examples of representing our community include using an official e-mail address, -posting via an official social media account, or acting as an appointed -representative at an online or offline event. - -## Enforcement - -Instances of abusive, harassing, or otherwise unacceptable behavior may be -reported to the community leaders responsible for enforcement at -[_this email_][contact]. -All complaints will be reviewed and investigated promptly and fairly. - -All community leaders are obligated to respect the privacy and security of the -reporter of any incident. - -## Enforcement Guidelines - -> [!CAUTION] -> Community leaders will follow these Community Impact Guidelines in determining the consequences for any action they deem in violation of this Code of Conduct: - -### 1. Correction - -**Community Impact**: Use of inappropriate language or other behavior deemed -unprofessional or unwelcome in the community. - -**Consequence**: A private, written warning from community leaders, providing -clarity around the nature of the violation and an explanation of why the -behavior was inappropriate. A public apology may be requested. - -### 2. Warning - -**Community Impact**: A violation through a single incident or series -of actions. - -**Consequence**: A warning with consequences for continued behavior. No -interaction with the people involved, including unsolicited interaction with -those enforcing the Code of Conduct, for a specified period of time. This -includes avoiding interactions in community spaces as well as external channels -like social media. Violating these terms may lead to a temporary or -permanent ban. - -### 3. Temporary Ban - -**Community Impact**: A serious violation of community standards, including -sustained inappropriate behavior. - -**Consequence**: A temporary ban from any sort of interaction or public -communication with the community for a specified period of time. No public or -private interaction with the people involved, including unsolicited interaction -with those enforcing the Code of Conduct, is allowed during this period. -Violating these terms may lead to a permanent ban. - -### 4. Permanent Ban - -**Community Impact**: Demonstrating a pattern of violation of community -standards, including sustained inappropriate behavior, harassment of an -individual, or aggression toward or disparagement of classes of individuals. - -**Consequence**: A permanent ban from any sort of public interaction within -the community. - -## Attribution - -This Code of Conduct is adapted from the [Contributor Covenant][homepage], -version 2.0, available at . - -Community Impact Guidelines were inspired by [Mozilla's code of conduct enforcement ladder](https://github.com/mozilla/diversity). - -[homepage]: https://www.contributor-covenant.org - -For answers to common questions about this code of conduct -see the FAQ at . -Translations are available at . - -[contact]: mailto:recursivezero@outlook.com diff --git a/.github/CONTRIBUTING.md b/.github/CONTRIBUTING.md deleted file mode 100644 index 2baf5c23..00000000 --- a/.github/CONTRIBUTING.md +++ /dev/null @@ -1,198 +0,0 @@ -# Contribute - -This article explains how to contribute to project. Please read through the following guidelines. - -Write something nice and instructive as an intro. Talk about what kind of contributions you are interested in. - -> Welcome! We love receiving contributions from our community, so thanks for stopping by! There are many ways to contribute, including submitting bug reports, improving documentation, submitting feature requests, reviewing new submissions, -> or contributing code that can be incorporated into the project. - -## Summary - -> [!Note] -> Before participating in our community, please read our [code of conduct][coc]. -> By interacting with this repository, organization, or community you agree to abide by its terms. - -This document describes our development process. Following these guidelines shows that you respect the time and effort of the developers managing this project. In return, you will be shown respect in addressing your issue, -reviewing your changes, and incorporating your contributions. - -## Contributions - -There’s several ways to contribute, not just by writing code. If you have questions, see [support][support]. - -### Financial support - -It’s possible to support us financially by becoming a backer or sponsor. - -### Improve docs - -As a user you’re perfect for helping us improve our docs.Typo corrections, error fixes, better explanations, new examples, etcetera. - -### Improve issues - -Some issues lack information, aren’t reproducible, or are just incorrect. You can help by trying to make them easier to resolve. -Existing issues might benefit from your unique experience or opinions. - -### Write code - -Code contributions are very welcome. -It’s probably a good idea to first post a question or open an issue to report a bug or suggest a new feature before creating a pull request. - -## Submitting an issue - -- The issue tracker is for issues. Use discussions for support -- Search the issue tracker (including closed issues) before opening a new issue -- Ensure you’re using the latest version of our packages -- Use a clear and descriptive title -- Include as much information as possible: steps to reproduce the issue, error message, version, operating system, etcetera -- The more time you put into an issue, the better we will be able to help you -- The best issue report is a proper reproduction step to prove it - -## Development Process - -What is your development process? - -> [!Tip] -> This project follows the basic git glow - -Check and follow [README][readme] file and run on your local. - -Talk about branches people should work on. Specifically, where is the starting point? `main`, `feature`, `hotfix` `task` etc. - -### Testing - -If you add code you need to add tests! We’ve learned the hard way that code without tests is undependable. If your pull request reduces our test coverage because it lacks tests then it will be rejected. - -Provide instructions for adding new tests. Provide instructions for running tests. - -```sh -npm run test -``` - -### Style Guidelines - -run below command - -```sh -npm run lint -``` - -### Code Formatting - -use code formatter in your IDE, add prettier and some other useful extension in your IDE. - -### Git Commit Guidelines - -below are the guidelines for your commit messages. - -- add clear message and with 50 lines -- prefix feature / issue number from issue page - -### Submitting a pull request - -- Run `npm test` locally to build, format, and test your changes -- Non-trivial changes are often best discussed in an issue first, to prevent you from doing unnecessary work -- For ambitious tasks, you should try to get your work in front of the community for feedback as soon as possible -- New features should be accompanied by tests and documentation -- Don’t include unrelated changes -- Test before submitting code by running `npm test` -- Write a convincing description of why we should land your pull request: it’s your job to convince us - -## Pull Request Process - -Add notes for pushing your branch: - -When you are ready to generate a pull request, either for preliminary review, or for consideration of merging into the project you must first push your local topic branch back up to GitHub: - -```sh -git push origin feature/branch-name -``` - -Include a note about submitting the PR: - -Once you've committed and pushed all of your changes to GitHub, go to the page for your fork on GitHub, select your development branch, and click the pull request button. -If you need to make any adjustments to your pull request, just push the updates to your branch. Your pull request will automatically track the changes on your development branch and update. - -1. Ensure any install or build dependencies are removed before the end of the layer when doing a build. -2. Update the README.md with details of changes to the interface, this includes new environment variables, exposed ports, useful file locations and container parameters. -3. Increase the version numbers in any examples files and the README.md to the new version that this Pull Request would represent. The versioning scheme we use is [SemVer](http://semver.org/). -4. You may merge the Pull Request in once you have the sign-off of two other developers, or if you do not have permission to do that, you may request the second reviewer to merge it for you. - -### Review Process - -Who reviews it? Who needs to sign off before it’s accepted? When should a contributor expect to hear from you? How can contributors get commit access, if at all? - -- The core team looks at Pull Requests on a regular basis in a weekly triage meeting that we hold in a public domain. The is announced in the weekly status updates. -- Our Reviewer will provide constructive Feedback by writing Review Comments (RC). Pull Requester have to address all RC on time. -- After feedback has been given we expect responses within two weeks. After two weeks we may close the pull request if it isn't showing any activity. -- Except for critical, urgent or very small fixes, we try to leave pull requests open for most of the day or overnight if something comes in late in the day, so that multiple people have the chance to review/comment. - Anyone who reviews a pull request should leave a note to let others know that someone has looked at it. For larger commits, we like to have a +1 from someone else on the core team and/or from other contributor(s). - Please note if you reviewed the code or tested locally -- a +1 by itself will typically be interpreted as your thinking its a good idea, but not having reviewed in detail. - -Perhaps also provide the steps your team will use for checking a PR. Or discuss the steps run on your CI server if you have one. This will help developers understand how to investigate any failures or test the process on their own. - -### Addressing Feedback - -Once a PR has been submitted, your changes will be reviewed and constructive feedback may be provided. Feedback isn't meant as an attack, but to help make sure the highest-quality code makes it into our project. -Changes will be approved once required feedback has been addressed. - -If a maintainer asks you to "rebase" your PR, they're saying that a lot of code has changed, and that you need to update your fork so it's easier to merge. - -To update your forked repository, follow these steps: - -### Fetch upstream master and merge with your repo's main branch - -```sh -git fetch upstream -git checkout main -git merge upstream/main -``` - -#### If there were any new commits, rebase your development branch - -```sh -git checkout feature/branch-name -git rebase main -``` - -If too much code has changed for git to automatically apply your branches changes to the new master, you will need to manually resolve the merge conflicts yourself. - -Once your new branch has no conflicts and works correctly, you can override your old branch using this command: - -```sh -git push origin feature/branch-name -``` - -Note that this will overwrite the old branch on the server, so make sure you are happy with your changes first! - -## Community - -Do you have a mailing list, Google group, slack channel, IRC channel? Link to them here. - -Include Other Notes on how people can contribute - -- You can help us answer questions our users have here: -- You can help build and design our website here: -- You can help write blog posts about the project by: -- You can help with newsletters and internal communications by: - -- Create an example of the project in real world by building something or showing what others have built. -- Write about other people’s projects based on this project. Show how it’s used in daily life. Take screenshots and make videos! - -## Resources - -- [How to contribute to open source](https://opensource.guide/how-to-contribute/) -- [Making your first contribution](https://medium.com/@vadimdemedes/making-your-first-contribution-de6576ddb190) -- [Using pull requests](https://help.github.com/articles/about-pull-requests/) -- [GitHub help](https://help.github.com) -- [git commit message](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html) - -## Author - -© Admin - - - -[readme]: https://github.com/recursivezero/assignment/blob/main/README.md -[support]: https://github.com/recursivezero/assignment/blob/main/.github/SUPPORT.md -[coc]: https://github.com/recursivezero/assignment/blob/main/.github/CODE_OF_CONDUCT.md diff --git a/.github/DISCUSSION_TEMPLATE/announcements.yml b/.github/DISCUSSION_TEMPLATE/announcements.yml deleted file mode 100644 index 7354ede3..00000000 --- a/.github/DISCUSSION_TEMPLATE/announcements.yml +++ /dev/null @@ -1,38 +0,0 @@ -title: "[General] " -labels: ["General Introduction"] -body: - - type: markdown - attributes: - value: | - introduce yourself! - - - type: textarea - id: improvements - attributes: - label: Top 3 improvements - description: "What are the top 3 improvements we could make to this project?" - value: | - 1. - 2. - 3. - ... - render: bash - validations: - required: true - - - type: textarea - id: has-id - attributes: - label: write us suggestion - description: A description about suggestions to help you - validations: - required: true - - - type: checkboxes - id: terms - attributes: - label: Before submitting - description: By submitting this announcement, you agree to follow our [Contributing Guidelines](https://github.com/recursivezero/assignment/blob/main/.github/CONTRIBUTING.md). - options: - - label: I've made research efforts and searched the documentation - required: true diff --git a/.github/DISCUSSION_TEMPLATE/ideas.yml b/.github/DISCUSSION_TEMPLATE/ideas.yml deleted file mode 100644 index 99f24b81..00000000 --- a/.github/DISCUSSION_TEMPLATE/ideas.yml +++ /dev/null @@ -1,47 +0,0 @@ -title: "[Idea]" -labels: ["Share your Idea"] -body: - - type: textarea - id: idea - attributes: - label: Idea highlight - description: "What are the idea we could make to this project?" - value: - render: bash - validations: - required: true - - - type: dropdown - id: improvement - attributes: - label: Which area of this project could be most improved? - options: - - Documentation - - Pull request review time - - Bug fix time - - Enhancement - validations: - required: true - - - type: input - id: id - attributes: - label: email - description: your contact email - validations: - required: false - - - type: checkboxes - id: terms - attributes: - label: Before submitting - description: By submitting this idea, you agree to follow our [Contributing Guidelines](https://github.com/recursivezero/assignment/blob/main/.github/CONTRIBUTING.md). - options: - - label: I've made research efforts and searched the documentation - required: true - - - type: markdown - attributes: - value: | - ### Thank you - _we will contact you_ **soon** diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml deleted file mode 100644 index a47b75a3..00000000 --- a/.github/FUNDING.yml +++ /dev/null @@ -1,5 +0,0 @@ -# These are supported funding model platforms -# Available funding options of the project. You can specify up to four [sponsored GitHub accounts](https://docs.github.com/en/sponsors/receiving-sponsorships-through-github-sponsors), -# up to four custom URLs, and one account per supported external funding platform. - -github: recursivezero diff --git a/.github/GOVERNANCE.md b/.github/GOVERNANCE.md deleted file mode 100644 index f30728e6..00000000 --- a/.github/GOVERNANCE.md +++ /dev/null @@ -1,91 +0,0 @@ -# Roles and responsibilities - -Kindly is maintained through volunteer work - all contributions are welcome and we look to invite new collaborators at all times. -The roles described below are intended as guidelines for different ways to get involved and different levels of commitment you may choose to take on at any point. - -How much you contribute and how long for is entirely at your discretion and collaborators can change their roles in the community in any way at any time that is relevant to them. - -There are two simple steps to taking on any role: - -- 🔨 **Do** the work involved. - This community is run on willful collaboration, meaning we invite and expect everyone to identify the areas of Kindly they would like to help with and take any reasonable action towards improving the platform. - - - If you are interested in being a maintainer, find ways in which you can help maintainers with their tasks - - If you see an opportunity to improve the performance of our code, publish an issue suggesting a spike or changes - - you get the point... - -- 🙋 **Ask** for any help needed. - The codebase on Kindly is the result of a large community collaborating over time, so if there's something you're not sure about it's very likely that someone else will have an insight that can help. - Be active in our discord server, share updates in your issues and if you would like to contribute in different ways let the core team know about your ideas - -## Collaborator - -Everyone involved in maintaining / improving Kindly is considered a collaborator. All you need in order to be a collaborator is to get involved. - -- **Do** - Get familiar with the documentation on Kindly. Set up your local environment and try using the platform. Connect with the community on the Discord server and introduce yourself in the `#start-here` channel. - Submit new issues if you spot an opportunity to improve Kindly by adding functionality of fixing a bug. - -- **Ask** - Shout out on Discord about anything that you would like to get involved with. Some Collaborators never contribute code but help us with `UX/UI` projects or user testing, or - maybe you are interested/experienced in a particular kind of development work - find out how your skills match the needs of the community by reaching out to us on Discord. - -## Contributor - -Contributors help us by closing issues in the backlog. The basic outline of the role consists of picking up issues, submitting code for them and successfully moving through a PR review to merge your code the staging environment (and eventually, production) - -To become a Collaborator: - -- **Do** - Pick out issues from our backlog, making sure to follow the conventions and patterns established in the codebase. Submit a PR and follow up on any requested changes to successfully merge your code into `dev` - -- **Ask** - Reach out to the community on Discord to get clarification on any questions and share learnings with the other developers. Use the comments in our issues and PRs to get help and buy-in from other collaborators on any specific technical questions around your contributions - -## Maintainer - -Maintainers help manage the repo itself and keep a level of consistency through all code contributions. They can approve Pull Requests or Request Changes, they can close issues if needed or assign new developers to them. - -To become a Maintainer: - -- **Do** - Submit reviews for other developers Pull Requests. Keep in mind the conventions set in our code and suggest helpful ways to improve readability, maintainability and performance in our code. - Look for ways to improve our documentation by adding more clarity around setup and governance or by simply documenting conventions or common patterns in the code that are not yet shown in the documentation. - -- **Ask** - For this role you will need to be given permissions to `read/write` to the repo and project board, so you will need to ask this directly of one of the members of the core team. You can easily find out who are the members of the core team in our Discord server. - - We will look for a few markers to make sure people wanting to help as Maintainers are comfortable with the code base and can help others get to the same point. These are general guidelines, but we will want to see that you: - - - have successfully merged 5 PRs since joining the community - - have provided helpful feedback to others on their contributions - -## Core team - -Members of the Core Team take part of regular catch up meetings with the Product Owner and have decision making power over the roadmap and repo management. - -To be become a member of the Core Team: - -- **Do** - Follow the steps involved in taking on the roles above and be prepared to commit a significant amount of time to Kindly. We do not have mandatory time quotas, as this is a fully voluntary project, - but joining the Core Team will most likely require the capacity to dedicate at least 10 weekly hours to it. - -- **Ask** - Let a member of the Core Team know that you are interested in helping out 🙂 - -## Questions - -### I have some time now and would love to help as a maintainer, but I don't know if I can do it for very long. What should I do? - -Collaborators can take on a new role at any point. If you would like to help as a Maintainer and have gone through the steps described above we'll be very grateful to take that help - and later on if being a Contributor is better suited for you -then you can just do that instead. Just let us know when your capacity changes 🙂 - -### I'm a Contributor and I'd love to do more but I'm not sure if I can be that helpful to other developers - -That's exactly why we ask everyone to **Do** and **Ask**. The best way to find out how much you can help is by getting started. We've set up a lot of documentation and guidance and if you spot a necessity for more then you can always help by contributing with that. -A lot of Collaborators in the community started off unsure of their code and ended up creating entire features and helping others debug and clean up their code. - -### How do I know who has what roles? - -Pretty much by interacting. The roles are set up purely as guidelines and to encourage everyone to find a way to contribute that makes sense to them. There are no badges, rewards or honorary titles associated. -If you need help just ask and someone in the community with the knowledge necessary will find your question. diff --git a/.github/ISSUE_TEMPLATE/BUG_REPORT.yml b/.github/ISSUE_TEMPLATE/BUG_REPORT.yml deleted file mode 100644 index 6faf1c19..00000000 --- a/.github/ISSUE_TEMPLATE/BUG_REPORT.yml +++ /dev/null @@ -1,95 +0,0 @@ -name: Bug Report -description: File a bug report to help us improve. -title: "[🐛]: " -labels: ["bug", "invalid"] -assignees: - - recursivezero - -body: - - type: markdown - attributes: - value: | - ### Thanks for taking the time to create a bug report. - Please search open/closed issues before submitting, as the issue may have already been reported/addressed. - - - type: textarea - id: problem - attributes: - label: Describe the bug - description: A clear and concise description of what the bug is. If you intend to submit a PR for this issue, tell us how in the description. Thanks! - placeholder: Tell us what you see! - validations: - required: true - - - type: textarea - id: expected - attributes: - label: What did you expect to happen? - description: | - Please provide expected result/output. - placeholder: Tell us what is expected ! - validations: - required: true - - - type: input - id: sample-link - attributes: - label: Sample code link - description: | - A link to a CodeSandbox or StackBlitz that includes a minimal reproduction of the problem. In rare cases when not applicable, you can link to a GitHub repository that we can easily run to recreate the issue. If a report is vague and does not have a reproduction, it will be closed without warning. - - > [!CAUTION] - > If you skip this step, this issue might be **labeled** with `please add a reproduction` and **closed**. - validations: - required: false - - - type: textarea - id: additional - attributes: - label: System info - description: Please provide other details if it is necessary. - placeholder: Software version and device details! - validations: - required: false - - - type: dropdown - id: browsers - attributes: - label: What browsers are you seeing the problem on? - multiple: true - options: - - Firefox - - Chrome - - Safari - - Microsoft Edge - - Other - - - type: textarea - id: logs - attributes: - label: Relevant log output - description: Please copy and paste any relevant log output. This will be automatically formatted into code, so no need for backticks. - render: shell - validations: - required: false - - - type: dropdown - id: self-assign - attributes: - label: Assignment - description: Let us know if you would like to be assigned this Issue - options: - - This issue is free for anyone to take - - I'd like to work on this Issue myself - default: 0 - - - type: checkboxes - id: terms - attributes: - label: Before submitting - description: By submitting this issue, you agree to follow our [Contributing Guidelines](https://github.com/recursivezero/assignment/blob/main/.github/CONTRIBUTING.md). - options: - - label: I've made research efforts and searched the documentation - required: true - - label: I've searched for existing issues - required: true diff --git a/.github/ISSUE_TEMPLATE/ENHANCEMENT.yml b/.github/ISSUE_TEMPLATE/ENHANCEMENT.yml deleted file mode 100644 index 1f0101f0..00000000 --- a/.github/ISSUE_TEMPLATE/ENHANCEMENT.yml +++ /dev/null @@ -1,22 +0,0 @@ -name: Enhancement Tracking Issue -description: Provide supporting details for a feature in development -title: "[🪡]: " -labels: [enhancement] -assignees: recursivezero - -body: - - type: textarea - id: feature - attributes: - label: What would you like to be added? - description: | - Feature requests are unlikely to make progress as issues. - validations: - required: true - - - type: textarea - id: rationale - attributes: - label: Why is this needed? - validations: - required: true diff --git a/.github/ISSUE_TEMPLATE/FEATURE_REQUEST.md b/.github/ISSUE_TEMPLATE/FEATURE_REQUEST.md deleted file mode 100644 index da7bfc27..00000000 --- a/.github/ISSUE_TEMPLATE/FEATURE_REQUEST.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -name: Feature request -about: "Suggest a feature for this project" -title: "[❇️]: " -labels: [] -assignees: recursivezero ---- - -**Is your feature request related to a problem? Please describe.** -A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] - -**Describe the solution you'd like** -A clear and concise description of what you want to happen. - -**Describe alternatives you've considered** -A clear and concise description of any alternative solutions or features you've considered. - -**Additional context** -Add any other context or screenshots about the feature request here. diff --git a/.github/ISSUE_TEMPLATE/QUESTION.md b/.github/ISSUE_TEMPLATE/QUESTION.md deleted file mode 100644 index 8f7db4d1..00000000 --- a/.github/ISSUE_TEMPLATE/QUESTION.md +++ /dev/null @@ -1,15 +0,0 @@ ---- -name: Question -about: Please ask any question about the project -title: "[❓]: " -labels: ["question"] -assignees: recursivezero ---- - -## Question - -State your question - -## Sample Code - -Please include relevant code snippets or files that provide context for your question. diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml deleted file mode 100644 index 91ff2906..00000000 --- a/.github/ISSUE_TEMPLATE/config.yml +++ /dev/null @@ -1,8 +0,0 @@ -blank_issues_enabled: false -contact_links: - - name: GitHub Community Support - url: https://github.com/orgs/community/discussions - about: Please ask and answer questions here. - - name: Social Media Support - url: https://github.com/recursivezero - about: Please connect on social media here. diff --git a/.github/PULL_REQUEST_TEMPLATE/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE/PULL_REQUEST_TEMPLATE.md deleted file mode 100644 index 09d38c6f..00000000 --- a/.github/PULL_REQUEST_TEMPLATE/PULL_REQUEST_TEMPLATE.md +++ /dev/null @@ -1,46 +0,0 @@ -# Pull Request Template - -## Checklist - -- [ ] My code follows the style guidelines of this project -- [ ] I have performed a self-review of my own code -- [ ] I have commented my code, particularly in hard-to-understand areas -- [ ] I have made corresponding changes to the documentation -- [ ] My changes generate no new warnings -- [ ] I have added tests that prove my fix is effective or that my feature works -- [ ] New and existing unit tests pass locally with my changes -- [ ] Any dependent changes have been merged and published in downstream modules -- [ ] I have checked my code and corrected any misspellings - -## Description - -**Relates #[issue number] OR Closes #[issue number]** -Include here a short description of what behavior this Pull Request introduces. -Outline any new dependencies introduced. Please include a summary of the change and which issue is fixed. -Please also include relevant motivation and context - -### Files changed - -Include one to two lines on the necessary changes to each file. - -## Type of change - -Please delete options that are not relevant. - -- [ ] Bug fix (non-breaking change which fixes an issue) -- [ ] New feature (non-breaking change which adds functionality) -- [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected) -- [ ] This change requires a documentation update - -## How Has This Been Tested? - -Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration - -- [ ] Test A -- [ ] Test B - -**Test Configuration**: - -- Browser: -- Device: -- Toolchain: diff --git a/.github/SECURITY.md b/.github/SECURITY.md deleted file mode 100644 index 6735ebaf..00000000 --- a/.github/SECURITY.md +++ /dev/null @@ -1,37 +0,0 @@ -# Security Policy - -## Scope - -Keeping users safe and secure is a top priority for us.We welcome the contribution of external security researchers. - -If you believe you’ve found a security or vulnerability issue in the repo we encourage you to notify us. - -There are no hard and fast rules to determine if a bug is worth reporting as a security issue or a “regular” issue. -When in doubt, please do send us a report. - -## How to submit a report - -Security issues can be reported by sending an email to [us][contact]. - -The team will acknowledge your email within 48 hours. You will receive a more detailed response within 96 hours. - -We will create a maintainer security advisory on GitHub to discuss internally, and when needed, invite you to the advisory. - -## Purpose - -- Make a good faith effort to avoid privacy violations, destruction of data, and interruption or degradation of our services -- Only interact with accounts you own or with explicit permission of the account holder. If you do encounter Personally Identifiable Information (PII) contact us immediately, - do not proceed with access, and immediately purge any local information -- Provide us with a reasonable amount of time to resolve vulnerabilities prior to any disclosure to the public or a third-party -- We will consider activities conducted consistent with this policy to constitute “authorized” conduct and will not pursue civil action or initiate a complaint to law enforcement. - We will help to the extent we can if legal action is initiated by a third party against you - -Please submit a report to us before engaging in conduct that may be inconsistent with or unaddressed by this policy. - -## Preferences - -- Please provide detailed reports with reproducible steps and a clearly defined impact -- Submit one vulnerability per report -- Social engineering (such as phishing, vishing, smishing) is prohibited - -[contact]: mailto:recursivezero@outlook.com diff --git a/.github/SUPPORT.md b/.github/SUPPORT.md deleted file mode 100644 index 53e5d901..00000000 --- a/.github/SUPPORT.md +++ /dev/null @@ -1,49 +0,0 @@ -# Support - -This article explains where to get help with remark. -Please read through the following guidelines. - -> [!Note] -> before participating in our community, please read our [code of conduct][coc]. -> By interacting with this repository, organization, or community you agree to abide by its terms. - -## Asking quality questions - -Questions can go to [GitHub discussions][discussion]. - -Help us help you! - -Spend time framing questions and add links and resources. -Spending the extra time up front can help save everyone time in the long run. - -> [!Tip] -> Here are some tips - -- [Talk to us][chat]! -- Don’t fall for the [XY problem][xy] -- Search to find out if a similar question has been asked -- Try to define what you need help with: - - Is there something in particular you want to do? - - What problem are you encountering and what steps have you taken to try and fix it? - - Is there a concept you don’t understand? -- Provide sample code, such as a [CodeSandbox][cs] or [StackBlitz][sb] or a small video, if possible -- Screenshots can help, but if there’s important text such as code or error messages in them, please also provide those as text -- The more time you put into asking your question, the better we can help you - -## Contributions - -See [`contributing guide`][contributing] on how to contribute. - -## Author - -© Admin - - - -[coc]: https://github.com/recursivezero/assignment/blob/main/.github/CODE_OF_CONDUCT.md -[chat]: https://github.com/recursivezero/assignment/discussions/new?category=general -[discussion]: https://github.com/recursivezero/assignment/discussions/new?category=q-a -[contributing]: https://github.com/recursivezero/assignment/blob/main/.github/CONTRIBUTING.md -[xy]: https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem/66378#66378 -[cs]: https://codesandbox.io -[sb]: https://stackblitz.com diff --git a/.github/workflows/auto-format-title.yml b/.github/workflows/auto-format-title.yml deleted file mode 100644 index 29f6124a..00000000 --- a/.github/workflows/auto-format-title.yml +++ /dev/null @@ -1,24 +0,0 @@ -name: "Auto Format Issue Title" -run-name: format issue title based on issue prefix - -on: - issues: - types: [opened, edited] - -concurrency: - group: format-title - cancel-in-progress: true - -permissions: - issues: write - -jobs: - format_title: - runs-on: ubuntu-latest - if: contains(github.event.issue.title, format('{0}-', vars.PROJECT_PREFIX)) == false - - steps: - - name: Format issue title - uses: recursivezero/action-club/.github/actions/format-issue-title@v0.2.58 - with: - prefix: ${{ vars.PROJECT_PREFIX }} diff --git a/.vscode/settings.json b/.vscode/settings.json deleted file mode 100644 index 48d1f3a6..00000000 --- a/.vscode/settings.json +++ /dev/null @@ -1,29 +0,0 @@ -{ - "cSpell.words": [ - "Kaggle", - "Pinterest", - "recursivezero" - ], - "workbench.colorCustomizations": { - "activityBar.activeBackground": "#2704dc", - "activityBar.background": "#2704dc", - "activityBar.foreground": "#e7e7e7", - "activityBar.inactiveForeground": "#e7e7e799", - "activityBarBadge.background": "#db2704", - "activityBarBadge.foreground": "#e7e7e7", - "commandCenter.border": "#e7e7e799", - "sash.hoverBorder": "#2704dc", - "sideBar.border": "#2704dc", - "statusBar.background": "#1e03aa", - "statusBar.foreground": "#e7e7e7", - "statusBarItem.hoverBackground": "#2704dc", - "statusBarItem.remoteBackground": "#1e03aa", - "statusBarItem.remoteForeground": "#e7e7e7", - "tab.activeBorder": "#2704dc", - "titleBar.activeBackground": "#1e03aa", - "titleBar.activeForeground": "#e7e7e7", - "titleBar.inactiveBackground": "#1e03aa99", - "titleBar.inactiveForeground": "#e7e7e799" - }, - "peacock.color": "#1e03aa" -} \ No newline at end of file diff --git a/LICENSE b/LICENSE deleted file mode 100644 index 720a847d..00000000 --- a/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2024 Recursivezero Private Limited - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. diff --git a/README.md b/README.md index 4959720d..86094204 100644 --- a/README.md +++ b/README.md @@ -1,99 +1,80 @@ -# 🎓 Internship Assignments +# QuotePaper -Welcome to the technical assessment repository. This project contains a series of tasks and assignments designed to evaluate engineering logic, code quality, and attention to detail. +A browser-based tool to turn text quotes into downloadable wallpapers. No build step, no dependencies to install — open `index.html` in any browser and it works. ------ +--- -## 🛠 Task List (Mini-Tasks) +## What it does -Each task is located in its respective branch. Use these to demonstrate specific technical skills. +Type a quote and author, pick a background theme, layout, font, canvas size, and decoration style, then download a high-resolution PNG. -| Task Description | Branch Name | -| :--- | :--- | -| **Title Case Utility:** Convert strings within an array of objects. | `task/title-case` | -| **VS Code Extension:** Display file metadata (M/C time) in the status bar. | `task/vscode-metadata` | -| **React Testing:** Implementation of unit tests for a UI component. | `task/react-unit-test` | -| **Chrome Extension:** Network request monitor with accordion UI. | `task/network-monitor` | +--- ------ +## Features -## 📂 Assignment List (Full Projects) +- 8 background themes (dark and light) +- 4 text layout positions +- 3 font choices — Playfair Display, Cormorant Garamond, DM Mono +- 4 export sizes — 16:9 desktop, 9:16 mobile/story, 1:1 square, 4:3 +- 4 decoration modes — line rule, large quote marks, decorative frame, minimal +- 30 built-in quotes with a random button +- High-res PNG download (scales from preview to full resolution) +- Keyboard shortcut: `Ctrl/Cmd + D` to download -Detailed documentation for each project can be found in the `docs/markdown` directory: +--- -Since these are for an internship repository, I've categorized them based on the likely engineering challenge (UI, Logic, Full-stack, etc.) to make it easier for candidates to choose. +## Getting started ------ +```bash +git clone https://github.com/YOUR-USERNAME/assignment.git +cd assignment +git checkout task/quotepaper +``` -## 📂 Assignment List +Open `index.html` in a browser. No server or build step needed. -### 🌐 Web & UI Challenges +--- -* **[ImageSearch](./docs/markdown/ImageSearch.md)** – Build an AI-powered search interface with real-time result streaming. -* **[ColorFinder](./docs/markdown/ColorFinder.md)** – Implementation of a tool to extract and identify color palettes from images or hex codes. -* **[ColorNumber](./docs/markdown/ColorNumber.md)** – A utility to map specific numeric data to visual color scales or identifiers. -* **[DynImagic](./docs/markdown/DynImagic.md)** – Create dynamic, responsive image layouts with on-the-fly manipulation. -* **[IndiaMap](./docs/markdown/IndiaMap.md)** – Interactive SVG-based data visualization of Indian states and regions. -* **[NumPad](./docs/markdown/NumPad.md)** – Development of a custom, accessible virtual numeric input for secure data entry. -* **[QuotePaper](./docs/markdown/QuotePaper.md)** – A generator that transforms text quotes into aesthetically pleasing, downloadable wallpapers. -* **[SocialPreview](./docs/markdown/SocialPreview.md)** – Build a tool to generate and preview OpenGraph/Social media meta-cards. +## Project structure -### ⚙️ Logic & Data Processing +``` +quotepaper/ +├── index.html +└── src/ + ├── style.css + ├── quotes.js + └── app.js +``` -* **[DanceCase](./docs/markdown/DanceCase.md)** – A string utility library for complex casing patterns (e.g., snake\_case to camelCase). -* **[DateMatics](./docs/markdown/DateMatics.md)** – Complex date calculation engine for handling business days and timezones. -* **[DateTimeCalculator](./docs/markdown/DateTimeCalculator.md)** – A focused utility for finding durations and differences between timestamps. -* **[HinDictionary](./docs/markdown/HinDictionary.md)** – A localized Hindi-English dictionary with optimized search indexing. -* **[Object\_Count](./docs/markdown/ObjectCount.md)** – Logic to parse and count nested objects or identified elements within a dataset. -* **[SunsignMonth](./docs/markdown/SunsignMonth.md)** – Data mapping tool to correlate dates with astrological signs and monthly cycles. -* **[URlShortner](./docs/markdown/URlShortner.md)** – Backend logic for creating, storing, and redirecting shortened URLs. +`style.css` owns all visual logic including themes and layouts. `quotes.js` holds the quote dataset. `app.js` handles state and event binding — it only toggles CSS classes, it never touches colour or layout directly. -### 📱 Full-Stack & Applications +--- -* **[Bilingual PWA Dictionary](./docs/markdown/BilingualDictionary.md)** – An offline-first mobile web app for multi-language translations. -* **[Build MCQ App](./docs/markdown/MCQApp.md)** – A complete quiz platform featuring timer logic and automated scoring. -* **[FabricStore](./docs/markdown/FabricStore.md)** – A specialized e-commerce flow for managing fabric inventory and custom measurements. -* **[PNR_PWA](./docs/markdown/PNR_PWA.md)** – A Progressive Web App to track and notify users of railway PNR status updates. -* **[Sapariwar](./docs/markdown/Sapariwar.md)** – A community-focused platform for managing family directory data. -* **[Societree](./docs/markdown/Societree.md)** – Visualization tool for mapping social networks and organizational hierarchies. -* **[ToyShare](./docs/markdown/ToyShare.md)** – A peer-to-peer platform for listing and borrowing items within a community. +## How the download works -### 🛡️ Systems & Productivity +`html2canvas` captures the `.wallpaper-canvas` element and multiplies it by a scale factor equal to `targetWidth / previewWidth`. A 16:9 preview at 640px wide is captured at 1920px — same proportions, full resolution. -* **[BrandAddress](./docs/markdown/BrandAddress.md)** – Implementation of a formal brand identity and physical address verification system. -* **[SafeDocs](./docs/markdown/SafeDocs.md)** – Privacy-centric document management with encryption or masking capabilities. -* **[TeamMatrix](./docs/markdown/TeamMatrix.md)** – A dashboard for visualizing team skills, availability, and project allocation. -* **[VoiceForm](./docs/markdown/VoiceForm.md)** – Use Web Speech API to fill out complex forms using only voice commands. +--- ------ +## Engineering notes -## How to Submit +The app uses a single `state` object with five keys. Every button click updates one key and calls `applyClasses()`, which rebuilds the element's class list. CSS does all the visual work. Adding a new background theme means one CSS class and one button in the HTML — nothing else changes. -1. Checkout the branch: `task/` -2. Create your branch: `feature/` -3. Raise a PR back to the original `task/` branch. +The quote dataset is local so the app runs fully offline and needs no API key. ------ +--- -## 🚀 Submission Workflow +## Possible improvements -Please follow this git flow strictly to ensure your code is reviewed: +- Custom background image upload +- Font size slider +- JPEG export for smaller file sizes +- LocalStorage to persist last-used settings +- Quote search or category filter -1. **Select your branch:** Checkout the branch corresponding to your task: - `git checkout task/` -2. **Create a feature branch:** `git checkout -b feature/` -3. **Commit & Push:** Ensure your commit messages are descriptive. -4. **Raise a PR:** Submit your Pull Request against the original `task/` branch. +--- ------ +## Submission -## 📮 Support & Feedback - -If you encounter any bugs or have questions regarding the requirements: - -* **GitHub:** [Open an Issue](https://github.com/your-username/repo/issues) -* **Email:** [recursivezero@outlook.com](mailto:recursivezero@outlook.com) - ------ - -© 2025-26 Recursive Zero. All rights reserved. +Branch: `feature/quotepaper` +PR target: `task/quotepaper` on the upstream repo diff --git a/assignment.code-workspace b/assignment.code-workspace deleted file mode 100644 index 40bd63a8..00000000 --- a/assignment.code-workspace +++ /dev/null @@ -1,35 +0,0 @@ -{ - "folders": [ - { - "path": "." - } - ], - "settings": { - "workbench.colorCustomizations": { - "activityBar.activeBackground": "#2704dc", - "activityBar.background": "#2704dc", - "activityBar.foreground": "#e7e7e7", - "activityBar.inactiveForeground": "#e7e7e799", - "activityBarBadge.background": "#db2704", - "activityBarBadge.foreground": "#e7e7e7", - "commandCenter.border": "#e7e7e799", - "sash.hoverBorder": "#2704dc", - "statusBar.background": "#1e03aa", - "statusBar.foreground": "#e7e7e7", - "statusBarItem.hoverBackground": "#2704dc", - "statusBarItem.remoteBackground": "#1e03aa", - "statusBarItem.remoteForeground": "#e7e7e7", - "titleBar.activeBackground": "#1e03aa", - "titleBar.activeForeground": "#e7e7e7", - "titleBar.inactiveBackground": "#1e03aa99", - "titleBar.inactiveForeground": "#e7e7e799" - }, - "peacock.color": "#1e03aa", - "deno.enable": true, - "deno.lint": true, - "editor.formatOnSave": true, - "[typescript]": { - "editor.defaultFormatter": "denoland.vscode-deno" - } - } -} \ No newline at end of file diff --git a/docs/markdown/ MCQApp.md b/docs/markdown/ MCQApp.md deleted file mode 100644 index 0275b28d..00000000 --- a/docs/markdown/ MCQApp.md +++ /dev/null @@ -1,126 +0,0 @@ -# Internship Assignment: Build an MCQ App with Feedback Form Functionality - -## Objective - -Design and develop a web-based Multiple Choice Question (MCQ) app that allows users to take quizzes and also submit feedback. The app should support both quiz-taking and feedback collection, with dynamic loading of quiz data from JSON files uploaded through a backend interface. - -## Requirements - -### 1. Data Structure - -- **Quiz Data:** Each quiz consists of multiple questions grouped by categories and difficulty levels. -- **JSON Format:** The app should load quiz data from JSON files with the following structure: - - ```json - { - "id": "unique-quiz-id", - "category": "category-name", - "level": "hard/medium/easy", - "questions": [ - { - "id": 1, - "question": "Question text", - "options": ["option1", "option2", "option3", "option4"], - "answer": "correct option text" - }, - ... - ] - } - ``` - -- **Feedback Data:** Should include open-ended and multiple-choice questions to collect user feedback. -- **User Data:** Store user responses for both quizzes and feedback forms and display ion finish of the quiz. - -### 2. User Interface (UI) - -- **Main View:** - - Dashboard offering two modes: Take Quiz or Submit Feedback. - - List available quiz categories dynamically loaded from uploaded JSON files. - -- **Quiz Mode:** - - User selects a category and difficulty level. - - Load questions dynamically based on selection. - - Display one question at a time with multiple-choice options. - - Navigation between questions and progress tracking. - - Display results at the end including score and correct answers. - -- **Feedback Mode:** - - Display various feedback questions. - - Allow submission with confirmation. - -- **Backend Admin Page:** - - Page for authorized users to upload MCQ JSON files. - - Validate JSON format on upload. - - Store JSON data for frontend usage. - -- **Design Considerations:** - - Responsive, accessible, and user-friendly UI. - - Smooth transitions and clear instructions. - -### 3. Technology Stack - -- **Frontend:** HTML, CSS, JavaScript; optionally React.js or Vue.js. -- **Backend:** Node.js or any preferred backend tech to handle JSON upload and serve quiz data. -- **Storage:** File system or database to store uploaded JSON files. - -### 4. Deliverables - -- Fully functional MCQ app with feedback form and backend JSON upload. -- Documentation explaining data structure, design decisions, and challenges. -- Video walkthrough or presentation demonstrating the app. - -### 5. Evaluation Criteria - -- Functionality, UI/UX, code quality, and creativity/enhancements. - -## Sample JSON - -```json -{ - "id": "quiz123", - "category": "General Knowledge", - "level": "medium", - "questions": [ - { - "id":1, - "question": "What is the capital of France?", - "options": ["Paris", "London", "Rome", "Berlin"], - "answer": "Paris" - }, - { - "id": 2, - "question": "Which planet is known as the Red Planet?", - "options": ["Earth", "Mars", "Venus", "Jupiter"], - "answer": "Mars" - }, - { - "id": 3, - "question": "Who wrote 'Hamlet'?", - "options": ["Charles Dickens", "William Shakespeare", "Mark Twain", "Leo Tolstoy"], - "answer": "William Shakespeare" - } - ] -} -``` - -### Deadline - -Final Submission Date: 7 Days since first Pull Date - -### Submission Process - -#### GitHub Repository - -- Create a public GitHub repository for your project. -- Commit and push your code regularly, documenting significant changes with clear commit messages. -- Ensure the repository contains all project files, including the source code, documentation, and any necessary resources. - -#### Submission - -- Invite `@recursivezero` to your private repository as a collaborator. -- Submit a link to your GitHub repository via Email on _recursivezero@outlook.com_ by the deadline. -- Prepare for a brief presentation or demo to showcase your work. - -Note: This assignment aims to evaluate your skills in web development, design aesthetics, and attention to detail. Good luck! - -> © 2025 RecursiveZero Private Limited, All rights reserved. diff --git a/docs/markdown/BilingualDictionary.md b/docs/markdown/BilingualDictionary.md deleted file mode 100644 index ecf45ded..00000000 --- a/docs/markdown/BilingualDictionary.md +++ /dev/null @@ -1,177 +0,0 @@ -# Bilingual Dictionary - -Here is a structured Product Plan Document for your bilingual vocabulary mobile app / PWA. It captures all your requirements — ideal for guiding development or prompting other AI agents. - ---- - -📘 Product Plan: Bilingual Vocabulary Builder (Hindi-English) - -1. 📌 Overview - -A mobile-first PWA for building and managing bilingual (Hindi-English) word entries. Targeted at learners, kids, and personal use, the app works completely offline using IndexedDB and supports JSON import/export, responsive design, and customizable themes. - ---- - -1. 🎯 Core Features - -🔤 Add / Edit / Delete Word Entry - -Fields: - -english (required, lowercase only) - -hindi (required) - -example (optional) - -type (noun, verb, etc.) — shown as colored chips (selectable, default is "noun") - -category (like "fruit", "emotion") — also shown as chips - -notes (optional) - -Auto timestamps: createdAt, updatedAt - -Duplicate check on [english + hindi] pair - -🔍 Search - -Instant search with auto-suggest - -Works on both Hindi & English - -Suggestion includes matched text highlight and direct meaning - -Results displayed in order of match relevance - -📇 Entry View - -Tap to show popover: - -Edit, Copy buttons - -Delete with optional "Don't ask again" toggle - -Show all details (highlighted Hindi/English depending on query) - -📥 Import / 📤 Export - -JSON Export of all data - -JSON Import with schema validation: - -Required: english, hindi - -Optional: example, type, category, notes - -Auto-add createdAt, updatedAt - -Skips invalid or duplicate entries - -Copy entry as plain text (just word + meaning) - -⚙️ Settings - -Theme toggle: Light / Dark / High Contrast - -Delete confirm toggle - -Export button (JSON) - -Import button (JSON file upload) - -PWA Install prompt - -📦 Storage - -Data stored in IndexedDB - -Two stores: - -vocab_entries - -settings - ---- - -1. 🖼 UI Design - -Minimal, touch-optimized UI - -Large text, chip-style selection, popover interactions - -Responsive layout for phones, tablets - -Accessible keyboard navigation (next field focus, arrows) - -Example screen sections: - -Home: Search + Recent Entries - -Add/Edit: Entry form with smart field ordering - -Detail: Card with all info, copy/download options - -Settings: Preferences and import/export - ---- - -1. 🌐 PWA Behavior - -Fully installable on Android/iOS via browser - -Service worker caches everything after first load - -Works 100% offline - -Custom manifest + icons - -Export/download triggers use Blob API - ---- - -1. 📁 Data Model - -{ -"id": 1234567890, -"english": "apple", -"hindi": "सेब", -"example": "An apple a day keeps the doctor away.", -"type": "noun", -"category": ["fruit"], -"notes": "Very common word", -"createdAt": 1711234567890, -"updatedAt": 1711234567890 -} - ---- - -1. 🛠️ Tech Stack - -Vanilla JavaScript (ES Modules) - -IndexedDB (via idb wrapper or direct) - -CSS (modern layout, popover, scroll, container queries) - -Vite (build tool) - -Deployed via Netlify, Firebase Hosting, or GitHub Pages - ---- - -1. 🧠 Extra Considerations - -All inputs trimmed and converted to lowercase where needed - -Auto-fill mode: If only Hindi is entered, auto-suggest from English too - -Toggle to show all entries or filter by letter/date - -Data can be grouped by type/category - -Support long-press or copy icon for quick copy of Hindi/English - ---- - -Would you like this exported as a PDF or Markdown file? I can also give you a prompt version to use with other agents. diff --git a/docs/markdown/BrandAddress.md b/docs/markdown/BrandAddress.md deleted file mode 100644 index f1b00505..00000000 --- a/docs/markdown/BrandAddress.md +++ /dev/null @@ -1,61 +0,0 @@ -**Intern Assignment : Brand Information Portal** - -**Objective:** -Create a web-based portal where users can easily access and search for details of various brands, companies, or organizations. The portal should have a beautiful UI, be easy to navigate, and provide fast search functionality. - -**Requirements:** - -1. **Brand Information Entry:** - - Users should be able to add details for a specific brand, company, or organization. - - Required details: Official email address, company website, social media handles. - - Users should be able to add tags to categorize the brand. - -2. **Search Functionality:** - - Implement a fast and efficient search feature. - - Users should be able to search by brand name or tags. - - Search results should display relevant details in a clear and organized manner. - -3. **User-Friendly Interface:** - - Design a beautiful and intuitive UI for the portal. - - Ensure easy navigation between pages and features. - - Consider responsive design for various devices. - -4. **Tagging System:** - - Implement a tagging system to categorize brands. - - Tags should enhance the search experience and aid in organizing information. - -5. **Data Validation and Error Handling:** - - Validate user inputs to ensure data accuracy. - - Implement error handling for any potential issues during data entry or search. - -6. **Security Measures:** - - Ensure data security and implement measures to protect user information. - - Employ best practices to prevent unauthorized access. - -7. **Documentation:** - - Provide clear documentation for users on how to use the portal. - - Include a guide on adding, editing, and searching for brand information. - -8. **Testing:** - - Conduct thorough testing to identify and fix any bugs or issues. - - Test the portal's performance, especially the search functionality. - -9. **Submission:** - - Interns should submit the project source code and any necessary files. - - Include a brief report on the design choices made and challenges faced during development. - -**Evaluation Criteria:** -Interns will be evaluated based on the following criteria: - -- UI design and user experience. -- Functionality and performance of the search feature. -- Security measures implemented. -- Quality of code and documentation. - -**Submission Deadline:** -[Specify the deadline for the intern to submit the completed assignment.] - -**Note:** -Interns are encouraged to be creative and innovative in their approach to designing the portal. The goal is to create a user-friendly and visually appealing platform for accessing brand information efficiently. - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/ColorFinder.md b/docs/markdown/ColorFinder.md deleted file mode 100644 index e58021c5..00000000 --- a/docs/markdown/ColorFinder.md +++ /dev/null @@ -1,127 +0,0 @@ -# Intern Assignment: ColorFinder - Python - -## Overview - -Your task is to develop a Python program that allows a user to upload an image, analyze the image, and detect the major colors present in it. The program should then return the major colors in RGB or any valid web format, ensuring that the color extraction process is efficient. The program will return the image name and a list of major colors in a structured JSON format. - ---- - -## Assignment Details - -### Input - -- An image file uploaded by the user. Supported formats include JPEG, PNG, GIF, etc. - -### Output - -- A JSON response containing: - - **Image Name**: The name of the uploaded image. - - **Major Colors**: A list of the major colors present in the image. - - The colors should be represented in either RGB or HEX format. - - The number of major colors should vary between 4 and 10. - -### Key Requirements - -1. **Major Color Extraction**: - - The program should detect between 4 and 10 major colors in the image using an efficient approach. - - Noise around the image (e.g., subtle color variations or shadows) should be ignored. - - Use **KMeans clustering** for color extraction. - -2. **Output Format**: - - The output should be returned as a JSON object containing the image name and a list of detected major colors. - - Example output format: - - ```json - { - "image_name": "sample_image.jpg", - "colors": [ - "rgb(123, 45, 67)", - "rgb(255, 220, 180)", - "rgb(100, 120, 130)", - "rgb(90, 60, 40)" - ] - } - ``` - -### Tools and Libraries - - -- **Python**: Core language for this assignment. -- **Libraries**: (just suggested not necessary to use) - - `Pillow` for image processing. - - `scikit-learn` for KMeans clustering. - - `numpy` for numerical operations. - - `json` for returning the output in JSON format. - ---- - -## Steps and Guidelines - -### 1. **Image Processing and Color Extraction** - -- **Load and Preprocess Image**: - - Use `Pillow` to load the uploaded image and convert it to RGB format. - - Optionally, resize the image to speed up processing for larger images. -- **Extract Pixel Data**: - - Convert the image into a numpy array containing RGB pixel values. -- **Apply KMeans Clustering**: - - Use **KMeans clustering** to group the pixels into clusters that represent the major colors. - - Set the number of clusters between 4 and 10. -- **Convert RGB to HEX**: - - Convert the RGB values of the cluster centers into HEX or RGB format to represent the major colors. - -### 2. **Return the Major Colors** - -- After clustering, convert the cluster centers to a valid color format (either RGB or Hex). -- Return the color list along with the image name in a JSON format. - -### 3. **Example JSON Response** - -- The program should return a JSON response like the following: - - ```json - { - "image_name": "sample_image.jpg", - "colors": [ - "rgb(123, 45, 67)", - "rgb(255, 220, 180)", - "rgb(100, 120, 130)", - "rgb(90, 60, 40)" - ] - } - - -### 4. Evaluation Criteria - -- Correctness - -Ensure the program correctly identifies and returns the major colors in the range of 4-10 colors. - -- Performance - -The program should process images efficiently, particularly for larger images. - -- Code Quality - -The code should be clean, modular, well-commented, and easy to understand. - -- Error Handling - -Handle cases such as invalid image formats or very small images gracefully. - -### 5. Submission - -Create a GitHub repository with the following: - -- Python script (color_extractor.py or similar) containing the code. -- Sample images for testing the functionality. -- A README.md file explaining how to run and test the code. -- Ensure the code runs efficiently and produces correct results within the given constraints. - - -**Note:** -Interns are encouraged to be creative and innovative in their approach to designing the portal. The goal is to create a user-friendly and visually appealing platform for accessing brand information efficiently. - ---- - -© 2024 RecursiveZero Private Limited | All rights reserved. diff --git a/docs/markdown/ColorNumber.md b/docs/markdown/ColorNumber.md deleted file mode 100644 index eb92b790..00000000 --- a/docs/markdown/ColorNumber.md +++ /dev/null @@ -1,75 +0,0 @@ -# Internship Assignment: Background generator with user input - -## Objective - -Assess the candidate's proficiency in HTML, CSS, and JavaScript by developing an interactive web page that dynamically changes its background color based on a user-inputted 6-digit number. - ---- - -## Assignment Overview - -Create a web page where users can enter any **6-digit number**, and the page background will change to the corresponding color (hex code equivalent). The UI should be **highly interactive** and include **smooth animations** for an engaging experience. - -## Requirements - -### 1. Input Field - -- A **single input box** (large enough for visibility and easy typing). -- Should accept only **6-digit numerical values**. -- Display an **error message** on the same input field if the entered value is invalid (less than 6 digits, more than 6 digits, or contains non-numeric characters). - -### 2. Dynamic Background Color Change - -- When a valid 6-digit number is entered, convert it into a **hex color** (e.g., `123456` → `#123456`). -- Apply the color as the **background** of the page. - -### 3. Scroll-Driven Animation - -- As the user **scrolls down**, the input box should smoothly move **to the top of the page**. -- Utilize **CSS Grid** to center the text dynamically. - -### 4. User Experience & UI Enhancements - -- Ensure a **smooth scrolling effect** when the input field moves to the top. -- The color should **fade in smoothly** when changed. -- Display the **entered number** in large, centered text over the background. - -## Technology Stack - -- **HTML**: Structure the page with semantic elements. -- **CSS**: Use CSS Grid for layout, and animations/transitions for effects. -- **JavaScript**: Validate input, update UI, and handle scroll-based interactions. - -## Code Quality - -Write clean and well-documented HTML, CSS, and JavaScript code. -Ensure the website is compatible with major web browsers. -Implement responsive design principles for a smooth experience on various devices. - -## Submission Instructions - -- Complete the assignment within **one week**. -- Upload the project to your own **GitHub repository**. -- Share the **GitHub repository link** along with a **README.md** containing: - - Brief description of the project. - - Steps to run the project. - - Any additional features implemented. - -## Bonus Points (Optional Enhancements) - -- Add **a button** to reset the background color. -- Provide **a preview** of the color before applying it. -- Implement **a smooth entry animation** for the input box when the page loads. - ---- - -## Evaluation Criteria - -- **Code Quality**: Clean, well-structured, and commented code. -- **Functionality**: All core requirements must work correctly. -- **Design & UX**: Smooth animations and an engaging interface. -- **GitHub Usage**: Proper repository structure, README, and commits. - -Good luck! 🚀 - -© 2025 [RecursiveZero](https://recursivezero.com) private limited | All rights reserved. diff --git a/docs/markdown/DanceCase.md b/docs/markdown/DanceCase.md deleted file mode 100644 index a1fd609e..00000000 --- a/docs/markdown/DanceCase.md +++ /dev/null @@ -1,61 +0,0 @@ -# Internship Assignment: Indian Folk Dance Showcase - -## Objective - -Create a web page showcasing the diverse folk dances of India, providing information about each state's dance form. The page should be well-organized, visually appealing, and user-friendly. - -## Task Overview - -## Homepage: Indian Folk Dance Overview - -Design a clean and visually appealing homepage displaying a map of India. -Each state on the map should be clickable, leading to the respective state's folk dance page. - -## State-wise Folk Dance Pages - -### For each state, create a dedicated page containing the following elements - -- State Dance Name: Clearly display the name of the folk dance. -- Image: Include a high-quality image representing the dance form. -- Brief History: Provide a concise history of the dance form, highlighting its cultural significance. -- Trivia: any facts or famous artist name -- Wiki Page Link: Include a link to the dance form's Wikipedia page for users who want to explore further. - -## Navigation - -### Implement a user-friendly navigation system - -Use a menu or clickable map on the homepage for easy access to state-wise pages. - -Include a "Home" button on each state page for quick navigation back to the homepage. - -## Design and Layout - -Ensure the design is neat, organized, and visually appealing. -Use a consistent layout for all state pages to maintain a cohesive look. -Optimize images and use a responsive design for a seamless user experience on different devices. - -## Code Quality - -Write clean and well-documented HTML, CSS, and JavaScript code. -Ensure the website is compatible with major web browsers. -Implement responsive design principles for a smooth experience on various devices. - -## Submission Guidelines - -Submit a compressed folder containing all project files, including HTML, CSS, JavaScript, and images. -Provide a README file with instructions on how to navigate and use the website. -Include comments in the code to explain the functionality and structure. - -## Evaluation Criteria - -Design and User Experience (40%): Neat, visually appealing, and easy-to-navigate pages. -Content Quality (30%): Accurate and concise information about each folk dance. -Code Quality (20%): Well-organized and documented code with good coding practices. -Responsiveness (10%): Ensure the website functions well on different devices. - ---- - -Note: Reach out for clarification or guidance if needed. The goal is to create an informative and enjoyable platform for users to explore the rich tapestry of Indian folk dances. - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/DateMatics.md b/docs/markdown/DateMatics.md deleted file mode 100644 index 835d62d4..00000000 --- a/docs/markdown/DateMatics.md +++ /dev/null @@ -1,49 +0,0 @@ -**Web Development Intern Assignment** - -**Objective:** Develop a minimalistic Progressive Web App (PWA) with mobile-friendly design that allows users to calculate the difference between two dates, perform date arithmetic, and display the current date in Hindi month using JavaScript APIs. - -**Requirements:** - -1. Create a single-page web application with HTML, CSS, and JavaScript. -2. Implement a date input field for the user to input the starting date in a specific format. -3. Include a second date input field for the user to enter another date. -4. Provide an option for the user to select the current date for both input fields. -5. Display the difference between the two dates in days, months, and years. -6. Present the result in a clear and user-friendly format. -7. Allow the user to perform date arithmetic by adding or subtracting a specified number of days from a selected date. -8. Ensure the web page is mobile-friendly and functions as a Progressive Web App. -9. Use JavaScript APIs, especially the latest ones. -10. Display the current date in Hindi month format using the [`Intl.DateTimeFormat`][1] API. - -**Additional Information:** - - -- Use responsive design principles to ensure a seamless experience on both desktop and mobile devices. -- Implement error handling to manage invalid date entries. -- Keep the user interface clean and intuitive, focusing on the essential functionality. -- Test the PWA on various browsers to ensure cross-browser compatibility. - -**Submission Guidelines:** - -- Provide the source code hosted on a version control platform (e.g., GitHub). -- Include a README file with instructions on how to run the application locally. -- Demonstrate the PWA functionality on different devices. -- Address any potential issues or limitations in the README. - -**Evaluation Criteria:** - -- Adherence to the specified requirements. -- Code clarity, organization, and best practices. -- User interface design and user experience. -- Functionality and accuracy in date calculations. -- Responsiveness on various devices. -- Integration and usage of JavaScript APIs. -- Accurate display of the current date in Hindi month format. - -**Deadline:** [Specify Deadline] - -**Note:** Feel free to reach out for clarification or guidance during the development process. Good luck! - -[1]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/DateTimeCalculator.md b/docs/markdown/DateTimeCalculator.md deleted file mode 100644 index 452a6701..00000000 --- a/docs/markdown/DateTimeCalculator.md +++ /dev/null @@ -1,88 +0,0 @@ -# Internship Assignment: Date & Time Calculator - -## Objective - -Assess the candidate's proficiency in **JavaScript date handling**, **Intl API**, and UI/UX development by creating an interactive date calculator that calculates age, date differences, and future dates. - ---- - -## Assignment Overview - -Create a **web-based date and time calculator** that allows users to: - -1. **Select a Date and Time** to calculate age or the difference between two dates. -2. **View the difference** between two selected dates in **years, months, and days**. -3. **Calculate future or past dates** (e.g., what date will it be **1000 days from today**). -4. **Display the current date and time** at the top using **JavaScript's Intl.DateTimeFormat API**. - -The UI should be interactive and **user-friendly**, utilizing **smooth animations** for a modern experience. - ---- - -## Requirements - -### 1. Display Current Date & Time - -- The **current date and time** should always be displayed at the top. -- Use **Intl.DateTimeFormat** to format it properly based on the user's locale. - -### 2. Age & Date Difference Calculator - -- Allow the user to **select two dates**. -- Display the difference in **years, months, and days**. -- If only one date is selected, calculate the difference **from today**. - -### 3. Future & Past Date Calculator - -- Allow users to enter a **number of days** (positive or negative). -- Show the **calculated future or past date**. -- Use **Intl.DateTimeFormat** for proper localization. - -### 4. UI/UX Enhancements - -- The layout should be **clean and responsive**. -- Use **smooth transitions** when displaying results. -- Implement **form validation** to prevent invalid inputs. - ---- - -## Technology Stack - -- **HTML**: Page structure. -- **CSS**: Grid/Flex box for layout, animations for interactions. -- **JavaScript**: - - Handle date selection and calculations. - - Use **Intl.DateTimeFormat** for date formatting. - - Validate user input and display meaningful messages. - ---- - -## Submission Instructions - -- Complete the assignment within **one week**. -- Upload the project to your own **GitHub repository**. -- Share the **GitHub repository link** along with a **README.md** containing: - - Brief description of the project. - - Steps to run the project. - - Any additional features implemented. - ---- - -## Bonus Points (Optional Enhancements) - -- Implement a **time difference calculator** (e.g., HH:MM:SS difference between two times). -- Allow the user to **change time zones** and see the difference. -- Add a **countdown timer** for a selected future date. - ---- - -## Evaluation Criteria - -- **Code Quality**: Clean, well-structured, and commented. -- **Functionality**: Features should work without errors. -- **Design & UX**: The UI should be smooth and interactive. -- **GitHub Usage**: Proper repository structure, meaningful commits, and a well-documented README. - -Good luck! 🚀 - -© 2025 [RecursiveZero](https://recursivezero.com) private limited | All rights reserved. diff --git a/docs/markdown/DynImagic.md b/docs/markdown/DynImagic.md deleted file mode 100644 index 6075ffdb..00000000 --- a/docs/markdown/DynImagic.md +++ /dev/null @@ -1,58 +0,0 @@ -# Internship Assignment: DynImagic - -## Objective - -Create a Mobile application that utilizes AI to separate colors from a group image and generate individual images with the same pattern. Implement a user-friendly UI to display available designs and colors, allowing users to generate specific color images on demand. - -## Requirements - -1. **Image Processing with AI:** - - Develop a function that takes two images as input: one with the pattern/design and another with a group of colors and patterns. - - Use AI/image processing techniques to identify and separate different colors from the group image. - - Generate separate images for each color, preserving the original pattern. - -2. **User Interface (UI):** - - Utilize a GUI library like Tkinter, PyQt, or any of your choice for the user interface. - - Display a list of available designs along with the count of unique colors for each design. - - When a user clicks on a design, dynamically show the associated colors and patterns. - - Provide a button or interactive element to generate individual color images based on the user's selection. - -3. **GitHub Repository:** - - Set up a GitHub repository for the project. - - Structure the repository with appropriate directories (e.g., code, documentation). - - Include a README file with instructions on how to run the application, required dependencies, and any additional information for users and developers. - -4. **Documentation:** - - Document your code thoroughly. - - Provide a brief explanation of the AI/image processing techniques used. - - Clearly explain the structure of your UI and how it interacts with the image processing functions. - -## Submission - -1. Push the complete codebase to the GitHub repository. -2. Include a README.md file with clear instructions on how to set up and run the application. -3. Provide a short document explaining the AI techniques used for color separation. - -## Evaluation Criteria - -1. **Functionality (50%):** - - Successful color separation and image generation. - - User-friendly UI with design and color selection features. - -2. **Code Quality (30%):** - - Well-documented code. - - Clear and modular structure. - -3. **GitHub Repository (10%):** - - Proper organization of files and directories. - - A README file with comprehensive instructions. - -4. **Documentation (10%):** - - Concise documentation explaining the AI techniques used. - - Clear instructions for users and developers. - -## Note - -Feel free to use any libraries or frameworks you find suitable for image processing and UI development. The goal is to create a functional and well-documented application that meets the specified requirements. - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/FabricStore.md b/docs/markdown/FabricStore.md deleted file mode 100644 index 3f9f8a5a..00000000 --- a/docs/markdown/FabricStore.md +++ /dev/null @@ -1,71 +0,0 @@ -# Internship Assignment: AI-Powered Fabric Sourcing Assistant - -**Objective:** -Build a web application featuring a "Voice-to-Form" interface designed for fabric merchants. The form will allow users to describe fabric details (type, GSM, color, etc.) via audio. The system must transcribe the audio, extract key entities using a Python backend, and dynamically populate the form for final manual review and submission. - -**Requirements:** - -## 1. HTML Structure & UI - -* Create a clean, responsive form with the following 5 fields: - * **Fabric Type** (e.g., Cotton, Silk, Polyester) - * **GSM** (Grams per Square Meter) - * **Color/Pattern** - * **Quantity Required** (in meters/yards) - * **Delivery Timeline** -* Include a prominent **"Speak"** button with a recording indicator. -* The UI must be professional and minimalist (OpenGraph compatibility is required for the final view mode). - -## 2. Voice Recording - -* Implement audio recording functionality (Web Speech API or MediaRecorder API). -* Enforce a **strict 1-minute limit** for recordings. -* Provide visual feedback (e.g., a pulsing icon or timer) while recording is active. - -## 3. Dynamic Form Filling (The AI Core) - -* **Backend**: Use a **Python** backend (FastAPI or Flask managed via **Poetry**). -* **Processing**: Transcribe the audio and use a lightweight LLM or NLP logic to extract the 5 fabric entities. -* **Logic**: Auto-fill the relevant fields. If a specific detail (like GSM) isn't mentioned, that field **must remain empty** for the user to fill manually. - -## 4. Edit & Validation - -* All auto-filled fields must remain **fully editable** by the user. -* Implement client-side validation to ensure numeric fields (GSM/Quantity) receive correct data types before submission. - -## 5. Submit and View - -* Store the submitted data (JSON or SQLite). -* Upon successful submission, redirect to a "Summary View" page that displays the fabric request details in a clear, read-only format. - -## 6. User Experience & Error Handling - -* Handle scenarios where the microphone is blocked or the transcription service fails. -* Ensure the transition from "Audio Processing" to "Form Populated" is seamless and fast. - -## 7. Optional Enhancements (Bonus) - -* **Audio Playback**: Allow the user to replay their recording before hitting submit. -* **Advanced Extraction**: Use Pydantic models for structured data extraction on the backend. -* **Styling**: Use a modern CSS framework (Tailwind or similar) to ensure a high-quality feel. - ---- - -**Submission Guidelines:** - -1. **Codebase**: Push the complete code to your GitHub repository. -2. **Documentation**: - * A `README.md` with clear setup instructions (include `poetry install` steps if using Python). - * A brief technical document explaining your choice of transcription library and how you handled the entity extraction. -3. **Timeline**: **1 Week** from the date of receipt. - -**Evaluation Criteria:** - -* **Accuracy**: How well the AI identifies fabric-specific terms and maps them to fields. -* **Code Quality**: Clean, scalable, and modular code with minimal but effective comments. -* **Production Readiness**: Proper environment management and error handling. -* **UI/UX**: Intuitive design and smooth interaction flow. - ---- - -© 2026 **Recursive Zero Pvt Ltd**, All rights reserved. diff --git a/docs/markdown/HinDictionary.md b/docs/markdown/HinDictionary.md deleted file mode 100644 index 8b3e7347..00000000 --- a/docs/markdown/HinDictionary.md +++ /dev/null @@ -1,60 +0,0 @@ -# Assignment Title: Bilingual Dictionary Web App - -## Task Overview - -Develop a bilingual dictionary web application that allows users to add and search for the meaning of Hindi and English words. Users should be able to add multiple meanings, examples, and pronunciation for each entry. The application should operate locally without internet search, and users can commit their progress to a GitHub repository. - -## Tasks - -### User Interface - -Design a user-friendly interface with input fields for Hindi and English words, along with areas for meanings, examples, and pronunciation. -Create a section for displaying saved entries and a search bar for quick lookups. - -### Add Word Functionality - -Implement a feature that allows users to add new words with their meanings in both Hindi and English. -Include the option to add multiple meanings, example sentences, and pronunciation. - -### Local Search - -Develop a search function to find words within the locally stored dictionary. -Display the search results with meanings, examples, and pronunciation if available. - -### Handle Duplicate - -Ensure that the application prevents the addition of duplicate words. If a word already exists, prompt the user to update the existing entry. - -### GitHub Repository - -Create a GitHub repository for the project. -Commit regularly to showcase coding progress and adherence to coding standards. - -### Optional Features - -Include the option to edit or delete existing entries. -Provide a link for internet search in case a word is not found locally. - -## Submission Guidelines - -Share the GitHub repository link for evaluation. -Include a README file with instructions on how to run the application locally. -Ensure clear comments and documentation in your code. - -### Evaluation Criteria - -- Functionality of adding, searching, and displaying entries. -- Prevention of duplicate entries. -- Inclusion of optional features (editing, deletion, internet search link). -- Code structure, readability, and adherence to coding standards. -- Regular commits to the GitHub repository. - -### Deadline - -Submit your project by 1 week. Regular commits and progress updates are encouraged. - -Best of luck with your bilingual dictionary web application! - -**Note:** This assignment aims to evaluate your skills in web development, design aesthetics, and attention to detail. Good luck! - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/ImageSearch.md b/docs/markdown/ImageSearch.md deleted file mode 100644 index 2ed621a2..00000000 --- a/docs/markdown/ImageSearch.md +++ /dev/null @@ -1,70 +0,0 @@ -# **Internship Assignment: AI/ML-Based Image Search Feature** - -**Position:** Engineering Intern (AI/ML) -**Duration:** 7 Days -**Submission:** GitHub - -## **Objective** - -Develop an **AI/ML-powered image search feature** that allows users to upload an image and retrieve visually similar images from a dataset. The solution should leverage machine learning models for feature extraction and similarity matching. - -### **Key Tasks** - -1. **Dataset Acquisition** - - - Download a suitable image dataset from **Kaggle** (e.g., [Fashion-MNIST](https://www.kaggle.com/datasets/zalando-research/fashionmnist), [CIFAR-10](https://www.kaggle.com/datasets/fedesoriano/cifar10-python-in-csv), or any relevant dataset). - - Preprocess the dataset (resize, normalize, augment if needed). - -2. **Feature Extraction with AI/ML** - - - Use a **pre-trained CNN model** (e.g., ResNet, VGG, or MobileNet) to extract image embeddings. - - Implement a feature vector database (can use **FAISS, Annoy, or Scikit-learn’s Nearest Neighbors** for efficient search). - -3. **Similarity Search Implementation** - - - Build a function that takes an input image and returns the top **N most similar images** from the dataset. - - Use **cosine similarity or Euclidean distance** for matching. - -4. **User Interface (Optional but Recommended)** - - - Develop a simple **Flask/FastAPI** backend to upload images and display results. - - (Bonus) Create a basic **Streamlit/React frontend** for interaction. - -5. **Optimization & Evaluation** - - Measure search accuracy (e.g., Precision@K). - - Optimize for speed (reduce search latency). - -### **Deliverables (Submit via GitHub)** - -✅ **GitHub Repository** with: - -- Well-documented code (README.md with setup instructions). -- Jupyter Notebook / Python script for model training & testing. -- Backend API code (if applicable). -- Sample test images & output examples. - -### **Tech Stack Suggestions** - -- **Languages:** Python -- **Libraries:** TensorFlow/PyTorch, OpenCV, Scikit-learn, FAISS/Annoy -- **Backend (Optional):** Flask/FastAPI -- **Version Control:** Git/GitHub - -### **Evaluation Criteria** - -✔ **Functionality** (Does the search work accurately?) -✔ **Code Quality** (Clean, modular, well-documented) -✔ **Performance** (Speed vs. accuracy trade-offs) -✔ **Innovation** (Any extra features like filters, UI improvements) - ---- - -**Submission Deadline:** A week from Today. - -## Note - -Feel free to use any libraries or frameworks you find suitable for the image processing and recognition and UI development. The goal is to create a functional and well-documented application that meets the specified requirements. - -**Good Luck!** 🚀 Let’s build something awesome! - -© 2025 RecursiveZero, All rights reserved. diff --git a/docs/markdown/IndiaMap.md b/docs/markdown/IndiaMap.md deleted file mode 100644 index 8686fe5d..00000000 --- a/docs/markdown/IndiaMap.md +++ /dev/null @@ -1,124 +0,0 @@ -# Internship Assignment: Interactive Indian Map Web Application - -## Problem Statement - -Create a web-based interactive map of India, where clicking on a specific state or Union Territory (UT) opens a modal containing detailed information about it. Additionally, the border of the selected state should be highlighted, its capital displayed, and an option to copy the state's details should be available. - ---- - -## Assignment Details - -### 1. Interactive Map - -- Display a map of India with all states and Union Territories (UTs) outlined. -- Each state/UT should be clickable. -- Use a minimal and responsive design so that the map adjusts well across various devices (desktop, tablet, mobile). - -### 2. State/UT Modal - -- When a user clicks on a state/UT, a modal should appear with the following information: - - Name of the state/UT. - - Capital city. - - Basic details like area, primary languages, traditional dance forms, and literacy rate. - - Flag image (if any). - - A brief description of the state/UT. -- Include a **"Copy" button** that allows users to copy the displayed information into their clipboard. -- The modal should be visually appealing and closeable (with a "Close" button or clicking outside the modal). - -### 3. State/UT Highlighting - -- Highlight the border of the selected state/UT upon click to make it visually distinct. -- The highlight should disappear when the modal is closed. - -### 4. Capital Display - -- Display the capital city of each state/UT on the map. -- The capital should be indicated with a small dot or marker along with a label. -- Upon state selection, the label for the capital city should become more prominent. - ---- - -## Technical Guidelines - -### 1. Tech Stack - -- Use HTML, CSS, and JavaScript for this project. -- Consider using libraries like SVG for the map or any JS library like Leaflet.js/D3.js for a more interactive experience. -- No frameworks (e.g., React, Angular, Vue) should be used, as this is intended to be a minimal project. - -### 2. Data Source - -- Use a JSON file containing details of each state/UT, including name, capital, population, area, languages, traditional dance, literacy rate, and flag image. -- Data should be sourced from official state/UT websites or their overview pages to ensure authenticity. -- Include all states and Union Territories in India. - -### 3. Design Considerations - -- The map should be easy to navigate and intuitive for users. -- Ensure the modal and map are accessible (e.g., keyboard navigable). -- Use CSS transitions and animations for smooth modal appearance and state/UT highlighting. - -### 4. Performance - -- Ensure the map is responsive and does not lag during interactions. -- Optimize the loading time of the map and data. - -### 5. Code Quality - -- Write clean, modular code using ES6+ standards. -- Use meaningful variable and function names. -- Comment your code where necessary to explain logic. - ---- - -## Deliverables - -1. **Code Submission**: - - Push the entire project code to a GitHub repository. - - Ensure that the repository has regular commits showcasing your development process. - - Create a `README.md` file with: - - Detailed instructions on how to run the project locally. - - Screenshots of the web application. - - A brief explanation of your approach and any key design decisions. - - Any known issues or areas for improvement. - -2. **Data Collection**: - - Ensure that all data used in the project is sourced from official state/UT websites. - - Document the sources in the `README.md` under a "Data Sources" section. - -3. **Short Presentation**: - - Prepare a short presentation (3-5 slides) covering: - - Your approach to solving the problem. - - Key challenges faced and how you overcame them. - - Possible improvements for future iterations. - ---- - -## Bonus (Optional) - -- Make the map visually appealing using gradient colors for different regions. -- Add a search bar to quickly find a state or UT. -- Provide a toggle to switch between different views, like "State Information" and "Geographical Features." - ---- - -## Timeline - -- **Duration**: 1 week. -- **Submission Deadline**: Push the final code to the GitHub repository within a week from the assignment date. - ---- - -## Additional Notes - -- Authentic data collection is critical, so ensure that state information is up-to-date and sourced properly. -- Focus on creating a smooth user experience with intuitive interactions. -- Regular commits to the GitHub repository are highly recommended to track progress. - ---- - -This assignment will assess your ability to handle interactive UI, data management, user experience design, and documentation, all using fundamental web technologies. Happy coding! - ---- - -© 2024 | RecursiveZero Private Limited | All rights reserved. diff --git a/docs/markdown/NumPad.md b/docs/markdown/NumPad.md deleted file mode 100644 index 558069d3..00000000 --- a/docs/markdown/NumPad.md +++ /dev/null @@ -1,58 +0,0 @@ -# Intern Assignment: Interactive Webpage Development - -## Objective - -Create a dynamic and visually appealing webpage for an intern assignment with the following specifications. - -## Requirements - -1. **Input Handling:** - - Allow users to input numbers or alphanumeric characters, no white space allowed. - - Set a customizable maximum input length of 16 characters. - - Restrict duplicate numbers. - -2. **Timeline Display:** - - Showcase entered numbers on a timeline. - - Include posting details such as date, time, and the respective user's name. - -3. **Aesthetics:** - - Choose an appropriate font to enhance the visual appeal. - - Implement dark and light themes using CSS root properties for a polished appearance. - -4. **Responsiveness:** - - Ensure mobile responsiveness for an optimal user experience. - -## Deliverables - -1. **Webpage Design:** - - Develop a visually pleasing interface with a focus on user experience. - -2. **Codebase:** - - Provide well-documented HTML, CSS, and JavaScript code. - -3. **User Guide:** - - Include instructions on how to use the webpage effectively. - -## Evaluation Criteria - -1. **Functionality:** - - Successful implementation of input handling, and timeline display. - -2. **Design Aesthetics:** - - Effective use of fonts and seamless integration of dark and light themes. - -3. **Responsiveness:** - - Webpage should be optimized for both desktop and mobile devices. - -4. **Code Quality:** - - Well-structured and commented code for easy understanding and maintenance. - -## Submission Guidelines - -- Deadline: 1 Week -- Submit the assignment by pushing your code in github repo. -- Include any additional notes or considerations. - -**Note:** This assignment aims to evaluate your skills in web development, design aesthetics, and attention to detail. Good luck! - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/ObjectCount.md b/docs/markdown/ObjectCount.md deleted file mode 100644 index a0d801d8..00000000 --- a/docs/markdown/ObjectCount.md +++ /dev/null @@ -1,131 +0,0 @@ -# Internship Assignment: Image-Based Object Counting using Python - -## Objective - -Assess the candidate’s ability to work with **Python**, **image processing**, and **basic computer vision concepts** by building an application that analyzes an image and returns the **count of distinct objects** arranged in stacks or blocks. - ---- - -## Assignment Overview - -You are given an image containing **multiple stacked objects** (for example, stacks of clothes arranged in rows and columns such as 3×3). -The task is to **analyze the image**, ignore noise, identify similar objects based on **shape, size, or block structure**, and return the **total count of distinct objects**. - -The application should also provide a **simple UI** where a user can upload an image and trigger the object-counting process. - ---- - -## Problem Statement - -- Input image may contain: - - Objects stacked **vertically or horizontally** - - Similar-looking objects (colors may repeat) - - **Noise** around or inside the image -- Example: - - If the image contains **9 stacks of cloths arranged in a 3×3 grid**, the output should be: - - ```text - Total distinct object count: 9 - ``` - -The logic should rely on **image analysis**, not manual hardcoding. - ---- - -## Functional Requirements - -### 1. Image Upload - -- Provide a UI input to **upload an image**. -- Display the **uploaded image thumbnail** on the screen. -- Validate that the uploaded file is a valid image format. - -### 2. Object Detection & Counting - -- Analyze the image to: - - Detect object boundaries or blocks - - Identify similarity using **width, height, contours, or block-based segmentation** -- Ignore: - - Small noisy regions - - Irrelevant artifacts -- Return the **total number of distinct objects** detected. - -### 3. Count Trigger - -- A **“Count Objects”** button that: - - Processes the uploaded image - - Displays the final object count clearly - ---- - -## Technical Constraints - -- Must be implemented using **Python** -- Allowed libraries: - - **OpenCV** - - NumPy - - Any open-source image processing or ML library - - Open-source LLMs (optional, if used for assistance or reasoning) -- The solution should **not rely on manual marking** of objects. - ---- - -## UI Requirements - -- Simple UI (any one is acceptable): - - Streamlit - - Flask + HTML - - Gradio -- UI must include: - - Image upload input - - Uploaded image preview - - Button to start object counting - - Clear display of the result - ---- - -## Suggested Approach (Not Mandatory) - -- Image preprocessing (grayscale, blur, thresholding) -- Noise removal using morphological operations -- Contour detection or block segmentation -- Filtering contours based on size/aspect ratio -- Counting valid detected objects - ---- - -## Submission Instructions - -- Complete the assignment within **one week** -- Upload the project to your **own GitHub repository** -- Include a **README.md** with: - - Problem explanation - - Approach and algorithm used - - Libraries used - - How to run the project - - Sample input and output screenshots - ---- - -## Bonus Points - -- Show bounding boxes around detected objects -- Display intermediate steps (noise removal, segmentation) -- Support both **horizontal and vertical stack layouts** -- Ability to handle different image sizes gracefully - ---- - -## Evaluation Criteria - -- **Correctness**: Accurate object counting -- **Image Processing Logic**: Proper noise handling and segmentation -- **Code Quality**: Readable, modular, and well-commented Python code -- **UI Usability**: Clear and simple user flow -- **Documentation**: Clear README and explanation - ---- - -Good luck! This assignment tests how well you can make machines “see” structure inside visual chaos 📷🧠 - -© 2026 RecursiveZero, All rights reserved. diff --git a/docs/markdown/PNR_PWA.md b/docs/markdown/PNR_PWA.md deleted file mode 100644 index 4224d96b..00000000 --- a/docs/markdown/PNR_PWA.md +++ /dev/null @@ -1,54 +0,0 @@ -**Intern Assignment: PWA Mobile App Development** - -**Project Overview:** -Create a Progressive Web App (PWA) focused on fetching and displaying Indian Railways PNR status. The app should allow users to view their last PNR status even when offline. Additionally, incorporate features such as storing and displaying five important train details, setting alarms for Tatkal booking, and implementing specific timings for AC and sleeper classes. - -**Tasks:** - -1. **PNR Status Retrieval:** - - Implement a functionality to fetch and display the current PNR status from a reliable API source. - - Store the last PNR status locally to enable offline access. - -2. **Train Details:** - - Allow users to save and view details of five important trains, including station codes and timings. - -3. **Offline Mode:** - - Ensure the app can function seamlessly in offline mode, allowing users to access their last PNR status. - -4. **Alarm for Tatkal Booking:** - - Integrate a feature to set alarms for Tatkal booking for specific trains. - - Implement separate alarm timings for AC (10 AM) and sleeper (11 AM) classes. - -5. **User Interface:** - - Design an intuitive and user-friendly interface for seamless navigation. - - Incorporate a clean layout for displaying PNR status, train details, and alarm settings. - -6. **Notification System:** - - Implement push notifications to remind users of upcoming Tatkal booking times. - -7. **Error Handling:** - - Develop a robust error-handling mechanism to address issues related to network connectivity or API failures. - -8. **Testing:** - - Conduct thorough testing to ensure the app's reliability and responsiveness. - - Test the app in various scenarios, including offline usage and alarm triggering. - -9. **Documentation:** - - Prepare detailed documentation outlining the app's architecture, functionalities, and usage instructions. - -10. **Performance Optimization:** - - Optimize the app's performance for faster load times and smoother user experience. - -**Submission:** -Submit the following deliverables: - -- Source code with proper comments and version control. -- Comprehensive documentation. -- Test cases and results. -- A brief presentation highlighting key features and implementation details. - -**Note:** Ensure adherence to coding standards, security best practices, and scalability considerations throughout the development process. Feel free to reach out for clarifications or guidance. Good luck! - -Good luck! - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/QuotePaper.md b/docs/markdown/QuotePaper.md deleted file mode 100644 index 7dbcf08c..00000000 --- a/docs/markdown/QuotePaper.md +++ /dev/null @@ -1,71 +0,0 @@ -# Internship Assignment: Creative Quote Typography Generator - -## Objective - -Assess the candidate’s ability to work with **HTML, CSS, JavaScript, SVG**, and **Canvas API** by developing an interactive typography generator that transforms user-inputted text into beautifully styled designs. - ---- - -## Assignment Overview - -Create a web page where users can **write a short quote** (up to **20 words**) and generate different typography-styled images with various **backgrounds, text colors, and font styles**. Users can then save the generated designs as images and **add them to a feed**. - -## Requirements - -### **User Input** - -- A **single input field** where users can type their **quote** (max 20 words). -- Once the text is **submitted**, the input box should smoothly move to the **top of the page**. - -### **Typography Design Generation** - -- Display **multiple typography variations** using **different fonts, colors, and layouts**. -- Reference **Pinterest-style designs** for inspiration. -- Use **SVG and HTML Canvas** to render the quote beautifully. - -### **Save & Feed Feature** - -- Users should be able to **save** their typography-generated quote as an image. -- The **saved designs** should appear in a **feed-style section** below. -- Allow users to **delete** or **edit** saved quotes. - -### **UI Enhancements & Effects** - -- Apply **smooth scrolling animation** when input is submitted. -- Generate **randomized color schemes** and **typography styles** for each quote. -- Ensure a **visually appealing layout** with proper spacing and alignment. - -## Technology Stack - -- **HTML**: Structure the page with semantic elements. -- **CSS**: Use animations, transitions, and flexible layouts. -- **JavaScript**: Handle input, text rendering, and image generation. -- **SVG & Canvas API**: Convert the text into styled images. - -## Submission Instructions - -- Complete the assignment within **one week**. -- Upload the project to your own **GitHub repository**. -- Share the **GitHub repository link** along with a **README.md** containing: - - Brief description of the project. - - Steps to run the project. - - Any additional features implemented. - -## Bonus Points (Optional Enhancements) - -- Allow users to **choose typography themes** manually. -- Implement **drag-and-drop customization** for text placement. -- Provide **multiple font and color presets**. - ---- - -## Evaluation Criteria - -- **Code Quality**: Clean, structured, and well-documented. -- **Functionality**: Proper input handling, typography generation, and saving feature. -- **Design & UX**: Aesthetic typography and smooth interactions. -- **GitHub Usage**: Proper repo structure, README, and commits. - -Good luck! 🚀 - -© 2025 [RecursiveZero](https://recursivezero.com) private limited | All rights reserved. diff --git a/docs/markdown/SafeDocs.md b/docs/markdown/SafeDocs.md deleted file mode 100644 index 6a26f53e..00000000 --- a/docs/markdown/SafeDocs.md +++ /dev/null @@ -1,49 +0,0 @@ -# Assignment: Offline PWA for Storing Personal Documents - -**Objective:** -Develop an offline PWA allowing users to securely store and manage their essential details such as Aadhaar number, Driving License number, PAN card number, and Passport number. Additionally, users should be able to download these details as a picture for sharing and store them locally on their phones. - -**Requirements:** - -1. **User Interface (UI):** - - Create a clean and user-friendly interface with input fields for Aadhaar number, Driving License number, PAN card number, and Passport number. - - Include a button to save these details locally on the device. - - Implement a feature to view and edit the saved details. - -2. **Download as Picture:** - - Implement a feature to convert the saved details into an image. - - Provide an option to download this image, making it easy for users to share their information when needed. - -3. **Local Storage:** - - Utilize the local storage of the device to save the entered details securely. - - Ensure data persistence even if the user closes the app or restarts their device. - -4. **Offline Functionality:** - - Develop the PWA to function seamlessly without an internet connection. - - Clearly communicate to the user when offline and guide them on how to use the app without connectivity. - -5. **Security:** - - Implement basic encryption techniques to secure the stored data on the device. - - Apply best practices for handling sensitive information. - -**Deliverables:** - -1. Working PWA with the specified features. -2. Codebase hosted on a version control system (e.g., GitHub) with clear commit messages. -3. Brief documentation explaining the structure of the code, dependencies used, and any special considerations for deployment. - -**Evaluation Criteria:** - -1. Functionality: Does the app fulfill the specified requirements? -2. Usability: Is the user interface intuitive and easy to navigate? -3. Offline Capability: Does the app work seamlessly without an internet connection? -4. Security: How well is the user's sensitive information protected? -5. Code Quality: Is the code well-organized, documented, and follows best practices? - -**Submission Guidelines:** -Submit the GitHub repository link and a short demo video showcasing the app's features. - -**Important Note:** -Ensure the developer follows industry best practices and ethical considerations when dealing with sensitive personal information. Regularly update the mentor on progress and seek feedback to enhance the learning experience. - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/Sapariwar.md b/docs/markdown/Sapariwar.md deleted file mode 100644 index 9da8d079..00000000 --- a/docs/markdown/Sapariwar.md +++ /dev/null @@ -1,208 +0,0 @@ -# Internship Assignment: Family Tree Application Development - -## Objective - -As an intern, your task is to develop a Family Tree application that caters to the cultural nuances of family relationships in India. The application should allow users to create, share, and collaborate on their family trees. Additionally, users should have the option to include details such as date of birth, residence, occupation, and business location for each family member. - -## Key Tasks - -### Family Member Management - -- Develop functionality for users to add themselves and their family members. -- Include fields for name, relationship, date of birth, residence, occupation, and business location. -- Consider there is only 1:1 mapping i.e. single husband and wife, no polygamy feature. - -### Relationship Mapping - -- Design a system for users to define relationships between family members. -- Ensure that the application recognizes and accommodates specific Indian familial relationships like Mausi, Mama, and bhua. -- if user click on a person then all relationship name would change keeping selected person in center. - -### Data Sharing - -- Implement a feature that allows users to share their family tree with specific relatives via email or username. - -### Collaborative Editing - -- Enable collaborative editing, allowing shared family members to contribute by adding their known relatives and detailing relationships. - -### Privacy Settings - -- Develop privacy settings to give users control over who can view and edit their family tree. - -### Additional Details - -- Provide an option for users to add more details about each family member, enhancing the depth and richness of the family tree. - -## Submission Guidelines - -- Share the GitHub repository link for evaluation. -- Include a README file with instructions on how to run the application locally. -- Ensure clear comments and documentation in your code. - -## Evaluation Criteria - -- Prevention and handling of error and invalid entries. -- Code structure, readability, and adherence to coding standards. -- Regular commits to the GitHub repository. - -## Notes - -- The internship assignment is expected to be completed within a week . Regular check-ins will be scheduled to monitor progress and provide guidance. -- Successful completion of the assignment may lead to further opportunities for involvement in the project or consideration for a more permanent position within the company. - -### sample json - -```json -{ - "familyTree": { - "id": "001", - "name": "Rajesh Sharma", - "dob": "1970-05-15", - "residence": "Delhi, India", - "occupation": "Businessman", - "businessLocation": "Chandni Chowk, Delhi", - "relations": { - "father": { - "id": "010", - "name": "Ramesh Sharma", - "dob": "1945-12-01", - "residence": "Delhi, India", - "occupation": "Retired", - "relationName": "Father", - "nicknames": ["Papa", "Bauji", "Pitaji"] - }, - "mother": { - "id": "011", - "name": "Kamla Sharma", - "dob": "1948-05-22", - "residence": "Delhi, India", - "occupation": "Retired", - "relationName": "Mother", - "nicknames": ["Maa", "Amma", "Mummy"] - }, - "wife": { - "id": "002", - "name": "Sunita Sharma", - "dob": "1975-08-22", - "residence": "Delhi, India", - "occupation": "Homemaker", - "relationName": "Wife", - "nicknames": ["Patni", "Biwi", "Jeevansathi"] - }, - "children": [ - { - "id": "003", - "name": "Amit Sharma", - "dob": "1995-02-10", - "residence": "Mumbai, India", - "occupation": "Software Engineer", - "relationName": "Son", - "nicknames": ["Beta", "Putra"], - "relations": { - "wife": { - "id": "005", - "name": "Priya Sharma", - "dob": "1997-06-15", - "residence": "Mumbai, India", - "occupation": "Doctor", - "relationName": "Daughter-in-law", - "nicknames": ["Bahu", "Vadhū"] - }, - "children": [ - { - "id": "006", - "name": "Aryan Sharma", - "dob": "2022-01-01", - "residence": "Mumbai, India", - "relationName": "Grandson", - "nicknames": ["Pota", "Nati"] - } - ] - } - }, - { - "id": "004", - "name": "Anjali Sharma", - "dob": "1998-11-25", - "residence": "Bengaluru, India", - "occupation": "Architect", - "relationName": "Daughter", - "nicknames": ["Beti", "Putri"] - } - ], - "siblings": [ - { - "id": "007", - "name": "Pankaj Sharma", - "dob": "1975-03-10", - "residence": "Delhi, India", - "occupation": "Teacher", - "relationName": "Younger Brother", - "nicknames": ["Bhai", "Chhota Bhai"], - "relations": { - "wife": { - "id": "008", - "name": "Kavita Sharma", - "dob": "1978-07-18", - "residence": "Delhi, India", - "occupation": "Lawyer", - "relationName": "Sister-in-law", - "nicknames": ["Bhabhi", "Vadhu"] - }, - "children": [ - { - "id": "009", - "name": "Neha Sharma", - "dob": "2001-09-15", - "residence": "Delhi, India", - "occupation": "Student", - "relationName": "Niece", - "nicknames": ["Bhatiji", "Bhanji"] - } - ] - } - } - ], - "uncle": { - "id": "012", - "name": "Surendra Sharma", - "dob": "1950-01-20", - "residence": "Lucknow, India", - "occupation": "Businessman", - "relationName": "Paternal Uncle", - "nicknames": ["Tauji", "Chacha"] - }, - "aunt": { - "id": "013", - "name": "Rekha Sharma", - "dob": "1955-07-30", - "residence": "Lucknow, India", - "occupation": "Retired Teacher", - "relationName": "Paternal Aunt", - "nicknames": ["Bhua", "Fufi"] - }, - "maternalUncle": { - "id": "014", - "name": "Vikram Verma", - "dob": "1960-04-10", - "residence": "Kolkata, India", - "occupation": "Professor", - "relationName": "Maternal Uncle", - "nicknames": ["Mama"] - }, - "maternalAunt": { - "id": "015", - "name": "Sangeeta Verma", - "dob": "1965-09-15", - "residence": "Kolkata, India", - "occupation": "Homemaker", - "relationName": "Maternal Aunt", - "nicknames": ["Mausi"] - } - } - } -} -``` - -© 2025 [RecursiveZero](https://recursivezero.com) private limited | All rights reserved. diff --git a/docs/markdown/SocialPreview.md b/docs/markdown/SocialPreview.md deleted file mode 100644 index da8b5a4f..00000000 --- a/docs/markdown/SocialPreview.md +++ /dev/null @@ -1,73 +0,0 @@ -# Internship Assignment: Dynamic Product Social-Preview System - -**Objective:** -Develop a production-ready service that dynamically generates branded social media preview images (OpenGraph images) for fabric listings. The system should take raw data (Product Name, Price, and Image) and turn it into a styled `.png` or `.jpg` on the fly. - -**Requirements:** - -## 1. The Generator Engine - -* **Technology Stack**: Use **Node.js** with **Hono.js** or **Express**. -* **Rendering**: Use a library like `satori` (by Vercel) or `playwright/puppeteer` to convert HTML/CSS templates into images. -* **Input**: The service should expose an API endpoint that accepts query parameters: - * `title`: The name of the fabric. - * `price`: The cost per meter. - * `image_url`: A link to the actual fabric thumbnail. - -## 2. Frontend Branding Template - -* Create a sophisticated HTML/CSS layout that includes: - * The **Recursive Zero** logo. - * A high-quality typography layout for the fabric name. - * A visually appealing background (gradient or mesh). - * An overlay or frame for the product image. - -## 3. Smart Caching - -* To ensure scalability and performance, implement a basic caching layer (e.g., using a local folder or an in-memory cache) so that if the same product is requested twice, the image isn't re-rendered from scratch. - -## 4. Interactive Preview Page - -* Build a simple **React** or **Astro** page where a user can: - * Type in product details. - * See a live "Live Preview" of how the social media card will look. - * Click a button to "Copy OG Link." - -## 5. OpenGraph Compatibility - -* Implement the meta tags on the preview page so that when the link is pasted into a [Social Mapper](https://www.opengraph.xyz/), the generated image actually appears. - -## 6. User Experience - -* Ensure the image generation happens in under 2 seconds. -* Handle "broken image" fallback—if a product image URL is invalid, show a branded placeholder instead. - -## 7. Optional Enhancements (Bonus) - -* **Edge Deployment**: Deploy the function as a serverless worker. -* **Watermarking**: Automatically add a "Verified by Recursive Zero" watermark to the bottom corner. -* **Custom Fonts**: Integrate a sophisticated font (like Inter or Playfair Display) for a premium marketplace feel. - ---- - -**Submission Guidelines:** - -1. **Repository**: Push the code to a public GitHub repository. -2. **Documentation**: - * A `README.md` explaining how the image generation engine works. - * Instructions on how to run the project locally (`npm install` & `npm run dev`). -3. **Demo**: A link to the hosted preview page (Vercel, Netlify, or Cloudflare Pages). -4. **Timeline**: **1 Week**. - -**Evaluation Criteria:** - -* **Visual Fidelity**: Does the generated image look like a professional marketing asset? -* **Code Scalability**: Is the backend structured to handle many simultaneous requests? -* **Tooling**: Proper use of modern web standards and TypeScript. -* **Production Readiness**: Does the solution handle edge cases like long text or missing images? - ---- - -© 2026 **Recursive Zero Pvt Ltd**, All rights reserved. - ---- diff --git a/docs/markdown/Societree.md b/docs/markdown/Societree.md deleted file mode 100644 index 51be4abd..00000000 --- a/docs/markdown/Societree.md +++ /dev/null @@ -1,75 +0,0 @@ -# Internship Assignment: Build a Society Tree Visualization Tool - -## Objective - -Design and develop an interactive family tree visualization tool. The tool should represent a caste family tree with 72 nodes, where each node represents a primary family branch. Upon clicking on a node, it should expand to show the surnames associated with that branch, along with their respective deity and gotra information. - -## Requirements - -### 1. Data Structure - -- **Primary Nodes:** There are 72 primary family branches (nodes). -- **Sub-nodes:** Each primary node has between 10 to 20 sub-nodes, representing surnames. -- **Sub-node Details:** Each surname should be associated with specific details including the deity and gotra information. - -### 2. User Interface (UI) - -- **Main View:** - - Display 72 interactive bubbles, each representing a primary family branch. - - Bubbles should be clearly labeled and visually distinct. -- **Interaction:** - - Clicking on a bubble should expand it to reveal the associated surnames. - - The surnames should appear as smaller bubbles or nodes connected to the primary node. - - Each surname bubble should display the deity and gotra information when hovered over or clicked. -- **Design Considerations:** - - Ensure the UI is responsive and visually appealing. - - Maintain a user-friendly experience with smooth animations for transitions and expansions. - - Consider accessibility features like keyboard navigation and screen reader support. - -### 3. Technology Stack - -- **Frontend:** Use HTML, CSS, and JavaScript for building the UI. -- **Libraries:** Consider using a visualization library like D3.js or a framework like React.js to manage the nodes and interactions. -- **Optional:** Implement a basic backend using Node.js to serve data dynamically, or use JSON files to store the family tree data. - -### 4. Deliverables - -- A fully functional web application that meets the requirements outlined above. -- A brief document explaining the data structure, design choices, and any challenges faced during development. -- A video walkthrough or presentation demonstrating the working application. - -### 5. Evaluation Criteria - -- **Functionality:** Does the application work as expected? Are all nodes and interactions implemented correctly? -- **Design and Usability:** Is the interface intuitive, visually appealing, and easy to navigate? -- **Code Quality:** Is the code well-organized, commented, and following best practices? -- **Creativity:** Are there any additional features or enhancements that improve the overall experience? - -## Timeline - -- **Week 1:** Initial design and data structure planning. -- **Week 2-3:** Implementation of the main UI and node interactions. -- **Week 4:** Testing, debugging, and final touches. -- **Week 5:** Submission and presentation. - -## Deadline - -- **Final Submission Date:** 7 Days since first Pull Date - -## Submission Process - -1. **GitHub Repository:** - - Create a private GitHub repository for your project. - - Commit and push your code regularly, documenting significant changes with clear commit messages. - - Ensure the repository contains all project files, including the source code, documentation, and any necessary resources. - -2. **Submission:** - - Invite [Insert Supervisor's GitHub Username] to your private repository as a collaborator. - - Submit a link to your GitHub repository via Email on _RecursiveZero@outlook.com_ by the deadline. - - Prepare for a brief presentation or demo to showcase your work. - -**Good Luck!** - -**Note:** This assignment aims to evaluate your skills in web development, design aesthetics, and attention to detail. Good luck! - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/SunsignMonth.md b/docs/markdown/SunsignMonth.md deleted file mode 100644 index 81faf6f6..00000000 --- a/docs/markdown/SunsignMonth.md +++ /dev/null @@ -1,83 +0,0 @@ -# Internship Assignment: Indian Months and Sun Signs - -## Objective - -Assess the candidate's proficiency in **HTML, CSS, and JavaScript** by developing a web-based project that displays **Indian months** and **Indian sun signs** with an interactive UI, supporting Hindi and English. - ---- - -## Assignment Overview - -Create a **two-page web application**: - -1. **Indian Months Page**: Displays a list of Indian months with their respective images and details in **both Hindi and English**. -2. **Indian Sun Signs Page**: Displays Indian sun signs as per mythology, with **images and descriptions** in Hindi and English. -3. **Dynamic Content Management**: The data should be **stored in a JSON file** and rendered dynamically. - -The UI should be **visually appealing**, inspired by [Species in Pieces](http://species-in-pieces.com/), incorporating smooth animations and an interactive layout. - ---- - -## Requirements - -### 1. Indian Months Page - -- Display a list of **Indian months** with names in **both Hindi and English**. -- Each month should be represented with an **image** and **brief description**. - -### 2. Indian Sun Signs Page - -- Display **12 Indian sun signs** based on **Indian mythology**. -- Each sun sign should include an **image** and **description** in **both Hindi and English**. - -### 3. JSON-based Data Management - -- Store all month and sun sign data in a **JSON file**. -- Use **JavaScript** to fetch and display the data dynamically. -- Include a feature to **add new data** to the JSON file. - -### 4. UI/UX Design - -- The design should be inspired by [Species in Pieces](http://species-in-pieces.com/). -- Use **smooth animations** when switching between pages. -- Implement **a grid-based layout** for easy navigation. - ---- - -## Technology Stack - -- **HTML**: For structuring the pages. -- **CSS**: Use **Grid and Flexbox** for layout and animations. -- **JavaScript**: To load and manipulate JSON data dynamically. - ---- - -## Submission Instructions - -- Complete the assignment within **one week**. -- Upload the project to your own **GitHub repository**. -- Share the **GitHub repository link** along with a **README.md** containing: - - Brief description of the project. - - Steps to run the project. - - Any additional features implemented. - ---- - -## Bonus Points (Optional Enhancements) - -- Implement **a search feature** to filter Indian months and sun signs. -- Add a **light/dark mode toggle**. -- Include **custom animations** when displaying images and text. - ---- - -## Evaluation Criteria - -- **Code Quality**: Well-structured, readable, and commented code. -- **Functionality**: The application should work correctly. -- **Design & UX**: The UI should be engaging and interactive. -- **GitHub Usage**: Proper repository structure, meaningful commits, and a well-documented README. - -Good luck! 🚀 - -© 2025 [RecursiveZero](https://recursivezero.com) private limited | All rights reserved. diff --git a/docs/markdown/TeamMatrix.md b/docs/markdown/TeamMatrix.md deleted file mode 100644 index 83d072bc..00000000 --- a/docs/markdown/TeamMatrix.md +++ /dev/null @@ -1,123 +0,0 @@ -# Internship Assignment: Team Matrix - -## Problem Statement - -In our organization, there are five distinct teams, each working on separate projects. Each team is responsible for specific features, and there is some overlap where certain team members can contribute to multiple features. To streamline communication and ensure uniformity across teams, we want to develop a web application that facilitates the enrollment of teams and the tracking of their progress on features and common practices. - -Teams have unique sets of features, each accompanied by a fixed set of common questions. Additionally, there are overarching common practices shared across the entire organization, such as agile methodologies, code quality, and continuous integration/continuous deployment (CI/CD) pipelines. Each of these practices may have a variable number of questions. - -The questions are standardized and cover various aspects like API integration, workflow, and customer behavior. Each question allows users to provide one of five responses: N/A, 0, 1, 2, or 3. A response of 1 indicates basic knowledge, 2 denotes hands-on experience, and 3 signifies expert-level proficiency. - -To address this, we aim to create a Node.js-based backend application to manage teams, features, and common practices. The backend should support adding, updating, and retrieving information about teams, features, and processes. Additionally, we need a frontend application that allows team members to log in, select their team, and answer questions related to the features and common practices assigned to their team. - -The frontend should dynamically load questions based on the selected team and feature, providing a smooth and intuitive user experience. Users should be able to submit their responses, and the system should store this information for later review. - -The primary objectives of this project are to improve team collaboration, standardize practices across projects, and track the skill levels of team members in different areas. This will contribute to a more efficient and cohesive working environment within the organization. - -## Tasks - -Crete Front end and Back end - -## Back End - -### Setup Node.js Project - -Initialize a Node.js project using npm init. -Install necessary packages such as Express for building the server, and any other dependencies. - -### Create Routes and Controllers - -Set up routes for handling team, feature, and process-related requests. -Create controllers to handle the business logic for each route. - -### Data Models - -Define data models for teams, features, processes, and questions. You can use an ORM like Mongoose for MongoDB or Sequelize for SQL databases. - -### Database Integration - -Connect your application to a database to store team, feature, and process information. - -### API Endpoints - -Create API endpoints for adding teams, features, and processes. -Design endpoints for retrieving questions based on the selected team and feature. - -### Middleware - -Add middleware for handling user sessions and checking user permissions. - -## Frontend - -### Setup Frontend Project - -Set up a frontend project using a framework like React, Angular, or Vue.js. - -### User Authentication - -Implement a login page where users can enter their credentials and select team - -### Feature and Process Pages - -Implement pages for features and processes that dynamically load questions based on the selected team and feature. - -### Questionnaire Component - -Design a reusable component for displaying questions and capturing user responses. -Use radio buttons or a similar UI element for users to select their answers. - -### Submission - -Implement a submission mechanism to send user responses to the backend for storage. - -### Integration - -Connect Backend and Frontend: - -Ensure that the frontend can communicate with the backend through API calls. - -### Testing - -Perform testing to validate that questions are loaded correctly based on team and feature selections. -Verify that user responses are being stored in the database. - -## Additional Considerations - -### Security - -Implement secure coding practices to protect against common web vulnerabilities. -Validate and sanitize user inputs to prevent injection attacks. - -### Scalability - -Design your application to scale by considering potential increases in the number of teams and users. - -### Documentation - -Provide documentation for both the backend API and the frontend application to assist developers and users. -User Interface (UI) and User Experience (UX): - -Design a user-friendly interface to enhance the overall user experience. - -This is a broad overview, and you may need to adjust the details based on your specific requirements and the technologies you choose for your stack. - -## Submission Guidelines - -Share the GitHub repository link for evaluation. -Include a README file with instructions on how to run the application locally. -Ensure clear comments and documentation in your code. - -### Evaluation Criteria - -- Code structure, readability, and adherence to coding standards. -- Regular commits to the GitHub repository. - -### Deadline - -Submit your project by 1 week. Regular commits and progress updates are encouraged. - -Best of luck with your bilingual dictionary web application! - -**Note:** This assignment aims to evaluate your skills in web development, design aesthetics, and attention to detail. Good luck! - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/markdown/ToyShare.md b/docs/markdown/ToyShare.md deleted file mode 100644 index 2c4e8226..00000000 --- a/docs/markdown/ToyShare.md +++ /dev/null @@ -1,106 +0,0 @@ -# Internship Assignment: Toy Sharing App for Housing Society - -## Objective - -Assess the candidate’s ability to design a **mini web application** using **HTML, CSS, and JavaScript** by building a toy-sharing platform for society members. The project should simulate user actions like **login, add toy, request toy, and manage sharing**. - ---- - -## Assignment Overview - -Create a 3-page application where society members can: - -1. **Login / Enter Flat Number** -2. **Upload Toys for Sharing** (with available dates) -3. **Browse & Request Toys**, and see current borrow status. - -All data will be handled **in-browser** using **JavaScript** (local storage or in-memory structures). - ---- - -## Pages & Features - -### 🏠 Page 1: Login / Flat Entry - -- Simple input to **enter flat number** (used as identity). -- Save the flat number in local/session storage. -- Redirect to Toy Dashboard (Page 2). - -### 🎁 Page 2: Upload Toy (Toy Dashboard) - -- Show the **logged-in flat number** at the top. -- Form to **upload toy**: - - Toy name - - Description - - Available from (start date) - - Available till (end date) - - Optional image upload (can be simulated) -- List of **your uploaded toys** with their share status. -- All toy data must be stored in memory or localStorage. - -### 🔍 Page 3: Browse & Request Toys - -- Display **all toys shared by others**. -- **Search functionality** by toy name or keyword. -- Show: - - Toy name, description, flat number (owner), availability dates - - **Request button** (only if not already requested by someone else) -- When requested: - - Toy is **locked** for the requesting flat. - - Status: "Requested by Flat X" -- Add a **Return** option when the toy is returned, to release it. - ---- - -## Technology Stack - -- **HTML**: Page structure -- **CSS**: Basic responsive layout, flex/grid, and styling -- **JavaScript**: - - Simulate login and data persistence with localStorage - - Handle toy uploads, availability, and request status - - Filtering and form validations - ---- - -## Submission Instructions - -- Complete the assignment in **1 week** -- Upload the project to your **GitHub repository** -- Include a **README.md** with: - - Project description - - How to run - - Features implemented - - Any improvements or challenges faced - ---- - -## Bonus Points - -- Add a filter by **date availability** -- Add **toy categories** (e.g., board games, puzzles, etc.) -- Responsive UI for mobile users -- Simple **notification badge** for requested/available toys - ---- - -## Evaluation Criteria - -- **Functionality**: All core flows working (upload, request, return) -- **Code Quality**: Modular, clean JS with comments -- **Design & UX**: User-friendly, responsive layout -- **Creativity**: Any additional enhancements or polish -- **GitHub Usage**: Clear commits, README, and structure - ---- - -**Optional Tip**: You can simulate an image preview using a base64 placeholder or emoji for toy images. - -Good luck and have fun building! 🧸✨ - -**Note:** -Interns are encouraged to be creative and innovative in their approach to designing the portal. The goal is to create a user-friendly and visually appealing platform for accessing brand information efficiently. - ---- - -© 2025 RecursiveZero Private Limited | All rights reserved diff --git a/docs/markdown/URlShortner.md b/docs/markdown/URlShortner.md deleted file mode 100644 index 0cb6806e..00000000 --- a/docs/markdown/URlShortner.md +++ /dev/null @@ -1,117 +0,0 @@ - -# Internship Assignment: Build a Short URL Service - -## Objective - -Design and develop a web-based Short URL service that allows users to create, manage, and analyze shortened links. The service should include both a user-facing front end and a backend admin page to handle URL submissions and track statistics. - -## Requirements - -### 1. Data Structure - -- **Shortened URL Data:** Each record should include a unique short code, the original URL, creation timestamp, visit count, and optional metadata (such as title, notes, or tags). -- **JSON Format:** The service should support importing/exporting collections of URLs via JSON files using the following structure: - - ```json - [ - { - "short_code": "abc123", - "original_url": "https://example.com/page", - "created_at": "2025-11-18T23:59:00Z", - "visit_count": 42, - "meta": { - "title": "Example Page", - "notes": "Optional description or notes", - "tags": ["test", "demo"] - } - }, - // more URL records - ] - ``` - -- **User Data:** Record user actions and allow owner-level visibility on URLs they created. - -### 2. User Interface (UI) - -- **Main View:** - - Simple form to enter an original URL and generate a short code. - - List of recently created short URLs for the current user, each showing visit count and metadata. - - Form for editing metadata or deleting a short URL. -- **Redirection:** - - When a short code is accessed, redirect to the original URL and increment the visit count. -- **Backend Admin Page:** - - Interface for authorized users to upload JSON files containing URL batches. - - Validate and merge uploaded records, preventing collisions and preserving visit history. - - Export URL collections to JSON. -- **Design Considerations:** - - Ensure responsive, clean, and accessible layout. - - Provide clear feedback for errors, duplicate codes, and link expiration. - - Optionally allow statistics/analytics on link accesses. - -### 3. Technology Stack - -- **Frontend:** HTML, CSS, JavaScript; optionally React.js or Vue.js. -- **Backend:** Node.js or preferred backend technology to generate short codes, handle redirects, store records, and manage uploads. -- **Storage:** File system or database (like MongoDB or SQLite) for URL records and visit data. - -### 4. Deliverables - -- Fully functional Short URL app with user and admin features. -- Documentation for data formats, design choices, and development challenges. -- Video walkthrough or presentation demonstrating features. - -### 5. Evaluation Criteria - -- Functionality, UI/UX, code quality, and enhancements/analytics. - -## Sample JSON - -```json -[ - { - "short_code": "go123", - "original_url": "https://github.com/RecursiveZero", - "created_at": "2025-11-18T18:00:00Z", - "visit_count": 108, - "meta": { - "title": "GitHub RecursiveZero", - "notes": "Company profile link", - "tags": ["company", "github"] - } - }, - { - "short_code": "tzip", - "original_url": "https://threadzip.com/privacy", - "created_at": "2025-11-16T10:30:00Z", - "visit_count": 70, - "meta": { - "title": "Threadzip Privacy Policy", - "notes": "", - "tags": ["policy"] - } - } -] -``` - -### Deadline - -Final Submission Date: 7 Days since first Pull Date - -### Submission Process - -#### GitHub Repository - -- Create a public GitHub repository for your project. -- Commit and push your code regularly, documenting significant changes with clear commit messages. -- Ensure the repository contains all project files, including the source code, documentation, and any necessary resources. - -#### Submission - -- Invite `@recursivezero` to your private repository as a collaborator. -- Submit a link to your GitHub repository via Email on _recursivezero@outlook.com_ by the deadline. -- Prepare for a brief presentation or demo to showcase your work. - - -Note: This assignment aims to evaluate your skills in web development, design aesthetics, and attention to detail. Good luck! - -> © 2025 RecursiveZero Private Limited, All rights reserved. diff --git a/docs/markdown/VoiceForm.md b/docs/markdown/VoiceForm.md deleted file mode 100644 index 484b7764..00000000 --- a/docs/markdown/VoiceForm.md +++ /dev/null @@ -1,61 +0,0 @@ -# Assignment: Voice-Activated Form - -**Objective:** -Build a web page featuring a form with 4-5 input fields, a "Speak" button enabling users to record a 1-minute audio clip. The form should dynamically populate based on the audio content, leaving fields empty if not mentioned. Additionally, provide users the ability to edit the automatically filled information before submitting. - -**Requirements:** - -1. **HTML Structure:** - - - Create an HTML form with 4-5 input fields. - - Include a "Speak" button for voice recording. - -2. **Voice Recording:** - - - Implement audio recording functionality using the Web Speech API or any suitable library. - - Set a limit of 1 minute for voice recordings. - -3. **Dynamic Form Filling:** - - - Upon clicking the "Speak" button, transcribe the audio and auto-fill relevant form fields. - - Leave fields empty if information is not mentioned in the audio. - -4. **Edit Functionality:** - - - Enable users to manually edit the filled information in each form field. - -5. **Submit and View:** - - - Implement a submission button to store the form data. - - After submission, display the details in a view mode. - -6. **User Experience:** - - - Ensure a user-friendly interface with clear instructions. - - Implement error handling for recording or transcription issues. - -7. **Optional Enhancements (Bonus):** - - Implement additional validation for form fields. - - Add a feature to replay the recorded audio. - - Provide user feedback during the recording process. - -**Submission:** - -1. Push the complete codebase to the your own GitHub repository and share the link. -2. Include a README.md file with clear instructions on how to set up and run the application. -3. Provide a short document explaining the structure, AI technologies used, and any challenges faced. - -**Evaluation Criteria:** - -- Successful implementation of the voice recording and transcription. -- Accurate and dynamic form filling based on audio content. -- Effective editing functionality. -- Clear and organized code structure. -- User interface design and experience. -- Submission and display of form data. - -**Note:** Feel free to use any front-end libraries or frameworks as needed. The goal is to create a functional and user-friendly voice-activated form with the specified features. - -**Submission date** : 1 Week. code push in your own github repo. - -© 2023 RecursiveZero, All rights reserved. diff --git a/docs/pdf/Assignment_AISearch.pdf b/docs/pdf/Assignment_AISearch.pdf deleted file mode 100644 index 13c90b2e..00000000 Binary files a/docs/pdf/Assignment_AISearch.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_BrandAddress.pdf b/docs/pdf/Assignment_BrandAddress.pdf deleted file mode 100644 index 9146d063..00000000 Binary files a/docs/pdf/Assignment_BrandAddress.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_ColorFinder.pdf b/docs/pdf/Assignment_ColorFinder.pdf deleted file mode 100644 index a3599fed..00000000 Binary files a/docs/pdf/Assignment_ColorFinder.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_ColorNumber.pdf b/docs/pdf/Assignment_ColorNumber.pdf deleted file mode 100644 index 0023071e..00000000 Binary files a/docs/pdf/Assignment_ColorNumber.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_DanceCase.pdf b/docs/pdf/Assignment_DanceCase.pdf deleted file mode 100644 index 7405e0fe..00000000 Binary files a/docs/pdf/Assignment_DanceCase.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_DateTimeCalculator.pdf b/docs/pdf/Assignment_DateTimeCalculator.pdf deleted file mode 100644 index 048df3ea..00000000 Binary files a/docs/pdf/Assignment_DateTimeCalculator.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_Datematics.pdf b/docs/pdf/Assignment_Datematics.pdf deleted file mode 100644 index 0fefb320..00000000 Binary files a/docs/pdf/Assignment_Datematics.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_DynImagic.pdf b/docs/pdf/Assignment_DynImagic.pdf deleted file mode 100644 index 6d4d5e78..00000000 Binary files a/docs/pdf/Assignment_DynImagic.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_FabricForm.pdf b/docs/pdf/Assignment_FabricForm.pdf deleted file mode 100644 index 6c975bc5..00000000 Binary files a/docs/pdf/Assignment_FabricForm.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_FamilyTree.pdf b/docs/pdf/Assignment_FamilyTree.pdf deleted file mode 100644 index 0bea1d05..00000000 Binary files a/docs/pdf/Assignment_FamilyTree.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_HinDictionary.pdf b/docs/pdf/Assignment_HinDictionary.pdf deleted file mode 100644 index b2c418dc..00000000 Binary files a/docs/pdf/Assignment_HinDictionary.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_ImageSearch.pdf b/docs/pdf/Assignment_ImageSearch.pdf deleted file mode 100644 index 0f1f424b..00000000 Binary files a/docs/pdf/Assignment_ImageSearch.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_IndiaMap.pdf b/docs/pdf/Assignment_IndiaMap.pdf deleted file mode 100644 index 516bf0bb..00000000 Binary files a/docs/pdf/Assignment_IndiaMap.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_MCQ.pdf b/docs/pdf/Assignment_MCQ.pdf deleted file mode 100644 index cc79ef8c..00000000 Binary files a/docs/pdf/Assignment_MCQ.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_PNR_PWA.pdf b/docs/pdf/Assignment_PNR_PWA.pdf deleted file mode 100644 index a32cb266..00000000 Binary files a/docs/pdf/Assignment_PNR_PWA.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_QuotePaper.pdf b/docs/pdf/Assignment_QuotePaper.pdf deleted file mode 100644 index 928a0723..00000000 Binary files a/docs/pdf/Assignment_QuotePaper.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_SafeDocs.pdf b/docs/pdf/Assignment_SafeDocs.pdf deleted file mode 100644 index cb3d2d11..00000000 Binary files a/docs/pdf/Assignment_SafeDocs.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_Sapariwar.pdf b/docs/pdf/Assignment_Sapariwar.pdf deleted file mode 100644 index 54e89673..00000000 Binary files a/docs/pdf/Assignment_Sapariwar.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_SocialPreview.pdf b/docs/pdf/Assignment_SocialPreview.pdf deleted file mode 100644 index 8036dc8f..00000000 Binary files a/docs/pdf/Assignment_SocialPreview.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_Socitree.pdf b/docs/pdf/Assignment_Socitree.pdf deleted file mode 100644 index 7faf40bd..00000000 Binary files a/docs/pdf/Assignment_Socitree.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_SunsignMonth.pdf b/docs/pdf/Assignment_SunsignMonth.pdf deleted file mode 100644 index d2e12ebe..00000000 Binary files a/docs/pdf/Assignment_SunsignMonth.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_TeamMatrix.pdf b/docs/pdf/Assignment_TeamMatrix.pdf deleted file mode 100644 index 501d6289..00000000 Binary files a/docs/pdf/Assignment_TeamMatrix.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_ToyShare.pdf b/docs/pdf/Assignment_ToyShare.pdf deleted file mode 100644 index ad0fbea4..00000000 Binary files a/docs/pdf/Assignment_ToyShare.pdf and /dev/null differ diff --git a/docs/pdf/Assignment_VoiceForm.pdf b/docs/pdf/Assignment_VoiceForm.pdf deleted file mode 100644 index 7d3dc20a..00000000 Binary files a/docs/pdf/Assignment_VoiceForm.pdf and /dev/null differ diff --git a/docs/pdf/URLShortner_App.pdf b/docs/pdf/URLShortner_App.pdf deleted file mode 100644 index 656798a3..00000000 Binary files a/docs/pdf/URLShortner_App.pdf and /dev/null differ diff --git a/index.html b/index.html new file mode 100644 index 00000000..f6d70b9d --- /dev/null +++ b/index.html @@ -0,0 +1,361 @@ + + + + + + QuotePaper — Quotes into Wallpapers + + + + + + + + + + + + + + +
+ + + + + +
+ + + + +
+ + + Live Preview + + Changes apply instantly +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + +
+ +
+
"The only way to do great work is to love what you do."
+
— Steve Jobs
+
+ +
QuotePaper
+
+
+ + +
+ + + High-res export + + + + 8 themes + + + + Instant preview + + + + 4 sizes + +
+ +
+
+ + + + + diff --git a/src/app.js b/src/app.js new file mode 100644 index 00000000..6489f295 --- /dev/null +++ b/src/app.js @@ -0,0 +1,121 @@ +(function () { + "use strict"; + + const quoteInput = document.getElementById("quoteInput"); + const authorInput = document.getElementById("authorInput"); + const canvasEl = document.getElementById("wallpaperCanvas"); + const canvasQuote = document.getElementById("canvasQuote"); + const canvasAuthor = document.getElementById("canvasAuthor"); + const downloadBtn = document.getElementById("downloadBtn"); + const randomBtn = document.getElementById("randomQuoteBtn"); + + const state = { + bg: "gradient-dusk", + layout: "centered", + font: "playfair", + size: "16x9", + decor: "line", + }; + + const SIZES = { + "16x9": { w: 1920, h: 1080 }, + "9x16": { w: 1080, h: 1920 }, + "1x1": { w: 1080, h: 1080 }, + "4x3": { w: 1440, h: 1080 }, + }; + + function applyClasses() { + canvasEl.className = [ + "wallpaper-canvas", + state.bg, + "layout-" + state.layout, + "font-" + state.font, + state.size !== "16x9" ? "size-" + state.size : "", + "decor-" + state.decor, + ].filter(Boolean).join(" "); + } + + function updatePreview() { + canvasQuote.textContent = quoteInput.value.trim() || "Enter a quote…"; + canvasAuthor.textContent = authorInput.value.trim() || ""; + } + + function bindGroup(containerId, stateKey) { + const container = document.getElementById(containerId); + if (!container) return; + + container.querySelectorAll("[data-" + stateKey + "]").forEach(btn => { + btn.addEventListener("click", () => { + container.querySelectorAll(".active").forEach(b => b.classList.remove("active")); + btn.classList.add("active"); + state[stateKey] = btn.dataset[stateKey]; + applyClasses(); + }); + }); + } + + function download() { + const { w } = SIZES[state.size] || SIZES["16x9"]; + const scale = w / canvasEl.offsetWidth; + + downloadBtn.textContent = "Preparing…"; + downloadBtn.disabled = true; + + html2canvas(canvasEl, { + scale, + useCORS: true, + allowTaint: true, + logging: false, + width: canvasEl.offsetWidth, + height: canvasEl.offsetHeight, + }) + .then(canvas => { + const link = document.createElement("a"); + const slug = quoteInput.value.trim().slice(0, 30).replace(/\s+/g, "-").toLowerCase(); + link.download = "quotepaper-" + (slug || "wallpaper") + ".png"; + link.href = canvas.toDataURL("image/png"); + link.click(); + }) + .catch(() => alert("Download failed. Please try again.")) + .finally(() => { + downloadBtn.innerHTML = ' Download'; + downloadBtn.disabled = false; + }); + } + + function loadRandom() { + const q = getRandomQuote(quoteInput.value.trim()); + quoteInput.value = q.text; + authorInput.value = "— " + q.author; + updatePreview(); + } + + function init() { + applyClasses(); + + quoteInput.addEventListener("input", updatePreview); + authorInput.addEventListener("input", updatePreview); + + bindGroup("bgOptions", "bg"); + bindGroup("layoutOptions", "layout"); + bindGroup("fontOptions", "font"); + bindGroup("sizeOptions", "size"); + bindGroup("decorOptions", "decor"); + + downloadBtn.addEventListener("click", download); + randomBtn.addEventListener("click", loadRandom); + + document.addEventListener("keydown", e => { + if ((e.ctrlKey || e.metaKey) && e.key === "d") { + e.preventDefault(); + download(); + } + }); + } + + if (document.readyState === "loading") { + document.addEventListener("DOMContentLoaded", init); + } else { + init(); + } +})(); diff --git a/src/quotes.js b/src/quotes.js new file mode 100644 index 00000000..34c2d6bc --- /dev/null +++ b/src/quotes.js @@ -0,0 +1,39 @@ +const QUOTES = [ + { text: "The only way to do great work is to love what you do.", author: "Steve Jobs" }, + { text: "If you are not embarrassed by the first version of your product, you've launched too late.", author: "Reid Hoffman" }, + { text: "Simplicity is the ultimate sophistication.", author: "Leonardo da Vinci" }, + { text: "A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away.", author: "Antoine de Saint-Exupéry" }, + { text: "It's not about ideas. It's about making ideas happen.", author: "Scott Belsky" }, + { text: "You miss 100% of the shots you don't take.", author: "Wayne Gretzky" }, + { text: "Whether you think you can or you think you can't, you're right.", author: "Henry Ford" }, + { text: "The secret of getting ahead is getting started.", author: "Mark Twain" }, + { text: "Do one thing every day that scares you.", author: "Eleanor Roosevelt" }, + { text: "Life begins at the end of your comfort zone.", author: "Neale Donald Walsch" }, + { text: "In the middle of every difficulty lies opportunity.", author: "Albert Einstein" }, + { text: "It does not matter how slowly you go as long as you do not stop.", author: "Confucius" }, + { text: "The journey of a thousand miles begins with one step.", author: "Lao Tzu" }, + { text: "Be yourself; everyone else is already taken.", author: "Oscar Wilde" }, + { text: "Two roads diverged in a wood, and I — I took the one less travelled by.", author: "Robert Frost" }, + { text: "Creativity is intelligence having fun.", author: "Albert Einstein" }, + { text: "You can't use up creativity. The more you use, the more you have.", author: "Maya Angelou" }, + { text: "Every artist was first an amateur.", author: "Ralph Waldo Emerson" }, + { text: "The creative adult is the child who has survived.", author: "Ursula K. Le Guin" }, + { text: "An idea that is not dangerous is unworthy of being called an idea at all.", author: "Oscar Wilde" }, + { text: "Life is what happens to you while you're busy making other plans.", author: "John Lennon" }, + { text: "The purpose of our lives is to be happy.", author: "Dalai Lama" }, + { text: "Get busy living or get busy dying.", author: "Stephen King" }, + { text: "You only live once, but if you do it right, once is enough.", author: "Mae West" }, + { text: "To live is the rarest thing in the world. Most people just exist.", author: "Oscar Wilde" }, + { text: "It always seems impossible until it's done.", author: "Nelson Mandela" }, + { text: "Success is not final, failure is not fatal: it is the courage to continue that counts.", author: "Winston Churchill" }, + { text: "Fall seven times, stand up eight.", author: "Japanese Proverb" }, + { text: "Hard times never last, but hard people do.", author: "Robert H. Schuller" }, + { text: "The harder the conflict, the greater the triumph.", author: "George Washington" }, +]; + +function getRandomQuote(excludeText) { + const pool = excludeText + ? QUOTES.filter(q => q.text !== excludeText) + : QUOTES; + return pool[Math.floor(Math.random() * pool.length)]; +} diff --git a/src/style.css b/src/style.css new file mode 100644 index 00000000..164e520e --- /dev/null +++ b/src/style.css @@ -0,0 +1,840 @@ +:root { + --bg: #0b0b0b; + --surface: #111111; + --surface-2: #181818; + --surface-3: #202020; + --border: #242424; + --border-subtle: #1a1a1a; + --text: #e8e4dc; + --text-muted: #6b6560; + --text-dim: #3d3a36; + --accent: #c9a96e; + --accent-light: #e8c98a; + --accent-dim: rgba(201,169,110,0.12); + --radius: 10px; + --radius-sm: 6px; + --font-mono: 'DM Mono', monospace; + --shadow-card: 0 1px 3px rgba(0,0,0,0.4), 0 4px 16px rgba(0,0,0,0.3); + --shadow-canvas: 0 40px 100px rgba(0,0,0,0.8), 0 0 0 1px rgba(255,255,255,0.05); + --transition: 0.18s cubic-bezier(0.4,0,0.2,1); +} + +*, *::before, *::after { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +html { font-size: 14px; scroll-behavior: smooth; } + +body { + background: var(--bg); + color: var(--text); + font-family: var(--font-mono); + min-height: 100vh; + display: flex; + flex-direction: column; + overflow-x: hidden; + position: relative; +} + +/* ---- Ambient background ---- */ +.ambient-layer { + position: fixed; + inset: 0; + pointer-events: none; + z-index: 0; + overflow: hidden; +} + +.ambient-svg { + width: 100%; + height: 100%; + position: absolute; + inset: 0; +} + +.orb { + animation: floatOrb 18s ease-in-out infinite; + transform-origin: center; +} +.orb-1 { animation-duration: 20s; } +.orb-2 { animation-duration: 25s; animation-delay: -8s; } +.orb-3 { animation-duration: 16s; animation-delay: -4s; } + +@keyframes floatOrb { + 0%, 100% { transform: translate(0, 0) scale(1); } + 33% { transform: translate(20px, -15px) scale(1.05); } + 66% { transform: translate(-10px, 10px) scale(0.97); } +} + +/* ---- Header ---- */ +.site-header { + position: relative; + z-index: 10; + display: flex; + align-items: center; + justify-content: space-between; + padding: 18px 28px; + border-bottom: 1px solid var(--border); + background: rgba(11,11,11,0.85); + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px); + animation: slideDown 0.5s ease both; +} + +@keyframes slideDown { + from { opacity: 0; transform: translateY(-12px); } + to { opacity: 1; transform: translateY(0); } +} + +.header-left { + display: flex; + align-items: center; + gap: 12px; +} + +.logo-icon { + width: 34px; + height: 34px; + flex-shrink: 0; + animation: rotateSlow 30s linear infinite; +} + +@keyframes rotateSlow { + from { transform: rotate(0deg); } + to { transform: rotate(360deg); } +} + +.logo-text { + display: flex; + flex-direction: column; + gap: 1px; +} + +.logo { + font-family: 'Playfair Display', serif; + font-size: 1.35rem; + letter-spacing: -0.02em; + color: var(--accent); + line-height: 1; +} + +.tagline { + font-size: 0.62rem; + color: var(--text-muted); + letter-spacing: 0.1em; + text-transform: uppercase; +} + +.header-badges { + display: flex; + gap: 8px; +} + +.badge { + display: flex; + align-items: center; + gap: 5px; + padding: 5px 10px; + background: var(--surface-2); + border: 1px solid var(--border); + border-radius: 100px; + font-size: 0.6rem; + letter-spacing: 0.06em; + color: var(--text-muted); + text-transform: uppercase; +} + +.badge svg { + width: 9px; + height: 9px; + color: var(--accent); +} + +/* ---- App layout ---- */ +.app-layout { + position: relative; + z-index: 1; + display: grid; + grid-template-columns: 290px 1fr; + flex: 1; + min-height: 0; +} + +/* ---- Controls panel ---- */ +.controls-panel { + background: var(--surface); + border-right: 1px solid var(--border); + padding: 20px 16px 24px; + display: flex; + flex-direction: column; + gap: 18px; + overflow-y: auto; + height: calc(100vh - 61px); + scrollbar-width: thin; + scrollbar-color: var(--border) transparent; + animation: slideRight 0.4s 0.1s ease both; +} + +@keyframes slideRight { + from { opacity: 0; transform: translateX(-16px); } + to { opacity: 1; transform: translateX(0); } +} + +.control-group { + display: flex; + flex-direction: column; + gap: 8px; +} + +.label { + display: flex; + align-items: center; + gap: 6px; + font-size: 0.6rem; + letter-spacing: 0.14em; + text-transform: uppercase; + color: var(--text-muted); + padding-bottom: 6px; + border-bottom: 1px solid var(--border-subtle); +} + +.label svg { + width: 11px; + height: 11px; + flex-shrink: 0; + opacity: 0.6; +} + +.input-text, +.input-field { + background: var(--surface-2); + border: 1px solid var(--border); + border-radius: var(--radius-sm); + color: var(--text); + font-family: var(--font-mono); + font-size: 0.82rem; + padding: 10px 12px; + width: 100%; + resize: vertical; + line-height: 1.55; + transition: border-color var(--transition), box-shadow var(--transition), background var(--transition); +} + +.input-text:focus, +.input-field:focus { + outline: none; + border-color: var(--accent); + background: var(--surface-3); + box-shadow: 0 0 0 3px rgba(201,169,110,0.08); +} + +.input-text::placeholder, +.input-field::placeholder { + color: var(--text-dim); +} + +/* ---- Background grid ---- */ +.bg-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 6px; +} + +.bg-btn { + background: var(--surface-2); + border: 2px solid transparent; + border-radius: var(--radius-sm); + cursor: pointer; + padding: 3px 3px 4px; + display: flex; + flex-direction: column; + align-items: center; + gap: 3px; + transition: border-color var(--transition), transform var(--transition); +} + +.bg-btn:hover { transform: translateY(-1px); border-color: rgba(201,169,110,0.4); } +.bg-btn.active { border-color: var(--accent); box-shadow: 0 0 0 1px rgba(201,169,110,0.2); } + +.swatch { + display: block; + width: 100%; + height: 32px; + border-radius: 4px; +} + +.swatch-name { + font-size: 0.52rem; + letter-spacing: 0.05em; + color: var(--text-muted); + text-transform: uppercase; +} + +/* ---- Layout buttons ---- */ +.layout-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 6px; +} + +.layout-btn { + background: var(--surface-2); + border: 1px solid var(--border); + border-radius: var(--radius-sm); + cursor: pointer; + padding: 8px 4px 6px; + display: flex; + flex-direction: column; + align-items: center; + gap: 5px; + color: var(--text-muted); + font-family: var(--font-mono); + font-size: 0.56rem; + letter-spacing: 0.06em; + text-transform: uppercase; + transition: all var(--transition); +} + +.layout-btn svg { + width: 100%; + height: 24px; +} + +.layout-btn.active { + background: var(--accent-dim); + border-color: var(--accent); + color: var(--accent); +} + +.layout-btn:hover:not(.active) { + border-color: var(--text-dim); + color: var(--text); +} + +/* ---- Font grid ---- */ +.font-grid { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 6px; +} + +.font-btn { + background: var(--surface-2); + border: 1px solid var(--border); + border-radius: var(--radius-sm); + cursor: pointer; + padding: 10px 6px 8px; + display: flex; + flex-direction: column; + align-items: center; + gap: 4px; + transition: all var(--transition); +} + +.font-preview { + font-size: 1.5rem; + color: var(--text); + line-height: 1; +} + +.font-name { + font-family: var(--font-mono); + font-size: 0.55rem; + letter-spacing: 0.06em; + color: var(--text-muted); + text-transform: uppercase; +} + +.font-btn.active { + border-color: var(--accent); + background: var(--accent-dim); +} + +.font-btn:hover:not(.active) { border-color: var(--text-dim); } + +/* ---- Size grid ---- */ +.size-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 6px; +} + +.size-btn { + background: var(--surface-2); + border: 1px solid var(--border); + border-radius: var(--radius-sm); + cursor: pointer; + padding: 8px 4px 6px; + display: flex; + flex-direction: column; + align-items: center; + gap: 5px; + color: var(--text-muted); + font-family: var(--font-mono); + font-size: 0.56rem; + letter-spacing: 0.06em; + text-transform: uppercase; + transition: all var(--transition); +} + +.size-btn svg { + width: auto; + height: 22px; + max-width: 100%; +} + +.size-btn.active { + border-color: var(--accent); + color: var(--accent); + background: var(--accent-dim); +} + +.size-btn:hover:not(.active) { border-color: var(--text-dim); color: var(--text); } + +/* ---- Decoration grid ---- */ +.decor-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 6px; +} + +.decor-btn { + background: var(--surface-2); + border: 1px solid var(--border); + border-radius: var(--radius-sm); + cursor: pointer; + padding: 8px 4px 6px; + display: flex; + flex-direction: column; + align-items: center; + gap: 5px; + color: var(--text-muted); + font-family: var(--font-mono); + font-size: 0.56rem; + letter-spacing: 0.06em; + text-transform: uppercase; + transition: all var(--transition); +} + +.decor-btn svg { + width: 100%; + height: 20px; +} + +.decor-btn.active { + border-color: var(--accent); + color: var(--accent); + background: var(--accent-dim); +} + +.decor-btn:hover:not(.active) { border-color: var(--text-dim); color: var(--text); } + +/* ---- Action buttons ---- */ +.action-row { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 8px; + padding-top: 2px; +} + +.btn-primary, +.btn-secondary { + border-radius: var(--radius-sm); + cursor: pointer; + font-family: var(--font-mono); + font-size: 0.68rem; + letter-spacing: 0.08em; + padding: 11px 8px; + transition: all 0.22s cubic-bezier(0.34, 1.56, 0.64, 1); + border: 1px solid; + text-transform: uppercase; + display: flex; + align-items: center; + justify-content: center; + gap: 6px; +} + +.btn-primary svg, +.btn-secondary svg { + width: 13px; + height: 13px; + flex-shrink: 0; +} + +.btn-primary { + background: var(--accent); + border-color: var(--accent); + color: #0b0b0b; + font-weight: 500; +} + +.btn-primary:hover { + background: var(--accent-light); + border-color: var(--accent-light); + transform: translateY(-2px); + box-shadow: 0 8px 24px rgba(201,169,110,0.3); +} + +.btn-primary:active { transform: translateY(0); } + +.btn-secondary { + background: transparent; + border-color: var(--border); + color: var(--text-muted); +} + +.btn-secondary:hover { + border-color: var(--text-muted); + color: var(--text); + transform: translateY(-1px); +} + +/* ---- Preview area ---- */ +.preview-wrapper { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 16px; + padding: 28px 32px; + background: #080808; + position: relative; + overflow: hidden; + animation: fadeIn 0.5s 0.2s ease both; +} + +@keyframes fadeIn { + from { opacity: 0; } + to { opacity: 1; } +} + +.preview-deco-art { + position: absolute; + top: -40px; + right: -40px; + width: 200px; + height: 200px; + opacity: 0.6; + animation: rotateSlow 60s linear infinite reverse; + pointer-events: none; +} + +.preview-header { + display: flex; + align-items: center; + justify-content: space-between; + width: 100%; + max-width: 720px; +} + +.preview-label { + display: flex; + align-items: center; + gap: 6px; + font-size: 0.6rem; + letter-spacing: 0.14em; + text-transform: uppercase; + color: var(--text-muted); +} + +.preview-label svg { + width: 8px; + height: 8px; + color: #3ecf7a; + animation: pulse 2s ease infinite; +} + +@keyframes pulse { + 0%, 100% { opacity: 1; } + 50% { opacity: 0.4; } +} + +.preview-hint { + font-size: 0.58rem; + letter-spacing: 0.06em; + color: var(--text-dim); + text-transform: uppercase; +} + +.canvas-outer { + width: 100%; + max-width: 720px; +} + +/* ---- Wallpaper canvas ---- */ +.wallpaper-canvas { + width: 100%; + aspect-ratio: 16 / 9; + border-radius: 12px; + position: relative; + overflow: hidden; + display: flex; + box-shadow: var(--shadow-canvas); + transition: aspect-ratio 0.4s ease, box-shadow 0.3s ease; +} + +/* Texture overlay */ +.canvas-texture { + position: absolute; + inset: 0; + z-index: 1; + opacity: 0.04; + background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E"); + background-size: 256px 256px; + pointer-events: none; +} + +/* Corner ornaments */ +.corner-ornament { + position: absolute; + width: 48px; + height: 48px; + z-index: 3; + pointer-events: none; + transition: color 0.3s; +} + +.corner-ornament.top-left { top: 8px; left: 8px; } +.corner-ornament.top-right { top: 8px; right: 8px; } +.corner-ornament.bottom-left { bottom: 8px; left: 8px; } +.corner-ornament.bottom-right{ bottom: 8px; right: 8px; } + +/* Light backgrounds get dark corners */ +.wallpaper-canvas.gradient-paper .corner-ornament, +.wallpaper-canvas.gradient-ivory .corner-ornament { + color: #1a1a1a; +} + +.wallpaper-canvas.gradient-dusk .corner-ornament, +.wallpaper-canvas.gradient-forest .corner-ornament, +.wallpaper-canvas.gradient-rose .corner-ornament, +.wallpaper-canvas.gradient-slate .corner-ornament, +.wallpaper-canvas.gradient-ocean .corner-ornament, +.wallpaper-canvas.gradient-amber .corner-ornament { + color: #ffffff; +} + +/* Background themes */ +.wallpaper-canvas.gradient-dusk { + background: linear-gradient(135deg, #1a1a2e 0%, #16213e 30%, #0f3460 65%, #e94560 100%); +} +.wallpaper-canvas.gradient-paper { + background: linear-gradient(135deg, #f5f0e8 0%, #e8dcc8 50%, #d4c5a9 100%); +} +.wallpaper-canvas.gradient-forest { + background: linear-gradient(135deg, #0d1b2a 0%, #1b4332 35%, #2d6a4f 70%, #40916c 100%); +} +.wallpaper-canvas.gradient-rose { + background: linear-gradient(135deg, #2d0a1e 0%, #5c1a3a 35%, #c2185b 70%, #f48fb1 100%); +} +.wallpaper-canvas.gradient-slate { + background: linear-gradient(135deg, #1c1c1c 0%, #2d2d2d 40%, #4a4a4a 75%, #6b6b6b 100%); +} +.wallpaper-canvas.gradient-ocean { + background: linear-gradient(135deg, #0c0c3e 0%, #023e8a 35%, #0077b6 65%, #90e0ef 100%); +} +.wallpaper-canvas.gradient-amber { + background: linear-gradient(135deg, #1a0a00 0%, #7d3c00 35%, #e65c00 70%, #f9a825 100%); +} +.wallpaper-canvas.gradient-ivory { + background: linear-gradient(135deg, #fefae0 0%, #fdf4c1 35%, #faedcd 65%, #e9c46a 100%); +} + +/* Layout positions */ +.canvas-content { + position: absolute; + max-width: 78%; + display: flex; + flex-direction: column; + gap: 10px; + z-index: 2; + padding: 20px; + transition: all 0.3s ease; +} + +.wallpaper-canvas.layout-centered .canvas-content { + top: 50%; left: 50%; + transform: translate(-50%, -50%); + text-align: center; + align-items: center; +} + +.wallpaper-canvas.layout-left-aligned .canvas-content { + top: 50%; left: 8%; + transform: translateY(-50%); + text-align: left; + align-items: flex-start; +} + +.wallpaper-canvas.layout-bottom-left .canvas-content { + bottom: 12%; left: 8%; + text-align: left; + align-items: flex-start; +} + +.wallpaper-canvas.layout-top-right .canvas-content { + top: 10%; right: 8%; + text-align: right; + align-items: flex-end; +} + +/* Quote text */ +.canvas-quote { + font-size: clamp(0.85rem, 2vw, 1.45rem); + line-height: 1.55; + font-weight: 400; +} + +.canvas-author { + font-size: clamp(0.5rem, 1.1vw, 0.8rem); + letter-spacing: 0.12em; + opacity: 0.7; +} + +/* Font themes */ +.wallpaper-canvas.font-playfair .canvas-quote { font-family: 'Playfair Display', serif; font-style: italic; } +.wallpaper-canvas.font-playfair .canvas-author { font-family: 'Playfair Display', serif; } + +.wallpaper-canvas.font-cormorant .canvas-quote { + font-family: 'Cormorant Garamond', serif; + font-size: clamp(1rem, 2.4vw, 1.75rem); + font-style: italic; + font-weight: 300; +} +.wallpaper-canvas.font-cormorant .canvas-author { font-family: 'Cormorant Garamond', serif; font-weight: 300; } + +.wallpaper-canvas.font-mono .canvas-quote { + font-family: 'DM Mono', monospace; + font-size: clamp(0.65rem, 1.3vw, 1rem); + font-weight: 300; +} +.wallpaper-canvas.font-mono .canvas-author { font-family: 'DM Mono', monospace; font-weight: 300; } + +/* Text colors by theme */ +.wallpaper-canvas.gradient-paper .canvas-quote, +.wallpaper-canvas.gradient-paper .canvas-author, +.wallpaper-canvas.gradient-ivory .canvas-quote, +.wallpaper-canvas.gradient-ivory .canvas-author { color: #1a1a1a; } + +.wallpaper-canvas.gradient-dusk .canvas-quote, +.wallpaper-canvas.gradient-dusk .canvas-author, +.wallpaper-canvas.gradient-forest .canvas-quote, +.wallpaper-canvas.gradient-forest .canvas-author, +.wallpaper-canvas.gradient-rose .canvas-quote, +.wallpaper-canvas.gradient-rose .canvas-author, +.wallpaper-canvas.gradient-slate .canvas-quote, +.wallpaper-canvas.gradient-slate .canvas-author, +.wallpaper-canvas.gradient-ocean .canvas-quote, +.wallpaper-canvas.gradient-ocean .canvas-author, +.wallpaper-canvas.gradient-amber .canvas-quote, +.wallpaper-canvas.gradient-amber .canvas-author { color: #f0ece4; } + +/* Decorations */ +.canvas-decor { + position: absolute; + inset: 0; + z-index: 1; + pointer-events: none; +} + +.wallpaper-canvas.decor-line .canvas-author::before { + content: ''; + display: block; + width: 36px; + height: 1px; + background: currentColor; + opacity: 0.45; + margin-bottom: 8px; +} + +.wallpaper-canvas.decor-quotes .canvas-quote::before { + content: '\201C'; + font-size: 4em; + line-height: 0; + vertical-align: -0.5em; + opacity: 0.18; + margin-right: 2px; +} + +.wallpaper-canvas.decor-frame::after { + content: ''; + position: absolute; + inset: 14px; + border: 1px solid rgba(255,255,255,0.14); + border-radius: 4px; + pointer-events: none; + z-index: 3; +} + +.wallpaper-canvas.gradient-paper.decor-frame::after, +.wallpaper-canvas.gradient-ivory.decor-frame::after { + border-color: rgba(0,0,0,0.1); +} + +/* Watermark */ +.canvas-watermark { + position: absolute; + bottom: 10px; + right: 14px; + font-family: 'DM Mono', monospace; + font-size: 0.5rem; + letter-spacing: 0.18em; + text-transform: uppercase; + opacity: 0.2; + z-index: 4; +} + +/* Size variants */ +.wallpaper-canvas.size-9x16 { aspect-ratio: 9 / 16; max-height: 520px; width: auto; } +.wallpaper-canvas.size-1x1 { aspect-ratio: 1 / 1; } +.wallpaper-canvas.size-4x3 { aspect-ratio: 4 / 3; } + +/* ---- Feature pills ---- */ +.feature-pills { + display: flex; + gap: 8px; + flex-wrap: wrap; + justify-content: center; + max-width: 720px; + width: 100%; +} + +.pill { + display: flex; + align-items: center; + gap: 5px; + padding: 5px 12px; + background: var(--surface); + border: 1px solid var(--border); + border-radius: 100px; + font-size: 0.6rem; + letter-spacing: 0.07em; + color: var(--text-muted); + text-transform: uppercase; +} + +.pill svg { + width: 10px; + height: 10px; + flex-shrink: 0; + color: var(--accent); +} + +/* ---- Responsive ---- */ +@media (max-width: 900px) { + .app-layout { grid-template-columns: 260px 1fr; } +} + +@media (max-width: 700px) { + .app-layout { grid-template-columns: 1fr; } + .controls-panel { + height: auto; + border-right: none; + border-bottom: 1px solid var(--border); + } + .preview-wrapper { padding: 20px 16px; } + .header-badges { display: none; } + .preview-deco-art { display: none; } +}