Add random chat button to NoLoginView: Introduce a new button for starting random chats, enhancing user engagement options. Update layout for improved accessibility and visual consistency.
This commit is contained in:
@@ -59,6 +59,7 @@
|
||||
<div class="quick-access-actions">
|
||||
<button type="button" class="primary-action" @click="doLogin">{{ $t('home.nologin.login.submit') }}</button>
|
||||
<button type="button" class="secondary-action" @click="openRegisterDialog">{{ $t('home.nologin.login.register') }}</button>
|
||||
<button type="button" class="secondary-action" @click="openRandomChat">{{ $t('home.nologin.startrandomchat') }}</button>
|
||||
</div>
|
||||
<div class="login-fields">
|
||||
<input ref="usernameInput" v-model="username" size="20" type="text" :placeholder="$t('home.nologin.login.name')"
|
||||
@@ -74,23 +75,14 @@
|
||||
<span>{{ $t('home.nologin.login.stayLoggedIn') }}</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="access-split">
|
||||
<article class="access-card">
|
||||
<h3>{{ $t('home.nologin.randomchat') }}</h3>
|
||||
<p>Ohne lange Vorbereitung direkt in spontane Begegnungen und offene Gespraeche starten.</p>
|
||||
<button type="button" class="secondary-action" @click="openRandomChat">{{ $t('home.nologin.startrandomchat') }}</button>
|
||||
</article>
|
||||
<article class="access-card">
|
||||
<h3>Konto und Zugang</h3>
|
||||
<p>Neu hier oder Passwort vergessen? Von hier aus gelangst du direkt in Registrierung und Wiederherstellung.</p>
|
||||
<div class="access-links">
|
||||
<span @click="openPasswordResetDialog" class="link">{{
|
||||
$t('home.nologin.login.lostpassword') }}</span>
|
||||
<span @click="openRegisterDialog" class="link">{{ $t('home.nologin.login.register') }}</span>
|
||||
</div>
|
||||
</article>
|
||||
<div class="access-links">
|
||||
<span @click="openPasswordResetDialog" class="link">{{
|
||||
$t('home.nologin.login.lostpassword') }}</span>
|
||||
<span @click="openRegisterDialog" class="link">{{ $t('home.nologin.login.register') }}</span>
|
||||
</div>
|
||||
<p class="login-panel__footnote">
|
||||
Oder ohne Konto direkt in spontane Begegnungen und offene Gespräche starten.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
@@ -352,9 +344,17 @@ export default {
|
||||
.access-links {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 0.1rem;
|
||||
gap: 0.9rem;
|
||||
}
|
||||
|
||||
.login-panel__footnote {
|
||||
margin: 0;
|
||||
color: var(--color-text-secondary);
|
||||
font-size: 0.92rem;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.stay-logged-in-row {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
||||
Reference in New Issue
Block a user