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

Make notification bell more prominent on mobile #20108

Merged
merged 12 commits into from
Jul 4, 2022

Conversation

tyroneyeh
Copy link
Contributor

Closes #20069

@GiteaBot GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Jun 23, 2022
@tyroneyeh
Copy link
Contributor Author

Results:

image
image

@lunny lunny added the topic/ui Change the appearance of the Gitea UI label Jun 24, 2022
@lunny lunny added this to the 1.18.0 milestone Jun 24, 2022
@lunny
Copy link
Member

lunny commented Jun 24, 2022

So for non-login, it's a blank in the right-top corner.

@tyroneyeh
Copy link
Contributor Author

non-login is display this

image

@wxiaoguang
Copy link
Contributor

wxiaoguang commented Jun 24, 2022

IMO there might be an easier solution. Keep the layout as much as possible, just move the bell(notification) element out from the right stackable menu and put the bell alongside the menu. The benefit is that there will be still only one bell element, instead of two copied, which is not easy to be maintained in the future. Just a guess, haven't tried yet.

Hmm ... it seems not feasible. The mobile layout and desktop layout is different.

@lunny
Copy link
Member

lunny commented Jun 24, 2022

How about put the smallbell middle?

@tyroneyeh
Copy link
Contributor Author

How about put the smallbell middle?

like this?
Screen Shot 2022-06-24 at 11 27 51
Screen Shot 2022-06-24 at 11 27 38

@wxiaoguang
Copy link
Contributor

like this?

Looks fine to me. Or make the bell right-aligned(beside the menu), either is fine to me.

@codecov-commenter
Copy link

Codecov Report

❗ No coverage uploaded for pull request base (main@d0507ef). Click here to learn what that means.
The diff coverage is n/a.

@@           Coverage Diff           @@
##             main   #20108   +/-   ##
=======================================
  Coverage        ?   46.94%           
=======================================
  Files           ?      972           
  Lines           ?   134536           
  Branches        ?        0           
=======================================
  Hits            ?    63164           
  Misses          ?    63630           
  Partials        ?     7742           

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update d0507ef...9849c91. Read the comment docs.

templates/base/head_navbar.tmpl Outdated Show resolved Hide resolved
templates/base/head_navbar.tmpl Outdated Show resolved Hide resolved
@GiteaBot GiteaBot added lgtm/need 1 This PR needs approval from one additional maintainer to be merged. and removed lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. labels Jun 25, 2022
@GiteaBot GiteaBot added lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. and removed lgtm/need 1 This PR needs approval from one additional maintainer to be merged. labels Jun 25, 2022
@tyroneyeh
Copy link
Contributor Author

conflict ?

@lunny
Copy link
Member

lunny commented Jul 4, 2022

conflict ?

Yes, please resolve the conflicts.

@tyroneyeh
Copy link
Contributor Author

conflict ?

Yes, please resolve the conflicts.

Solved

@lunny
Copy link
Member

lunny commented Jul 4, 2022

LGTM

@lunny lunny merged commit c174bdc into go-gitea:main Jul 4, 2022
@zeripath zeripath changed the title Adjust template for #20069 smallbell Make notification bell more prominent on mobile Jul 6, 2022
zeripath added a commit to zeripath/gitea that referenced this pull request Jul 6, 2022
…itea#20236, go-gitea#20251)

Backport go-gitea#20108
Backport go-gitea#20236
Backport go-gitea#20251

Make notification bell more prominent on mobile

Co-authored-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: Tyrone Yeh <siryeh@gmail.com>
Signed-off-by: Andrew Thornton <art27@cantab.net>
zeripath added a commit to zeripath/gitea that referenced this pull request Jul 6, 2022
Unfortunately there is a bug in go-gitea#20108 where the translation call was
not updated to use `.locale` from `.i18n`.

This PR updates the template to use `.locale`.

Signed-off-by: Andrew Thornton <art27@cantab.net>
zeripath added a commit that referenced this pull request Jul 6, 2022
Unfortunately there is a bug in #20108 where the translation call was
not updated to use `.locale` from `.i18n`.

This PR updates the template to use `.locale`.

Signed-off-by: Andrew Thornton <art27@cantab.net>
zjjhot added a commit to zjjhot/gitea that referenced this pull request Jul 7, 2022
* upstream/main:
  Modify milestone search keywords to be case insensitive (go-gitea#20266)
  Fix toolip on mobile notification bell (go-gitea#20270)
  Allow RSA 2047 bit keys (go-gitea#20272)
  Refix notification bell placement (go-gitea#20251)
  Bump mermaid from 9.1.1 to 9.1.2 (go-gitea#20256)
  EscapeFilter the group dn membership (go-gitea#20200)
  Only show Followers that current user can access (go-gitea#20220)
  Init popup for new code comment (go-gitea#20234)
  Bypass Firefox (iOS) bug (go-gitea#20244)
  Adjust max-widths for the repository file table (go-gitea#20243)
  Display full name (go-gitea#20171)
  Adjust class for mobile has the problem of double small bells (go-gitea#20236)
  Adjust template for go-gitea#20069 smallbell (go-gitea#20108)
  Add integration tests for the Gitea migration form (go-gitea#20121)
  Allow dev i18n to be more concurrent (go-gitea#20159)
  Allow enable LDAP source and disable user sync via CLI (go-gitea#20206)
6543 pushed a commit that referenced this pull request Jul 7, 2022
…) (#20269)

Backport #20108
Backport #20236
Backport #20251

Make notification bell more prominent on mobile

Co-authored-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: Tyrone Yeh <siryeh@gmail.com>
Signed-off-by: Andrew Thornton <art27@cantab.net>
@6543 6543 added backport/done All backports for this PR have been created backport/v1.17 labels Jul 7, 2022
dineshsalunke pushed a commit to dineshsalunke/gitea that referenced this pull request Jul 9, 2022
* Adjust template for go-gitea#20069 smallbell

* Adjust notification Unread Count variable to global and count bell position with mobile

* Adjust bell icon style

* Adjust smallbell to middle

* Avoid using inline styles

* move notificationUnreadCount to a general code block, reduce changed lines

* Solved conflicts

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: 6543 <6543@obermui.de>
dineshsalunke pushed a commit to dineshsalunke/gitea that referenced this pull request Jul 9, 2022
Unfortunately there is a bug in go-gitea#20108 where the translation call was
not updated to use `.locale` from `.i18n`.

This PR updates the template to use `.locale`.

Signed-off-by: Andrew Thornton <art27@cantab.net>
@tyroneyeh tyroneyeh deleted the 20069_smallbell_for_mobile branch July 17, 2022 14:43
Gusted pushed a commit to Gusted/gitea that referenced this pull request Jul 29, 2022
- Since go-gitea#20108 we have two version of the notification bell, one for
mobile the other for non-mobile. However the code only accounts for one
notification count and thus was only updating the non-mobile one.
- This code fixes that by applying the code for all
`.notification_count`s.
- Frontport will be in go-gitea#20543
wxiaoguang pushed a commit that referenced this pull request Jul 30, 2022
- Since #20108 we have two version of the notification bell, one for
mobile the other for non-mobile. However the code only accounts for one
notification count and thus was only updating the non-mobile one.
- This code fixes that by applying the code for all `.notification_count`s.
- Frontport will be in #20543
vsysoev pushed a commit to IntegraSDL/gitea that referenced this pull request Aug 10, 2022
* Adjust template for go-gitea#20069 smallbell

* Adjust notification Unread Count variable to global and count bell position with mobile

* Adjust bell icon style

* Adjust smallbell to middle

* Avoid using inline styles

* move notificationUnreadCount to a general code block, reduce changed lines

* Solved conflicts

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: 6543 <6543@obermui.de>
vsysoev pushed a commit to IntegraSDL/gitea that referenced this pull request Aug 10, 2022
Unfortunately there is a bug in go-gitea#20108 where the translation call was
not updated to use `.locale` from `.i18n`.

This PR updates the template to use `.locale`.

Signed-off-by: Andrew Thornton <art27@cantab.net>
@go-gitea go-gitea locked and limited conversation to collaborators May 3, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
backport/done All backports for this PR have been created lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. topic/ui Change the appearance of the Gitea UI
Projects
None yet
Development

Successfully merging this pull request may close these issues.

The display problem of the small bell in the mobile phone
8 participants