[Feature Request]: Restyle floatingRefreshSection

[pkrasicki]

Guidelines

• [X] I have searched the issue tracker for open and closed issues that are similar to the feature request I want to file, without success.
• [X] I have searched the documentation for information that matches the description of the feature request I want to file, without success.
• [X] This issue contains only one feature request.

Problem Description

The floating refresh section in FreeTube 0.23 (modified in #4380) obscures some of the content while scrolling.

Proposed Solution

Remove most of the background and reposition the text, so that it obscures less content.

refresh-section.webm

Alternatives Considered

None.

Issue Labels

visual improvement

Additional Information

CSS code (needs testing on mobile):

.floatingRefreshSection
{
    background-color: transparent;
    box-shadow: none;
    border-inline-start: none;

    .lastRefreshTimestamp
    {
        background-color: var(--card-bg-color);
        position: relative;
        top: -12px;
    }
}

[pkrasicki]

I forgot that unlike my design FreeTube has different background color for the card and for the page background, so this change won't look as good as on my screenshots. But maybe it's still worth trying?

Edit: Here is what it would actually look like in FreeTube. I think it looks good: