New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Redesign - EFY #1391
Comments
The code for it can be found at the |
On my list already! Thanks! |
@Senor-Ducky It got broken after the last commit, it was okay before, but I think I identified the cause for the most part. Thank you! If you notice other bugs lmk |
The live instance will likely have issues for a while, but the css code is fine, it's just needs to be split and distributed to vue components. Keep sending feedback, but keep in mind that there might be a difference between how unstable it seems to be and how stable it actually is |
@IronMaltese Glad you like it! Your issue was on the list too, but having it here makes it easier to keep track of what I gotta do lol, so thanks! |
Everyone and @Senor-Ducky , if you tried the live instance before the problem got fixed, try clearing your cache ( |
Fixed all the issues above, refresh your cache if needed! |
The Text is too big in 'Select a Playlist' modal. Would be better if it is smaller. |
|
The animation which plays on click is extremely distracting. There should be a way to disable it. |
fixed in the new update. I'll look into the rounded corners for the video and polish characters. Thanks for the feedback!! |
@EdwardLangdon thanks again! I'll look into all of them. For the shorts tho, I think it could be the main colours rather than red, so that it fits with whatever colours the user chooses and instead of black, the variable for the background, like the time on the video, which can be black, white, chosen by the user etc. So basically kinda the same as your idea, but with custom colors |
Alright @opl- , I can add a new accessibility option for that then. I need to figure out how to implement it, but it should be fairly easy I think. Thank you! To make sure I fully understand you, do you mean buttons or any animation related to clicks in general? |
The main thing for me was the scale down -> scale back up "pulse" animation playing whenever I clicked on any button, video or any other interactive element. |
@opl- Alright, got you then |
@opl- There will be a toggle inside |
@martin-desktops Thanks again! We're planning to make a module in the sidebar for captions, so that you can choose between multiple styles, like maybe (not decided yet), you can choose between background, no background and blurred. Right now I'm trying to solve issues that get the framework and redesign to a stable state and then things like captions or comments can become more modular and doing that should take less time. I'm pretty limited time wise by having to apply to jobs, which is why things have been slower, but I acknowledge the current problem with captions or other similar bugs, like the white flash on page load. Keep the feedback going when you need to! Will take care of this as soon as I can! Btw, I can't replicate your bug with Polish characters, so please let me know how I can if it's still present. |
Just out of curiosity. Is https://piped.mha.fi the same redesign as this development thread ? |
@julianfairfax makes sense. There's a problem tho, light & dark themes are usually not very customizable like with efy, which is why that concept works, cuz they don't have to consider transparency, potential background images etc, but in order to do something similar in efy I'd have to let the user store 2 different themes at the same time and based on the time of the day or browser's preference change the one or the other. I could just toggle the light or dark mode, but if the user modifies the colors of the text and background for example, it can be kinda weird for the user to be switched back to the default or to see "broken colors", so I pretty much have to go with the approach mentioned above, because efy has billions of themes, not just 2 like normal frameworks. Also, in efy you can import and export themes from I'll eventually add a feature to automatically load a saved configuration based on a trigger like time of the day or the browser's theme preference, but for now you gotta do it manually, cuz that will be complicated to implement and it will probably take a long time, considering that I have lots of projects and features to work on. |
@eladkarako thanks for the detailed feedback. Yeah, I'm working right now on updating it to the latest Piped version, since it currently uses an older version. As for the cards and labels, I think it makes sense to put more emphasis on the checkboxes and labels than the container, as you said, so I'll look into that. The hover effect you did is interesting, but on touchscreen that won't work, unless using a pen, so the solution needs to cover fingers on touchscreen too, or a design that will let you know stuff without having to hover on it. And for the part about lazy loading stuff it kinda makes sense to me, but I'm more in charge of design than that sort of stuff so maybe @FireMasterK or someone else would be better at understanding and deciding on that, since I think it applies to Piped in general, rather than efy or design specificially. Anyway, I'm gonna first release the latest Piped + latest efy to make sure that stuff is up to date and then I'll work on issues and features. Yours is medium priority I think, there's higher priority ones to deal with first, but I'll get to it as soon as my time allows it. Thanks again and if you have more input, feel free to share it! |
New update is live at efy.piped.pages.dev 🥳 I fixed some of your issues too, but it's more of a maintanance and compatibility update + loads of efficiency improvements and efy features, so expect the newer updates to have more features and bug fixes. Keep the feedback coming, it's been very useful. We also talk, do polls etc on the matrix room from time to time. Enjoy! |
Not sure if this is the right place to ask, but how are you meant to install this? I had done it previously by building the docker image from the repo, but now I am getting errors. Is there a pre-built image anywhere that I can use? |
I as well can't build a docker image for piped-efy. I get this error:
|
@Donty10 @unstablemaple Thanks guys for letting us know, I don't know docker, so maybe @FireMasterK can give more insight? (if you have time) |
Any update on this? Did you find a workaround? |
Really good work, dragos. The feed is now good and display 5 videos in a row as in original. Much appreciated for that as it is much needed. For piped style, It would be lot better if it enters beta stage. |
Thanks! I'll add some new stuff specific to Piped soon. Also noticed a few small bugs I gotta fix, but yeah, overall it's getting pretty stable except for the piped section in the menu (which will have some of the new stuff) |
can we edit the theme as simple user or only if you host your own piped? Also, I wanted to create a new issue but the default dark theme is hard on the eyes. The github dark theme is better for example. |
@BarbzYHOOL Yeah, efy (the UI framework it uses) is very customizable for the user, you can create billions of designs, just click / tap on the sidebar menu button from the top right corner (3 horizontal lines like this: In fact, if you like the github theme, you can probably paste the colors they have into efy, change the radius, borders etc and it will look similar. And not only that, but if someome else wants the same, you can share the file with them. You can also export a theme as json from Just keep in mind to backup your theme, cuz this Piped instance is not fully stable yet and soon I will push a breaking update. |
I am using public Piped instances and there is no such option example here https://piped.lunar.icu/ or https://piped.video/preferences Is it because they haven't updated? Edit: ok it's not in the source code, I thought it was because it's an issue and not a Pull Request ^ |
@BarbzYHOOL those instances don't use efy, that's why, there's 3-4 afaik, but the most up to date one is efy.piped.pages.dev, so I'd recommend that one. As for the source code, you can see it on the efy branch of Piped. It's not part of the main branch yet to smooth out issues, stability etc before making it official. It's still in the experimental phase if that makes sense. |
thanks, should i only use this piped instance for testing? PS: the piped instance i'm using has trouble loading videos, kinda annoying, i hope it's just the instance, i'm new to it |
@BarbzYHOOL you can use other ones too, but you're not guaranteed to have the latest version, so for that, yeah, that instance is the most recommended and "official" haha. For loading videos, Youtube bans IPs or changes its structure constantly, which we're not fully in control, change the backend instance from settings when you notice that until you find one that works. You can keep the same frontend, you just gotta change the backend basically. But that's related to Piped in general, not this instance. Anyway, let me know how it goes with theming if you have thoughts you wanna share, since this thread is for that. You can also ask efy questions in the efy room or Piped questions in the Piped room depending on what the questions are related to. |
@BarbzYHOOL it's cuz either your browser and desktop environment doesn't support window transparency or you need a transparent gtk / qt theme. It's explained on the question mark alongside. You can use transparency on any device tho if you add your own images from the And in case it's not clear, transparent windows look like this (ignore the red line, I'm too lazy to take a new screenshot lol): while background images with transparency or layers like this: The window addresses what's behind it, while the background what's above it. |
@kzhe2059 Thanks for the feedback! For me it works fine on other instances than smnz.de, so it doesn't seem to be an issue related to the efy instance, because on piped.video for example it does the same, so I'd suggest you to switch the instance or contact the instance owner if they're okay with that |
Is there any way to use a custom instance on the new UI? |
@kzhe2059 If you mean changing the backend instance, then go to |
Yes, but you can only choose from the list, not input custom url for the api and such |
Hey @Reinachan! Yeah, it's the right place.
Thanks for the feedback, feel free to give me more whenever you feel the need to, it helps me and the community overall have a better experience! Just keep in mind that my time for Piped is limited currently cuz of other priorities, but soon I'll work on more stuff |
@kzhe2059 that's not related to efy then... cuz the official piped doesn't have that feature either, so I guess maybe talk to the main devs about it IF THEY LIKE THE IDEA, else it won't be added in the efy version either, since I'd have to rely on the defaults, which I'm not responsible for. |
Hello! I noticed that there is no share video button. Is that planned to be added? |
@Imzxhir yes, it's a bug I'll fix soon, it should be easy, it annoys me too, as someone who copies links a lot haha |
Here's the new Piped redesign! 🥳 It uses efy for customisation features and to help you theme it how you want. It's not just simple predetermined themes, you can actually create billions of patterns & themes yourself or import them from others.
You can track the current status of the features, ideas & bugs here. I'm also working on the documentation to make it easier for devs to understand the logic behind it and contribute. Any feedback or suggestions you have, please share them, I and other really cool people who I'm grateful for have been testing it, but bugs can still come up, therefore if you wanna share something, please do!
Live demo: https://efy.piped.pages.dev
Matrix room for questions and support specific to efy: https://matrix.to/#/#efy_ui:matrix.org
Features
Special thanks to: Bnyro, Kavin, Zucc (whatever.social), Diamond_AaronXG, IkelAtomig and other small or anonymous contributors, you guys rock! 🔥
The text was updated successfully, but these errors were encountered: