arakoodev/doc

Arakoo.ai - built on top of Docusaurus (reactjs)

doc's Issues

Anchor tag underline visible on hover in the buttons on home page

Describe the bug

Here the underline of the anchor tag is visible on hover state and I'm assuming it is not the part of the expected design.

Expected behaviour

I can change the hover state of the buttons to look like this . @sandys please assign this issue to me

Screenshots

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Add animation and stylise the homepage.

Is your feature request related to a problem? Please describe.

Homepage appears quite simple.

Describe the solution you'd like

Adding styles and animation to the homepage would make it more attractive.

Describe alternatives you've considered

Dividing elements like :
EdgeChains : LLM chains on-the-edge
community
guideline

into sections and adding css styling to it.

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Adding badges is the readme.md file

Is your feature request related to a problem? Please describe.

These badges help in increasing the readability of the readme file because they provide some KPIs or metrics about the repositories. As a result, readers get a clear idea of the repository very quickly by scanning the attached badges.

Describe the solution you'd like

Describe alternatives you've considered

No response
@sandys

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

theme (light and dark) toggling is not present

Is your feature request related to a problem? Please describe.

Light and Dark Theme Toggling" feature in a webpage offers improved user experience, accessibility, reduced eye fatigue, energy efficiency, aesthetic appeal, personalization, and compatibility with other apps. By providing this feature, web developers can cater to various user preferences and create a more inclusive and engaging browsing experience.

Describe the solution you'd like

I want to add theme toggle in navbar section

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

adding smooth transition effect on the buttons

Is your feature request related to a problem? Please describe.

when we hover the button changes its color abruptly

Describe the solution you'd like

will add a smooth transition effect

Describe alternatives you've considered

No response

Additional context

pls assign me under GSSOC'23
@sandys

Code of Conduct

• I agree to follow this project's Code of Conduct

Adding an Attractive Drop-down Menu to Improve User Experience

Is your feature request related to a problem? Please describe.

Description:
As a beginner in HTML CSS Web Design/Docusaurus/React.js, I would like to contribute to an open source project by enhancing the user experience through the addition of an attractive drop-down menu. The current project's navigation menu lacks interactivity and visual appeal, which can negatively impact user engagement.

The goal of this issue is to design and implement a modern, visually appealing drop-down menu that provides an intuitive and user-friendly navigation experience. The new menu should have the following features:

1. Drop-down functionality: When a user hovers over or clicks on a menu item, a drop-down menu should appear, displaying additional navigation options related to the selected item.

2. Styling and aesthetics: The drop-down menu should have an attractive design that aligns with the overall theme and branding of the project. It should utilize CSS effects, transitions, and animations to enhance the visual appeal and make the navigation experience more engaging.

3. Responsiveness: The drop-down menu should be responsive and adapt to different screen sizes, ensuring that it remains accessible and user-friendly on various devices, including desktops, tablets, and mobile phones.

4. Accessibility: It is essential to ensure that the drop-down menu is accessible to all users, including those who rely on assistive technologies. Proper HTML structure and ARIA attributes should be utilized to ensure a positive experience for users with disabilities.

5. Customizability: The drop-down menu should be easily customizable, allowing developers to modify its appearance, behavior, and content to suit the specific needs of the project.

Describe the solution you'd like

Solution:

The solution to adding an attractive drop-down menu involves implementing the following steps:

1. HTML Structure: Create the HTML structure for the navigation menu and drop-down menu. Use nested <ul> and <li> elements to represent the menu items and their respective sub-menus. Assign appropriate classes or IDs to elements for styling and JavaScript interactions.

2. CSS Styling: Apply CSS styles to the menu and drop-down menu elements. Customize the colors, fonts, and layout to match the project's design guidelines. Utilize CSS transitions and animations to create smooth and visually appealing effects when opening and closing the drop-down menu.

3. JavaScript Interactions: Write JavaScript code to handle the menu interactions. Use event listeners to detect mouse hover or click events on the menu items. When an event is triggered, toggle the visibility of the corresponding drop-down menu using CSS classes or inline styles. Ensure smooth transitions and animations when displaying and hiding the drop-down menu.

4. Responsiveness: Implement responsive design techniques to ensure the drop-down menu adapts to different screen sizes. Utilize CSS media queries to adjust the menu's layout, font sizes, and spacing for smaller screens such as tablets and mobile devices.

5. Accessibility Considerations: Ensure the drop-down menu is accessible to all users, including those who rely on assistive technologies. Use appropriate HTML markup, such as <nav>, <ul>, and <li> elements, to convey the semantic structure of the menu. Implement keyboard navigation support and ensure proper focus management when interacting with the drop-down menu.

6. Customizability: Design the drop-down menu in a modular and flexible way, allowing developers to easily customize its appearance and behavior. Use CSS variables or SASS variables to define key styles, allowing for easy customization and theme changes.

7. Documentation and Testing: Document the changes made to the project, including the updated HTML, CSS, and JavaScript code. Provide clear instructions on how to integrate the new drop-down menu into the existing project. Test the menu thoroughly on different browsers and devices to ensure cross-browser compatibility and responsiveness.

Describe alternatives you've considered

1. CSS Frameworks: Instead of building the drop-down menu from scratch, you could leverage existing CSS frameworks like Bootstrap, Foundation, or Bulma. These frameworks offer pre-built components, including drop-down menus, that can be easily customized and integrated into your project. Using a CSS framework can save development time and provide a consistent look and feel across different projects.

2. JavaScript Libraries: There are several JavaScript libraries and frameworks, such as React.js, Vue.js, or Angular, that provide components for creating interactive menus and drop-downs. If your project already utilizes one of these libraries, it might be beneficial to explore the available components and plugins within the ecosystem. These libraries often come with built-in functionality and extensive documentation, making it easier to implement and customize the drop-down menu.

3. CSS Transitions and Animations: While the solution mentioned earlier suggests using JavaScript for menu interactions and animations, you could also rely solely on CSS transitions and animations. CSS provides powerful transition and animation properties that can be applied to the drop-down menu, allowing you to create smooth and visually appealing effects. This approach eliminates the need for JavaScript code but may have limitations when it comes to complex interactions.

4. Mega Menus: If your project requires a more elaborate navigation menu with multiple levels of sub-menus or additional content, you might consider implementing a mega menu. Mega menus typically display a grid or multi-column layout with various navigation options, images, or even widgets. They offer a spacious and organized way to present a large amount of information, enhancing user exploration and engagement.

5. Custom Design Approach: If the project has specific design requirements or branding guidelines, you may opt for a custom design approach. In this case, you would design the drop-down menu from scratch, considering the project's visual identity and unique user experience needs. This approach provides complete control over the menu's aesthetics and behavior but requires more design and development effort.

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Addition of Pull Request template

Is your feature request related to a problem? Please describe.

Pull Request Template means when someone opens a Pull Request, they will have a template that they can edit making it easier for maintainers of the project to review PR and make sure that no PR is submitted without proper description.

Describe the solution you'd like

Pull Request Template means when someone opens a Pull Request, they will have a template that they can edit making it easier for maintainers of the project to review PR and make sure that no PR is submitted without proper description.

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Multi-Language Support for Documentation Websites

Is your feature request related to a problem? Please describe.

No, this issue aims to make the documentation website accessible to a broader audience by providing support for multiple languages. The goal is to enable users from different regions and language backgrounds to access the documentation in their native languages, thereby enhancing the website's usability and reach.

Describe the solution you'd like

To implement multi-language support, developers will need to work on the following tasks:

1. Language Selection Menu: Add a language selection menu or dropdown to the website, allowing users to choose their preferred language. This menu should be easily accessible and clearly indicate the available language options.

2. Translation Integration: Implement a translation system that enables content translation for each supported language. This may involve collaborating with translators or using automated translation services to provide accurate and coherent translations of the documentation content.

3. Language Switching Mechanism: Develop a mechanism that allows users to switch between different languages seamlessly. When a user selects a different language, the website should reload the relevant content in the chosen language without disrupting the user experience.

4. Localized URLs and SEO Considerations: Ensure that each translated version of the documentation has its own localized URL structure. This helps search engines index and rank the pages correctly for different languages, improving the website's search engine optimization (SEO) for multi-language support.

5. Language-Specific Formatting and Date/Time Localization: Take into account regional differences in formatting, date/time display, and other language-specific requirements to ensure a culturally appropriate user experience.

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Changing the footer section

Is your feature request related to a problem? Please describe.

The original footer section is less interactive. It didn't had a good description about Arakoo. The ui was not very eye catchy.

Describe the solution you'd like

I would like to add icons of the related social media links. Also like to change the ui of the footer and add a better description.

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Close all tags option on tags page

Is your feature request related to a problem? Please describe.

there is an option to View all tags which opens a new page i.e. the second image and there is no option to go back.

Describe the solution you'd like

We can add a link to go back to the previous page at the same position to Close all tags.

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Dark Mode not rendering correctly

Describe the bug

When enabling Dark Mode, the expected behavior is for all elements and content on the page to be displayed in a darker color scheme. However, it has been observed that only the scrollbar is being rendered correctly in a darker color, while the rest of the contents, including text and background, remain in a lighter color. This inconsistency in Dark Mode rendering affects the overall user experience and can make the content less readable or visually appealing.

Expected behaviour

When Dark Mode is enabled, the entire interface, including the scrollbar, text, and background, should be displayed in a darker color scheme, providing a cohesive and visually pleasing user experience.

Screenshots

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Improve Search Functionality on Documentation Websites

Is your feature request related to a problem? Please describe.

yes ,the objective of this issue is to enhance the search functionality on the documentation websites, making it easier for users to find the information they need quickly and efficiently. The current search feature may be limited or not yielding accurate results, leading to frustration for users trying to access specific documentation

Describe the solution you'd like

To address this, Some potential enhancements include:

1. Implementing a more advanced search algorithm: Introduce a more robust search algorithm that takes into account keyword relevance, partial matches, and fuzzy search to improve the accuracy of search results.

2. Adding filters and categories: Allow users to refine their search results by adding filters or categories, such as documentation version, topic, or date, to help them find specific content within a larger documentation set.

3. Providing instant search suggestions: Implement an auto-suggest feature that displays relevant search suggestions as users type, helping them discover popular or related documentation topics faster.

4. Optimizing search performance: Optimize the search feature to ensure quick response times, especially for websites with extensive documentation and large user bases.

5. Incorporating search analytics: Track user search behavior and analyze search queries to gain insights into the most common search terms and user pain points, which can inform future improvements.

6. Making the search UI intuitive: Ensure the search interface is user-friendly, with a prominent search bar and clear instructions on how to use the search feature effectively.

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Missing issue templates

Description:

I noticed that the repository does not have an issue template. Having an issue template can greatly improve the clarity and consistency of issue reports, making it easier for contributors and maintainers to understand and address the problems or feature requests effectively.

Here are three templates that I want to include:

Issue Template: This template enables users to create well-structured issue reports by providing sections for a concise title, detailed description, steps to reproduce (if applicable), expected behavior, actual behavior, additional information, and environment details.

Feature Request Template: The feature request template allows users to outline their desired features with clarity, including sections for a clear feature description, expected benefits, and any additional context or information.

Documentation Template: This template facilitates the creation of comprehensive documentation by providing a structured format, including sections for an introduction, usage instructions, examples, and other relevant details.

Please assign this issue to me under GSSoC'23 @sandys

Dark Mode Bug

Describe the bug

There is a bug related to the dark mode functionality in the project, which is causing problems for users when using the application or website in dark mode.

When users enable dark mode, certain elements of the interface do not switch to the appropriate dark color scheme. As a result, users may encounter issues such as illegible or hard-to-read text, buttons or icons not being visible, or incorrect color combinations, making the application or website difficult to use in dark mode.

Proposed Solution:
To resolve the dark mode bug, the development team needs to identify the specific elements that are not properly adjusting to the dark mode settings. Once the problematic elements are identified, the team should implement appropriate CSS changes or update the UI components to ensure proper color adjustments and readability in dark mode.

Expected behaviour

Clarify the expected behavior for the dark mode feature. This will serve as a reference point for the developers to understand the intended design and functionality when the application or website is in dark mode.

Screenshots

No response

Additional context

If there are any additional details, such as recent changes made to the dark mode feature or any known triggers that might be causing the issue, provide that information to aid the development team in their investigation and resolution.

Code of Conduct

• I agree to follow this project's Code of Conduct

Button on clicking view can be enhanced

Is your feature request related to a problem? Please describe.

Yes, because buttons should have some real look and feel on clicking it, like we are clicking a real button.

Describe the solution you'd like

I wan to add some transform property of css on buttons.

Describe alternatives you've considered

Through transform CSS, on clicking on button it will go deeper that appears like we really clicking on it..

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Dark Mode Moon icon Issue

Describe the bug

Hello @sandys
I saw an issue regarding the navbar which is the darkmode icon {Moon}
It's too fade when the website is in light mode.

Expected behaviour

When the website is in light mode the Moon icon should be in the Black color so user can use that feature without any doubt. 👍🏻

Screenshots

Code of Conduct

• I agree to follow this project's Code of Conduct

Dark Mode not rendering correctly

Is your feature request related to a problem? Please describe.

When enabling Dark Mode, the expected behavior is for all elements and content on the page to be displayed in a darker color scheme. However, it has been observed that only the scrollbar is being rendered correctly in a darker color, while the rest of the contents, including text and background, remain in a lighter color. This inconsistency in Dark Mode rendering affects the overall user experience and can make the content less readable or visually appealing.

Describe the solution you'd like

When enabling Dark Mode, the expected behavior is for all elements and content on the page to be displayed in a darker color scheme. However, it has been observed that only the scrollbar is being rendered correctly in a darker color, while the rest of the contents, including text and background, remain in a lighter color. This inconsistency in Dark Mode rendering affects the overall user experience and can make the content less readable or visually appealing.

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Close all tags option on tags page

Is your feature request related to a problem? Please describe.

In the first screenshot, there is an option to View all tags which opens a new page i.e. the second image and there is no option to go back.

Describe the solution you'd like

We can add a link to go back to the previous page at the same position to Close all tags.

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Nav-Bar Revamp

Is your feature request related to a problem? Please describe.

The nav bar currently present is the default one and does not tie up or do justice to the application.

Describe the solution you'd like

I want to add a custom built nav-bar that is sleek and professional that should enhance the overall look and feel of the web application.

Describe alternatives you've considered

No response

Additional context

I am a UI/UX designer and developer and I feel that something as small as a nav-bar goes a long way

Code of Conduct

• I agree to follow this project's Code of Conduct

To add the contents of the This is the Way repo to the Docs as a new section

Describe the bug

Hey , I will be adding the contents of the This is the way repo This is the way repo in the docs section . I will create new sections for newer docs.

Please assign this issue to me.

Expected behaviour

The docs website will have more documents with more sections.

Screenshots

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Dark Mode

Describe the bug

Dark Mode is not working properly only scrollbar is getting darker but rest of the contents remains same (lighter).
I can fix this problem, please assign this issue to me.

Expected behaviour

After clicking dark mode button, the whole screen should get darker.

Screenshots

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

BOUNTY: improve docs

Our docs are outdated and written a long time back. here's our main repo - https://github.com/arakoodev/edgechains

Describe your ideal solution

1. Try out edgechains
2. Rewrite our docs in a better
   way

Goal - is for first time users to be able to quickly create their first application using Edgechains.

P.S. if you hit any bugs or problems while using it, we will fix it.

Ideally you should be someone who knows java. But even if you are not, you need to be able to learn quickly and write little bit of java to be able to use edgechains.
Please do not do this bounty if you are not running edgechains and simply rewriting docs using chatgpt. that will not be acceptable.

HOW TO USE
this doc system is built on docusaurus. It automatically builds. All you have to do is change the docs inside "docs" directory using markdown.
If you fork this site, you will see that it automatically builds using actions.

Feature Request: Making dark mode for website "arakoo.ai" and some other enhancements

Hi @sandys, I am planning to make this website's dark mode and some other enhancements like - borders of buttons, and the styling the nav bar.

Please assign this issue to me under GSSOC'23 as I want to work on it. 🙏🙏

Grammatical and spelling errors in the Privacy policy section

##Description
The website content has lots of grammatical and spelling errors, and I want to resolve them, Kindly assign me this issue.

##Screenshot

Addition of scroll to top button

Is your feature request related to a problem? Please describe.

Addition of scroll to top button will redirect directly to the starting of the page which will enchance the web page and it is a necessary user requirement.

Describe the solution you'd like

I will use CSS to style the button and will use Javascript to add the scroll to top button.

Describe alternatives you've considered

No response

Additional context

I am familiar with HTML, CSS and Javascript so I can contribute to this issue.
Please kindly assign me with this issue :)

Code of Conduct

• I agree to follow this project's Code of Conduct

Implementing Dark Mode in a Web Application

Is your feature request related to a problem? Please describe.

yes, The request involves implementing a dark mode feature in a web application. Dark mode is a popular user interface option that provides a dark color scheme instead of the traditional light background. This feature aims to enhance user experience, reduce eye strain, and conserve device battery life.

Describe the solution you'd like

Solution:

1. Choose a suitable approach: Decide on the approach for implementing dark mode. This can include using CSS variables, creating separate CSS stylesheets, or using JavaScript to toggle between light and dark themes.

2. Define color schemes: Determine the color scheme for the dark mode. Select colors that provide sufficient contrast and readability, considering elements such as text, backgrounds, buttons, and other UI components.

3. Update CSS styles: Modify the CSS styles to incorporate the dark mode color scheme. This may involve updating background colors, text colors, borders, and other relevant properties. Consider using CSS variables to define colors, allowing for easier switching between light and dark themes.

4. Implement theme toggling: If providing a user preference for enabling or disabling dark mode, implement the necessary functionality. This can involve adding a toggle button or a switch in the user settings, and using JavaScript to handle the state change and apply the appropriate CSS styles.

5. Test across devices and browsers: Test the dark mode implementation on various devices, browsers, and screen sizes to ensure consistent rendering and functionality. Verify that the contrast, readability, and overall user experience meet expectations.

Describe alternatives you've considered

Alternative 1: Third-Party Dark Mode Plugin

Another alternative is to use a third-party dark mode plugin or library to implement the feature. There are various existing solutions available that offer pre-built dark mode functionality. This could potentially save development time and provide a consistent and well-tested solution. However, it may also introduce dependencies, limitations, or customization challenges that might not align perfectly with the specific requirements or design of the web application.

Alternative 2 Custom Theme Options

Instead of implementing a standard dark mode, an alternative could be to provide users with customizable theme options. This approach would allow users to define their preferred color schemes, including dark, light, or custom themes. It would involve developing a theme selector or editor where users can customize various aspects of the application's appearance, such as colors, fonts, and layouts. While this offers flexibility, it might require more development effort and maintenance to support a wide range of customization options.

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Add Error 404: Page

Is your feature request related to a problem? Please describe.

No, I would like to include a visually engaging error 404 page.
The page will feature a picture of an adivasi man, the man trying to eat an electric wire, we can show him inquisitively observing the wires, showcasing his curiosity and fascination.
In the center of the page, we'll display the main text using a clear and legible font. The primary message will say, "Oops! It looks like you're lost." .
Beneath the main text, we'll include another text in a slightly smaller font size: "The page you are looking for is not available." This informative message succinctly communicates that the requested page is currently unavailable.
To ensure a cohesive design, we'll use contrasting colors that complement your website's overall aesthetic. The background should provide sufficient contrast to make the text easily readable.

Describe the solution you'd like

Visual Design:

The error 404 page will feature an image of an adivasi man, chosen respectfully and representing diversity. To make it more engaging and aligned with website etiquette, we'll depict the adivasi man curiously observing the electric wire instead of trying to eat it. This visual element aims to capture the attention and curiosity of the visitors.

Text:

In the center of the page, we'll place the main text in a clear and noticeable font size, ensuring easy readability. The primary message will read: "Oops! Looks like you are lost." This friendly statement acknowledges the visitor's predicament and adds a touch of empathy to the error encounter.

Describe alternatives you've considered

1. Visual Alternatives:

   • Instead of using a picture of an adivasi man, you could opt for a visually appealing graphic or illustration that aligns with your website's theme and branding.
   • Instead of depicting the man looking at electrical wires, you could use a different visual representation that symbolizes being lost or exploring new paths.

2. Text Message Alternatives:

   • Instead of the main text saying, "Oops! It looks like you're lost," you could use a different friendly and empathetic message, such as "Uh-oh! You've wandered off the path."
   • Instead of the smaller text saying, "The page you are looking for is not available," you could provide a more detailed explanation or suggestions for other relevant content.

3. Styling and Navigation Alternatives:

   • Instead of using contrasting colors, you could experiment with different color schemes that align with your website's design and ensure readability.
   • Instead of a navigation element, you could provide additional options like a search bar or a list of popular pages to help visitors find what they're looking for.

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Dark Mode not rendering correctly

Describe the bug

When enabling Dark Mode, the expected behavior is for all elements and content on the page to be displayed in a darker color scheme. However, it has been observed that only the scrollbar is being rendered correctly in a darker color, while the rest of the contents, including text and background, remain in a lighter color. This inconsistency in Dark Mode rendering affects the overall user experience and can make the content less readable or visually appealing.

Expected behaviour

When Dark Mode is enabled, the entire interface, including the scrollbar, text, and background, should be displayed in a darker color scheme, providing a cohesive and visually pleasing user experience.

Screenshots

Additional context

To fix this issue, it is necessary to apply the appropriate styles to ensure that all content elements are correctly rendered in a darker color scheme when Dark Mode is enabled. This may involve updating CSS rules, adjusting color values, or addressing any conflicting styles that are preventing the proper rendering of the Dark Mode.

I am interested in resolving this issue and would like to take ownership of it. Kindly assign this bug to me, and I will work on fixing it promptly.

Code of Conduct

• I agree to follow this project's Code of Conduct

Improved Navigation Menu

Is your feature request related to a problem? Please describe.

No, This feature request aims to improve the navigation menu to enhance user experience and ease of access to different sections of the website.

Describe the solution you'd like

Design and implement an improved navigation menu that offers better organization and visual cues for users to quickly identify and access different sections of the website. Consider implementing drop-down menus, a search bar, or a sticky menu for easy access while scrolling.

Describe alternatives you've considered

• An alternative solution could be a mega menu that displays a broader range of options when hovering over the main menu items.
• Another approach is a hamburger menu for mobile devices to optimize the navigation experience on smaller screens.

Additional context

Attaching a screenshot of the current navigation menu will provide additional context for developers and designers to understand the current limitations and design constraints.

By implementing an improved navigation menu, users will have a more pleasant and efficient browsing experience, leading to increased user satisfaction and engagement with the website.

Code of Conduct

• I agree to follow this project's Code of Conduct

Grid-View change for better UI

Is your feature request related to a problem? Please describe.

The aside block (Recent posts) covers 3 col in the first image and the main content covers 7 which distracts attention from the main content.

Describe the solution you'd like

We can change it to col-2 and col-8 as in the second picture for uniform distribution of the other contents focusing more on the main content.

Describe alternatives you've considered

No response

Additional context

We can also increase the padding and improve the alignment of text
No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Privacy Page UI Enhancement

Is your feature request related to a problem? Please describe.

The home page of this website has nice padding but the padding on the privacy page looks quite odd .

Describe the solution you'd like

I would to add some padding on the privacy page and it would look somewhat like this!

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Dark Mode not rendering correctly

Describe the bug

When enabling Dark Mode, the expected behavior is for all elements and content on the page to be displayed in a darker color scheme. However, it has been observed that only the scrollbar is being rendered correctly in a darker color, while the rest of the contents, including text and background, remain in a lighter color. This inconsistency in Dark Mode rendering affects the overall user experience and can make the content less readable or visually appealing.

Expected behaviour

When Dark Mode is enabled, the entire interface, including the scrollbar, text, and background, should be displayed in a darker color scheme, providing a cohesive and visually pleasing user experience.

Screenshots

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Add Light mode to Website

Enhancing the textual formatting and spacing within the website to optimize its presentation and readability.

Is your feature request related to a problem? Please describe.

Hello @arakoodev I m a contributor of Gssoc'23

I have been exploring the website and have noticed an opportunity for improvement. There appears to be an abundance of textual content that, in my opinion, requires some attention. I believe implementing proper text formatting, along with adequate spacing, would greatly enhance the overall readability of the website. Additionally, I would recommend considering subtle adjustments to the color combination while maintaining the existing theme, as it would further contribute to an enhanced reading experience.

I kindly request you to assign me this particular issue under the label GSSOC'23 as I am eager to make a meaningful contribution to this project.

Describe the solution you'd like

Proper text formatting, along with adequate spacing, would greatly enhance the overall readability of the website. Additionally, I would recommend considering subtle adjustments to the color combination while maintaining the existing theme, as it would further contribute to an enhanced reading experience.

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Addition of dependabot.yml file

We need to add dependabot.yml file as it helps us to keep our dependencies up to date. Every day, it checks your dependency files for outdated requirements and opens individual PRs for any it finds.

@arakoodev please assign me this issue under gssoc'23.

auto comment .yaml file

Describe the bug

We need to add an auto-comment.yml that will automatically welcome, greet and provide necessary information to the contributors when they create new issues, PR, and when these will get assigned or merged respectively. This will promote motivation and performance

https://github.com/arakoodev Please assign me this issue under gssoc'23

Expected behaviour

We need to add an auto-comment.yml that will automatically welcome, greet and provide necessary information to the contributors when they create new issues, PR, and when these will get assigned or merged respectively. This will promote motivation and performance

https://github.com/arakoodev Please assign me this issue under gssoc'23

Screenshots

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Changing the Footer Section

Is your feature request related to a problem? Please describe.

The original footer section of the project has been identified as lacking interactivity and failing to provide a sufficient description of Arakoo, which could have a negative impact on user engagement and hinder their understanding of the project's purpose. Furthermore, the UI of the footer is not visually appealing, potentially resulting in a subpar user experience.

Describe the solution you'd like

The proposed solution includes adding icons for related social media links to improve the project's online presence and visibility on various platforms. Furthermore, they aim to redesign the footer's UI to make it more attractive and user-friendly

Describe alternatives you've considered

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Addition of auto-comment.yml file

We need to add an auto-comment.yml that will automatically welcome, greet and provide necessary information to the contributors when they create new issues, PR, and when these will get assigned or merged respectively. This will promote motivation and performance

@arakoodev Please assign me this issue under gssoc'23

Enhanced Collaboration and Version Control for Documentation

Is your feature request related to a problem? Please describe.

I propose enhancing collaboration and version control features for documentation on our website. This feature request aims to improve the efficiency and effectiveness of content creation, editing, and review processes for documentation projects.

Describe the solution you'd like

1. Real-time Collaboration: Implement a real-time collaboration feature that allows multiple team members to work on the same document simultaneously. This will enable faster content creation and seamless collaboration among team members.

2. Version History: Introduce version control functionality to track changes made to documentation over time. Team members can view and revert to previous versions, ensuring content accuracy and providing a safety net for potential mistakes.

3. Commenting and Feedback: Enable users to leave comments and provide feedback directly on the documentation. This feature promotes open discussions, encourages peer review, and helps maintain a transparent feedback loop.

4. Assigning Roles and Permissions: Allow administrators to assign roles and permissions to team members, controlling who can view, edit, or approve changes in the documentation. This ensures data security and maintains document integrity.

5. Notifications and Alerts: Implement a notification system to inform team members about updates, changes, and pending review tasks related to the documentation. This feature will keep everyone informed and streamline the workflow.

6. Integration with Version Control Systems: Integrate with popular version control systems like Git or Mercurial, enabling seamless synchronization between the documentation and code repositories.

7. Markdown Support: Provide robust support for Markdown, a lightweight markup language commonly used for technical documentation. This will simplify content formatting and allow users to focus on writing content rather than worrying about complex formatting.

8. Export and Publishing Options: Offer various export formats (PDF, HTML, etc.) and publishing options to make the documentation accessible to a wider audience and facilitate offline reading.

Describe alternatives you've considered

No response

Additional context

By implementing these enhanced collaboration and version control features for our documentation, we can significantly improve productivity, promote effective teamwork, and ensure the accuracy and integrity of our content.

Code of Conduct

• I agree to follow this project's Code of Conduct

creation of learn more page

Is your feature request related to a problem? Please describe.

Yes, i would like to create a learn more page when we click on learn more . this would be feature upgrade. can create a page where we could describe more about the technologies used in the project.

Describe the solution you'd like

solution to the problem is to create a new page where we would describe more about the technologies used.

Describe alternatives you've considered

solution to the problem is to create a new page where we would describe more about the technologies used.

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

creation of learn more page

Describe the bug

creation of learn more page

Expected behaviour

creation of learn more page

Screenshots

creation of learn more page

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Adding proper padding and margin to the page

Is your feature request related to a problem? Please describe.

Describe the solution you'd like

Adding proper padding and margin to the page

Describe alternatives you've considered

No response

Additional context

pls assign me this issue under GSSOC'23
@sandys

Code of Conduct

• I agree to follow this project's Code of Conduct

Addition of auto-comment.yml file

Describe the bug

We need to add an auto-comment.yml that will automatically welcome, greet and provide necessary information to the contributors when they create new issues, PR, and when these will get assigned or merged respectively. This will promote motivation and performance

https://github.com/arakoodev Please assign me this issue under gssoc'23

Expected behaviour

We need to add an auto-comment.yml that will automatically welcome, greet and provide necessary information to the contributors when they create new issues, PR, and when these will get assigned or merged respectively. This will promote motivation and performance

https://github.com/arakoodev Please assign me this issue under gssoc'23

Screenshots

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Enhancing User Experience with an Attractive Drop-Down Menu

Is your feature request related to a problem? Please describe.

Description:

As a beginner in HTML, CSS, Web Design/Docusaurus, and React.js, I would like to contribute to an open source project by improving the user experience through the addition of an attractive drop-down menu. The project's current navigation menu lacks interactivity and visual appeal, which can negatively impact user engagement.

Goal:
The goal of this issue is to design and implement a modern, visually appealing drop-down menu that provides an intuitive and user-friendly navigation experience. The new menu should have the following features:

1. Drop-down functionality: When a user hovers over or clicks on a menu item, a drop-down menu should appear, displaying additional navigation options related to the selected item.

2. Styling and aesthetics: The drop-down menu should have an attractive design that aligns with the overall theme and branding of the project. It should utilize CSS effects, transitions, and animations to enhance the visual appeal and make the navigation experience more engaging.

3. Responsiveness: The drop-down menu should be responsive and adapt to different screen sizes, ensuring that it remains accessible and user-friendly on various devices, including desktops, tablets, and mobile phones.

4. Accessibility: It is essential to ensure that the drop-down menu is accessible to all users, including those who rely on assistive technologies. Proper HTML structure and ARIA attributes should be utilized to ensure a positive experience for users with disabilities.

5. Customizability: The drop-down menu should be easily customizable, allowing developers to modify its appearance, behavior, and content to suit the specific needs of the project.

Describe the solution you'd like

The solution to adding an attractive drop-down menu involves implementing the following steps:

1. HTML Structure: Create the HTML structure for the navigation menu and drop-down menu using nested <ul> and <li> elements. Assign appropriate classes or IDs to elements for styling and JavaScript interactions.

2. CSS Styling: Apply CSS styles to the menu and drop-down menu elements. Customize the colors, fonts, and layout to match the project's design guidelines. Utilize CSS transitions and animations to create smooth and visually appealing effects when opening and closing the drop-down menu.

3. JavaScript Interactions: Write JavaScript code to handle the menu interactions. Use event listeners to detect mouse hover or click events on the menu items. When an event is triggered, toggle the visibility of the corresponding drop-down menu using CSS classes or inline styles. Ensure smooth transitions and animations when displaying and hiding the drop-down menu.

4. Responsiveness: Implement responsive design techniques using CSS media queries to ensure the drop-down menu adapts to different screen sizes. Adjust the menu's layout, font sizes, and spacing for smaller screens such as tablets and mobile devices.

5. Accessibility Considerations: Ensure the drop-down menu is accessible to all users by using appropriate HTML markup, semantic structure, and ARIA attributes. Implement keyboard navigation support and ensure proper focus management when interacting with the drop-down menu.

6. Customizability: Design the drop-down menu in a modular and flexible way, using CSS variables or SASS variables to define key styles. This will allow developers to easily customize its appearance and behavior to suit the specific needs of the project.

7. Documentation and Testing: Document the changes made to the project, including the updated HTML, CSS, and JavaScript code. Provide clear instructions on how to integrate the new drop-down menu into the existing project. Test the menu thoroughly on different browsers and devices to ensure cross-browser compatibility and responsiveness.

Describe alternatives you've considered

• CSS Frameworks: Instead of building the drop-down menu from scratch, consider leveraging existing CSS frameworks like Bootstrap, Foundation, or Bulma.

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Addition of Pull Request template

Pull Request Template means when someone opens a Pull Request, they will have a template that they can edit making it easier for maintainers of the project to review PR and make sure that no PR is submitted without proper description.

@arakoodev Please assign this issue to me under Gssoc'23

creation of learn more page

Is your feature request related to a problem? Please describe.

i would like to create a learn more page when we click on learn more . this would be feature upgrade. can create a page where we could describe more about the technologies used in the project.

Describe the solution you'd like

solution to the problem is to create a new page where we would describe more about the technologies used.

Describe alternatives you've considered

if not making a new page we could connect the learn more button to the documents.

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Enhancing the Button Click Experience with CSS Transform Effects

Is your feature request related to a problem? Please describe.

The current button design lacks a realistic look and feel when clicked, which can diminish user experience and engagement.

Describe the solution you'd like

To address this issue, I propose adding CSS transform properties to the buttons, providing a more immersive and interactive button click experience. By applying appropriate CSS transforms, we can simulate the effect of pressing a physical button, giving users a sense of tactile feedback.

Describe alternatives you've considered

One alternative considered was to rely solely on color or shading changes to indicate button interaction. However, this approach may not provide a sufficiently immersive or intuitive experience. By incorporating CSS transform effects, we can create a more realistic and engaging button click experience.

Additional context

As of now, there has been no response regarding this enhancement request. However, by implementing CSS transform effects, we can elevate the button interaction and improve the overall user interface.

Code of Conduct

• I agree to follow this project's Code of Conduct

Enhanced Collaboration and Version Control for Documentation

Is your feature request related to a problem? Please describe.

I propose enhancing collaboration and version control features for documentation on our website. The current process for creating, editing, and reviewing documentation can be improved to make it more efficient and effective.

Describe the solution you'd like

1. Real-time Collaboration: Implement a real-time collaboration feature that allows multiple team members to work on the same document simultaneously. This will enable faster content creation and seamless collaboration among team members.

2. Version History: Introduce version control functionality to track changes made to documentation over time. Team members can view and revert to previous versions, ensuring content accuracy and providing a safety net for potential mistakes.

3. Commenting and Feedback: Enable users to leave comments and provide feedback directly on the documentation. This feature promotes open discussions, encourages peer review, and helps maintain a transparent feedback loop.

4. Assigning Roles and Permissions: Allow administrators to assign roles and permissions to team members, controlling who can view, edit, or approve changes in the documentation. This ensures data security and maintains document integrity.

5. Notifications and Alerts: Implement a notification system to inform team members about updates, changes, and pending review tasks related to the documentation. This feature will keep everyone informed and streamline the workflow.

6. Integration with Version Control Systems: Integrate with popular version control systems like Git or Mercurial, enabling seamless synchronization between the documentation and code repositories.

7. Markdown Support: Provide robust support for Markdown, a lightweight markup language commonly used for technical documentation. This will simplify content formatting and allow users to focus on writing content rather than worrying about complex formatting.

8. Export and Publishing Options: Offer various export formats (PDF, HTML, etc.) and publishing options to make the documentation accessible to a wider audience and facilitate offline reading.

Describe alternatives you've considered

No response

Additional context

By implementing these enhanced collaboration and version control features for our documentation, we can significantly improve productivity, promote effective teamwork, and ensure the accuracy and integrity of our content.

Code of Conduct

• I agree to follow this project's Code of Conduct

Want to add styling to the scroll bar of the website

Is your feature request related to a problem? Please describe.

Description
I Want to add styling to the scroll bar of the website, This will improve the UI of the website.

Describe the solution you'd like

Adding styling on the scrollbar

Describe alternatives you've considered

No response

Additional context

Code of Conduct

• I agree to follow this project's Code of Conduct

Add the icon instead of text in footer

Icons For redirect links in footer like stack overflow, Discord, Twitter and GitHup which Icons give attractive footer. I'm GSSOC 23 Contributor Can you assign me to update the footer.