Skip to content
GitLab
Commit bcd0ead4 authored by ZeMKI's avatar ZeMKI
Browse files

New UI workings 

* finished searchable studies
* improved accessibility
* optimized code
parent cad5a6d5
Expand all Hide whitespace changes
Inline Side-by-side
app/Http/Controllers/HomeController.php
View file @ bcd0ead4
......@@ -23,22 +23,21 @@ class HomeController extends Controller
public function asuser($userid)
{
if(!auth()->user()->isAdmin()) abort(401);
if (!auth()->user()->isAdmin()) {
abort(401);
}
$data['studies'] = User::findOrFail((int)$userid)->studies()->with('sortings')->get();
$data['invited_studies'] = User::findOrFail((int)$userid)->invites;
$data['breadcrumb'] = ['Home'];
if (User::findOrFail((int)$userid)->profile()->exists())
{
if (User::findOrFail((int)$userid)->profile()->exists()) {
$data['newsletter'] = auth()->user()->profile->newsletter === config('enums.newsletter_status.NOT DECIDED');
} else
{
} else {
$profile = User::findOrFail((int)$userid)->addProfile(User::findOrFail((int)$userid));
$data['newsletter'] = User::findOrFail((int)$userid)->profile->newsletter === config('enums.newsletter_status.NOT DECIDED');
}
return view('home', $data);
return view('home', $data);
}
/**
......@@ -47,14 +46,17 @@ class HomeController extends Controller
*/
public function index()
{
$data['studies'] = auth()->user()->studies()->with('sortings')->get();
$data['studies'] = auth()->user()->studies()->with('sortings', 'interviews')->get();
foreach ($data['studies'] as $key => $value) {
$data['studies'][$key]['authiscreator'] = Auth::user()->is($data['studies'][$key]->creator());
$data['studies'][$key]['editable'] = $data['studies'][$key]->isEditable();
}
ray($data['studies']);
$data['invited_studies'] = auth()->user()->invites;
$data['breadcrumb'] = ['Home'];
if (auth()->user()->profile()->exists())
{
if (auth()->user()->profile()->exists()) {
$data['newsletter'] = auth()->user()->profile->newsletter === config('enums.newsletter_status.NOT DECIDED');
} else
{
} else {
$profile = auth()->user()->addProfile(auth()->user());
$data['newsletter'] = auth()->user()->profile->newsletter === config('enums.newsletter_status.NOT DECIDED');
}
......
package-lock.json
View file @ bcd0ead4
This diff is collapsed.
resources/js/app.js
View file @ bcd0ead4
......@@ -10,6 +10,7 @@ import "alpinejs";
import Vue from "vue";
import Vuex, { mapState } from "vuex";
import store from "./store";
import { RayPlugin } from "vue-ray/vue2";
require("./bootstrap");
......@@ -41,6 +42,16 @@ Vue.prototype.trans = (key) => {
*/
Vue.use(Buefy);
Vue.use(Vuex);
Vue.use(RayPlugin, {
interceptErrors: true,
host: "localhost",
port: 23517,
scheme: "http",
showComponentEvents: ["created", "updated"],
nodeRaySettings: {
interceptConsoleLog: true,
},
});
require("./components");
......@@ -197,11 +208,6 @@ window.app = new Vue({
study: 0,
activeTab: 0,
},
interview: {
interviewed: "",
study: "",
url: "",
},
registration: {
password: null,
password_length: 0,
......@@ -282,27 +288,6 @@ window.app = new Vue({
);
});
},
copyInterviewUrlToClipboard() {
if (this.interview.url != "") {
let testingCodeToCopy = document.querySelector("#publicUrl");
testingCodeToCopy.setAttribute("type", "text");
testingCodeToCopy.select();
let self = this;
try {
var successful = document.execCommand("copy");
var msg = successful ? "successful" : "unsuccessful";
self.$buefy.snackbar.open("Url copied to Clipboard.");
} catch (err) {
self.$buefy.snackbar.open("Unable to copy.");
}
/* unselect the range */
window.getSelection().removeAllRanges();
} else {
this.$buefy.snackbar.open("The url is empty.");
}
},
togglePersonModal() {
this.$store.dispatch("togglePersonModal");
},
......@@ -375,31 +360,6 @@ window.app = new Vue({
},
});
},
setinterviewdname: function (studyid) {
let self = this;
this.$buefy.dialog.prompt({
message: self.trans(`What's the interviewee name?`),
confirmText: self.trans("Start Interview"),
inputAttrs: {
placeholder: "",
maxlength: 20,
required: false,
},
onConfirm: (value) => {
self.interview.interviewed = value;
window.location.href =
"interviews/new?study=" +
studyid +
"&interviewed=" +
value;
},
});
setTimeout(function () {
let el = document.querySelector(".modal-card input");
document.activeElement.blur();
}, 100);
},
reloadusers: function (r) {
this.users[r[1]] = r[0];
this.$forceUpdate();
......
resources/js/components/studieslist.vue
View file @ bcd0ead4
This diff is collapsed.
resources/lang/en/validation.php 0 → 100644
View file @ bcd0ead4
<?php
return array(
'confirmed' => 'There\'s an error with your data',
'unique' => 'Your email address is already registered'
);
resources/views/auth/login.blade.php
View file @ bcd0ead4
......@@ -3,39 +3,45 @@
@section('content')
<div class="p-4 mx-2 rounded-md bg-yellow-50 md:hidden" role="alert">
<div class="flex">
<div class="flex-shrink-0">
<svg class="w-5 h-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
<div class="flex">
<div class="flex-shrink-0">
<svg class="w-5 h-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"
aria-hidden="true">
<path fill-rule="evenodd"
d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z"
clip-rule="evenodd" />
</svg>
</div>
<div class="ml-3">
<h3 class="text-sm font-medium text-yellow-800">{{__('Attention Needed')}}</h3>
<div class="mt-2 text-sm text-yellow-700">
<p>{{__('Mesort is intended to be used on a Tablet or Computer')}}</p>
</div>
</div>
<div class="ml-3">
<h3 class="text-sm font-medium text-yellow-800">{{__('Attention Needed')}}</h3>
<div class="mt-2 text-sm text-yellow-700">
<p>{{__('Mesort is intended to be used on a Tablet or Computer')}}</p>
</div>
</div>
</div>
@if(session()->has('message') || !empty($message))
<div class="p-4 rounded-md bg-red-50">
</div>
@if(session()->has('message') || !empty($message))
<div class="p-4 rounded-md bg-red-50">
<div class="flex">
<div class="flex-shrink-0">
<!-- Heroicon name: solid/x-circle -->
<svg class="w-5 h-5 text-red-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd" />
<svg class="w-5 h-5 text-red-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"
aria-hidden="true">
<path fill-rule="evenodd"
d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z"
clip-rule="evenodd" />
</svg>
</div>
<div class="ml-3">
<div class="mt-2 text-sm text-red-700">
{{session()->get('message') ? session()->get('message') : $message}}
{{session()->get('message') ? session()->get('message') : $message}}
</div>
</div>
</div>
</div>
@endif
@endif
<div class="flex items-center justify-center min-h-full px-4 py-12 sm:px-6 lg:px-8">
<div class="w-full max-w-md space-y-8">
<div>
......@@ -43,45 +49,57 @@
<h1 class="mt-6 text-3xl font-extrabold text-center text-gray-900">Sign in to MeSort</h1>
<p class="mt-2 text-sm text-center text-gray-600">
Or
<a href="{{url('register')}}" class="font-medium text-indigo-600 hover:text-indigo-500"> Register to use MeSort </a>
<a href="{{url('register')}}" class="font-medium text-blue-500 hover:text-blue-700"> Register to use MeSort
</a>
</p>
</div>
<form class="mt-8 space-y-6" action="{{ route('login') }}" method="POST">
<input type="hidden" name="remember" value="true">
@csrf
@csrf
<div class="-space-y-px rounded-md shadow-sm">
<div>
<label for="email-address" class="sr-only">{{ __('E-Mail Address') }}</label>
<input id="email-address" name="email" type="email" autocomplete="email" required class="relative block w-full px-3 py-2 text-gray-900 placeholder-gray-500 border border-gray-300 rounded-none appearance-none rounded-t-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm" placeholder="Email address">
<input id="email-address" name="email" type="email" autocomplete="email" required
class="relative block w-full px-3 py-2 text-gray-900 placeholder-gray-500 border border-gray-300 rounded-none appearance-none rounded-t-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
placeholder="{{ __('E-Mail Address') }}">
</div>
<div>
<label for="password" class="sr-only">{{ __('Password') }}</label>
<input id="password" name="password" type="password" autocomplete="current-password" required class="relative block w-full px-3 py-2 text-gray-900 placeholder-gray-500 border border-gray-300 rounded-none appearance-none rounded-b-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm" placeholder="Password">
<input id="password" name="password" type="password" autocomplete="current-password" required
class="relative block w-full px-3 py-2 text-gray-900 placeholder-gray-500 border border-gray-300 rounded-none appearance-none rounded-b-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
placeholder="{{ __('Password') }}">
</div>
</div>
<div class="flex items-center justify-between">
<div class="text-sm">
<a href="{{url('password/reset')}}" class="font-medium text-indigo-600 hover:text-indigo-500"> Forgot your password? </a>
<a href="{{url('password/reset')}}" class="font-medium text-blue-600 hover:text-blue-700"> Forgot your
password? </a>
</div>
</div>
@if ($errors->has('email'))
<div class="py-2 pl-2 my-2 font-bold text-white bg-red-700 rounded-none appearance-none rounded-b-md">{{ $errors->first('email') }}
</div>
@endif
@if ($errors->has('email'))
<div class="py-2 pl-2 my-2 font-bold text-white bg-red-700 rounded-none appearance-none rounded-b-md">{{
$errors->first('email') }}
</div>
@endif
@if ($errors->has('password'))
<div class="py-2 pl-2 my-2 font-bold text-white bg-red-700 rounded-none appearance-none rounded-b-md">{{ $errors->first('password') }}
</div>
@endif
@if ($errors->has('password'))
<div class="py-2 pl-2 my-2 font-bold text-white bg-red-700 rounded-none appearance-none rounded-b-md">{{
$errors->first('password') }}
</div>
@endif
<div>
<button type="submit" class="relative flex justify-center w-full px-4 py-2 text-sm font-medium text-white bg-indigo-600 border border-transparent rounded-md group hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
<button type="submit"
class="relative flex justify-center w-full px-4 py-2 text-sm font-medium text-white bg-blue-600 border border-transparent rounded-md group hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
<span class="absolute inset-y-0 left-0 flex items-center pl-3">
<!-- Heroicon name: solid/lock-closed -->
<svg class="w-5 h-5 text-indigo-500 group-hover:text-indigo-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z" clip-rule="evenodd" />
<svg class="w-5 h-5 text-blue-500 group-hover:text-blue-400" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd"
d="M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z"
clip-rule="evenodd" />
</svg>
</span>
{{__("Login")}}
......@@ -90,4 +108,4 @@
</form>
</div>
</div>
@endsection
@endsection
\ No newline at end of file
resources/views/auth/register.blade.php
View file @ bcd0ead4
......@@ -9,88 +9,95 @@
<h1 class="mt-6 text-3xl font-extrabold text-center text-gray-900">Register to MeSort</h1>
<p class="mt-2 text-sm text-center text-gray-600">
Or
<a href="{{url('login')}}" class="font-medium text-indigo-600 hover:text-indigo-500"> Login </a>
<a href="{{url('login')}}" class="font-medium text-blue-600 hover:text-blue-500"> Login </a>
</p>
</div>
<form class="mt-8 space-y-6" method="POST" action="{{ route('register') }}">
<form class="mt-8 space-y-6" method="POST" action="{{ route('register') }}">
<input type="hidden" name="remember" value="true">
@csrf
@csrf
<div class="-space-y-px rounded-md shadow-sm">
<div>
<label for="email-address" class="sr-only">{{ __('E-Mail Address') }}</label>
<input id="email-address" name="email" type="email" autocomplete="email" required class="relative block w-full px-3 py-2 text-gray-900 placeholder-gray-500 border border-gray-300 rounded-none appearance-none rounded-t-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm" placeholder="Email address">
<input id="email-address" name="email" type="email" autocomplete="email" required
class="relative block w-full px-3 py-2 text-gray-900 placeholder-gray-500 border border-gray-300 rounded-none appearance-none focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
placeholder="Email address">
</div>
<ul class="w-full my-2">
<li class="w-auto list-item-registration"
:class="{ is_valid: registration.contains_six_characters }">{{__('6 Characters')}}
</li>
<li class="list-item-registration" :class="{ is_valid: registration.contains_number }">
{{__('Contains Number')}}
</li>
<li class="list-item-registration" :class="{ is_valid: registration.contains_letters }">
{{__('Contains Letters')}}
</li>
</ul>
<ul class="w-full my-2">
<li class="mb-2 text-sm font-bold break-words whitespace-normal list-item-registration"
:class="{ is_valid: registration.contains_six_characters }">{{__('6
Characters')}}
</li>
<li class="mb-2 text-sm font-bold break-words whitespace-normal list-item-registration"
:class="{ is_valid: registration.contains_number }">
{{__('Contains Number')}}
</li>
<li class="text-sm font-bold break-words whitespace-normal list-item-registration"
:class="{ is_valid: registration.contains_letters }">
{{__('Contains Letters')}}
</li>
</ul>
<div>
<label for="password" class="sr-only">{{ __('Password') }}</label>
<input
id="password" type="password" v-model="registration.password"
@input="checkPassword()"
class="input {{ $errors->has('password') ? ' bg-red-800 text-white' : '' }}"
name="password"
required
autocomplete="current-password" required class="relative block w-full px-3 py-2 text-gray-900 placeholder-gray-500 border border-gray-300 rounded-none appearance-none rounded-b-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm" placeholder="Password">
<input id="password" type="password" v-model="registration.password" @input="checkPassword()" name="password"
required autocomplete="new-password" required
class="{{ $errors->has('password') ? ' bg-red-100 text-white' : '' }} relative block w-full px-3 py-2 text-gray-900 placeholder-gray-500 border border-gray-300 rounded-none appearance-none rounded-t-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
placeholder="{{ __('Password') }}">
</div>
<div>
<label for="password-confirm"
class="label">{{ __('Confirm Password') }}</label>
<input id="password-confirm" type="password" autocomplete="new-password"
placeholder="{{ __('Confirm Password') }}"
class="{{ $errors->has('password') ? ' bg-red-100 text-white' : '' }} relative block w-full px-3 py-2 text-gray-900 placeholder-gray-500 border border-gray-300 rounded-none appearance-none rounded-b-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
name="password_confirmation" required>
</div>
@if ($errors->has('email'))
<div class="py-2 pl-2 my-2 text-white bg-red-500">
{{ $errors->first('email') }}
</div>
@endif
@if ($errors->has('password'))
<div class="py-2 pl-2 my-2 text-white bg-red-500">
{{ $errors->first('password') }}
</div>
@endif
<div class="relative flex items-start my-2">
<div class="flex items-center h-5">
<input checked aria-describedby="newsletter-subscription" name="newsletter" type="checkbox"
class="w-4 h-4 text-blue-500 border-gray-300 rounded focus:ring-blue-500">
</div>
<div class="ml-3 text-sm">
<label for="comments" class="font-medium text-gray-700">{{__('Send me your newsletter!')}}</label>
</div>
</div>
<input id="password-confirm" type="password" class="input"
name="password_confirmation" required>
</div>
@if ($errors->has('email'))
<div class="py-2 pl-2 my-2 text-white bg-red-700">
{{ $errors->first('email') }}
</div>
@endif
@if ($errors->has('password'))
<div class="py-2 pl-2 my-2 text-white bg-red-700">
{{ $errors->first('password') }}
</div>
@endif
<div class="flex items-center justify-between">
<label class="block w-full font-bold">
<input class="mr-2 leading-tight" type="checkbox" checked name="newsletter">
<span class="text-sm">
Send me your newsletter!
</span>
</label>
</div>
<div>
<div>
<p class="block">{!!__('By registering you confirmed that you read the <a class="text-blue-500" target="_blank" href="https://mesoftware.org/index.php/datenschutzerklaerung-mesort/" title="Privacy Policy">Privacy Policy</a>')!!}</p>
<button type="submit" class="relative flex justify-center w-full px-4 py-2 text-sm font-medium text-white bg-indigo-600 border border-transparent rounded-md group hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
:class="{'opacity-50 cursor-not-allowed opacity-75' : !this.registration.valid_password}"
:disabled="!this.registration.valid_password"
>
<span class="absolute inset-y-0 left-0 flex items-center pl-3">
<!-- Heroicon name: solid/lock-closed -->
<svg class="w-5 h-5 text-indigo-500 group-hover:text-indigo-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z" clip-rule="evenodd" />
</svg>
</span>
<p class="block">{!!__('By registering you confirmed that you read the <a class="text-blue-500"
target="_blank" href="https://mesoftware.org/index.php/datenschutzerklaerung-mesort/"
title="Privacy Policy">Privacy Policy</a>')!!}</p>
<button type="submit"
class="relative flex justify-center w-full px-4 py-2 text-sm font-medium text-white bg-blue-600 border border-transparent rounded-md group hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
:class="{'opacity-50 cursor-not-allowed opacity-75' : !this.registration.valid_password}"
:disabled="!this.registration.valid_password">
<span class="absolute inset-y-0 left-0 flex items-center pl-3">
<!-- Heroicon name: solid/lock-closed -->
<svg class="w-5 h-5 text-blue-500 group-hover:text-blue-400" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd"
d="M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z"
clip-rule="evenodd" />
</svg>
</span>
{{__('Register')}}
</button>
</div>
</button>
</div>
</form>
</div>
</div>
@endsection
@endsection
\ No newline at end of file
resources/views/home.blade.php
View file @ bcd0ead4
This diff is collapsed.
resources/views/layouts/nav.blade.php
View file @ bcd0ead4
......@@ -6,105 +6,58 @@
<!-- Logo section -->
<div class="flex items-center px-2 lg:px-0 xl:w-64">
<div class="flex-shrink-0">
<a href="{{url('/')}}" title="home">
<img class="w-auto h-10" src="{{config('utilities.base64logo')}}" alt="MeSort Logo">
<a class="flex items-center justify-center text-white align-middle hover:text-gray-200" href="{{url('/')}}"
title="Home button">
<img class="w-auto h-10" src="{{config('utilities.base64logo')}}" alt="MeSort Logo">
<p class="px-3 py-2 text-sm font-medium text-gray-200 rounded-md hover:text-white">Home</p>
</a>
</div>
</div>
<!-- Search section -->
{{-- <div class="flex justify-center flex-1 lg:justify-end">
<div class="w-full px-2 lg:px-6">
<label for="search" class="sr-only">Search Studies</label>
<div class="relative text-indigo-200 focus-within:text-gray-400">
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<!-- Heroicon name: solid/search -->
<svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd" />
</svg>
</div>
<input id="search" name="search" class="block w-full py-2 pl-10 pr-3 leading-5 text-indigo-100 placeholder-indigo-200 bg-indigo-400 bg-opacity-25 border border-transparent rounded-md focus:outline-none focus:bg-white focus:ring-0 focus:placeholder-gray-400 focus:text-gray-900 sm:text-sm" placeholder="Search projects" type="search">
</div>
</div>
</div> --}}
<div class="flex lg:hidden">
<!-- Mobile menu button -->
<button type="button" class="inline-flex items-center justify-center p-2 text-indigo-400 bg-indigo-600 rounded-md hover:text-white hover:bg-indigo-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-indigo-600 focus:ring-white" aria-controls="mobile-menu" aria-expanded="false">
<span class="sr-only">Open main menu</span>
<!--
Icon when menu is closed.
Heroicon name: outline/menu-alt-1
Menu open: "hidden", Menu closed: "block"
-->
<svg class="block w-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h8m-8 6h16" />
</svg>
<!--
Icon when menu is open.
Heroicon name: outline/x
Menu open: "block", Menu closed: "hidden"
-->
<svg class="hidden w-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
<!-- Links section -->
<div class="hidden lg:block lg:w-80">
<div class="flex items-center justify-end">
@if(Request::is('/'))
@if(Request::is('/'))
<notification-bell></notification-bell>
@endif
@if(Auth::user()->hasRole('admin'))
<a target="_blank" class="px-3 py-2 text-sm font-medium text-indigo-200 rounded-md hover:text-white"
href="{{url('translations')}}"
>
{{ __('Translations') }}
@endif
@if(Auth::user()->hasRole('admin'))
<a target="_blank" class="px-3 py-2 text-sm font-medium text-gray-200 rounded-md hover:text-white"
href="{{url('translations')}}">
{{ __('Translations') }}
</a>
@endif
@endif
<div class="flex">
<a href="https://mesoftware.org/index.php/mesort/" class="px-3 py-2 text-sm font-medium text-indigo-200 rounded-md hover:text-white">Manuals</a>
<a title="{{__('MeSort User Manuals')}}" href="https://mesoftware.org/index.php/mesort/"
class="px-3 py-2 text-sm font-medium text-gray-200 rounded-md hover:text-white">Manuals</a>
</div>
<div class="flex shrink-0">
<span class="px-3 py-2 text-sm font-medium text-indigo-200 rounded-md cursor-pointer pointer-events-none hover:text-indigo-200">{{ Auth::user()->email }}</span>
<span class="sr-only">{{__('Your Email')}}</span>
<span
class="px-3 py-2 text-sm font-medium text-gray-200 rounded-md cursor-pointer pointer-events-none hover:text-gray-200">{{
Auth::user()->email }}</span>
</div>
<!-- Profile dropdown -->
<div class="relative flex-shrink-0 ml-4">
<div>
<button ref="usermenu" @click="showdropdown('dropdownLogout')" @mouseover="showdropdown('dropdownLogout')" type="button" class="flex text-sm rounded-full bg-sky-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-sky-500 focus:ring-white" id="user-menu-button" aria-expanded="false" aria-haspopup="true">
<span class="sr-only">Open user menu</span>
<img class="w-8 h-8 rounded-full" src="{{\Gravatar::get(Auth::user()->email)}}" alt="">
</button>
</div>
<!--
Dropdown menu, show/hide based on menu state.
<div>
Entering: "transition ease-out duration-100"
From: "transform opacity-0 scale-95"
To: "transform opacity-100 scale-100"
Leaving: "transition ease-in duration-75"
From: "transform opacity-100 scale-100"
To: "transform opacity-0 scale-95"
-->
<button ref="usermenu" @click="showdropdown('dropdownLogout')"
@mouseover="showdropdown('dropdownLogout')" type="button"
class="flex text-sm rounded-full bg-sky-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-sky-500 focus:ring-white"
id="user-menu-button" aria-expanded="false" aria-haspopup="true">
<span class="sr-only">Open user menu</span>
<img class="w-8 h-8 rounded-full" src="{{\Gravatar::get(Auth::user()->email)}}" alt="">
</button>