- Change the color of the entire post , using a different color than the usual alternating blue and grey (but not too different).
Yep. That's pretty much the first thing I tried, but, I couldn't find a color that struck a nice balance between (effectively) highlighting the post, and not drifting too far away from the SMF aesthetic. Maybe I wasn't persistent enough, and someone else might have better luck, but every time I managed to get the post to stand out, it looked ugly/wrong to me, and every time I managed to make it look nice/right, the post didn't really stand out.
What do you think if it's something like this:
Another more or less equivalent tone can be used. I don't think it gave much, and would only be applied in this specific scenario.
Yep. That's pretty much the first thing I tried, but, I couldn't find a color that struck a nice balance between (effectively) highlighting the post, and not drifting too far away from the SMF aesthetic. Maybe I wasn't persistent enough, and someone else might have better luck, but every time I managed to get the post to stand out, it looked ugly/wrong to me, and every time I managed to make it look nice/right, the post didn't really stand out.
What do you think if it's something like this:
Code:
bgcolor=#F7F8E0
Another more or less equivalent tone can be used. I don't think it gave much, and would only be applied in this specific scenario.
- Change the color of the entire post , using a different color than the usual alternating blue and grey (but not too different).
Yep. That's pretty much the first thing I tried, but, I couldn't find a color that struck a nice balance between (effectively) highlighting the post, and not drifting too far away from the SMF aesthetic. Maybe I wasn't persistent enough, and someone else might have better luck, but every time I managed to get the post to stand out, it looked ugly/wrong to me, and every time I managed to make it look nice/right, the post didn't really stand out.
Maybe this one's too subtle, but, a drop shadow on the icon looks kind of nice:
(That's a style="filter: drop-shadow(0 0 2px #355d8099);" on the![]()
element; the #355d8099 is a 60% opacity dark/desaturated blue that I color-picked from the top-most gradient on the SMF menu.)
Yep. That's pretty much the first thing I tried, but, I couldn't find a color that struck a nice balance between (effectively) highlighting the post, and not drifting too far away from the SMF aesthetic. Maybe I wasn't persistent enough, and someone else might have better luck, but every time I managed to get the post to stand out, it looked ugly/wrong to me, and every time I managed to make it look nice/right, the post didn't really stand out.
- Add a little red(?) asterisk or something in the lower-right corner of the post icon (ie. td.td_headerandpost table tbody tr td a img).
Messing with the post icon is a cool idea...Maybe this one's too subtle, but, a drop shadow on the icon looks kind of nice:
(That's a style="filter: drop-shadow(0 0 2px #355d8099);" on the
I like the idea. All proposed styles seem OK to me, though some alternative styling ideas which come to mind are:
- Change the color of the entire post, using a different color than the usual alternating blue and grey (but not too different).
- Add a little red(?) asterisk or something in the lower-right corner of the post icon (ie. td.td_headerandpost table tbody tr td a img).
Those are decoy posts meant to confuse adblockers. This is also why a lot of the CSS classes randomize on each pageload. Now that there are no ads, I could remove both of these things. Would doing so break anyone's parsers?
The other advantage went back to the customized style sheets people may be using, in the pseudo-element scenario using Style B, they'd have the ability to change the symbol/content.
The pseudo-element wouldn't have to happen on though, I initially picked that because it was the line of code you were modifying in the patch, but it makes more sense on the
No changes to the html tree and I personally find it easier to identify on the page.
I agree too. I think this way is more efficient for what is proposed. And most importantly, it doesn't change the current structure, it's just a matter of layout.
No changes to the html tree and I personally find it easier to identify on the page.
(*) To me, it feels unnatural to put something in the global stylesheet for such a specific, single use-case. (Though, I'm aware that that's mostly a matter of preference, and I do see some other used-just-once stuff in the stylesheet already. I guess, if I were building a new frontend for Bitcointalk from scratch, I'd probably be inclined to avoid inline styles and to observe stricter separation between content and presentation.)
(*) With this patch, there's no avoiding having to make a small change to Display.php and a small change to Display.template.php (with or without your CSS idea). So, involving the stylesheet would add a third patch-point. Needing 3 co-ordinating pieces for this feature to work makes things a little more fragile and complicated than they should be, I think. (I'm also inclined to believe that theymos is more likely to decide to sit down and review/merge a patch, when that patch involves no more components/changes than necessary.)
(*) When the "marker" is added this way (via a ::before pseudo-element), it forms part of the actual subject-line link (as opposed to sitting next to it in a sibling element), and so, when you hover over it, for example, it looks/responds like it's just some extra characters in the subject-line (which is undesirable for a few reasons, but, the main one, I guess, is that I don't want to introduce any unnecessary confusion around where the marker ends and the subject-line begins; if someone tries, for example, to artificially place the marker into their subject-line before posting, then I want there to be some semi-obvious difference between a genuine marker and a "fake" one). It also picks up the link's color (which lowers the contrast of the marker), and its opacity value ends up affecting a small part of the link's :hover text decoration, which looks kind of messy.
Style C
This one just makes the subject-line link black.
- Change the color of the entire post
- Add a little red(?) asterisk or something in the lower-right corner of the post icon (ie. td.td_headerandpost table tbody tr td a img).
When you open the HTML source of this page for example, there are a bunch of "shadow" posts under the OP. These are invisible posts that have the same HTML structure as real posts, but they don't have anything inside them. There is usually a random amount of these displayed, anywhere from one to three. So what is the deal with that, and where do they come from?
Those are decoy posts meant to confuse adblockers. This is also why a lot of the CSS classes randomize on each pageload. Now that there are no ads, I could remove both of these things. Would doing so break anyone's parsers?
That's a cool idea (that is, using a content string on a ::before pseudo-element), but, besides the advantage of avoiding adding a element (which, all concerned parties seem to agree will either not disturb, or be pretty easy to adjust their parsers for), there are a few drawbacks (in no particular order):
~
~
The other advantage went back to the customized style sheets people may be using, in the pseudo-element scenario using Style B, they'd have the ability to change the symbol/content.
The pseudo-element wouldn't have to happen on though, I initially picked that because it was the line of code you were modifying in the patch, but it makes more sense on the
above that, to avoid the link interference.
Although, I'm kinda liking the black version on Style C myself now. But, if Style B makes it, I'd prefer the one-time use of the CSS as opposed to the there, but that's just me... I guess I understand not wanting to add a 3rd file into the mix.
Although, I'm kinda liking the black version on Style C myself now. But, if Style B makes it, I'd prefer the one-time use of the CSS as opposed to the there, but that's just me... I guess I understand not wanting to add a 3rd file into the mix.
Style C
This one just makes the subject-line link black.
I like this one better, tbh.This one just makes the subject-line link black.
No changes to the html tree and I personally find it easier to identify on the page.
I agree too. I think this way is more efficient for what is proposed. And most importantly, it doesn't change the current structure, it's just a matter of layout.
I'm probably going to quote this out of context once in a while:
if I were building a new frontend for Bitcointalk from scratch
Good luck 
Style C
This one just makes the subject-line link black.
I like this one better, tbh.This one just makes the subject-line link black.
No changes to the html tree and I personally find it easier to identify on the page.
Sometimes the post you're looking for will not even be on the landing page after clicking on the link. (...) Will this pose a problem or it happens too few times for it to actually matter.
Missing/deleted posts won't confuse this patch. What'll happen is that none of the posts will be "marked". (Typically, when I land on a topic-page that's missing the post I was looking for, I usually know that's what's happened because the viewport hasn't snapped to a post, and I can still see the SMF menu; that'll still be the case with this patch.)In terms of hard-coding any styles in general, is there any reason you are not avoiding the all together and adding an "id" to the element, then just adding to the CSS file?
That's a cool idea (that is, using a content string on a ::before pseudo-element), but, besides the advantage of avoiding adding a element (which, all concerned parties seem to agree will either not disturb, or be pretty easy to adjust their parsers for), there are a few drawbacks (in no particular order):(*) To me, it feels unnatural to put something in the global stylesheet for such a specific, single use-case. (Though, I'm aware that that's mostly a matter of preference, and I do see some other used-just-once stuff in the stylesheet already. I guess, if I were building a new frontend for Bitcointalk from scratch, I'd probably be inclined to avoid inline styles and to observe stricter separation between content and presentation.)
(*) With this patch, there's no avoiding having to make a small change to Display.php and a small change to Display.template.php (with or without your CSS idea). So, involving the stylesheet would add a third patch-point. Needing 3 co-ordinating pieces for this feature to work makes things a little more fragile and complicated than they should be, I think. (I'm also inclined to believe that theymos is more likely to decide to sit down and review/merge a patch, when that patch involves no more components/changes than necessary.)
(*) When the "marker" is added this way (via a ::before pseudo-element), it forms part of the actual subject-line link (as opposed to sitting next to it in a sibling element), and so, when you hover over it, for example, it looks/responds like it's just some extra characters in the subject-line (which is undesirable for a few reasons, but, the main one, I guess, is that I don't want to introduce any unnecessary confusion around where the marker ends and the subject-line begins; if someone tries, for example, to artificially place the marker into their subject-line before posting, then I want there to be some semi-obvious difference between a genuine marker and a "fake" one). It also picks up the link's color (which lowers the contrast of the marker), and its opacity value ends up affecting a small part of the link's :hover text decoration, which looks kind of messy.
But, I believe the best approach is option A, (...) I would just add maybe a color change, or a different font size, to make this situation stand out more than just italics.
I've looked at a lot of hues by going around the color wheel in ~15 degree increments, and, maybe I'm just really picky, but they all look "wrong" to me in one way or another. What does end up working rather nicely, though, is making the subject-line black. Another thing that works pretty nicely is underlining the subject-line. Underlining also kind of makes sense semantically, in a weird way: Normally, you only see the subject-line underlined when you're about to click on it, but, in this context, you already have clicked on the link (otherwise you wouldn't be seeing it rendered differently to begin with).Style C
This one just makes the subject-line link black.
Code:
--- baseline/Sources/Display.php 2011-02-07 16:45:09.000000000 +0000
+++ modified/Sources/Display.php 2024-04-04 00:02:44.000000000 +0000
@@ -230,24 +230,25 @@
SELECT COUNT(*)
FROM {$db_prefix}messages
WHERE ID_MSG < $virtual_msg
AND ID_TOPIC = $topic", __FILE__, __LINE__);
list ($context['start_from']) = mysql_fetch_row($request);
mysql_free_result($request);
}
// We need to reverse the start as well in this case.
$_REQUEST['start'] = empty($options['view_newest_first']) ? $context['start_from'] : $topicinfo['numReplies'] - $context['start_from'];
$context['robot_no_index'] = true;
+ $context['requested_msg'] = $virtual_msg;
}
}
// Create a previous next string if the selected theme has it as a selected option.
$context['previous_next'] = $modSettings['enablePreviousNext'] ? '' . $txt['previous_next_back'] . ' ' . $txt['previous_next_forward'] . '' : '';
// Check if spellchecking is both enabled and actually working. (for quick reply.)
$context['show_spellchecking'] = !empty($modSettings['enableSpellChecking']) && function_exists('pspell_new');
// Censor the title...
censorText($topicinfo['subject']);
$context['page_title'] = $topicinfo['subject'];
+++ modified/Sources/Display.php 2024-04-04 00:02:44.000000000 +0000
@@ -230,24 +230,25 @@
SELECT COUNT(*)
FROM {$db_prefix}messages
WHERE ID_MSG < $virtual_msg
AND ID_TOPIC = $topic", __FILE__, __LINE__);
list ($context['start_from']) = mysql_fetch_row($request);
mysql_free_result($request);
}
// We need to reverse the start as well in this case.
$_REQUEST['start'] = empty($options['view_newest_first']) ? $context['start_from'] : $topicinfo['numReplies'] - $context['start_from'];
$context['robot_no_index'] = true;
+ $context['requested_msg'] = $virtual_msg;
}
}
// Create a previous next string if the selected theme has it as a selected option.
$context['previous_next'] = $modSettings['enablePreviousNext'] ? '' . $txt['previous_next_back'] . ' ' . $txt['previous_next_forward'] . '' : '';
// Check if spellchecking is both enabled and actually working. (for quick reply.)
$context['show_spellchecking'] = !empty($modSettings['enableSpellChecking']) && function_exists('pspell_new');
// Censor the title...
censorText($topicinfo['subject']);
$context['page_title'] = $topicinfo['subject'];
Code:
--- baseline/Themes/default/Display.template.php 2010-10-22 01:38:35.000000000 +0000
+++ modified/Themes/default/Display.template.php 2024-04-07 23:42:42.000000000 +0000
@@ -359,33 +359,34 @@
echo '
', $settings['use_image_buttons'] ? '![' . $message['member']['online']['label'] . '](' . $settings['images_url'] . '/im_' . ($message['member']['online']['is_online'] ? 'on' : 'off') . '.gif)
' : $message['member']['online']['label'], '';
}
}
// Otherwise, show the guest's email.
elseif (empty($message['member']['hide_email']))
echo '
', ($settings['use_image_buttons'] ? '![' . $txt[69] . '](' . $settings['images_url'] . '/email_sm.gif "' . $txt[69] . '")
' : $txt[69]), '';
// Done with the information about the poster... on to the post itself.
+ $is_requested_message = isset($context['requested_msg']) && $context['requested_msg'] == $message['id'];
echo '
+++ modified/Themes/default/Display.template.php 2024-04-07 23:42:42.000000000 +0000
@@ -359,33 +359,34 @@
echo '
', $settings['use_image_buttons'] ? '
' : $message['member']['online']['label'], '';}
}
// Otherwise, show the guest's email.
elseif (empty($message['member']['hide_email']))
echo '
', ($settings['use_image_buttons'] ? '
' : $txt[69]), '';// Done with the information about the poster... on to the post itself.
+ $is_requested_message = isset($context['requested_msg']) && $context['requested_msg'] == $message['id'];
echo '
'; // If this is the first post, (#0) just say when it was posted - otherwise give the reply #. echo ' « ', !empty($message['counter']) ? $txt[146] . ' #' . $message['counter'] : '', ' ', $txt[30], ': ', $message['time'], ' » | '; // Can they reply? Have they turned on quick reply? if ($context['can_reply'] && !empty($options['display_quick_reply'])) echo ' ', $reply_button, ''; Style D This one puts a text-decoration: underline on the subject-line link.  Code: --- baseline/Sources/Display.php 2011-02-07 16:45:09.000000000 +0000 +++ modified/Sources/Display.php 2024-04-04 00:02:44.000000000 +0000 @@ -230,24 +230,25 @@ SELECT COUNT(*) FROM {$db_prefix}messages WHERE ID_MSG < $virtual_msg AND ID_TOPIC = $topic", __FILE__, __LINE__); list ($context['start_from']) = mysql_fetch_row($request); mysql_free_result($request); } // We need to reverse the start as well in this case. $_REQUEST['start'] = empty($options['view_newest_first']) ? $context['start_from'] : $topicinfo['numReplies'] - $context['start_from']; $context['robot_no_index'] = true; + $context['requested_msg'] = $virtual_msg; } } // Create a previous next string if the selected theme has it as a selected option. $context['previous_next'] = $modSettings['enablePreviousNext'] ? '' . $txt['previous_next_back'] . ' ' . $txt['previous_next_forward'] . '' : ''; // Check if spellchecking is both enabled and actually working. (for quick reply.) $context['show_spellchecking'] = !empty($modSettings['enableSpellChecking']) && function_exists('pspell_new'); // Censor the title... censorText($topicinfo['subject']); $context['page_title'] = $topicinfo['subject']; Code: --- baseline/Themes/default/Display.template.php 2010-10-22 01:38:35.000000000 +0000 +++ modified/Themes/default/Display.template.php 2024-04-07 23:43:30.000000000 +0000 @@ -359,33 +359,34 @@ echo ' ', $settings['use_image_buttons'] ? ' ' : $message['member']['online']['label'], '';} } // Otherwise, show the guest's email. elseif (empty($message['member']['hide_email'])) echo ' ', ($settings['use_image_buttons'] ? ' ' : $txt[69]), '';// Done with the information about the poster... on to the post itself. + $is_requested_message = isset($context['requested_msg']) && $context['requested_msg'] == $message['id']; echo ' |
|
