mirror of
https://github.com/ParisNeo/lollms-webui.git
synced 2024-12-24 06:36:37 +00:00
Enhanced ui
This commit is contained in:
Saifeddine ALOUI
parent
981323eb26
commit
12c75a3e2e
File diff suppressed because one or more lines are too long
8
web/dist/assets/index-9ddef0b4.css
vendored
Normal file
8
web/dist/assets/index-9ddef0b4.css
vendored
Normal file
File diff suppressed because one or more lines are too long
8
web/dist/assets/index-c6c58977.css
vendored
8
web/dist/assets/index-c6c58977.css
vendored
File diff suppressed because one or more lines are too long
4
web/dist/index.html
vendored
4
web/dist/index.html
vendored
@ -6,8 +6,8 @@
|
|||||||
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js"></script>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>LoLLMS WebUI</title>
|
<title>LoLLMS WebUI</title>
|
||||||
<script type="module" crossorigin src="/assets/index-fe749e52.js"></script>
|
<script type="module" crossorigin src="/assets/index-4ac94331.js"></script>
|
||||||
<link rel="stylesheet" href="/assets/index-c6c58977.css">
|
<link rel="stylesheet" href="/assets/index-9ddef0b4.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
|||||||
@ -1,72 +1,58 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- <link v-if="codeBlockStylesheet" rel="stylesheet" :href="codeBlockStylesheet"> -->
|
|
||||||
<header class="top-0 shadow-lg">
|
<header class="top-0 shadow-lg">
|
||||||
<nav class="container flex flex-col lg:flex-row item-center gap-2 pb-0 ">
|
<nav class="container flex flex-col lg:flex-row items-center gap-2 pb-0">
|
||||||
<!-- LOGO -->
|
<!-- LOGO -->
|
||||||
<RouterLink :to="{ name: 'discussions' }">
|
<RouterLink :to="{ name: 'discussions' }" class="flex items-center gap-3 flex-1">
|
||||||
<div class="flex items-center gap-3 flex-1">
|
<div class="logo-container">
|
||||||
<img class="w-12 hover:scale-95 duration-150" title="LoLLMS WebUI" :src="$store.state.config==null?storeLogo:$store.state.config.app_custom_logo!=''?'/user_infos/'+$store.state.config.app_custom_logo: storeLogo" alt="Logo">
|
<img class="w-12 h-12 rounded-full object-cover logo-image"
|
||||||
<div class="flex flex-col">
|
:src="$store.state.config == null ? storeLogo : $store.state.config.app_custom_logo != '' ? '/user_infos/' + $store.state.config.app_custom_logo : storeLogo"
|
||||||
<p class="text-2xl font-bold text-2xl drop-shadow-md align-middle">LoLLMS</p>
|
alt="Logo" title="LoLLMS WebUI">
|
||||||
<p class="text-gray-400 ">One tool to rule them all</p>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="flex flex-col logo-text">
|
||||||
|
<p class="text-2xl font-bold drop-shadow-md align-middle">LoLLMS</p>
|
||||||
|
<p class="text-gray-400">One tool to rule them all</p>
|
||||||
</div>
|
</div>
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
|
|
||||||
<!-- GITHUB AND THEME BUTTONS -->
|
<!-- GITHUB AND THEME BUTTONS -->
|
||||||
<div class="flex gap-3 flex-1 items-center justify-end">
|
<div class="flex gap-3 flex-1 items-center justify-end">
|
||||||
|
|
||||||
<div v-if="isModelOK" title="Model is ok" class="text-green-500 cursor-pointer">
|
<div v-if="isModelOK" title="Model is ok" class="text-green-500 cursor-pointer">
|
||||||
<b class="text-2xl">M</b>
|
<b class="text-2xl">M</b>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="!isModelOK" title="Model is not ok" class="text-red-500 cursor-pointer">
|
<div v-else title="Model is not ok" class="text-red-500 cursor-pointer">
|
||||||
<b class="text-2xl">M</b>
|
<b class="text-2xl">M</b>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="!isGenerating" title="Text is not being generated. Ready to generate" class="text-green-500 cursor-pointer">
|
<div v-if="!isGenerating" title="Text is not being generated. Ready to generate" class="text-green-500 cursor-pointer">
|
||||||
<i data-feather="flag"></i>
|
<i data-feather="flag"></i>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="isGenerating" title="Generation in progress..." class="text-red-500 cursor-pointer">
|
<div v-else title="Generation in progress..." class="text-red-500 cursor-pointer">
|
||||||
<i data-feather="flag"></i>
|
<i data-feather="flag"></i>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="isConnected" title="Connection status: Connected" class="text-green-500 cursor-pointer">
|
<div v-if="isConnected" title="Connection status: Connected" class="text-green-500 cursor-pointer">
|
||||||
<i data-feather="zap"></i>
|
<i data-feather="zap"></i>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="!isConnected" title="Connection status: Not connected" class="text-red-500 cursor-pointer">
|
<div v-else title="Connection status: Not connected" class="text-red-500 cursor-pointer">
|
||||||
<i data-feather="zap-off"></i>
|
<i data-feather="zap-off"></i>
|
||||||
</div>
|
</div>
|
||||||
<a href="#" @click="restartProgram">
|
|
||||||
<div class="text-2xl hover:text-primary duration-150" title="restart program">
|
<a href="#" @click="restartProgram" class="text-2xl hover:text-primary duration-150" title="restart program">
|
||||||
<i data-feather="power"></i>
|
<i data-feather="power"></i>
|
||||||
</div>
|
|
||||||
</a>
|
</a>
|
||||||
<a href="#" @click="refreshPage">
|
<a href="#" @click="refreshPage" class="text-2xl hover:text-primary duration-150" title="refresh page">
|
||||||
<div class="text-2xl hover:text-primary duration-150" title="refresh page">
|
|
||||||
<i data-feather="refresh-ccw"></i>
|
<i data-feather="refresh-ccw"></i>
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="https://github.com/ParisNeo/lollms-webui" target="_blank">
|
|
||||||
<div class="text-2xl hover:text-primary duration-150" title="Fast API doc">
|
|
||||||
<a href="/docs" target="_blank"><img :src="FastAPI" width="75" height="25"></a>
|
|
||||||
</div>
|
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a href="https://github.com/ParisNeo/lollms-webui" target="_blank">
|
<a href="/docs" target="_blank" class="text-2xl hover:text-primary duration-150" title="Fast API doc">
|
||||||
|
<img :src="FastAPI" width="75" height="25" alt="Fast API">
|
||||||
|
</a>
|
||||||
|
|
||||||
<div class="text-2xl hover:text-primary duration-150" title="Visit repository page">
|
<a href="https://github.com/ParisNeo/lollms-webui" target="_blank" class="text-2xl hover:text-primary duration-150" title="Visit repository page">
|
||||||
<i data-feather="github"></i>
|
<i data-feather="github"></i>
|
||||||
</div>
|
|
||||||
</a>
|
</a>
|
||||||
<a href="https://www.youtube.com/channel/UCJzrg0cyQV2Z30SQ1v2FdSQ" target="_blank">
|
<a href="https://www.youtube.com/channel/UCJzrg0cyQV2Z30SQ1v2FdSQ" target="_blank" class="text-2xl hover:text-primary duration-150" title="Visit my youtube channel">
|
||||||
|
|
||||||
<div class="text-2xl hover:text-primary duration-150" title="Visit my youtube channel">
|
|
||||||
<i data-feather="youtube"></i>
|
<i data-feather="youtube"></i>
|
||||||
</div>
|
|
||||||
</a>
|
</a>
|
||||||
|
<a href="https://x.com/ParisNeo_AI" target="_blank" class="text-2xl hover:fill-primary dark:fill-white dark:hover:fill-primary duration-150" title="Follow me on my twitter acount">
|
||||||
<a href="https://x.com/ParisNeo_AI" target="_blank">
|
|
||||||
|
|
||||||
<div class="text-2xl hover:fill-primary dark:fill-white dark:hover:fill-primary duration-150" title="Follow me on my twitter acount">
|
|
||||||
<svg class="w-10 h-10 rounded-lg object-fill dark:text-white" xmlns="http://www.w3.org/2000/svg"
|
<svg class="w-10 h-10 rounded-lg object-fill dark:text-white" xmlns="http://www.w3.org/2000/svg"
|
||||||
viewBox="0 0 1668.56 1221.19" style="enable-background:new 0 0 1668.56 1221.19;" xml:space="preserve">
|
viewBox="0 0 1668.56 1221.19" style="enable-background:new 0 0 1668.56 1221.19;" xml:space="preserve">
|
||||||
<g id="layer1" transform="translate(52.390088,-25.058597)">
|
<g id="layer1" transform="translate(52.390088,-25.058597)">
|
||||||
@ -74,37 +60,29 @@
|
|||||||
h-87.51l-313.51,338.7l-253.31-338.7H283.94z M412.63,231.77h136.81l604.13,807.76h-136.81L412.63,231.77z"/>
|
h-87.51l-313.51,338.7l-253.31-338.7H283.94z M412.63,231.77h136.81l604.13,807.76h-136.81L412.63,231.77z"/>
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</a>
|
||||||
|
<a href="https://discord.com/channels/1092918764925882418" target="_blank" class="text-2xl hover:text-primary duration-150" title="Visit my discord channel">
|
||||||
|
<img :src="discord" width="25" height="25" alt="Discord">
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a href="https://discord.com/channels/1092918764925882418" target="_blank">
|
<div class="sun text-2xl w-6 hover:text-primary duration-150 cursor-pointer" title="Switch to Light theme" @click="themeSwitch()">
|
||||||
<div class="text-2xl hover:text-primary duration-150" title="Visit my discord channel">
|
|
||||||
<img :src="discord" width="25" height="25">
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<div class="sun text-2xl w-6 hover:text-primary duration-150 cursor-pointer" title="Swith to Light theme"
|
|
||||||
@click="themeSwitch()">
|
|
||||||
<i data-feather="sun"></i>
|
<i data-feather="sun"></i>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="moon text-2xl w-6 hover:text-primary duration-150 cursor-pointer" title="Switch to Dark theme" @click="themeSwitch()">
|
||||||
|
|
||||||
<div class="moon text-2xl w-6 hover:text-primary duration-150 cursor-pointer" title="Swith to Dark theme"
|
|
||||||
@click="themeSwitch()">
|
|
||||||
<i data-feather="moon"></i>
|
<i data-feather="moon"></i>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="moon text-2xl w-6 hover:text-primary duration-150 cursor-pointer" title="Lollms News"
|
<div class="text-2xl w-6 hover:text-primary duration-150 cursor-pointer" title="Lollms News" @click="showNews()">
|
||||||
@click="showNews()">
|
<img :src="static_info" alt="News">
|
||||||
<img :src="static_info">
|
|
||||||
</div>
|
</div>
|
||||||
<div v-if="is_fun_mode" title="fun mode is on press to turn off" class="text-green-500 cursor-pointer" @click="fun_mode_off()">
|
<div v-if="is_fun_mode" title="fun mode is on press to turn off" class="text-green-500 cursor-pointer" @click="fun_mode_off()">
|
||||||
<img class="w-5 h-5" :src="fun_mode">
|
<img class="w-5 h-5" :src="fun_mode" alt="Fun mode on">
|
||||||
</div>
|
</div>
|
||||||
<div v-else title="fun mode is off press to turn on" class="text-red-500 cursor-pointer" @click="fun_mode_on()">
|
<div v-else title="fun mode is off press to turn on" class="text-red-500 cursor-pointer" @click="fun_mode_on()">
|
||||||
<img class="w-5 h-5" :src="normal_mode">
|
<img class="w-5 h-5" :src="normal_mode" alt="Fun mode off">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="language-selector relative" style="position: relative;">
|
<div class="language-selector relative">
|
||||||
<button @click="toggleLanguageMenu" class="bg-transparent text-black dark:text-white py-1 px-1 rounded font-bold uppercase transition-colors duration-300 hover:bg-blue-500">
|
<button @click="toggleLanguageMenu" class="bg-transparent text-black dark:text-white py-1 px-1 rounded font-bold uppercase transition-colors duration-300 hover:bg-blue-500">
|
||||||
{{ $store.state.language.slice(0, 2) }}
|
{{ $store.state.language.slice(0, 2) }}
|
||||||
</button>
|
</button>
|
||||||
@ -122,17 +100,9 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<!-- NAVIGATION BUTTONS -->
|
<!-- NAVIGATION BUTTONS -->
|
||||||
<Navigation />
|
<Navigation />
|
||||||
<Toast ref="toast" />
|
<Toast ref="toast" />
|
||||||
@ -145,17 +115,12 @@
|
|||||||
<YesNoDialog ref="yesNoDialog" class="z-20" />
|
<YesNoDialog ref="yesNoDialog" class="z-20" />
|
||||||
<PersonalityEditor ref="personality_editor" :config="currentPersonConfig" :personality="selectedPersonality"></PersonalityEditor>
|
<PersonalityEditor ref="personality_editor" :config="currentPersonConfig" :personality="selectedPersonality"></PersonalityEditor>
|
||||||
<div id="app">
|
<div id="app">
|
||||||
<!-- Your other components... -->
|
|
||||||
<PopupViewer ref="news"/>
|
<PopupViewer ref="news"/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<body>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import Toast from '@/components/Toast.vue'
|
import Toast from '@/components/Toast.vue'
|
||||||
import MessageBox from "@/components/MessageBox.vue";
|
import MessageBox from "@/components/MessageBox.vue";
|
||||||
@ -526,5 +491,62 @@ export default {
|
|||||||
background-color: red;
|
background-color: red;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.animate-pulse {
|
||||||
|
animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
0%, 100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: .7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-container {
|
||||||
|
position: relative;
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
animation: roll-and-bounce 4s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 50%;
|
||||||
|
animation: spin 4s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes roll-and-bounce {
|
||||||
|
0%, 100% {
|
||||||
|
transform: translateX(0) rotate(0deg);
|
||||||
|
}
|
||||||
|
45% {
|
||||||
|
transform: translateX(100px) rotate(360deg);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: translateX(90px) rotate(390deg);
|
||||||
|
}
|
||||||
|
55% {
|
||||||
|
transform: translateX(100px) rotate(360deg);
|
||||||
|
}
|
||||||
|
95% {
|
||||||
|
transform: translateX(0) rotate(0deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
0% {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-text {
|
||||||
|
position: relative;
|
||||||
|
left: 100px; /* Adjust this value to match the maximum translation of the logo */
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
@ -1,38 +1,42 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="flex flex-col items-center justify-center w-full h-full bg-gradient-to-br from-blue-100 to-purple-100 dark:from-blue-900 dark:to-purple-900">
|
<div class="flex flex-col items-center justify-center w-full h-full min-h-screen bg-gradient-to-br from-indigo-100 to-purple-100 dark:from-indigo-900 dark:to-purple-900 p-8">
|
||||||
<div class="text-center">
|
<div class="text-center max-w-4xl">
|
||||||
<div class="flex items-center justify-center gap-4 mb-8">
|
<div class="flex items-center justify-center gap-8 mb-12">
|
||||||
<div class="relative w-20 h-80">
|
<div class="relative w-24 h-24">
|
||||||
<img
|
<img
|
||||||
:src="logoSrc"
|
:src="logoSrc"
|
||||||
alt="LoLLMS Logo"
|
alt="LoLLMS Logo"
|
||||||
class="w-20 h-20 rounded-full absolute animate-ball-bounce"
|
class="w-24 h-24 rounded-full absolute animate-rolling-ball"
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col items-start">
|
<div class="flex flex-col items-start">
|
||||||
<h1 class="text-5xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-purple-600 dark:from-blue-400 dark:to-purple-400">
|
<h1 class="text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-indigo-600 to-purple-600 dark:from-indigo-400 dark:to-purple-400">
|
||||||
LoLLMS
|
LoLLMS
|
||||||
</h1>
|
</h1>
|
||||||
<p class="text-xl text-gray-600 dark:text-gray-300 italic">
|
<p class="text-2xl text-gray-600 dark:text-gray-300 italic mt-2">
|
||||||
One tool to rule them all
|
Lord of Large Language And Multimodal Systems
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="space-y-6 animate-fade-in-up">
|
<div class="space-y-8 animate-fade-in-up">
|
||||||
<h2 class="text-3xl font-semibold text-gray-800 dark:text-gray-200">
|
<h2 class="text-4xl font-semibold text-gray-800 dark:text-gray-200">
|
||||||
Welcome to LoLLMS WebUI
|
Welcome to LoLLMS WebUI
|
||||||
</h2>
|
</h2>
|
||||||
<p class="text-xl text-gray-600 dark:text-gray-300">
|
<p class="text-xl text-gray-600 dark:text-gray-300 max-w-3xl mx-auto">
|
||||||
Your gateway to powerful language models and intelligent conversations
|
Embark on a journey through the realm of advanced AI with LoLLMS, your ultimate companion for intelligent conversations and multimodal interactions. Unleash the power of large language models and explore new frontiers in artificial intelligence.
|
||||||
</p>
|
</p>
|
||||||
<div class="flex justify-center space-x-4 mt-8">
|
<div class="mt-12 space-y-6">
|
||||||
<button class="px-6 py-3 text-white bg-blue-600 rounded-full hover:bg-blue-700 transform hover:scale-105 transition-all duration-200 ease-in-out shadow-lg">
|
<p class="text-lg text-gray-700 dark:text-gray-300">
|
||||||
Create New Discussion
|
Discover the capabilities of LoLLMS:
|
||||||
</button>
|
</p>
|
||||||
<button class="px-6 py-3 text-blue-600 bg-white border-2 border-blue-600 rounded-full hover:bg-blue-50 transform hover:scale-105 transition-all duration-200 ease-in-out shadow-lg">
|
<ul class="text-left list-disc list-inside text-gray-600 dark:text-gray-300 space-y-2">
|
||||||
Select Existing Discussion
|
<li>Engage in natural language conversations</li>
|
||||||
</button>
|
<li>Generate creative content and ideas</li>
|
||||||
|
<li>Analyze complex data and provide insights</li>
|
||||||
|
<li>Assist with coding and technical tasks</li>
|
||||||
|
<li>Process and understand multimodal inputs</li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -64,22 +68,17 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
@keyframes ball-bounce {
|
@keyframes rolling-ball {
|
||||||
0%, 100% {
|
0% { transform: translateX(-50px) rotate(0deg); }
|
||||||
transform: translateY(0) rotate(0deg);
|
25% { transform: translateX(0) rotate(90deg); }
|
||||||
animation-timing-function: ease-out;
|
50% { transform: translateX(50px) rotate(180deg); }
|
||||||
}
|
75% { transform: translateX(0) rotate(270deg); }
|
||||||
25% { transform: translateY(-120px) rotate(90deg); }
|
100% { transform: translateX(-50px) rotate(360deg); }
|
||||||
50% { transform: translateY(-160px) rotate(180deg); }
|
|
||||||
75% { transform: translateY(-40px) rotate(270deg); }
|
|
||||||
85%, 95% {
|
|
||||||
transform: translateY(0) rotate(360deg);
|
|
||||||
animation-timing-function: ease-in;
|
|
||||||
}
|
|
||||||
90%, 97% {
|
|
||||||
transform: translateY(-20px) rotate(360deg);
|
|
||||||
animation-timing-function: ease-out;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@keyframes bounce {
|
||||||
|
0%, 100% { transform: translateY(0); }
|
||||||
|
50% { transform: translateY(-20px); }
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes fade-in-up {
|
@keyframes fade-in-up {
|
||||||
@ -93,11 +92,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.animate-ball-bounce {
|
.animate-rolling-ball {
|
||||||
animation: ball-bounce 4s infinite;
|
animation: rolling-ball 4s infinite ease-in-out, bounce 1s infinite ease-in-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
.animate-fade-in-up {
|
.animate-fade-in-up {
|
||||||
animation: fade-in-up 1s ease-out;
|
animation: fade-in-up 1.5s ease-out;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Loading…
Reference in New Issue
Block a user