brittanyrw / emojibops Goto Github PK
View Code? Open in Web Editor NEWEmojiBops is a listing of songs depicted through emojis.
Home Page: https://emojibops.com
License: Other
EmojiBops is a listing of songs depicted through emojis.
Home Page: https://emojibops.com
License: Other
In the top of EmojiBops in the filters section, add a dropdown filter so that users can filter by genre. The options for the filter should include all genres in the data.js file and also in the genres.md genre chart. The filter should be able to automatically pull any new genres someone adds to an emoji card in the future.
Use the colors and styling currently on the website.
You can use the filters on EmojiScreen as an example of how filters can look, but the design does not have to look exactly like that.
Link to other open source projects that I have created.
Add a link to EmojiScreen (https://emojiscreen.com) and EmojiPages (https://emojipages.com) somewhere on the homepage.
Right now it seems like the only logical place is the footer area but open to suggestions. Feel free to add in a quick wireframe or sketch of what you are thinking before you start coding.
Add Hot N Cold by Katy Perry
Song Info: https://en.wikipedia.org/wiki/Hot_n_Cold
Song Info: https://en.wikipedia.org/wiki/DNA_(BTS_song)
Song Info: https://en.wikipedia.org/wiki/Barbie_Girl
Song Link: https://en.wikipedia.org/wiki/Bye_Bye_Bye
Song Info: https://en.wikipedia.org/wiki/Black_or_White
Add pagination to the homepage.
Similar to the attached image (design does NOT have to match the image, just showing what I mean by pagination).
Add E.T. by Katy Perry
Song Info: https://en.wikipedia.org/wiki/E.T._(song)
Add Juice by Lizzo to EmojiBops
Song Link: https://en.wikipedia.org/wiki/Hotline_Bling
Add a timed game mode to EmojiBops. A timed game should allow users to try to guess as many cards as they can in a certain amount of time.
This game should be on a new page.
Here are some suggestions on how to structure this:
Right now, the emoji cards (square with record) are a fixed size. On mobile, they are a little small. Make them larger so that they fill more of the screen on mobile.
This will involve adding a media query in the CSS and adding an additional fixed size or making the sizing more dynamic so that it will change based on the screen size.
Make sure that EmojiBops is fully accessible.
In the top of EmojiBops in the filters section, add a dropdown filter so that users can filter by years. The filter options should be by decades such as 1970s, 1980s, 1990s, 2010s, etc.
If there are no items that match the time period selected, a message should appear saying that no cards match the selected years.
Use the colors and styling currently on the website.
You can use the filters on EmojiScreen as an example of how filters can look, but the design does not have to look exactly like that.
Add a quiz game mode to EmojiBops. A quiz game should present users with a fixed number of cards and see how many they can guess correctly.
This game should be on a new page.
Here are some suggestions on how to structure this:
Song Info: https://en.wikipedia.org/wiki/1985_(song)
Add a button on the homepage that will toggle showing and hiding the song name. This button will allow people to show all names if they just want to browse vs having to click on each card to see the name.
When you click on the button it should toggle, ie if I click and nothing is expanded, everything will expand and then when I click again, everything should hide again.
Song Info: https://en.wikipedia.org/wiki/Thrift_Shop
Firework by Katy Perry
https://en.wikipedia.org/wiki/Firework_(song)
Like a Prayer by Madonna
https://en.wikipedia.org/wiki/Like_a_Prayer_(song)
Add Waving Through A Window to EmojiBops
Song Info: https://en.wikipedia.org/wiki/Sk8er_Boi
Wrecking Ball by Miley Cyrus
https://en.wikipedia.org/wiki/Wrecking_Ball_(Miley_Cyrus_song)
Song Info: https://en.wikipedia.org/wiki/Lost_in_Japan
Right now the homepage layout is the same as EmojiScreen emojiscreen.com.
Add A Whole New World by Aladdin
Song Info: https://en.wikipedia.org/wiki/A_Whole_New_World
Song Info: https://en.wikipedia.org/wiki/Ice_Ice_Baby
Diamonds are a Girls Best Friend by Gentlemen Prefer Blondes
https://en.wikipedia.org/wiki/Diamonds_Are_a_Girl%27s_Best_Friend
Add Diamonds by Rhianna
https://en.wikipedia.org/wiki/Diamonds_(Rihanna_song)
Add a search bar (above the emoji cards but below the header) so that users can find specific songs.
Song Link: https://en.wikipedia.org/wiki/Dancing_Queen
Add Can You Feel the Love Tonight by Lion King
Song Info: https://en.wikipedia.org/wiki/Can_You_Feel_the_Love_Tonight
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.