keii.dev
1{{--
2 Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the GNU Affero General Public License v3.0.
3 See the LICENCE file in the repository root for full licence text.
4--}}
5@php
6 $user = Auth::user();
7@endphp
8<div class="visible-xs no-print js-header--main">
9 <div class="navbar-mobile-before"></div>
10
11 <div class="navbar-mobile" role="navigation">
12 <div class="navbar-mobile__header-section">
13 <a class="navbar-mobile__logo" href="{{ route('home') }}"></a>
14 <span class="navbar-mobile__brand u-ellipsis-overflow">
15 {{ page_title() }}
16 </span>
17 </div>
18
19 <div class="navbar-mobile__header-section navbar-mobile__header-section--buttons">
20 <button
21 type="button"
22 class="navbar-mobile__toggle js-click-menu"
23 data-click-menu-target="mobile-menu"
24 >
25 <span class="sr-only">Toggle navigation</span>
26 <span class="navbar-mobile__toggle-icon">
27 <i class="fas fa-chevron-down"></i>
28 </span>
29 </button>
30 </div>
31 </div>
32
33 <div
34 class="mobile-menu js-click-menu u-fancy-scrollbar"
35 data-click-menu-id="mobile-menu"
36 >
37 <div class="mobile-menu__content">
38 <div class="mobile-menu__tabs">
39 @if (isset($user))
40 <a
41 href="{{ route('users.show', $user->user_id) }}"
42 data-click-menu-target="mobile-user"
43 class="mobile-menu-tab mobile-menu-tab--user js-click-menu"
44 >
45 <span class="mobile-menu-tab__avatar">
46 <span
47 class="avatar avatar--full-rounded"
48 style="background-image: url('{{ $user->user_avatar }}');"
49 ></span>
50 </span>
51
52 <span class="u-ellipsis-overflow">
53 {{ $user->username }}
54 </span>
55 </a>
56 @else
57 <button
58 class="mobile-menu-tab mobile-menu-tab--user js-user-link"
59 >
60 <span class="mobile-menu-tab__avatar">
61 <span class="avatar avatar--full-rounded avatar--guest"></span>
62 </span>
63
64 <span class="u-ellipsis-overflow">
65 {{ osu_trans('layout.popup_login.button') }}
66 </span>
67 </button>
68 @endif
69
70 <button class="mobile-menu-tab js-click-menu" data-click-menu-target="mobile-nav">
71 <span class="fas fa-sitemap"></span>
72 </button>
73
74 @if (isset($user))
75 <button class="mobile-menu-tab js-click-menu" data-click-menu-target="mobile-search">
76 <span class="fas fa-search"></span>
77 </button>
78
79 <a
80 class="mobile-menu-tab js-click-menu js-react--chat-icon"
81 data-click-menu-target="mobile-chat-notification"
82 data-turbo-permanent
83 data-type='mobile'
84 id="notification-widget-chat-icon-mobile"
85 href="{{ route('chat.index') }}"
86 >
87 <span class="notification-icon notification-icon--mobile">
88 <i class="fas fa-comment-alt"></i>
89 <span class="notification-icon__count">...</span>
90 </span>
91 </a>
92
93 <a
94 class="mobile-menu-tab js-click-menu js-react--main-notification-icon"
95 data-click-menu-target="mobile-notification"
96 data-turbo-permanent
97 data-type='mobile'
98 id="notification-widget-icon-mobile"
99 href="{{ route('notifications.index') }}"
100 >
101 <span class="notification-icon notification-icon--mobile">
102 <i class="fas fa-inbox"></i>
103 <span class="notification-icon__count">...</span>
104 </span>
105 </a>
106 @endif
107 </div>
108
109 <div class="mobile-menu__item js-click-menu" data-click-menu-id="mobile-user">
110 @include('layout.header_mobile.user')
111 </div>
112
113 <div class="mobile-menu__item js-click-menu" data-click-menu-id="mobile-nav">
114 @include('layout.header_mobile.nav')
115 </div>
116
117 @if (isset($user))
118 <div class="mobile-menu__item mobile-menu__item--search js-click-menu js-react--quick-search" data-click-menu-id="mobile-search">
119 </div>
120
121 <div
122 class="mobile-menu__item js-click-menu js-react--notification-widget"
123 data-click-menu-id="mobile-chat-notification"
124 data-notification-widget="{{ json_encode(['only' => 'channel']) }}"
125 data-visibility="hidden"
126 data-turbo-permanent
127 id="notification-widget-chat-mobile"
128 ></div>
129
130 <div
131 class="mobile-menu__item js-click-menu js-react--notification-widget"
132 data-click-menu-id="mobile-notification"
133 data-notification-widget="{{ json_encode(['excludes' => ['channel']]) }}"
134 data-visibility="hidden"
135 data-turbo-permanent
136 id="notification-widget-mobile"
137 ></div>
138 @endif
139 </div>
140 </div>
141</div>