Skip to content

General layout improvement: Top level navigation + structure#6047

Draft
math-GH wants to merge 150 commits intoFreshRSS:edgefrom
math-GH:General-layout-improved
Draft

General layout improvement: Top level navigation + structure#6047
math-GH wants to merge 150 commits intoFreshRSS:edgefrom
math-GH:General-layout-improved

Conversation

@math-GH
Copy link
Copy Markdown
Contributor

@math-GH math-GH commented Jan 18, 2024

The first draft was presented in #5966. This is now the implementation.

close #4224

This PR is still in draft but I am happy about each comment or feedback

  • Roughly fine with Origine theme (wide screen)
  • Roughly fine with Origine theme (small screen/mobile devices)
  • introduce a new break point 1200px
  • Fine with each theme
    • Origine
    • Origine compact
    • Alternative dark
    • Dark/Dark Pink
    • Ansum/Mapco
    • Flat design
    • Nord
    • Pafat
    • Swage
  • Install routine page
  • views
    • normal view
    • global view
    • reading view
  • Anonym. reading
  • login page
  • about page as guest
  • TOS page as guest
  • check extensions
    • Colorful List
    • Custom CSS
    • Custom JS
    • Image Proxy (not relevant, but works fine)
    • Quick Collapse
    • ReadingTime
    • Share By Email <== buggy
    • Sticky Feeds (not necessary anymore)
    • Title-Wrap
    • ShowFeedID
    • ThreePanesView <== buggy
    • any other important extension, that needs to be checked?
  • navigation buttons
    • invisible buttons
    • visible buttons
    • left button
    • right button
    • up button
  • options for less buttons in the header
  • Update screenshots of the themes

known issues

  • Tested the shortcuts for switching the views
  • offset of mark read while scrolling
  • extensions
  • ....... please leave feedback and your testing results here in the comment sections ....

(more screenshots + description will follow)

Out of scope

(not so important, discussion needed, PR could follow):

  • [ ]reorganize the navigation side bar (aside_config.phtml, aside_subscription.phtml), following the new dropdown menu structure

@math-GH math-GH added UI 🎨 User Interfaces UX User experience labels Jan 18, 2024
@math-GH math-GH added this to the 1.24.0 milestone Jan 18, 2024
@math-GH math-GH marked this pull request as draft January 18, 2024 12:02
@Alkarex
Copy link
Copy Markdown
Member

Alkarex commented Jan 18, 2024

I like the fixed bar at the top 👍🏻

I am more neutral about the left bar. But it is nice with an update 🙂

The improvements of the mobile view are what I am most looking forward to.

A couple of notes, which you probably already have spotted:

  • The "plus" button (to add feeds) leads to a dead link
  • With the option "auto mark as read during scroll", the vertical cut before which articles should be marked as read should be adjusted a bit (at the moment, it is about ~2 articles off).

@Frenzie
Copy link
Copy Markdown
Member

Frenzie commented Jul 19, 2024

Feel free to ping me again in a few days if I forget; it's a bit too late now. :-)

@Alkarex
Copy link
Copy Markdown
Member

Alkarex commented Jul 22, 2024

I am giving it a try

@Alkarex
Copy link
Copy Markdown
Member

Alkarex commented Jul 22, 2024

  • Mark as read during scroll does not seem to work in mobile view

  • In mobile view, buttons become too narrow, despite the fact that there is a lot of remaining margin available
    image

  • When opening the user labels drop-down menu, the interface moves a bit up and down

@math-GH
Copy link
Copy Markdown
Contributor Author

math-GH commented Jul 29, 2024

In mobile view, buttons become too narrow, despite the fact that there is a lot of remaining margin available
image

The buttons have the same size like the buttons below in normal view (filter buttons). It is not simple to have the best size for a responsive window. Could you check it on your mobile phone with its screen resolution?

@Alkarex
Copy link
Copy Markdown
Member

Alkarex commented Jul 30, 2024

Screenshot_20240730_132117_Firefox Beta

@math-GH
Copy link
Copy Markdown
Contributor Author

math-GH commented Aug 7, 2024

It looks as expected for me. What would you change/improve?

@Alkarex
Copy link
Copy Markdown
Member

Alkarex commented Aug 11, 2024

When changing page, the new left menu has a tendency to jump (Firefox) briefly during loading, because the last button arrives later. Screenshot during loading, showing only two buttons:
image
If needed, I can do a screen recording a bit later.
I will try to use this PR a bit

@Alkarex
Copy link
Copy Markdown
Member

Alkarex commented Aug 11, 2024

Quick test on Firefox mobile:

  • Loading more articles automatically seems broken
  • marking articles as read on scroll broken as well
  • Expanding an article when another one is already expanded moves the view to the wrong position

@Alkarex
Copy link
Copy Markdown
Member

Alkarex commented Aug 11, 2024

I think the help icon takes too much real-estate compared to how often it will be used, especially in the mobile view (for which I would rather like to have larger buttons)
image

I suggest removing it and moving its two entries to one of the other two icons

@math-GH
Copy link
Copy Markdown
Contributor Author

math-GH commented Aug 17, 2024

Quick test on Firefox mobile:

* [ ]  Loading more articles automatically seems broken

* [ ]  marking articles as read on scroll broken as well

* [ ]  Expanding an article when another one is already expanded moves the view to the wrong position

Yes, I am still investigating what is broken here.

@math-GH
Copy link
Copy Markdown
Contributor Author

math-GH commented Aug 17, 2024

I think the help icon takes too much real-estate compared to how often it will be used, especially in the mobile view (for which I would rather like to have larger buttons) image

I suggest removing it and moving its two entries to one of the other two icons

I agree. I thought that I wrote down already my thoughts about it but cannot find it anymore:
I would like to give new users the opportunity to find help faster so that the onboarding is a bit smoother.
On the other hand there are a lot of power users who does not the help anymore at this prominent place.

@Frenzie : What do you think about it?

@math-GH
Copy link
Copy Markdown
Contributor Author

math-GH commented Aug 17, 2024

When changing page, the new left menu has a tendency to jump (Firefox) briefly during loading, because the last button arrives later. Screenshot during loading, showing only two buttons

I understand what you mean, but I cannot reproduce it nor I cannot understand the reason for this behaviour.

@Frenzie
Copy link
Copy Markdown
Member

Frenzie commented Aug 17, 2024

@Frenzie : What do you think about it?

I'd move help under settings.

'title' => 'Visualizzazione',
'view_bar' => array(
'headline' => 'View bar', // TODO
'show_add_feed_category_button' => 'Show „Add Feed or Category“ quick button', // TODO
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Suggested change
'show_add_feed_category_button' => 'Show „Add Feed or Category“ quick button', // TODO
'show_add_feed_category_button' => 'Mostra il pulsante rapido “Aggiungi feed o categoria”',

'view_bar' => array(
'headline' => 'View bar', // TODO
'show_add_feed_category_button' => 'Show „Add Feed or Category“ quick button', // TODO
'show_help_button' => 'Show „Help“ quick button', // TODO
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Suggested change
'show_help_button' => 'Show „Help“ quick button', // TODO
'show_help_button' => 'Mostra il pulsante rapido “Aiuto”',

'back' => '← Torna indietro',
'back_to_rss_feeds' => '← Indietro',
'cancel' => 'Annulla',
'close' => 'Close', // TODO
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Suggested change
'close' => 'Close', // TODO
'close' => 'Chiudere',

'configuration' => 'Configurazione',
'display' => 'Visualizzazione',
'extensions' => 'Estensioni',
'help' => 'Help', // TODO
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Suggested change
'help' => 'Help', // TODO
'help' => 'Aiuto',

),
'share' => 'Condividi',
'tag' => array(
'more' => 'More article tags', // TODO
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Suggested change
'more' => 'More article tags', // TODO
'more' => 'Altri tag dell'articolo',

@Alkarex Alkarex modified the milestones: 1.26.0, 1.27.0 Feb 6, 2025
@Alkarex Alkarex modified the milestones: 1.27.0, 1.28.0 Aug 18, 2025
@Alkarex Alkarex modified the milestones: 1.28.0, 1.29.0 Dec 16, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

UI 🎨 User Interfaces UX User experience

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] Reading View: Feed menu in side bar: does not work

5 participants