lexoskeleton/feq_dictionary_app

Front End Queens Open Source Dictionary Web App

feq_dictionary_app's Issues

Style - Style Search Bar to handle empty submissions

Style - Move & Style Search Bar

View - HTML - Error Screen

Functionality - Use Search Bar to Search Dictionary API

Style/Functionality - Add OnSubmit Action to Search Box

our search box is currently a text input field without an option to submit.

we have not yet connected to the dictionary api, but for now, we need to create an onSubmit action that:

• triggers the error message for an empty search
• does not throw an error out when there is a valid search (there are letters entered)

Bug - Fix "Synonym Subtitle" and "Example" should update with new search results (JS)

See the Synonyms and the quote towards the bottom.
The result next to synonyms could use some padding or margin as well.

View - HTML - Results Screen

Functionality/Style - Allow for Toggle between Light/Dark Themes

View - Create Search Input with Form Validation

We need an HTML input search bar that does not allow blank searches.

Known Issue - Firefox Compatibility

an "extra credit" issue for folks who'd like to keep working on the project after submission: text dropdown light/dark theme change broken in firefox and edge:

View - HTML - Search Bar Screen

Compatibility - MacOS & PC

Investigate color/style setting incompatibility across MacOS & PC systems.

Create a Container Div to Centralize the App on the page

1. Create a div to be a container of the page
2. Style this div to centralize and add a gap between navbar, searchbar and the results.

folder restructure

add folders for css & js (styles & js)

Fix app styles to look like Figma design

Fix small styles like:

• grey lines side by subtitle noun and verb
• purple dots
• alignment of the app parts

Functionality - Dynamically populate Results div with results from Dictionary API

Deployment

more extra credit - let's deploy this somewhere so we can share the link in the readme and on our portfolios!

Bug - Light/Dark Toggle Currently Stuck on Dark Mode

View - Create Light/Dark Theme Toggle

We want to switch between light & dark mode with a toggle.

Polishing JavaScript functionality and code

Remove console.logs, check functionality, optimize code

Style - Move and Style Light/Dark Theme Toggle

Style - Add Media Queries for Responsive Design

Bug - Fix Invalid Search Error Message

Missing Query size for the text inside the font-family menu

Add a Query to change the font size of the text inside the font-family menu.

Documentation - Create a ReadMe

View - Create Results Div

This is the div that will store the results from the Search Input, or the error message if applicable

Style - Apply Light/Dark Theme(s) to Site

View - Create Font Dropdown

We want to switch between serif, sans serif, and monospace fonts.

Bug - Search Bar does not accept new input from Invalid Search view

Functionality - Update search query to submit upon hitting the "enter" key

Right now the search can only happen if the user clicks the search button. Can we add an event listener to make submit the search with the "enter" key?

Add a condition to display Synonyms and Antonyms

Add a condition to display Synonyms and Antonyms only when the length of each differs from empty "".

Style font selector