Skip to content
View in the app

A better way to browse. Learn more.

www.Head-Case.org

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Major Forum Software Update

Featured Replies

Based on the research that I was able to do it is essentially a known forum bug. I can't find a way to shut them off or to even assign a generic (very small) image to each of them to kill the void caused by the lack of image. If someone else finds a link that explains how it can be changed/fixed shoot it my way and I'll see what I can do.

I haven’t used this technique in many years, but any chance you can apply CSS tags to them and either position off-screen or display off?

Ex.

.ipsType_richText img {

position: absolute;

left: -9999px;

}

or

.ipsType_richText img {

display: none !important;

}

https://chatgpt.com/share/6acce6f6-9554-83e8-bf4a-f5dc88363f26

I asked my local AI the same question , and suggested the stylus plugin and this script for the home page

@-moz-document url("https://www.head-case.org/forums/"),

url("https://www.head-case.org/forums") {

/*

* HEAD-CASE — COMPACT FORUM HOMEPAGE

*

* Trial stylesheet: selectors are not verified against

* Head-Case's live HTML.

*

* Applies only to the two homepage URLs above.

*/

/* 1. Replace forum grids with a single-column list.

Only target lists containing forum-category links. */

:is(.ipsData, .ipsDataList):has(a[href*="/forums/forum/"]) {

display: flex !important;

flex-direction: column !important;

gap: 6px !important;

}

/* 2. Remove fixed heights and excessive row spacing. */

:is(.ipsData, .ipsDataList):has(a[href*="/forums/forum/"])

> :is(.ipsData__item, .ipsDataItem) {

width: 100% !important;

max-width: none !important;

min-height: 0 !important;

height: auto !important;

margin-block: 0 !important;

padding: 10px 12px !important;

box-sizing: border-box !important;

}

/* 3. Hide decorative forum cover-image containers.

Do not hide all images: avatars and posted pictures

should remain untouched. */

:is(.ipsData__item, .ipsDataItem)

:is(.ipsData__image, .ipsDataItem_image) {

display: none !important;

}

/* 4. Let the text area use the space left by the image. */

:is(.ipsData__item, .ipsDataItem)

:is(.ipsData__main, .ipsDataItem_main) {

flex: 1 1 auto !important;

min-width: 0 !important;

width: auto !important;

min-height: 0 !important;

padding-block: 0 !important;

}

/* 5. Clear any reserved image-column layout.

Keep information arranged in a simple vertical stack. */

.ipsData__item:has(a[href*="/forums/forum/"]) {

display: flex !important;

flex-direction: column !important;

gap: 4px !important;

aspect-ratio: auto !important;

}

/* 6. Keep forum titles readable without oversized headings. */

:is(.ipsData__item, .ipsDataItem)

:is(.ipsData__title, .ipsDataItem_title) {

font-size: 17px !important;

line-height: 1.35 !important;

margin-block: 0 4px !important;

}

/* 7. Tighten descriptions without shrinking their text. */

:is(.ipsData__item, .ipsDataItem)

:is(.ipsData__desc, .ipsDataItem_meta) {

line-height: 1.45 !important;

margin-block: 2px !important;

}

/* 8. Slightly smaller padding on phones. */

@media (max-width: 700px) {

:is(.ipsData, .ipsDataList):has(a[href*="/forums/forum/"])

> :is(.ipsData__item, .ipsDataItem) {

padding: 8px 10px !important;

}

}

}

Before:

image.png

After:

image.png

HTML Jockeys may be able to do a better job, but the advantage is its client side, so your choice, fairly easy to implement, and reversible

  • Add the Stylus plugin / extension to your browser

  • Go to the Head Case forum page - or whatever page is annoying you

  • Click on the Stylus extension icon in your toolbar

  • (click on the + to) Add a Style for the Website / URL in Question

  • Paste the above code in

  • Save

  • re visit / refresh the site

  • See the before and after by noting that the Stylus icon has 1 rule applied for the page, and by clicking on it you can toggle it on or off

More design oriented people could have a deeper, better conversation with their AI of choice, but not bad for a first vibe coded attempt?

It does look better without the image placeholders. I've gotten used to looking at them, but there must be a way to get rid of them permanently, particularly for the mobile users.

My typical use case is just click unread content, and take it from there, but, that does miss Today's Birthday's, and who's Online, so there is that.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.