kibi/f0ckm
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

adding different layouts for testing

Browse Source
This commit is contained in:
Kibi Kelburton
2026-05-17 14:02:35 +02:00
parent 832f97970e
commit dbb8861aed
18 changed files with 238 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
views/admin.html
View File

@@ -86,6 +86,19 @@
</div>
<div class="settings-item" style="background: rgba(0,0,0,0.2); padding: 15px; border-radius: 4px; display: flex; align-items: center; justify-content: space-between; margin-top: 10px;">
<div>
<label style="display: block; font-weight: bold; color: var(--accent);">Default Feed Layout</label>
<p style="margin: 2px 0 0 0; font-size: 0.8em; color: #aaa;">Default layout for new users and guests on the main page.</p>
</div>
<select id="default_feed_layout_select" onchange="saveAdminSettings()" style="background: #333; border: 1px solid #444; color: #fff; padding: 5px 8px; border-radius: 4px; font-size: 0.85em;">
<option value="0" {{ default_feed_layout === 0 ? 'selected' : '' }}>Grid (Compact)</option>
<option value="1" {{ default_feed_layout === 1 ? 'selected' : '' }}>Grid (3-column Modern)</option>
<option value="2" {{ default_feed_layout === 2 ? 'selected' : '' }}>Feed (X / Instagram)</option>
<option value="3" {{ default_feed_layout === 3 ? 'selected' : '' }}>YouTube Style</option>
</select>
</div>
<span id="settings-status" style="display: block; margin-top: 10px; font-size: 0.8em; font-weight: bold; text-align: right;"></span>
</div>
</div>
@@ -107,6 +120,7 @@
const registrationToggle = document.getElementById('registration_open_toggle');
const minTagsInput = document.getElementById('min_tags_input');
const trustedUploadsInput = document.getElementById('trusted_uploads_input');
const feedLayoutSelect = document.getElementById('default_feed_layout_select');
status.textContent = 'Saving...';
status.style.color = 'var(--accent)';
@@ -123,6 +137,7 @@
...(registrationToggle ? { registration_open: registrationToggle.checked ? 'on' : 'off' } : {}),
min_tags: minTagsInput.value,
trusted_uploads: trustedUploadsInput.value,
default_feed_layout: feedLayoutSelect ? feedLayoutSelect.value : '0',
csrf_token: '{{ csrf_token }}'
}).toString()
});

2
views/index-partial.html
View File

@@ -1,7 +1,7 @@
<div class="index-layout-wrapper">
<div class="index-container">
@include(snippets/page-title)
<div class="posts" data-current-page="{{ pagination.current }}" data-has-more="{{ pagination.next ? 'true' : 'false' }}">
<div class="posts {{ feed_layout_class }}" data-current-page="{{ pagination.current }}" data-has-more="{{ pagination.next ? 'true' : 'false' }}">
@each(items as item)
<a href="{{ link.main }}{{ item.id }}" class="{{ item.is_pinned ? 'anim-boxshadow ' : '' }}thumb lazy-thumb {{ item.has_notification ? 'has-notif' : '' }} {{ item.is_pinned ? 'is-pinned' : '' }}" data-file="{{ item.dest }}" data-mime="{{ item.mime }}" data-user="{!! item.display_name || item.username !!}" data-ext="{{ item.mime.split('/')[1].replace('youtube', 'yt').replace('x-shockwave-flash', 'flash').replace('vnd.adobe.flash.movie', 'flash').toUpperCase() }}" data-mode="{{ item.tag_id == nsfl_tag_id ? 'nsfl' : (item.tag_id == 2 ? 'nsfw' : (item.tag_id == 1 ? 'sfw' : 'null')) }}" data-bg="/t/{{ item.id }}.webp" data-size="{{ enable_dynamic_thumbs ? (item.thumb_size || 1) : 1 }}">
<div class="thumb-indicators">

17
views/settings.html
View File

@@ -86,14 +86,19 @@
<span>{{ t('settings.show_motd') }}</span>
</label>
</div>
<div class="setting-item">
<label for="use_new_layout_toggle" style="cursor: pointer; display: flex; align-items: center; gap: 10px;">
<input type="checkbox" id="use_new_layout_toggle" @if(session.use_new_layout===true) checked @endif>
<span>{{ t('settings.modern_layout') }}</span>
<div class="setting-item" style="margin-bottom: 15px;">
<label for="feed_layout_select" style="display: flex; flex-direction: column; gap: 6px;">
<span>{{ t('settings.feed_layout') }}</span>
<small class="text-muted">{{ t('settings.feed_layout_hint') }}</small>
</label>
<small class="text-muted" style="margin-left: 25px;">{{ t('settings.modern_layout_hint') }}</small>
<select id="feed_layout_select" style="margin-top: 6px; background: var(--bg-secondary, #1a1a1a); color: var(--text, #fff); border: 1px solid var(--nav-border-color, #333); border-radius: 4px; padding: 6px 10px; font-size: 0.9em; width: 100%; max-width: 340px;">
<option value="0" {{ (session.feed_layout === 0 || session.feed_layout === undefined || session.feed_layout === null) ? 'selected' : '' }}>{{ t('settings.feed_layout_grid') }}</option>
<option value="1" {{ session.feed_layout === 1 ? 'selected' : '' }}>{{ t('settings.feed_layout_modern') }}</option>
<option value="2" {{ session.feed_layout === 2 ? 'selected' : '' }}>{{ t('settings.feed_layout_feed') }}</option>
<option value="3" {{ session.feed_layout === 3 ? 'selected' : '' }}>{{ t('settings.feed_layout_youtube') }}</option>
</select>
</div>
@if(!session.use_new_layout)
@if(session.feed_layout !== 2 && session.feed_layout !== 3)
<div class="setting-item" style="margin-top: 15px;">
<label for="alternative_infobox_toggle"
style="cursor: pointer; display: flex; align-items: center; gap: 10px;">

4
views/snippets/footer.html
View File

@@ -411,7 +411,9 @@
fileupload_comments_multifile: @if(fileupload_comments_multifile) true @else false @endif,
fileupload_comments_size: {{ fileupload_comments_size }},
fileupload_comments_max: {{ fileupload_comments_max }},
fileupload_comments_mode: "{{ fileupload_comments_mode }}"
fileupload_comments_mode: "{{ fileupload_comments_mode }}",
feed_layout: @if(session){{ session.feed_layout !== undefined ? session.feed_layout : 0 }}@else 0 @endif,
default_feed_layout: {{ default_feed_layout !== undefined ? default_feed_layout : 0 }}
};
window.f0ckDebug = window.f0ckSession.development ? console.log.bind(console) : () => {};
window.f0ckI18n = {