group settings (TEST)

This commit is contained in:
olcxja 2026-08-09 16:51:37 +02:00
commit 08ff4755a1
12 changed files with 416 additions and 24 deletions

View file

@ -31,8 +31,18 @@ var createGroupScreen = `
<div class="input-group">
<label for="creategroup-name"><blah>title.name</blah></label>
<input type="text" id="creategroup-name" placeholder="{blah(placeholder.create.group.input)}" class="forminput">
</div>
<div class="input-group">
<div class="setting-row" style="text-align: left;">
<div class="setting-info">
<span class="setting-title"><blah>title.group.history.visible</blah></span>
<span class="setting-desc"><blah>desc.group.history.visible</blah></span>
</div>
<label class="toggle-switch">
<input type="checkbox" id="creategroup-history">
<span class="toggle-slider"></span>
</label>
</div>
<button class="submit-button blah" onclick="createGroup()">title.create.group</button>
</div>
</div>
@ -368,6 +378,36 @@ var profileSettings = `
</div>
</div>
`;
var groupSettingsScreen = `
<div class="auth-box popup-auto-height" style="margin-top:2rem">
<div class="input-group" style="display: flex; flex-direction: row; align-items: stretch; justify-content: space-between; border: var(--border-width) solid var(--light-border-color); border-radius: 0.8rem; padding: 1rem; width: 100%; max-width: 30rem;">
<img id="group-settings-avatar-preview" src="" style="width: 4.5rem; height: 4.5rem; border-radius: 0.8rem; border: var(--border-width) solid rgba(255, 255, 255, 0.2); object-fit: cover; background: var(--main-bg-color);">
<div style="display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; padding: 0.1rem 0;">
<div style="font-weight: bold;"><blah>title.avatar</blah></div>
<button class="submit-button blah" style="margin: 0; padding: 0.5rem 1rem; width: auto;" onclick="document.getElementById('group-settings-avatar-input').click()">action.change.avatar</button>
<input type="file" id="group-settings-avatar-input" style="display: none;" accept="image/*" onchange="openCropper(this, 'group-avatar')">
</div>
</div>
<br>
<div class="input-group">
<label for="group-settings-name"><blah>title.group.name</blah></label>
<input type="text" id="group-settings-name" class="forminput">
<div class="setting-row">
<div class="setting-info">
<span class="setting-title"><blah>title.group.history.visible</blah></span>
<span class="setting-desc"><blah>desc.group.history.visible</blah></span>
</div>
<label class="toggle-switch">
<input type="checkbox" id="group-settings-history">
<span class="toggle-slider"></span>
</label>
</div>
<button class="submit-button blah" onclick="saveGroupSettings()">action.save</button>
</div>
</div>
`;
var appearanceSettings = `
<div style="display: flex;justify-content: center;align-items: center;height:100%;flex-direction: column;text-align: center;">