(UI) Filled icons and closer match to the web UI navigation bar#85
Open
Taffroi wants to merge 6 commits intojoinloops:mainfrom
Open
(UI) Filled icons and closer match to the web UI navigation bar#85Taffroi wants to merge 6 commits intojoinloops:mainfrom
Taffroi wants to merge 6 commits intojoinloops:mainfrom
Conversation
…web UI The older Feather icons were directly taken from Pixelfed and didn't have filled versions. I didn't know to make webUI icons work in expo, so I used the material community icons since it has filled icons & look similar to the icons of loops.video. I made the colors softer, following the same theme as loops webUI so it should look cleaner. I replaced the profile tab icon by the avatar of the user, and added an outline when focused. The create tab icon has been replaced by a plus, but i'm not sure if it's a good icon since while you can directly upload a video from the gallery, it takes you directly in camera mode. I added an outline and border radius to the bar, I thought it looks cool and matches with the rest of the app. Feel free to remove it if you think it's out of place. I would have increase the height of the bar because the tabs are really close to the navigation bar of android (with the 3 buttons) but it would overlaps with the video player. Let me know what do you think about this !
Contributor
Author
|
I got farther into reproducing the tab bar from Loops Web I enabled labels for tabs, added a singular style to the create button and I adjusted the border of the profile picture. It's still not adjusted for iOS, you should probably watch for the padding when testing. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
NOT TESTED ON IOS
The older Feather icons were directly taken from Pixelfed and didn't have filled versions.
I didn't know how to make webUI icons work in expo, so I used the material community icons since it has filled icons & look similar to the icons of loops.video.
I know there's already a lot of different icon fonts used haha, you should choose one to adopt or import a new one to the app or it will never look consistent.
I made the colors softer, following the same theme as loops webUI so it should look cleaner.
I replaced the profile tab icon by the avatar of the user, and added an outline when focused.
The create tab icon has been replaced by a plus, but i'm not sure if it's a good icon since while you can directly upload a video from the gallery, it takes you directly in camera mode.
The outline is slightly bolder.
I would have increase the height of the bar because the tabs are really close to the navigation bar of android (with the 3 buttons) but it would overlaps with the video player.
Let me know what do you think about this !
Screenshots