プロジェクト

全般

プロフィール

Vote #79557

未完了

Some buttons in wiki toolbar are hidden in responsive layout

Admin Redmine さんが3年以上前に追加. 3年以上前に更新.

ステータス:
New
優先度:
通常
担当者:
-
カテゴリ:
UI - Responsive_57
開始日:
2022/05/09
期日:
進捗率:

0%

予定工数:
category_id:
57
version_id:
33
issue_org_id:
29694
author_id:
332
assigned_to_id:
107353
comments:
5
status_id:
1
tracker_id:
1
plus1:
0
affected_version:
closed_on:
affected_version_id:
ステータス-->[New]

説明

#27758#note-8 by Marius BALTEANU:

on responsive mode, when the screen resolution width in less than the total width of the js toolbar (tabs + buttons), some buttons become hidden. I'm not happy with the current solution, but is not a blocker from my point of view and we can improve this later when we have a better solution.

#27758#note-53 by Takeshi Nakamura:

Toolbar buttons are not wrapped when the screen is narrow.

Redmine 4.0

!/attachments/download/21519/toolbar-4.0.png!

Redmine 3.4

!/attachments/download/21518/toolbar-3.4.png!


journals

--------------------------------------------------------------------------------
I made two patterns of patches to make wiki-toolbar scrollable.
Attach the patches with the screenshot.

(1) scrollable-css.patch
Add scroll setting with css to wiki-toolbar.

!{width:400px}scrollable-css.gif!

(2) move-left-right-buttons.patch
Add buttons to move the wiki-toolbar left and right like the setting screen.

!{width:500px}move-left-right-buttons.png!
--------------------------------------------------------------------------------
It may be one of the solutions to reduce buttons by implementing a context menu like Slack. In Slack, the menu is displayed when you select text. We can remove some buttons from the current toolbar with the popup menu.

!{border: 1px solid grey;}.slack-popup-menu.png!
--------------------------------------------------------------------------------
Github also has an interesting solution for this issue. They simply put their toolbar under the tab if there's not enough space left next to it.

On wide screens the toolbar is next to the tabs.
!github_wide.png!

On narrow screens it moves under the tabs in the input field area.
!github_small.png!

--------------------------------------------------------------------------------


related_issues

relates,Closed,27758,Adds preview option to the wiki toolbar

Admin Redmine さんが3年以上前に更新

  • カテゴリUI - Responsive_57 にセット
  • 対象バージョンCandidate for next minor release_33 にセット

他の形式にエクスポート: Atom PDF

いいね!0
いいね!0