Improve the mobile UX (#167)

Chunky PR

Reviewed-on: https://git.leftypol.org/leftypol/leftypol/pulls/167
Co-authored-by: Zankaria <zankaria.auxa@skiff.com>
Co-committed-by: Zankaria <zankaria.auxa@skiff.com>
This commit is contained in:
Zankaria 2024-08-19 21:57:50 +00:00 committed by Zankaria
parent 31086b05d9
commit f2ea90a2d0
28 changed files with 661 additions and 451 deletions

View file

@ -18,7 +18,7 @@
*/ */
// From http://stackoverflow.com/a/14035162 // From http://stackoverflow.com/a/14035162
$.fn.scrollStopped = function(callback) { $.fn.scrollStopped = function(callback) {
$(this).scroll(function(){ $(this).scroll(function(){
var self = this, $this = $(self); var self = this, $this = $(self);
if ($this.data('scrollTimeout')) { if ($this.data('scrollTimeout')) {
@ -73,7 +73,7 @@ $(document).ready(function(){
$('#auto_thread_desktop_notifications>input,#auto_thread_desktop_notifications_all>input').on('click', function() { $('#auto_thread_desktop_notifications>input,#auto_thread_desktop_notifications_all>input').on('click', function() {
if (!("Notification" in window)) return; if (!("Notification" in window)) return;
var setting = $(this).parent().attr('id'); var setting = $(this).parent().attr('id');
if ($(this).is(':checked')) { if ($(this).is(':checked')) {
Notification.requestPermission(function(permission){ Notification.requestPermission(function(permission){
@ -132,7 +132,7 @@ $(document).ready(function(){
var new_posts = 0; var new_posts = 0;
var first_new_post = null; var first_new_post = null;
var title = document.title; var title = document.title;
if (typeof update_title == "undefined") { if (typeof update_title == "undefined") {
@ -178,7 +178,7 @@ $(document).ready(function(){
var decrement_timer = function() { var decrement_timer = function() {
poll_current_time = poll_current_time - 1000; poll_current_time = poll_current_time - 1000;
$('#update_secs').text(poll_current_time/1000); $('#update_secs').text(poll_current_time/1000);
if (poll_current_time <= 0) { if (poll_current_time <= 0) {
poll(manualUpdate = false); poll(manualUpdate = false);
} }
@ -195,7 +195,7 @@ $(document).ready(function(){
update_title(); update_title();
first_new_post = null; first_new_post = null;
}; };
// automatically updates the thread after a specified delay // automatically updates the thread after a specified delay
var auto_update = function(delay) { var auto_update = function(delay) {
clearInterval(countdown_interval); clearInterval(countdown_interval);
@ -204,14 +204,14 @@ $(document).ready(function(){
countdown_interval = setInterval(decrement_timer, 1000); countdown_interval = setInterval(decrement_timer, 1000);
$('#update_secs').text(poll_current_time/1000); $('#update_secs').text(poll_current_time/1000);
} }
var stop_auto_update = function() { var stop_auto_update = function() {
clearInterval(countdown_interval); clearInterval(countdown_interval);
} }
var epoch = (new Date).getTime(); var epoch = (new Date).getTime();
var epochold = epoch; var epochold = epoch;
var timeDiff = function (delay) { var timeDiff = function (delay) {
if((epoch-epochold) > delay) { if((epoch-epochold) > delay) {
epochold = epoch = (new Date).getTime(); epochold = epoch = (new Date).getTime();
@ -221,10 +221,15 @@ $(document).ready(function(){
return; return;
} }
} }
var poll = function(manualUpdate) { var poll = function(manualUpdate) {
stop_auto_update(); stop_auto_update();
$('#update_secs').text(_("Updating...")); let isScreenSmall = window.matchMedia('(max-width: 48em)').matches;
if (isScreenSmall) {
$('#update_secs').text('...');
} else {
$('#update_secs').text(_('Updating...'));
}
$.ajax({ $.ajax({
cache: !manualUpdate, cache: !manualUpdate,
@ -259,14 +264,14 @@ $(document).ready(function(){
}); });
time_loaded = Date.now(); // interop with watch.js time_loaded = Date.now(); // interop with watch.js
if ($('#auto_update_status').is(':checked')) { if ($('#auto_update_status').is(':checked')) {
// If there are no new posts, double the delay. Otherwise set it to the min. // If there are no new posts, double the delay. Otherwise set it to the min.
if(loaded_posts == 0) { if(loaded_posts == 0) {
// if the update was manual, don't increase the delay // if the update was manual, don't increase the delay
if (manualUpdate == false) { if (manualUpdate == false) {
poll_interval_delay *= 2; poll_interval_delay *= 2;
// Don't increase the delay beyond the maximum // Don't increase the delay beyond the maximum
if(poll_interval_delay > poll_interval_maxdelay) { if(poll_interval_delay > poll_interval_maxdelay) {
poll_interval_delay = poll_interval_maxdelay; poll_interval_delay = poll_interval_maxdelay;
@ -275,7 +280,7 @@ $(document).ready(function(){
} else { } else {
poll_interval_delay = poll_interval_mindelay; poll_interval_delay = poll_interval_mindelay;
} }
auto_update(poll_interval_delay); auto_update(poll_interval_delay);
} else { } else {
// Decide the message to show if auto update is disabled // Decide the message to show if auto update is disabled
@ -300,7 +305,7 @@ $(document).ready(function(){
} else { } else {
$('#update_secs').text(_("Unknown error")); $('#update_secs').text(_("Unknown error"));
} }
// Keep trying to update // Keep trying to update
if ($('#auto_update_status').is(':checked')) { if ($('#auto_update_status').is(':checked')) {
poll_interval_delay = poll_interval_errordelay; poll_interval_delay = poll_interval_errordelay;
@ -308,7 +313,7 @@ $(document).ready(function(){
} }
} }
}); });
return false; return false;
}; };
@ -318,7 +323,7 @@ $(document).ready(function(){
poll(manualUpdate = true); poll(manualUpdate = true);
}); });
$(window).scrollStopped(function() { $(window).scrollStopped(function() {
// if the newest post is not visible // if the newest post is not visible
if($(this).scrollTop() + $(this).height() < if($(this).scrollTop() + $(this).height() <

View file

@ -1,12 +1,13 @@
/* Depends on post-menu.js /* Depends on post-menu.js
* Usage: * Usage:
* $config['additional_javascript'][] = 'js/jquery.min.js';
* $config['additional_javascript'][] = 'js/post-menu.js'; * $config['additional_javascript'][] = 'js/post-menu.js';
* $config['additional_javascript'][] = 'js/post-filter.js'; * $config['additional_javascript'][] = 'js/post-filter.js';
*/ */
if (active_page === 'thread' || active_page === 'index' || active_page === 'catalog' || active_page === 'ukko') { if (active_page === 'thread' || active_page === 'index' || active_page === 'catalog' || active_page === 'ukko') {
$(document).on('menu_ready', function () { $(document).on('menu_ready', function () {
'use strict'; 'use strict';
// returns blacklist object from storage // returns blacklist object from storage
function getList() { function getList() {
return JSON.parse(localStorage.postFilter); return JSON.parse(localStorage.postFilter);
@ -69,12 +70,12 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
} }
function nameSpanToString(el) { function nameSpanToString(el) {
var s = ''; var s = '';
$.each($(el).contents(), function(k,v) { $.each($(el).contents(), function(k,v) {
if (v.nodeName === 'IMG') if (v.nodeName === 'IMG')
s=s+$(v).attr('alt') s=s+$(v).attr('alt')
if (v.nodeName === '#text') if (v.nodeName === '#text')
s=s+v.nodeValue s=s+v.nodeValue
}); });
@ -170,7 +171,7 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
} }
}; };
/* /*
* hide/show the specified thread/post * hide/show the specified thread/post
*/ */
function hide(ele) { function hide(ele) {
@ -181,13 +182,13 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
$(ele).data('hidden', true); $(ele).data('hidden', true);
if ($ele.hasClass('op')) { if ($ele.hasClass('op')) {
$ele.parent().find('.body, .files, .video-container').not($ele.children('.reply').children()).hide(); $ele.parent().find('.head, .body, .files, .video-container').not($ele.children('.reply').children()).hide();
// hide thread replies on index view // hide thread replies on index view
if (active_page == 'index' || active_page == 'ukko') $ele.parent().find('.omitted, .reply:not(.hidden), post_no, .mentioned, br').hide(); if (active_page == 'index' || active_page == 'ukko') $ele.parent().find('.omitted, .reply:not(.hidden), post_no, .mentioned, br').hide();
} else { } else {
// normal posts // normal posts
$ele.children('.body, .files, .video-container').hide(); $ele.children('.head, .body, .files, .video-container').hide();
} }
} }
function show(ele) { function show(ele) {
@ -195,15 +196,15 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
$(ele).data('hidden', false); $(ele).data('hidden', false);
if ($ele.hasClass('op')) { if ($ele.hasClass('op')) {
$ele.parent().find('.body, .files, .video-container').show(); $ele.parent().find('.head, .body, .files, .video-container').show();
if (active_page == 'index') $ele.parent().find('.omitted, .reply:not(.hidden), post_no, .mentioned, br').show(); if (active_page == 'index') $ele.parent().find('.omitted, .reply:not(.hidden), post_no, .mentioned, br').show();
} else { } else {
// normal posts // normal posts
$ele.children('.body, .files, .video-container').show(); $ele.children('.head, .body, .files, .video-container').show();
} }
} }
/* /*
* create filter menu when the button is clicked * create filter menu when the button is clicked
*/ */
function initPostMenu(pageData) { function initPostMenu(pageData) {
@ -225,18 +226,19 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
submenu.add_item('filter-remove-trip', _('Tripcode')); submenu.add_item('filter-remove-trip', _('Tripcode'));
Menu.onclick(function (e, $buffer) { Menu.onclick(function (e, $buffer) {
var ele = e.target.parentElement.parentElement; let ele = e.target.parentElement.parentElement.parentElement;
var $ele = $(ele); let $ele = $(ele);
var threadId = $ele.parent('.thread').attr('id').replace('thread_', ''); let threadNode = $ele.parent('.thread');
var boardId = $ele.parent().data('board'); let threadId = threadNode.attr('id').replace('thread_', '');
var postId = $ele.find('.post_no').not('[id]').text(); let boardId = $ele.parent().data('board');
let postId = $ele.find('.post_no').not('[id]').text();
if (pageData.hasUID) { if (pageData.hasUID) {
var postUid = $ele.find('.poster_id').text(); var postUid = $ele.find('.poster_id').text();
} }
var postName; let postName;
var postTrip = ''; let postTrip = '';
if (!pageData.forcedAnon) { if (!pageData.forcedAnon) {
postName = (typeof $ele.find('.name').contents()[0] == 'undefined') ? '' : nameSpanToString($ele.find('.name')[0]); postName = (typeof $ele.find('.name').contents()[0] == 'undefined') ? '' : nameSpanToString($ele.find('.name')[0]);
postTrip = $ele.find('.trip').text(); postTrip = $ele.find('.trip').text();
@ -343,7 +345,7 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
}); });
} }
/* /*
* hide/unhide thread on index view * hide/unhide thread on index view
*/ */
function quickToggle(ele, threadId, pageData) { function quickToggle(ele, threadId, pageData) {
@ -357,7 +359,7 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
var postId = $(ele).find('.post_no').not('[id]').text(); var postId = $(ele).find('.post_no').not('[id]').text();
var hidden = $(ele).data('hidden'); var hidden = $(ele).data('hidden');
var boardId = $(ele).parents('.thread').data('board'); var boardId = $(ele).parents('.thread').data('board');
if (hidden) { if (hidden) {
blacklist.remove.post(boardId, threadId, postId, false); blacklist.remove.post(boardId, threadId, postId, false);
$(this).html('[&ndash;]'); $(this).html('[&ndash;]');
@ -749,7 +751,7 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
} }
} }
/* /*
* clear out pruned threads * clear out pruned threads
*/ */
function purge() { function purge() {
@ -785,7 +787,7 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
if ((timestamp() - list.lastPurge) < 86400) // less than 1 day if ((timestamp() - list.lastPurge) < 86400) // less than 1 day
return; return;
for (boardId in list.nextPurge) { for (boardId in list.nextPurge) {
board = list.nextPurge[boardId]; board = list.nextPurge[boardId];
for (threadId in board) { for (threadId in board) {
@ -869,7 +871,7 @@ if (active_page === 'thread' || active_page === 'index' || active_page === 'cata
} }
init(); init();
}); });
if (typeof window.Menu !== "undefined") { if (typeof window.Menu !== "undefined") {
$(document).trigger('menu_ready'); $(document).trigger('menu_ready');
} }

View file

@ -13,166 +13,218 @@
* *
*/ */
$(document).ready(function () { /*
var dont_fetch_again = []; * Unknown media types always return false, so old browsers (css media 3 or prior to css media) which do support
init_hover = function() { * any-hover or css media queries may return false negatives.
var $link = $(this); * Handle it by checking if the query is explicitly NOT supported.
*/
var id; if (!window.matchMedia('(any-hover: none)').matches) {
var matches; $(document).ready(function () {
let isScreenSmall = false
/*
* Set up screen size detection.
* If the method is not defined, suppose the screen is always not-small.
*/
if (window.matchMedia) {
let query = window.matchMedia('(max-width: 48em)');
if ($link.is('[data-thread]')) { query.addEventListener('change', (e) => isScreenSmall = e.matches);
id = $link.attr('data-thread'); isScreenSmall = query.matches;
}
else if(matches = $link.text().match(/^>>(?:>\/([^\/]+)\/)?(\d+)$/)) {
id = matches[2];
} }
else {
return;
}
var board = $(this);
while (board.data('board') === undefined) {
board = board.parent();
}
var threadid;
if ($link.is('[data-thread]')) threadid = 0;
else threadid = board.attr('id').replace("thread_", "");
board = board.data('board'); let dont_fetch_again = [];
init_hover = function() {
let link = $(this);
var parentboard = board; let id;
let matches;
if ($link.is('[data-thread]')) parentboard = $('form[name="post"] input[name="board"]').val();
else if (matches[1] !== undefined) board = matches[1];
var $post = false; if (link.is('[data-thread]')) {
var hovering = false; id = link.attr('data-thread');
var hovered_at; } else if (matches = link.text().match(/^>>(?:>\/([^\/]+)\/)?(\d+)$/)) {
$link.hover(function(e) { id = matches[2];
hovering = true;
hovered_at = {'x': e.pageX, 'y': e.pageY};
var start_hover = function($link) {
if($.contains($post[0], $link[0])) {
// link links to itself or to op; ignore
}
else if ($post.is(':visible') &&
$post.offset().top >= $(window).scrollTop() &&
$post.offset().top + $post.height() <= $(window).scrollTop() + $(window).height()) {
// post is in view
$post.addClass('highlighted');
} else {
var $newPost = $post.clone();
$newPost.find('>.reply, >br').remove();
//$newPost.find('span.mentioned').remove();
$newPost.find('a.post_anchor').remove();
$newPost
.attr('id', 'post-hover-' + id)
.attr('data-board', board)
.addClass('post-hover')
.css('border-style', 'solid')
.css('display', 'inline-block')
.css('position', 'absolute')
.css('font-style', 'normal')
.css('z-index', '100')
.css('margin-left', '1em')
.addClass('reply').addClass('post')
.insertAfter($link.parent())
$link.trigger('mousemove');
}
};
$post = $('[data-board="' + board + '"] div.post#reply_' + id + ', [data-board="' + board + '"]div#thread_' + id);
if($post.length > 0) {
start_hover($(this));
} else { } else {
var url = $link.attr('href').replace(/#.*$/, ''); return;
}
if($.inArray(url, dont_fetch_again) != -1) {
let board = $(this);
while (board.data('board') === undefined) {
board = board.parent();
}
let threadid;
if (link.is('[data-thread]')) {
threadid = 0;
} else {
threadid = board.attr('id').replace("thread_", "");
}
board = board.data('board');
let parentboard = board;
if (link.is('[data-thread]')) {
parentboard = $('form[name="post"] input[name="board"]').val();
} else if (matches[1] !== undefined) {
board = matches[1];
}
let post = false;
let hovering = false;
let hovered_at;
let updatePreviewPosition = function(pageX, pageY, hoverPreview) {
let scrollTop = $(window).scrollTop();
if (link.is("[data-thread]")) {
scrollTop = 0;
}
let epy = pageY;
if (link.is("[data-thread]")) {
epy -= $(window).scrollTop();
}
let top = (epy ? epy : hovered_at['y']) - 10;
if (epy < scrollTop + 15) {
top = scrollTop;
} else if (epy > scrollTop + $(window).height() - hoverPreview.height() - 15) {
top = scrollTop + $(window).height() - hoverPreview.height() - 15;
}
let hovery = pageY ? pageY : hovered_at['y'];
if ((hovery - top) > 20){
top = hovery;
}
let previewX;
if (isScreenSmall) {
previewX = 0;
} else {
previewX = (pageX ? pageX : hovered_at['x']) + 1
}
hoverPreview.css('left', previewX).css('top', top);
};
link.hover(function(e) {
hovering = true;
hovered_at = {'x': e.pageX, 'y': e.pageY};
let start_hover = function(link) {
if ($.contains(post[0], link[0])) {
// link links to itself or to op; ignore
} else if (post.is(':visible') &&
post.offset().top >= $(window).scrollTop() &&
post.offset().top + post.height() <= $(window).scrollTop() + $(window).height()) {
// Post is in view, highlight it.
post.addClass('highlighted');
} else {
// Creates the preview, and displays it,
let hoverPreview = post.clone();
hoverPreview.find('>.reply, >br').remove();
hoverPreview.find('a.post_anchor').remove();
hoverPreview
.attr('id', 'post-hover-' + id)
.attr('data-board', board)
.addClass('post-hover')
.css('border-style', 'solid')
.css('display', 'inline-block')
.css('position', 'absolute')
.css('font-style', 'normal')
.css('z-index', '100');
if (isScreenSmall) {
hoverPreview
.css('margin-top', '1em')
.css('border-left-style', 'none')
.css('border-right-style', 'none');
} else {
hoverPreview.css('margin-left', '1em');
}
hoverPreview.addClass('reply').addClass('post')
.insertAfter(link.parent())
updatePreviewPosition(e.pageX, e.pageY, hoverPreview);
}
};
post = $('[data-board="' + board + '"] div.post#reply_' + id + ', [data-board="' + board + '"]div#thread_' + id);
if (post.length > 0) {
start_hover($(this));
} else {
let url = link.attr('href').replace(/#.*$/, '');
if ($.inArray(url, dont_fetch_again) != -1) {
return;
}
dont_fetch_again.push(url);
$.ajax({
url: url,
context: document.body,
success: function(data) {
var mythreadid = $(data).find('div[id^="thread_"]').attr('id').replace("thread_", "");
if (mythreadid == threadid && parentboard == board) {
$(data).find('div.post.reply').each(function() {
if ($('[data-board="' + board + '"] #' + $(this).attr('id')).length === 0) {
$('[data-board="' + board + '"]#thread_' + threadid + " .post.reply:first").before($(this).hide().addClass('hidden'));
}
});
} else if ($('[data-board="' + board + '"]#thread_'+mythreadid).length > 0) {
$(data).find('div.post.reply').each(function() {
if ($('[data-board="' + board + '"] #' + $(this).attr('id')).length === 0) {
$('[data-board="' + board + '"]#thread_' + mythreadid + " .post.reply:first").before($(this).hide().addClass('hidden'));
}
});
} else {
$(data).find('div[id^="thread_"]').hide().attr('data-cached', 'yes').prependTo('form[name="postcontrols"]');
}
post = $('[data-board="' + board + '"] div.post#reply_' + id + ', [data-board="' + board + '"]div#thread_' + id);
if (hovering && post.length > 0) {
start_hover(link);
}
}
});
}
}, function() {
// Remove the preview.
hovering = false;
if (!post) {
return; return;
} }
dont_fetch_again.push(url);
$.ajax({
url: url,
context: document.body,
success: function(data) {
var mythreadid = $(data).find('div[id^="thread_"]').attr('id').replace("thread_", "");
if (mythreadid == threadid && parentboard == board) { post.removeClass('highlighted');
$(data).find('div.post.reply').each(function() { if (post.hasClass('hidden') || post.data('cached') == 'yes') {
if($('[data-board="' + board + '"] #' + $(this).attr('id')).length == 0) { post.css('display', 'none');
$('[data-board="' + board + '"]#thread_' + threadid + " .post.reply:first").before($(this).hide().addClass('hidden')); }
} $('.post-hover').remove();
}); }).mousemove(function(e) {
} // Update the preview position if the mouse moves.
else if ($('[data-board="' + board + '"]#thread_'+mythreadid).length > 0) {
$(data).find('div.post.reply').each(function() {
if($('[data-board="' + board + '"] #' + $(this).attr('id')).length == 0) {
$('[data-board="' + board + '"]#thread_' + mythreadid + " .post.reply:first").before($(this).hide().addClass('hidden'));
}
});
}
else {
$(data).find('div[id^="thread_"]').hide().attr('data-cached', 'yes').prependTo('form[name="postcontrols"]');
}
$post = $('[data-board="' + board + '"] div.post#reply_' + id + ', [data-board="' + board + '"]div#thread_' + id); if (!post) {
return;
}
if(hovering && $post.length > 0) { // The actual displayed preview.
start_hover($link); let hoverPreview = $('#post-hover-' + id + '[data-board="' + board + '"]');
} if (hoverPreview.length === 0) {
} return;
}); }
}
}, function() {
hovering = false;
if(!$post)
return;
$post.removeClass('highlighted');
if($post.hasClass('hidden') || $post.data('cached') == 'yes')
$post.css('display', 'none');
$('.post-hover').remove();
}).mousemove(function(e) {
if(!$post)
return;
var $hover = $('#post-hover-' + id + '[data-board="' + board + '"]');
if($hover.length == 0)
return;
var scrollTop = $(window).scrollTop(); updatePreviewPosition(e.pageX, e.pageY, hoverPreview);
if ($link.is("[data-thread]")) scrollTop = 0; });
var epy = e.pageY; };
if ($link.is("[data-thread]")) epy -= $(window).scrollTop();
var top = (epy ? epy : hovered_at['y']) - 10; $('div.body a:not([rel="nofollow"])').each(init_hover);
if(epy < scrollTop + 15) { // allow to work with auto-reload.js, etc.
top = scrollTop; $(document).on('new_post', function(e, post) {
} else if(epy > scrollTop + $(window).height() - $hover.height() - 15) { $(post).find('div.body a:not([rel="nofollow"])').each(init_hover);
top = scrollTop + $(window).height() - $hover.height() - 15;
}
var hovery = e.pageY ? e.pageY : hovered_at['y'];
if ( ( hovery - top) > 20){
top = hovery;
}
$hover.css('left', (e.pageX ? e.pageX : hovered_at['x']) + 1).css('top', top);
}); });
};
$('div.body a:not([rel="nofollow"])').each(init_hover);
// allow to work with auto-reload.js, etc.
$(document).on('new_post', function(e, post) {
$(post).find('div.body a:not([rel="nofollow"])').each(init_hover);
}); });
}); }

View file

@ -4,57 +4,57 @@
* *
* Released under the MIT license * Released under the MIT license
* Copyright (c) 2012 Michael Save <savetheinternet@tinyboard.org> * Copyright (c) 2012 Michael Save <savetheinternet@tinyboard.org>
* Copyright (c) 2013-2014 Marcin Łabanowski <marcin@6irc.net> * Copyright (c) 2013-2014 Marcin Łabanowski <marcin@6irc.net>
* *
* Usage: * Usage:
* $config['additional_javascript'][] = 'js/jquery.min.js'; * $config['additional_javascript'][] = 'js/jquery.min.js';
* // $config['additional_javascript'][] = 'js/post-hover'; (optional; must come first) * // $config['additional_javascript'][] = 'js/post-hover.js'; (optional; must come first)
* $config['additional_javascript'][] = 'js/show-backlinks.js'; * $config['additional_javascript'][] = 'js/show-backlinks.js';
* *
*/ */
$(document).ready(function(){ $(document).ready(function() {
var showBackLinks = function() { let showBackLinks = function() {
var reply_id = $(this).attr('id').replace(/^reply_/, ''); let replyId = $(this).attr('id').replace(/^reply_/, '');
$(this).find('div.body a:not([rel="nofollow"])').each(function() { $(this).find('div.body a:not([rel="nofollow"])').each(function() {
var id, post, $mentioned; let id = $(this).text().match(/^>>(\d+)$/);
if (id) {
if(id = $(this).text().match(/^>>(\d+)$/))
id = id[1]; id = id[1];
else } else {
return; return;
}
$post = $('#reply_' + id);
if($post.length == 0) let post = $('#reply_' + id);
if(post.length == 0)
return; return;
$mentioned = $post.find('p.intro span.mentioned'); let mentioned = post.find('p.intro span.mentioned');
if($mentioned.length == 0) if (mentioned.length === 0) {
$mentioned = $('<span class="mentioned unimportant"></span>').appendTo($post.find('p.intro')); mentioned = $('<span class="mentioned unimportant"></span>').prependTo(post.find('.head'));
}
if ($mentioned.find('a.mentioned-' + reply_id).length != 0)
if (mentioned.find('a.mentioned-' + replyId).length !== 0) {
return; return;
}
var $link = $('<a class="mentioned-' + reply_id + '" onclick="highlightReply(\'' + reply_id + '\');" href="#' + reply_id + '">&gt;&gt;' +
reply_id + '</a>'); let link = $('<a class="mentioned-' + replyId + '" onclick="highlightReply(\'' + replyId + '\');" href="#'
$link.appendTo($mentioned) + replyId + '">&gt;&gt;' + replyId + '</a>');
link.appendTo(mentioned)
if (window.init_hover) { if (window.init_hover) {
$link.each(init_hover); link.each(init_hover);
} }
}); });
}; };
$('div.post.reply').each(showBackLinks); $('div.post.reply').each(showBackLinks);
$(document).on('new_post', function(e, post) { $(document).on('new_post', function(e, post) {
if ($(post).hasClass("reply")) { if ($(post).hasClass('reply')) {
showBackLinks.call(post); showBackLinks.call(post);
} } else {
else {
$(post).find('div.post.reply').each(showBackLinks); $(post).find('div.post.reply').each(showBackLinks);
} }
}); });
}); });

View file

@ -110,6 +110,11 @@ div.post.reply {
background: #282A2E; background: #282A2E;
border: 1px solid #117743; border: 1px solid #117743;
border-radius: 5px; border-radius: 5px;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply.highlighted { div.post.reply.highlighted {
background: rgba(59, 22, 43, 0.4); background: rgba(59, 22, 43, 0.4);

View file

@ -58,6 +58,11 @@ div.post.reply.post-hover {
border-width: 1px; border-width: 1px;
border-style: none solid solid none; border-style: none solid solid none;
border-color: #B7C5D9; border-color: #B7C5D9;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply div.body a { div.post.reply div.body a {

View file

@ -55,8 +55,10 @@ div.post.reply {
background: #333333; background: #333333;
border: #555555 1px solid; border: #555555 1px solid;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply.highlighted { div.post.reply.highlighted {
background: #555; background: #555;

View file

@ -5,17 +5,17 @@
/*dark.css has been prepended (2021-11-11) instead of @import'd for performance*/ /*dark.css has been prepended (2021-11-11) instead of @import'd for performance*/
body { body {
background: #1E1E1E; background: #1E1E1E;
color: #999999; color: #A7A7A7;
font-family: Verdana, sans-serif; font-family: Verdana, sans-serif;
font-size: 14px; font-size: 14px;
} }
.quote { .quote {
color:#B8D962; color:#B8D962;
} }
@font-face { @font-face {
font-family: 'lain'; font-family: 'lain';
src: url('./fonts/nrdyyh.woff') format('woff'), src: url('./fonts/nrdyyh.woff') format('woff'),
url('./fonts/tojcxo.TTF') format('truetype'); url('./fonts/tojcxo.TTF') format('truetype');
} }
h1 h1
{ {
@ -51,6 +51,11 @@ a.post_no:hover {
div.post.reply { div.post.reply {
background: #333333; background: #333333;
border: #555555 1px solid; border: #555555 1px solid;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply.highlighted { div.post.reply.highlighted {
background: #555; background: #555;
@ -152,7 +157,7 @@ hr {
} }
div.boardlist { div.boardlist {
text-align: center; text-align: center;
color: #999999; color: #A7A7A7;
} }
div.ban { div.ban {
background-color: transparent; background-color: transparent;
@ -172,9 +177,9 @@ div.boardlist:not(.bottom) {
} }
.desktop-style div.boardlist:not(.bottom) { .desktop-style div.boardlist:not(.bottom) {
text-shadow: black 1px 1px 1px, black -1px -1px 1px, black -1px 1px 1px, black 1px -1px 1px; text-shadow: black 1px 1px 1px, black -1px -1px 1px, black -1px 1px 1px, black 1px -1px 1px;
color: #999999; color: #A7A7A7;
background-color: #1E1E1E; background-color: #1E1E1E;
} }
div.report { div.report {
color: #666666; color: #666666;

View file

@ -67,6 +67,11 @@ div.post.reply.post-hover {
border-width: 1px; border-width: 1px;
border-style: none solid solid none; border-style: none solid solid none;
border-color: #B7C5D9; border-color: #B7C5D9;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply div.body a { div.post.reply div.body a {

View file

@ -73,6 +73,11 @@ div.post.reply.post-hover {
border-width: 1px; border-width: 1px;
border-style: none solid solid none; border-style: none solid solid none;
border-color: #101010; border-color: #101010;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply div.body a { div.post.reply div.body a {

View file

@ -90,6 +90,11 @@ div.post.reply.post-hover {
border-width: 1px; border-width: 1px;
border-style: none solid solid none; border-style: none solid solid none;
border-color: #B7C5D9; border-color: #B7C5D9;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply div.body a { div.post.reply div.body a {

View file

@ -94,7 +94,7 @@ form table tr th {
form table tr th { form table tr th {
background: #AF0A0F; background: #AF0A0F;
color: #FFF; color: #FFF;
border: 1px solid #800000; border: 1px solid #800000;
} }
form table tr td div { form table tr td div {
text-align: center; text-align: center;
@ -213,6 +213,11 @@ div.post.reply {
border-style: none solid solid none; border-style: none solid solid none;
border-color: #DCDCDC; border-color: #DCDCDC;
display: inline-block; display: inline-block;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
span.trip { span.trip {
color: #228854; color: #228854;
@ -393,7 +398,7 @@ div.blotter {
} }
.desktop-style div.boardlist:nth-child(1) { .desktop-style div.boardlist:nth-child(1) {
} }
.desktop-style div.boardlist:nth-child(1):hover, .desktop-style div.boardlist:nth-child(1).cb-menu { .desktop-style div.boardlist:nth-child(1):hover, .desktop-style div.boardlist:nth-child(1).cb-menu {

View file

@ -18,9 +18,9 @@ img {
/* boardlist gets all scrunched on small screens */ /* boardlist gets all scrunched on small screens */
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
header, img.board_image { header, img.board_image {
margin-top: 5em; margin-top: 5em;
} }
} }
@media screen and (min-width: 700px) { @media screen and (min-width: 700px) {
@ -39,7 +39,6 @@ html, body {
} }
div.pages{ div.pages{
margin:0!important; margin:0!important;
padding: 0!important; padding: 0!important;
} }
@ -61,8 +60,7 @@ img.banner, img.board_image {
} }
.bar { .bar {
display: table;
display: table!important;
position: fixed; position: fixed;
width: 100%; width: 100%;
left: 0px; left: 0px;
@ -70,10 +68,12 @@ img.banner, img.board_image {
background-color: #D6DAF0; background-color: #D6DAF0;
border-color: #B7C5D9; border-color: #B7C5D9;
} }
.bar > :not(script) { .bar > :not(script) {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;
} }
.bar.top { .bar.top {
text-align: center; text-align: center;
top: 0px; top: 0px;
@ -81,11 +81,26 @@ img.banner, img.board_image {
} }
.bar.bottom { .bar.bottom {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
bottom: 0px; bottom: 0px;
border-top: 1px solid #333333; border-top: 1px solid #333333;
/*background-color: #333333 ;*/
} }
/* Stuff in the bottom bar. */
@media (max-width: 64em) {
.pages-list {
display: none;
}
}
@media (max-width: 64em) {
#updater {
display: block;
}
}
/*homepage banner*/ /*homepage banner*/
div.lain_banner{ div.lain_banner{
@ -102,9 +117,14 @@ body {
color: black; color: black;
font-family: arial,helvetica,sans-serif; font-family: arial,helvetica,sans-serif;
font-size: 10pt; font-size: 10pt;
margin: 0 4px;
padding-left: 4px; padding-left: 4px;
padding-right: 4px; padding-right: 4px;
margin: 0px 4px;
@media (max-width: 48em) {
margin: 0px;
padding: 0px;
}
} }
main, main,
@ -242,10 +262,6 @@ a.post_no {
color: #ff0000; color: #ff0000;
} }
.intro label {
display: inline;
}
.intro time,p.intro a.ip-link,p.intro a.capcode { .intro time,p.intro a.ip-link,p.intro a.capcode {
direction: ltr; direction: ltr;
unicode-bidi: embed; unicode-bidi: embed;
@ -346,7 +362,6 @@ form table tr td div label {
.file { .file {
float: left; float: left;
margin-right: 2px;
} }
.file:not(.multifile) .post-image { .file:not(.multifile) .post-image {
@ -359,11 +374,7 @@ form table tr td div label {
p.fileinfo { p.fileinfo {
display: block; display: block;
margin: 0 0 0 20px; margin: 0.2em 0px;
}
div.post p.fileinfo {
padding-left: 5px;
} }
div.banner { div.banner {
@ -403,7 +414,7 @@ img.banner,img.board_image {
} }
div.post .post-image { div.post .post-image {
padding: 5px; padding: 0.2em;
margin: 0 20px 0 0; margin: 0 20px 0 0;
} }
@ -418,24 +429,29 @@ div.post i.fa, div.thread i.fa {
font-size: 16px; font-size: 16px;
} }
div.post.op {
margin-right: 20px;
margin-bottom: 5px;
}
div.post.op hr { div.post.op hr {
border-color: #D9BFB7; border-color: #D9BFB7;
} }
.intro {
margin: 0.5em 0;
padding: 0;
padding-bottom: 0.2em;
}
input.delete { input.delete {
float: left; float: left;
margin: 1px 6px 0 0; margin: 1px 6px 0px 0px;
scale: 1.05;
}
.intro {
padding: 0px;
line-height: 1.3em;
}
.intro span {
min-width: 0.3em;
display: inline-block;
}
.post-details {
text-wrap: nowrap;
float: right;
} }
.intro span.subject { .intro span.subject {
@ -448,12 +464,12 @@ input.delete {
font-weight: bold; font-weight: bold;
} }
.intro span.capcode,p.intro a.capcode,p.intro a.nametag { .post-details span.capcode,p.intro a.capcode,p.intro a.nametag {
color: #F00000; color: #F00000;
margin-left: 0; margin-left: 0;
} }
.intro a { .post-details a {
margin-left: 5px; margin-left: 5px;
} }
@ -466,13 +482,35 @@ input.delete {
color: maroon; color: maroon;
} }
div.post p { div.post {
display: block; margin: 0.2em 4px;
margin: 0; padding: 0.5em 0.3em;
display: inline-block;
max-width: 94%!important;
line-height: 1.16em; @media (max-width: 48em) {
font-size: 13px; margin: 0.1em 0px;
min-height: 1.16em; padding: 0.5em 0px;
width: 100%;
max-width: unset!important;
}
}
div.post > div.head {
margin: 0.1em 1em;
clear: both;
line-height: 1.3em;
}
div.post > p {
margin: 0.1em 0.4em;
font-size: 13px;
min-height: 1.16em;
@media (max-width: 48em) {
margin-right: 1.4em;
}
} }
div.post div.body { div.post div.body {
@ -481,6 +519,10 @@ div.post div.body {
padding-bottom: 0.3em; padding-bottom: 0.3em;
} }
div.post.op div.body {
margin-left: 0.8em;
}
div.post.reply div.body { div.post.reply div.body {
margin-left: 1.8em; margin-left: 1.8em;
} }
@ -498,15 +540,27 @@ div.post div.body {
white-space: pre-wrap; white-space: pre-wrap;
} }
div.post.op {
padding-top: 0px;
vertical-align: top;
/* Add back in the padding that is provided by body on large screens */
@media (max-width: 48em) {
padding-left: 4px;
padding-right: 4px;
}
}
div.post.reply { div.post.reply {
background: #D6DAF0; background: #D6DAF0;
margin: 0.2em 4px;
padding: 0.5em 0.3em 0.5em 0.6em;
border-width: 1px; border-width: 1px;
border-style: none solid solid none; border-style: none solid solid none;
border-color: #B7C5D9; border-color: #B7C5D9;
display: inline-block;
max-width: 94%!important; @media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply.has-file.body-not-empty { div.post.reply.has-file.body-not-empty {
@ -553,19 +607,14 @@ br.clear {
} }
span.controls { span.controls {
float: right;
margin: 0; margin: 0;
padding: 0; padding: 0;
font-size: 80%;
}
span.controls.op {
float: none;
margin-left: 10px;
} }
span.controls a { span.controls a {
margin: 0; margin: 0;
text-wrap: nowrap;
display: inline-block;
} }
div#wrap { div#wrap {

View file

@ -4,7 +4,7 @@ body {
font-family: sans-serif; font-family: sans-serif;
font-size: 12px; font-size: 12px;
color: #99938D; color: #99938D;
background-color: #1e1e1e; background-color: #1e1e1e;
background-image: url('img/szalet_bg.png'); background-image: url('img/szalet_bg.png');
background-repeat: repeat; background-repeat: repeat;
@ -14,7 +14,7 @@ body {
background-image: url('img/szalet_bg.png'); background-image: url('img/szalet_bg.png');
background-repeat: repeat; background-repeat: repeat;
/*background-color: #200000;*/ /*background-color: #200000;*/
} }
.boardlist .board a { .boardlist .board a {
background-color: #200000; background-color: #200000;
@ -27,7 +27,7 @@ color: #26899C;
div.pages a.selected { div.pages a.selected {
color: #FFFCFC !important;} color: #FFFCFC !important;}
a:link, a:visited, div.post.reply p.body a { a:link, a:visited, div.post.reply p.body a {
color: #7A422C!important; color: #7A422C!important;
text-decoration: none; text-decoration: none;
@ -35,12 +35,12 @@ a:link, a:visited, div.post.reply p.body a {
a:link:hover, a:visited:hover, div.post.reply p.body a:hover { a:link:hover, a:visited:hover, div.post.reply p.body a:hover {
color: #8A8A23!important; color: #8A8A23!important;
} }
a.email span.name { a.email span.name {
color: #4B4B4B !important; color: #4B4B4B !important;
} }
input { input {
color: #8A7656; color: #8A7656;
background: none !important; background: none !important;
@ -52,7 +52,7 @@ input, textarea, select {
background: #200000; background: #200000;
color: #99938D; color: #99938D;
} }
hr { hr {
height: 3px; height: 3px;
border-width: 0px; border-width: 0px;
@ -60,7 +60,7 @@ background: url('img/szalet_hr.png') center no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
overflow: hidden; overflow: hidden;
} }
.reflink a:hover{ .reflink a:hover{
font-weight: bold; font-weight: bold;
} }
@ -93,7 +93,7 @@ div.banner, .replymode, .catalogmode {
font-weight: bold; font-weight: bold;
text-align: center !important; text-align: center !important;
} }
.postarea { .postarea {
} }
.rules { .rules {
@ -119,7 +119,7 @@ div.banner, .replymode, .catalogmode {
.delbuttons { .delbuttons {
text-align:center; text-align:center;
padding-bottom:4px; padding-bottom:4px;
} }
.managehead { .managehead {
background-color: #1e1e1e; background-color: #1e1e1e;
@ -153,13 +153,13 @@ div.banner, .replymode, .catalogmode {
color: #bebebe; color: #bebebe;
font-weight:800; font-weight:800;
} }
.intro span.subject { .intro span.subject {
color: #771018; color: #771018;
font-weight: bold; font-weight: bold;
} }
span.name, .postername { span.name, .postername {
color: #8A775B !important; color: #8A775B !important;
font-weight:bold; font-weight:bold;
@ -178,11 +178,16 @@ div.post.reply {
padding: 5px; padding: 5px;
border: 1px #583E28 solid !important; border: 1px #583E28 solid !important;
background: #200000; background: #200000;
-webkit-border-radius: 10px; -webkit-border-radius: 10px;
-khtml-border-radius: 10px; -khtml-border-radius: 10px;
-moz-border-radius: 10px; -moz-border-radius: 10px;
border-radius: 10px; border-radius: 10px;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply.highlighted { div.post.reply.highlighted {
background: #583E28; background: #583E28;

View file

@ -38,6 +38,11 @@ div.post.reply {
background: #000000; background: #000000;
border: 1px dashed; border: 1px dashed;
border-color:#00FF00; border-color:#00FF00;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply.highlighted { div.post.reply.highlighted {
background: transparent; background: transparent;
@ -174,7 +179,7 @@ table.modlog tr th {
-moz-box-shadow: 0 0 40px #000; -moz-box-shadow: 0 0 40px #000;
-webkit-box-shadow: 0 0 40px #000; -webkit-box-shadow: 0 0 40px #000;
box-shadow: 0 0 40px #000; box-shadow: 0 0 40px #000;
} }
.bar.top .bar.top
{ {

View file

@ -60,6 +60,11 @@ a.post_no:hover {
div.post.reply { div.post.reply {
background: #111111; background: #111111;
border: 1px dotted; border: 1px dotted;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply.highlighted { div.post.reply.highlighted {
background: transparent; background: transparent;

View file

@ -1,24 +1,24 @@
@import url(./terminal_common.css); @import url(./terminal_common.css);
body, div.title, h1, a:link, a:visited, p.intro a.email span.name, body, div.title, h1, a:link, a:visited, p.intro a.email span.name,
a:link:hover, a:visited:hover, a.post_no, a.post_no:hover, a:link:hover, a:visited:hover, a.post_no, a.post_no:hover,
div.post.reply div.body a:link, div.post.reply div.body a:visited, div.post.reply div.body a:link, div.post.reply div.body a:visited,
div.post.reply div.body a:link:hover, div.post.reply div.body a:visited:hover, div.post.reply div.body a:link:hover, div.post.reply div.body a:visited:hover,
table.modlog tr th, p.intro span.name, p.intro a.capcode, p.intro a.nametag, table.modlog tr th, p.intro span.name, p.intro a.capcode, p.intro a.nametag,
div.pages a.selected, p.intro a.email, p.intro a.email span.name, div.pages a.selected, p.intro a.email, p.intro a.email span.name,
p.intro a.email:hover, p.intro a.email:hover span.name, p.intro a.email:hover, p.intro a.email:hover span.name,
div.boardlist input[type="text"], form table tr td input[type="text"], textarea, select, input[type="password"], div.boardlist input[type="text"], form table tr td input[type="text"], textarea, select, input[type="password"],
form table tr th, input[type="submit"], input[type="submit"]:hover, div.pages form table tr th, input[type="submit"], input[type="submit"]:hover, div.pages
{ {
color: #8725EC!important; color: #8725EC!important;
} }
.boardlist, div.blotter, header div.subtitle, h1, span.quote .boardlist, div.blotter, header div.subtitle, h1, span.quote
{ {
color: #A6D2FF!important; color: #A6D2FF!important;
} }
p.intro span.subject, span.trip p.intro span.subject, span.trip
{ {
color: #8725EC; color: #8725EC;
} }
@ -36,13 +36,20 @@ div.ban h2 {
} }
input[type="text"], textarea, select, input[type="password"], form table tr th, input[type="text"], textarea, select, input[type="password"], form table tr th,
input[type="submit"], input[type="submit"]:hover, div.pages, hr, div.ban, input[type="submit"], input[type="submit"]:hover, div.pages, hr, div.ban,
div.post.reply, div.post.reply.highlighted div.post.reply, div.post.reply.highlighted
{ {
border-color: #8725EC; border-color: #8725EC;
} }
@media (max-width: 48em) {
div.post.reply {
border-left-style: none;
border-right-style: none;
}
}
.desktop-style div.boardlist:nth-child(1) { .desktop-style div.boardlist:nth-child(1) {
border-bottom: #8725EC 1px dashed; border-bottom: #8725EC 1px dashed;
} }
@ -55,7 +62,7 @@ div.post.reply, div.post.reply.highlighted
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
.bar.top .bar.top
{ {
border-bottom-style: dotted; border-bottom-style: dotted;
} }

View file

@ -1,7 +1,7 @@
@import url("animate.css"); @import url("animate.css");
/* /*
* test.css * test.css
* Just a test. * Just a test.
*/ */
.quote { .quote {
color:#B8D962; color:#B8D962;
@ -22,7 +22,7 @@
src: url('./fonts/nrdyyh.woff') format('woff'), src: url('./fonts/nrdyyh.woff') format('woff'),
url('./fonts/tojcxo.TTF') format('truetype'); url('./fonts/tojcxo.TTF') format('truetype');
} }
h1 h1
{ {
font-family: 'lain', tahoma; font-family: 'lain', tahoma;
letter-spacing: -2px; letter-spacing: -2px;
@ -41,7 +41,7 @@ img
div.title, h1 { div.title, h1 {
color: #32DD72; color: #32DD72;
} }
div.title p { div.title p {
font-size: 10px; font-size: 10px;
@ -97,14 +97,17 @@ div.post.reply {
border-radius: 10px; border-radius: 10px;
opacity: 0.85; opacity: 0.85;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
img.post-image:hover { img.post-image:hover {
-webkit-animation: flip 5s linear infinite; -webkit-animation: flip 5s linear infinite;
-moz-animation: flip 5s linear infinite; -moz-animation: flip 5s linear infinite;
-o-animation: flip 5s linear infinite; -o-animation: flip 5s linear infinite;
animation: flip 5s linear infinite; animation: flip 5s linear infinite;
} }
@ -112,14 +115,14 @@ div.post.op:hover{
-webkit-animation: pulse 5s linear ; -webkit-animation: pulse 5s linear ;
-moz-animation: pulse 5s linear ; -moz-animation: pulse 5s linear ;
-o-animation: pulse 5s linear ; -o-animation: pulse 5s linear ;
animation: pulse 5s linear ; animation: pulse 5s linear ;
} }
div.postcontainer:hover{ div.postcontainer:hover{
-webkit-animation: pulse 5s linear; -webkit-animation: pulse 5s linear;
-moz-animation: pulse 5s linear; -moz-animation: pulse 5s linear;
-o-animation: pulse 5s linear ; -o-animation: pulse 5s linear ;
animation: pulse 5s linear ; animation: pulse 5s linear ;
} }
div.post div.body { div.post div.body {
@ -235,17 +238,17 @@ span.trip {
div.pages { div.pages {
background: #1E1E1E; background: #1E1E1E;
font-family: "LoveLetter" , sans-serif; font-family: "LoveLetter" , sans-serif;
} }
.bar.bottom { .bar.bottom {
bottom: 0px; bottom: 0px;
border-top: 1px solid #333333; border-top: 1px solid #333333;
background-color: #1E1E1E; background-color: #1E1E1E;
text-shadow: #525252 1px 1px 1px, #080808 -1px -1px 1px, #27ff00 -1px 1px 1px, #1e1e1e 1px -1px 1px; text-shadow: #525252 1px 1px 1px, #080808 -1px -1px 1px, #27ff00 -1px 1px 1px, #1e1e1e 1px -1px 1px;
} }
div.pages a.selected { div.pages a.selected {
color: #CCCCCC; color: #CCCCCC;
@ -254,7 +257,7 @@ hr {
height: 1px; height: 1px;
border: #0aaf0f 1px solid; border: #0aaf0f 1px solid;
background-position: -500px 0; background-position: -500px 0;
background-image: linear-gradient(to right, rgba(10, 167, 0, 0.94), rgba(13, 255, 0, 0.75), rgb(22, 144, 7)); background-image: linear-gradient(to right, rgba(10, 167, 0, 0.94), rgba(13, 255, 0, 0.75), rgb(22, 144, 7));
-webkit-animation: thread2 10s linear ; -webkit-animation: thread2 10s linear ;
-moz-animation: thread2 10s linear ; -moz-animation: thread2 10s linear ;
-o-animation: thread2 10s linear; -o-animation: thread2 10s linear;
@ -265,7 +268,7 @@ img.banner, img.board_image {
-webkit-animation: wobble 10s linear infinite; -webkit-animation: wobble 10s linear infinite;
-moz-animation: wobble 10s linear infinite; -moz-animation: wobble 10s linear infinite;
-o-animation: wobble 10s linear infinite; -o-animation: wobble 10s linear infinite;
animation: wobble 10s linear infinite; animation: wobble 10s linear infinite;
} }
@ -315,13 +318,13 @@ table.modlog tr th {
} }
div.boardlist:not(.bottom) { div.boardlist:not(.bottom) {
text-shadow: #525252 1px 1px 1px, #080808 -1px -1px 1px, #27ff00 -1px 1px 1px, #1e1e1e 1px -1px 1px; text-shadow: #525252 1px 1px 1px, #080808 -1px -1px 1px, #27ff00 -1px 1px 1px, #1e1e1e 1px -1px 1px;
background-color: #1E1E1E; background-color: #1E1E1E;
} }
.desktop-style div.boardlist:not(.bottom) { .desktop-style div.boardlist:not(.bottom) {
position:static; position:static;
color: #999999; color: #999999;
background-color: #1E1E1E; background-color: #1E1E1E;
} }

View file

@ -4,7 +4,7 @@ body {
font-family: sans-serif; font-family: sans-serif;
font-size: 12px; font-size: 12px;
color:#bebebe; color:#bebebe;
background-color: #1e1e1e; background-color: #1e1e1e;
background-image: url('img/testorange_testo.png'), url('img/testorange_top_bg.png'), url('img/testorange_bg.png'); background-image: url('img/testorange_testo.png'), url('img/testorange_top_bg.png'), url('img/testorange_bg.png');
background-repeat: no-repeat, repeat-x, repeat; background-repeat: no-repeat, repeat-x, repeat;
@ -15,7 +15,7 @@ body {
.desktop-style .bl-menu{ .desktop-style .bl-menu{
background-image: url('img/testorange_bg.png'); background-image: url('img/testorange_bg.png');
background-repeat: repeat; background-repeat: repeat;
} }
.boardlist .board a { .boardlist .board a {
background-image: url('img/testorange_bg.png'); background-image: url('img/testorange_bg.png');
@ -33,6 +33,13 @@ a:link:hover, a:visited:hover, div.post.reply div.body a:hover {
color:#ffff00; color:#ffff00;
} }
@media (max-width: 48em) {
div.post.reply {
border-left-style: none;
border-right-style: none;
}
}
a.email span.name { a.email span.name {
color:#ff9100 !important; color:#ff9100 !important;
} }

View file

@ -3,13 +3,13 @@
color change by kalyx color change by kalyx
*/ */
@import url("/stylesheets/dark.css"); @import url("/stylesheets/dark.css");
@font-face @font-face
{ {
font-family: "DejaVuSansMono"; font-family: "DejaVuSansMono";
src: url("/stylesheets/fonts/DejaVuSansMono.ttf") format("truetype"); src: url("/stylesheets/fonts/DejaVuSansMono.ttf") format("truetype");
} }
@font-face @font-face
{ {
font-family: 'lain'; font-family: 'lain';
src: url('./fonts/nrdyyh.woff') format('woff'), src: url('./fonts/nrdyyh.woff') format('woff'),
@ -20,13 +20,13 @@ color change by kalyx
color change by kalyx color change by kalyx
*/ */
@import url("/stylesheets/dark.css"); @import url("/stylesheets/dark.css");
@font-face @font-face
{ {
font-family: "DejaVuSansMono"; font-family: "DejaVuSansMono";
src: url("/stylesheets/fonts/DejaVuSansMono.ttf") format("truetype"); src: url("/stylesheets/fonts/DejaVuSansMono.ttf") format("truetype");
} }
@font-face @font-face
{ {
font-family: 'lain'; font-family: 'lain';
src: url('./fonts/nrdyyh.woff') format('woff'), src: url('./fonts/nrdyyh.woff') format('woff'),
@ -329,6 +329,11 @@ div.post.reply {
border-color: #B7C5D9; border-color: #B7C5D9;
display: inline-block; display: inline-block;
max-width: 94%!important; max-width: 94%!important;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
span.trip { span.trip {
@ -986,10 +991,10 @@ span.pln {
clear: both; clear: both;
visibility: hidden; visibility: hidden;
overflow: hidden; overflow: hidden;
font-size: 0px; font-size: 0px;
line-height: 0px; line-height: 0px;
box-sizing: border-box; box-sizing: border-box;
border: none; border: none;
height: 0; height: 0;
@ -1004,7 +1009,7 @@ span.pln {
/* Board List */ /* Board List */
div.boardlist { div.boardlist {
margin-top: 3px; margin-top: 3px;
color: #89A; color: #89A;
font-size: 16px; font-size: 16px;
} }
@ -1358,6 +1363,11 @@ div.post.reply {
background: #111; background: #111;
border: #555555 1px solid; border: #555555 1px solid;
box-shadow: 4px 4px #555; box-shadow: 4px 4px #555;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
div.post.reply.highlighted { div.post.reply.highlighted {
background: #555; background: #555;

View file

@ -6,29 +6,29 @@ feel free to steal it.
*/ */
@import url("/stylesheets/dark.css"); @import url("/stylesheets/dark.css");
@font-face @font-face
{ {
font-family: "Open Sans Light"; font-family: "Open Sans Light";
src: url("/stylesheets/fonts/OpenSans-Light-webfont.eot") format("embedded-opentype"), url("/stylesheets/fonts/OpenSans-Light-webfont.woff") format("woff"), url("/stylesheets/fonts/OpenSans-Light-webfont.ttf") format("truetype"), url("/stylesheets/fonts/OpenSans-Light-webfont.svg#OpenSansLight") format("svg"); src: url("/stylesheets/fonts/OpenSans-Light-webfont.eot") format("embedded-opentype"), url("/stylesheets/fonts/OpenSans-Light-webfont.woff") format("woff"), url("/stylesheets/fonts/OpenSans-Light-webfont.ttf") format("truetype"), url("/stylesheets/fonts/OpenSans-Light-webfont.svg#OpenSansLight") format("svg");
} }
body body
{ {
background: #395168; background: #395168;
color: #E0E0E0; color: #E0E0E0;
} }
.bar .bar
{ {
-moz-box-shadow: 0 0 40px #435D78; -moz-box-shadow: 0 0 40px #435D78;
-webkit-box-shadow: 0 0 40px #435D78; -webkit-box-shadow: 0 0 40px #435D78;
box-shadow: 0 0 40px #435D78; box-shadow: 0 0 40px #435D78;
background-color: #435D78!important; background-color: #435D78!important;
border-color: #486582!important; border-color: #486582!important;
} }
div.boardlist:not(.bottom) div.boardlist:not(.bottom)
{ {
background-color:#395168; background-color:#395168;
} }
.desktop-style div.boardlist:not(.bottom) .desktop-style div.boardlist:not(.bottom)
{ {
background-color:#395168; background-color:#395168;
} }
@ -56,6 +56,14 @@ div.topbar, input[type="text"], select, form table tr th, form table tr td input
border-color: #486582!important; border-color: #486582!important;
color: #E0E0E0!important; color: #E0E0E0!important;
} }
@media (max-width: 48em) {
div.post.reply {
border-left-style: none;
border-right-style: none;
}
}
div.post.reply.highlighted{ div.post.reply.highlighted{
background-color: #486582!important; background-color: #486582!important;
} }

View file

@ -212,6 +212,11 @@ div.post.reply {
border-style: none solid solid none; border-style: none solid solid none;
border-color: lightgreen; border-color: lightgreen;
display: inline-block; display: inline-block;
@media (max-width: 48em) {
border-left-style: none;
border-right-style: none;
}
} }
span.trip { span.trip {
color: #228854; color: #228854;
@ -393,7 +398,7 @@ div.blotter {
} }
.desktop-style div.boardlist:nth-child(1) { .desktop-style div.boardlist:nth-child(1) {
} }

View file

@ -119,9 +119,13 @@
<div id="bottom-hud" class="bar bottom"> <div id="bottom-hud" class="bar bottom">
<div class="pages"> <div class="pages">
{{ btn.prev }} [ {% for page in pages %} {{ btn.prev }}
<a {% if page.selected %}class="selected"{% endif %}{% if not page.selected %}href="{{ page.link }}"{% endif %}>{{ page.num }}</a>{% if not loop.last %} /{% endif %} <span class="pages-list">
{% endfor %} ] {{ btn.next }} [ {% for page in pages %}
<a {% if page.selected %}class="selected"{% endif %}{% if not page.selected %}href="{{ page.link }}"{% endif %}>{{ page.num }}</a>{% if not loop.last %} /{% endif %}
{% endfor %} ]
</span>
{{ btn.next }}
{% if config.catalog_link %} {% if config.catalog_link %}
| <a href="{{ config.root }}{% if mod %}{{ config.file_mod }}?/{% endif %}{{ board.dir }}{{ config.catalog_link }}">{% trans %}Catalog{% endtrans %}</a> | <a href="{{ config.root }}{% if mod %}{{ config.file_mod }}?/{% endif %}{{ board.dir }}{{ config.catalog_link }}">{% trans %}Catalog{% endtrans %}</a>
{% endif %} {% endif %}

View file

@ -1,17 +1,17 @@
{% if mod %} {% if mod %}
<span class="controls {% if not post.thread %}op{% endif %}"> <span class="controls {% if not post.thread %}op{% endif %}">
{% if mod|hasPermission(config.mod.warning, board.uri) %} {% if mod|hasPermission(config.mod.warning, board.uri) %}
<a title="{% trans %}Warn{% endtrans %}" href="?/{{ board.dir }}warning/{{ post.id }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_warning }}</a>&nbsp; <a title="{% trans %}Warn{% endtrans %}" href="?/{{ board.dir }}warning/{{ post.id }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_warning }}</a>&nbsp;
{% endif %} {% endif %}
{% if mod|hasPermission(config.mod.delete, board.uri) %} {% if mod|hasPermission(config.mod.delete, board.uri) %}
<a title="{% trans %}Delete{% endtrans %}" onclick="if (event.which==2) return true;if (confirm('{% trans %}Are you sure you want to delete this?{% endtrans %}')) document.location='?/{{ secure_link(board.dir ~ 'delete/' ~ post.id) }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}';return false;" href="?/{{ board.dir }}delete/{{ post.id }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_delete }}</a>&nbsp; <a title="{% trans %}Delete{% endtrans %}" onclick="if (event.which==2) return true;if (confirm('{% trans %}Are you sure you want to delete this?{% endtrans %}')) document.location='?/{{ secure_link(board.dir ~ 'delete/' ~ post.id) }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}';return false;" href="?/{{ board.dir }}delete/{{ post.id }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_delete }}</a>&nbsp;
{% endif %} {% endif %}
{% if mod|hasPermission(config.mod.deletebyip, board.uri) %} {% if mod|hasPermission(config.mod.deletebyip, board.uri) %}
<a title="{% trans %}Delete all posts by IP{% endtrans %}" onclick="if (event.which==2) return true;if (confirm('{% trans %}Are you sure you want to delete all posts by this IP address?{% endtrans %}')) document.location='?/{{ secure_link(board.dir ~ 'deletebyip/' ~ post.id) }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}';return false;" href="?/{{ board.dir }}deletebyip/{{ post.id }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_deletebyip }}</a>&nbsp; <a title="{% trans %}Delete all posts by IP{% endtrans %}" onclick="if (event.which==2) return true;if (confirm('{% trans %}Are you sure you want to delete all posts by this IP address?{% endtrans %}')) document.location='?/{{ secure_link(board.dir ~ 'deletebyip/' ~ post.id) }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}';return false;" href="?/{{ board.dir }}deletebyip/{{ post.id }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_deletebyip }}</a>&nbsp;
{% endif %} {% endif %}
{% if mod|hasPermission(config.mod.deletebyip_global, board.uri) %} {% if mod|hasPermission(config.mod.deletebyip_global, board.uri) %}
<a title="{% trans %}Delete all posts by IP across all boards{% endtrans %}" onclick="if (event.which==2) return true;if (confirm('{% trans %}Are you sure you want to delete all posts by this IP address, across all boards?{% endtrans %}')) document.location='?/{{ secure_link(board.dir ~ 'deletebyip/' ~ post.id ~ '/global') }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}';return false;" href="?/{{ board.dir }}deletebyip/{{ post.id }}/global{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_deletebyip_global }}</a>&nbsp; <a title="{% trans %}Delete all posts by IP across all boards{% endtrans %}" onclick="if (event.which==2) return true;if (confirm('{% trans %}Are you sure you want to delete all posts by this IP address, across all boards?{% endtrans %}')) document.location='?/{{ secure_link(board.dir ~ 'deletebyip/' ~ post.id ~ '/global') }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}';return false;" href="?/{{ board.dir }}deletebyip/{{ post.id }}/global{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_deletebyip_global }}</a>&nbsp;
{% endif %} {% endif %}
{% if mod|hasPermission(config.mod.ban, board.uri) %} {% if mod|hasPermission(config.mod.ban, board.uri) %}
<a title="{% trans %}Ban{% endtrans %}" href="?/{{ board.dir }}ban/{{ post.id }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_ban }}</a>&nbsp; <a title="{% trans %}Ban{% endtrans %}" href="?/{{ board.dir }}ban/{{ post.id }}{% if post.thread %}&amp;thread={{ post.thread }}{% endif %}">{{ config.mod.link_ban }}</a>&nbsp;

View file

@ -1,7 +1,7 @@
{% if config.poster_ids %} {% if config.poster_ids %}
{% if post.thread %} {% if post.thread %}
<span class="poster_id">{{ post.ip|poster_id(post.thread) }}</span> <span class="poster_id">{{ post.ip|poster_id(post.thread) }}</span>
{% else %} {% else %}
<span class="poster_id">{{ post.ip|poster_id(post.id) }}</span> <span class="poster_id">{{ post.ip|poster_id(post.id) }}</span>
{% endif %} {% endif %}
{% endif %} {% endif %}

View file

@ -1 +1 @@
<time datetime="{{ post.time|date('%Y-%m-%dT%H:%M:%S') }}{{ timezone() }}">{{ post.time|date(config.post_date) }}</time> <time datetime="{{ post.time|date('%Y-%m-%dT%H:%M:%S') }}{{ timezone() }}">{{ post.time|date(config.post_date) }}</time>

View file

@ -1,24 +1,27 @@
{% filter remove_whitespace %} {% filter remove_whitespace %}
{# tabs and new lines will be ignored #} {# tabs and new lines will be ignored #}
<div class="post reply" id="reply_{{ post.id }}" data-board="{{ board.uri }}"> <div class="post reply" id="reply_{{ post.id }}" data-board="{{ board.uri }}">
<p class="intro"> <p class="intro">
{% if not index %}<a id="{{ post.id }}" class="post_anchor"></a>{% endif %} <label for="delete_{{ post.id }}">
<input type="checkbox" class="delete" name="delete_{{ post.id }}" id="delete_{{ post.id }}" /> {% if not index %}<a id="{{ post.id }}" class="post_anchor"></a>{% endif %}
<label for="delete_{{ post.id }}"> <input type="checkbox" class="delete" name="delete_{{ post.id }}" id="delete_{{ post.id }}" />
{% include 'post/subject.html' %} {% include 'post/subject.html' %}
{% include 'post/name.html' %} {% include 'post/name.html' %}
{% include 'post/ip.html' %} {% include 'post/ip.html' %}
{% include 'post/flag.html' %} {% include 'post/flag.html' %}
{% include 'post/time.html' %} </label>
</label> <span></span>
{% include 'post/poster_id.html' %}&nbsp; {% include 'post/poster_id.html' %}
<label style="text-wrap: nowrap;"> <label class="post-details">
<a class="post_no" id="post_no_{{ post.id }}" onclick="highlightReply({{ post.id }})" href="{% if isnoko50 %}{{ post.link('', config.file_page50) }}{% else %}{{ post.link }}{% endif %}">No.</a> {% include 'post/time.html' %}
<a class="post_no" onclick="citeReply({{ post.id }})" href="{% if isnoko50 %}{{ post.link('q', config.file_page50) }}{% else %}{{ post.link('q') }}{% endif %}">{{ post.id }}</a> <a class="post_no" id="post_no_{{ post.id }}" title="Link to this post" onclick="highlightReply({{ post.id }})" href="{% if isnoko50 %}{{ post.link('', config.file_page50) }}{% else %}{{ post.link }}{% endif %}">No.</a>
</label> <a class="post_no" title="Reply to this post" onclick="citeReply({{ post.id }})" href="{% if isnoko50 %}{{ post.link('q', config.file_page50) }}{% else %}{{ post.link('q') }}{% endif %}">{{ post.id }}</a>
</p> </label>
{% include 'post/fileinfo.html' %} </p>
{% include 'post/post_controls.html' %} <div class="head">
{% include 'post/post_controls.html' %}
{% include 'post/fileinfo.html' %}
</div>
<div class="body" {% if post.files|length > 1 %}style="clear:both"{% endif %}> <div class="body" {% if post.files|length > 1 %}style="clear:both"{% endif %}>
{% endfilter %}{% if index %}{{ post.body|truncate_body(post.link) }}{% else %}{{ post.body }}{% endif %}{% filter remove_whitespace %} {% endfilter %}{% if index %}{{ post.body|truncate_body(post.link) }}{% else %}{{ post.body }}{% endif %}{% filter remove_whitespace %}
{% if post.modifiers['ban message'] %} {% if post.modifiers['ban message'] %}

View file

@ -3,95 +3,98 @@
<div class="thread" id="thread_{{ post.id }}" data-board="{{ board.uri }}"> <div class="thread" id="thread_{{ post.id }}" data-board="{{ board.uri }}">
{% if not index %}<a id="{{ post.id }}" class="post_anchor"></a>{% endif %} {% if not index %}<a id="{{ post.id }}" class="post_anchor"></a>{% endif %}
<div class="post op" id="op_{{ post.id }}" {%if post.num_files > 1%}style='clear:both'{%endif%}>
{% include 'post/fileinfo.html' %} <p class="intro">
<div class="post op" id="op_{{ post.id }}" {%if post.num_files > 1%}style='clear:both'{%endif%}><p class="intro"> <label for="delete_{{ post.id }}">
<input type="checkbox" class="delete" name="delete_{{ post.id }}" id="delete_{{ post.id }}" /> <input type="checkbox" class="delete" name="delete_{{ post.id }}" id="delete_{{ post.id }}" />
<label for="delete_{{ post.id }}"> {% include 'post/subject.html' %}
{% include 'post/subject.html' %} {% include 'post/name.html' %}
{% include 'post/name.html' %} {% include 'post/ip.html' %}
{% include 'post/ip.html' %} {% include 'post/flag.html' %}
{% include 'post/flag.html' %} </label>
{% include 'post/time.html' %} <span></span>
</label> {% include 'post/poster_id.html' %}&nbsp;
{% include 'post/poster_id.html' %}&nbsp; <label class="post-details">
<label style="text-wrap: nowrap;"> {% include 'post/time.html' %}
<a class="post_no" id="post_no_{{ post.id }}" onclick="highlightReply({{ post.id }})" href="{% if isnoko50 %}{{ post.link('', '50') }}{% else %}{{ post.link }}{% endif %}">No.</a> <a class="post_no" id="post_no_{{ post.id }}" title="Link to this post" onclick="highlightReply({{ post.id }})" href="{% if isnoko50 %}{{ post.link('', '50') }}{% else %}{{ post.link }}{% endif %}">No.</a>
<a class="post_no" onclick="citeReply({{ post.id }})" href="{% if isnoko50 %}{{ post.link('q', '50') }}{% else %}{{ post.link('q') }}{% endif %}">{{ post.id }}</a> <a class="post_no" title="Reply to this post" onclick="citeReply({{ post.id }})" href="{% if isnoko50 %}{{ post.link('q', '50') }}{% else %}{{ post.link('q') }}{% endif %}">{{ post.id }}</a>
</label> </label>
{% if post.sticky %} </p>
{% if config.font_awesome %} <div class="head">
<i class="fa fa-thumb-tack" title="Sticky"></i> {% if post.sticky %}
{% else %} {% if config.font_awesome %}
<img class="icon" title="Sticky" src="{{ config.root }}{{ config.image_sticky }}" alt="Sticky" /> <i class="fa fa-thumb-tack" title="Sticky"></i>
{% endif %} {% else %}
{% endif %} <img class="icon" title="Sticky" src="{{ config.root }}{{ config.image_sticky }}" alt="Sticky" />
{% if post.locked %}
{% if config.font_awesome %}
<i class="fa fa-lock" title="Locked"></i>
{% else %}
<img class="icon" title="Locked" src="{{ config.root }}{{ config.image_locked }}" alt="Locked" />
{% endif %}
{% endif %}
{% if post.sage and (config.mod.view_bumplock < 0 or (post.mod and post.mod|hasPermission(config.mod.view_bumplock, board.uri))) %}
{% if config.font_awesome %}
<i class="fa fa-anchor" title="Bumplocked"></i>
{% else %}
<img class="icon" title="Bumplocked" src="{{ config.root }}{{ config.image_bumplocked }}" alt="Bumplocked" />
{% endif %}
{% endif %}
{% if post.cycle %}
{% if config.font_awesome %}
<i class="fa fa-refresh" title="Cyclical"></i>
{% else %}
<img class="icon" title="Cyclical" src="{{ config.root }}{{ config.image_cycled }}" alt="Cyclical" />
{% endif %}
{% endif %}
{% if index %}
<a href="{{ post.root }}{{ board.dir }}{{ config.dir.res }}{{ link_for(post) }}">[{% trans %}Reply{% endtrans %}]</a>
{% endif %}
{% if isnoko50 %}
<a href="{{ post.root }}{{ board.dir }}{{ config.dir.res }}{{ link_for(post) }}">[{% trans %}View All{% endtrans %}]</a>
{% endif %}
{% if hasnoko50 and not isnoko50 %}
{% set lastcount = config.noko50_count %}
<a href="{{ post.root }}{{ board.dir }}{{ config.dir.res }}{{ link_for(post, true) }}">[{% trans %}Last 1 Post{% plural lastcount %}Last {{ count }} Posts{% endtrans %}]</a>
{% endif %}
{% include 'post/post_controls.html' %}
</p>
<div class="body">
{% endfilter %}{% if index %}{{ post.body|truncate_body(post.link) }}{% else %}{{ post.body }}{% endif %}{% filter remove_whitespace %}
{% if post.modifiers['ban message'] %}
{{ config.mod.ban_message|sprintf(post.modifiers['ban message']) }}
{% endif %}
{% if post.modifiers['warning message'] %}
{{ config.mod.warning_message|sprintf(post.modifiers['warning message']) }}
{% endif %}
</div>
{% if post.omitted or post.omitted_images %}
<span class="omitted">
{% if post.omitted %}
{% trans %}
1 post
{% plural post.omitted %}
{{ count }} posts
{% endtrans %}
{% if post.omitted_images %}
{% trans %}and{% endtrans %}
{% endif %} {% endif %}
{% endif %} {% endif %}
{% if post.omitted_images %} {% if post.locked %}
{% trans %} {% if config.font_awesome %}
1 image reply <i class="fa fa-lock" title="Locked"></i>
{% plural post.omitted_images %} {% else %}
{{ count }} image replies <img class="icon" title="Locked" src="{{ config.root }}{{ config.image_locked }}" alt="Locked" />
{% endtrans %} {% endif %}
{% endif %} {% trans %}omitted. Click reply to view.{% endtrans %} {% endif %}
</span> {% if post.sage and (config.mod.view_bumplock < 0 or (post.mod and post.mod|hasPermission(config.mod.view_bumplock, board.uri))) %}
{% if config.font_awesome %}
<i class="fa fa-anchor" title="Bumplocked"></i>
{% else %}
<img class="icon" title="Bumplocked" src="{{ config.root }}{{ config.image_bumplocked }}" alt="Bumplocked" />
{% endif %}
{% endif %}
{% if post.cycle %}
{% if config.font_awesome %}
<i class="fa fa-refresh" title="Cyclical"></i>
{% else %}
<img class="icon" title="Cyclical" src="{{ config.root }}{{ config.image_cycled }}" alt="Cyclical" />
{% endif %}
{% endif %}
{% if index %}
<a href="{{ post.root }}{{ board.dir }}{{ config.dir.res }}{{ link_for(post) }}">[{% trans %}Reply{% endtrans %}]</a>
{% endif %}
{% if isnoko50 %}
<a href="{{ post.root }}{{ board.dir }}{{ config.dir.res }}{{ link_for(post) }}">[{% trans %}View All{% endtrans %}]</a>
{% endif %}
{% if hasnoko50 and not isnoko50 %}
{% set lastcount = config.noko50_count %}
<a href="{{ post.root }}{{ board.dir }}{{ config.dir.res }}{{ link_for(post, true) }}">[{% trans %}Last 1 Post{% plural lastcount %}Last {{ count }} Posts{% endtrans %}]</a>
{% endif %}
{% include 'post/post_controls.html' %}
{% include 'post/fileinfo.html' %}
</div>
<div class="body">
{% endfilter %}{% if index %}{{ post.body|truncate_body(post.link) }}{% else %}{{ post.body }}{% endif %}{% filter remove_whitespace %}
{% if post.modifiers['ban message'] %}
{{ config.mod.ban_message|sprintf(post.modifiers['ban message']) }}
{% endif %}
{% if post.modifiers['warning message'] %}
{{ config.mod.warning_message|sprintf(post.modifiers['warning message']) }}
{% endif %}
</div>
{% if post.omitted or post.omitted_images %}
<span class="omitted">
{% if post.omitted %}
{% trans %}
1 post
{% plural post.omitted %}
{{ count }} posts
{% endtrans %}
{% if post.omitted_images %}
{% trans %}and{% endtrans %}
{% endif %}
{% endif %}
{% if post.omitted_images %}
{% trans %}
1 image reply
{% plural post.omitted_images %}
{{ count }} image replies
{% endtrans %}
{% endif %} {% trans %}omitted. Click reply to view.{% endtrans %}
</span>
{% endif %}
{% if not index %}
{% endif %} {% endif %}
{% if not index %} </div>{% endfilter %}
{% endif %}
</div>{% endfilter %}
{% set iparray = [post.ip] %} {% set iparray = [post.ip] %}
{% set hr = post.hr %} {% set hr = post.hr %}
{% for post in post.posts %} {% for post in post.posts %}