FreakU
/
Retrospring
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add mobile user menu

This commit is contained in:
Karina Kwiatek 2021-08-07 19:18:01 +02:00
parent e895dedd14
commit 31a8bf6f00
3 changed files with 15 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/assets/stylesheets/components/_mobile-nav.scss
View File

@ -1,7 +1,7 @@
#rs-mobile-nav { #rs-mobile-nav {
padding-bottom: unquote('calc(env(safe-area-inset-bottom) + 4px)'); padding-bottom: unquote('calc(env(safe-area-inset-bottom) + 4px)');
.navbar-nav { .navbar-icon-row {
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
width: 100%; width: 100%;
@ -16,3 +16,11 @@
} }
} }
} }
#rs-mobile-nav-profile {
position: fixed;
bottom: unquote("calc(env(safe-area-inset-bottom) + #{$navbar-height + 2px})");
right: unquote("calc(env(safe-area-inset-right) + 15px)");
left: unset;
top: unset;
}

8
app/views/navigation/_mobile.haml
View File

@ -1,14 +1,12 @@
= render 'navigation/mobile/profile'
%nav.navbar.navbar-themed.bg-primary.fixed-bottom.d-lg-none.d-block#rs-mobile-nav{ role: :navigation } %nav.navbar.navbar-themed.bg-primary.fixed-bottom.d-lg-none.d-block#rs-mobile-nav{ role: :navigation }
.container{ class: ios_web_app? ? 'ios-web-app' : '' } .container{ class: ios_web_app? ? 'ios-web-app' : '' }
%ul.nav.navbar-nav.mr-auto %ul.nav.navbar-nav.navbar-icon-row
.collapse.navbar-collapse#j2-mobile-navbar-collapse
%ul.nav.navbar-nav
= render 'navigation/mobile/profile'
= nav_entry t('views.navigation.timeline'), root_path, icon: 'home', icon_only: true = nav_entry t('views.navigation.timeline'), root_path, icon: 'home', icon_only: true
= nav_entry t('views.navigation.inbox'), '/inbox', badge: inbox_count, icon: 'inbox', icon_only: true = nav_entry t('views.navigation.inbox'), '/inbox', badge: inbox_count, icon: 'inbox', icon_only: true
- if APP_CONFIG.dig(:features, :discover, :enabled) || current_user.mod? - if APP_CONFIG.dig(:features, :discover, :enabled) || current_user.mod?
= nav_entry t('views.navigation.discover'), discover_path, icon: 'compass', icon_only: true = nav_entry t('views.navigation.discover'), discover_path, icon: 'compass', icon_only: true
= nav_entry t('views.navigation.notifications'), '#', icon: 'bell-o', icon_only: true = nav_entry t('views.navigation.notifications'), '#', icon: 'bell-o', icon_only: true
%li.nav-item.profile--image-dropdown %li.nav-item.profile--image-dropdown
%a{ data: { target: '#j2-mobile-navbar-collapse', toggle: :collapse } } %a.nav-link{ href: '#', data: { toggle: 'dropdown', target: '#rs-mobile-nav-profile' }, aria: { controls: 'rs-mobile-nav-profile', expanded: 'false' } }
%img.avatar-md.d-inline{ src: current_user.profile_picture.url(:small) } %img.avatar-md.d-inline{ src: current_user.profile_picture.url(:small) }

2
app/views/navigation/mobile/_profile.haml
View File

@ -1,4 +1,4 @@
.dropdown-menu .dropdown-menu#rs-mobile-nav-profile
%h6.dropdown-header.d-none.d-sm-block= current_user.screen_name %h6.dropdown-header.d-none.d-sm-block= current_user.screen_name
%a.dropdown-item{ href: show_user_profile_path(current_user.screen_name) } %a.dropdown-item{ href: show_user_profile_path(current_user.screen_name) }
%i.fa.fa-fw.fa-user %i.fa.fa-fw.fa-user