Skip to content
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

Temporary Fix: change height and padding of podcast and form footer #20826

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

morfenza
Copy link
Contributor

@morfenza morfenza commented Apr 2, 2024

What type of PR is this? (check all applicable)

  • Refactor
  • Feature
  • Bug Fix
  • Optimization
  • Documentation Update

Description

As described in the issue there is a visual "glitch" of sorts when listening to a podcast and creating a post, the podcast bar can make it difficult to press the "Publish" button.

I've decided to make a temporary fix while a more sophisticated solution is found.

Temporary fix:

Screenshot from 2024-04-02 11-05-52

image

SUGGESTION

Admins, please create an issue to implement a new feature: minimize the podcast bar, button " - ", this hide feature will conceil the progress bar, leaving only the play button and the maximize button e.g: " > "

When minimized:

Screenshot from 2024-04-02 11-14-56

Related Tickets & Documents

Added/updated tests?

We encourage you to keep the code coverage percentage at 80% and above.

  • Yes
  • No, there is no need
  • I need help with writing tests

[optional] What gif best describes this PR or how it makes you feel?

family-guy-css

@morfenza morfenza requested a review from a team as a code owner April 2, 2024 14:26
@morfenza morfenza requested review from lightalloy and maestromac and removed request for a team April 2, 2024 14:26
Copy link
Contributor

github-actions bot commented Apr 2, 2024

Thank you for opening this PR! We appreciate you!

For all pull requests coming from third-party forks we will need to
review the PR before we can process it through our CI pipelines.

A Forem Team member will review this contribution and get back to
you as soon as possible!

Copy link
Contributor

github-actions bot commented Apr 2, 2024

Uffizzi Ephemeral Environment Deploying

☁️ https://app.uffizzi.com/github.com/forem/forem/pull/20826

⚙️ Updating now by workflow run 8540579994.

What is Uffizzi? Learn more!

@@ -11,7 +11,7 @@
#progressBar {
color: #fff;
width: 100%;
height: calc(48px + 1vh);
height: calc(43px + 1vh);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@morfenza I would advice you to either define a custom variable (e.g. --progress-bar-height: xx ) here or use of the properties available on stylesheets/config/variables and apply them in all of these instances

Plus, I think you might want to remove the +1vh and calc function if you want to keep the same height, otherwise check how it looks on mobile or other viewports.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice suggestion, I'll try to implement it! Thanks! <3

@morfenza morfenza force-pushed the fix/podcast-layout-problem-with-publish-tools branch from d0cfe6b to bb9fc16 Compare April 3, 2024 14:23
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

When listening to a podcast, the bar overlaps to publish tools
2 participants