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

Style and position badges on mobile nav

This commit is contained in:
Karina Kwiatek 2021-08-12 21:56:28 +02:00
parent c33c4bb4ed
commit d76af263ce
3 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -19,7 +19,9 @@
} }
.badge { .badge {
float: right; position: absolute;
top: 4px;
transform: translateX(16px);
} }
} }
} }

9
app/helpers/application_helper.rb
View File

@ -23,11 +23,10 @@ module ApplicationHelper
end end
end end
unless options[:badge].nil? unless options[:badge].nil?
# TODO: make this prettier? badge_class = "badge"
body << " #{ badge_class << " badge-#{options[:badge_color]}" unless options[:badge_color].nil?
content_tag(:span, options[:badge], class: ("badge#{ badge_class << " badge-pill" if options[:badge_pill]
" badge-#{options[:badge_color]}" unless options[:badge_color].nil? body << " #{content_tag(:span, options[:badge], class: badge_class)}"
}"))}"
end end
content_tag(:li, link_to(body.html_safe, path, class: "nav-link"), class: classes) content_tag(:li, link_to(body.html_safe, path, class: "nav-link"), class: classes)

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

@ -4,11 +4,13 @@
.container{ class: ios_web_app? ? 'ios-web-app' : '' } .container{ class: ios_web_app? ? 'ios-web-app' : '' }
%ul.nav.navbar-nav.navbar-icon-row %ul.nav.navbar-nav.navbar-icon-row
= 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, badge_color: 'primary', badge_pill: true,
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'), '/notifications', = nav_entry t('views.navigation.notifications'), '/notifications',
badge: notification_count, badge_color: 'light', badge_pill: true, badge: notification_count, badge_color: 'primary', badge_pill: true,
icon: notifications_icon, icon_only: true icon: notifications_icon, icon_only: true
%li.nav-item.profile--image-dropdown %li.nav-item.profile--image-dropdown
%a.nav-link{ href: '#', data: { toggle: 'dropdown', target: '#rs-mobile-nav-profile' }, aria: { controls: 'rs-mobile-nav-profile', expanded: 'false' } } %a.nav-link{ href: '#', data: { toggle: 'dropdown', target: '#rs-mobile-nav-profile' }, aria: { controls: 'rs-mobile-nav-profile', expanded: 'false' } }