Hello again LES - Things are probably going to change a bit, here are my ideas, I want your input.

cybertech · May 8

let's do it

rpqu · May 8

Adsense? (aws) SES?
I'm surprised it's not run on vercell, heroku, fly.io

ascicode · May 8

some crypto adresses and everyone can decide if yes or no. Maybe have luck and someone sends that 20k.

AnthonySmith · May 8

@ascicode said:
some crypto adresses and everyone can decide if yes or no. Maybe have luck and someone sends that 20k.

haha, i think thats pretty unlikley but sure whats that thing, buymeacoffee or something, or is there another one I forget for crypto

rpqu · May 8

@AnthonySmith said:

@ascicode said:
some crypto adresses and everyone can decide if yes or no. Maybe have luck and someone sends that 20k.

haha, i think thats pretty unlikley but sure whats that thing, buymeacoffee or something, or is there another one I forget for crypto

Patreon, kofi, onlyfans

WSS · May 8

@rpqu said:

onlyfans

$5 for high res feet pics @AnthonySmith

ahnlak · May 9

@rpqu said:

@AnthonySmith said:

@ascicode said:
some crypto adresses and everyone can decide if yes or no. Maybe have luck and someone sends that 20k.

haha, i think thats pretty unlikley but sure whats that thing, buymeacoffee or something, or is there another one I forget for crypto

Patreon, kofi, onlyfans

Patreon has the advantage that you can set up a recurring sub, which I don't think kofi/buymyacoffee do.

bikegremlin · May 9

@ahnlak said:

@rpqu said:

@AnthonySmith said:

@ascicode said:
some crypto adresses and everyone can decide if yes or no. Maybe have luck and someone sends that 20k.

haha, i think thats pretty unlikley but sure whats that thing, buymeacoffee or something, or is there another one I forget for crypto

Patreon, kofi, onlyfans

Patreon has the advantage that you can set up a recurring sub, which I don't think kofi/buymyacoffee do.

Ko-fi is also cool and does let you set recurring memberships too (along with one-time donations)!

https://ko-fi.com/bikegremlin/tiers

Patreon, on the other hand, will not let you set one-time donations and can even flag your account if many members cancel after just one payment (not the only metric used, but it tries to discourage one-time payments through its platform as far as I could understand it at the time of writing).

ahnlak · May 9

Ahh, didn't realise ko-fi handles recurring too - I should probably look at that again!

willie · May 10

Wow. Ok I haven't read the whole thread, but my take on the first page or so:

1) I can live with ads if they are needed to keep the site alive. Or I can donate a few bucks but not a lot. $7/year would be a good LES-inspired amount for a standardized paid membership, or $7/month for higher level privs, providers, etc.

2) I'm fine with a forum software change (even Xenforo which is where the big sites end up going) as long as we run it ourselves. I don't like Discourse but can live with it. I do mostly like Xenforo despite it being proprietary.

3) I'm very anti-Discord. If we can't run our own chat server, why are we even here on a DIY hosting forum? So I've avoided the existing Discord.

4) I'm surprised by the cost of running this site and wonder if it's really in the low end spirit. But, since I'm not the one doing the work, I'm not gonna gripe that much if it's easier to do some things by spending a little more.

5) I'm against raising the offer price limits, an ever-recurring proposal. Unsustainable offers have been around from the beginning and increasing the limits, or even removing them, won't prevent that. Yes hardware prices are up over the past year, but they're maybe now where they were 5 years ago(?). We did fine back then and most software hasn't changed that much. I guess some people want to run LLM's now, the one software area with new demands. So I could imagine a special category for servers with GPU's able to run reasonably advanced models, with higher limits. Though, maybe we're contributing to the problem that way.

6) If I can help with the technical side of things, let me know.

snake · May 10

$7
please dont use discourse

AnthonySmith · May 10

@willie said:
Wow. Ok I haven't read the whole thread, but my take on the first page or so:

1) I can live with ads if they are needed to keep the site alive. Or I can donate a few bucks but not a lot. $7/year would be a good LES-inspired amount for a standardized paid membership, or $7/month for higher level privs, providers, etc.

2) I'm fine with a forum software change (even Xenforo which is where the big sites end up going) as long as we run it ourselves. I don't like Discourse but can live with it. I do mostly like Xenforo despite it being proprietary.

3) I'm very anti-Discord. If we can't run our own chat server, why are we even here on a DIY hosting forum? So I've avoided the existing Discord.

4) I'm surprised by the cost of running this site and wonder if it's really in the low end spirit. But, since I'm not the one doing the work, I'm not gonna gripe that much if it's easier to do some things by spending a little more.

5) I'm against raising the offer price limits, an ever-recurring proposal. Unsustainable offers have been around from the beginning and increasing the limits, or even removing them, won't prevent that. Yes hardware prices are up over the past year, but they're maybe now where they were 5 years ago(?). We did fine back then and most software hasn't changed that much. I guess some people want to run LLM's now, the one software area with new demands. So I could imagine a special category for servers with GPU's able to run reasonably advanced models, with higher limits. Though, maybe we're contributing to the problem that way.

6) If I can help with the technical side of things, let me know.

Thanks @willie I always appreciate your perspective.

corbpie · May 11

@AnthonySmith said: creeping towards a 4-figure per year bill

This part blows my mind, its just a forum is it hosted on AWS or something

AnthonySmith · May 11

@corbpie said:

@AnthonySmith said: creeping towards a 4-figure per year bill

This part blows my mind, its just a forum is it hosted on AWS or something

I made a correction, I went back and checked I thought runcloud was heading for $600 it was only $160 ISH so it's closer to 400 in total.

somik · May 11

@AnthonySmith said:
I made a correction, I went back and checked I thought runcloud was heading for $600 it was only $160 ISH so it's closer to 400 in total.

Have you considered hosting it on ColonClensing (colocrossing) servers? Only 100 dollar per year and comes with "premium" DDR2/DDR3 servers.

Btw, what is the server specs and stack LES is running on?

wankel · May 12

Hahaha, fun to see that the key take-away from the thread is the (refuted) claim that it takes 3 euro/day to run the forum.

Thanks for giving the option to chime in, and to take up the project in the first place!

My thoughts, in order of appearance:

Search: quite often I recall having read something useful, but the only way I can find it back is by luck
Perhaps have editing costing karma, multiplied by size of the change and time since posting?
Discourse, in my experience, is quite nice, and offers fediverse integration. That opens LES to a much larger community. It won't be the only platform that has granulary authorization for mods and admins, and 'chat like' updates while writing a response.
Set guardrails for offers. Allow for excesses, but have the system mark them as such, "This offer is recognized as setting a too high price for slow HDD space", or "This was a nice offer in 2007", or some machine learning as I saw on some German second hand car site that marks offers as "bad value", "exceptional good value" and things in between
Monetizing user tags seems fun. Not only 1 (valuta) per year to use a tag, but also 5 (valuta) to introduce a new tag that others can use, and when you click on it, you can see that I created that tag. They can be related to the karma system (let me use an awful tag that has been downvoted at peril of karma) and might also work as unobtrusive ads.
Downside is that it needs some micropayment system. Thinking about it, maybe one could use Tierhive credits to pay for it?
I'm ambivalent towards ads, as in: I ethically abhor ad-driven products, but, as probably most in the target audience of this site, have abolished ads on my networks.

Whatever direction, I'm all for open source / free software, also in whatever donations system (I see the use of sponsoring someone I like, but I don't really see the use of sponsoring a commercial-donothing in-between)

Ympker · May 13

Welcome back, Anth! We still remember you, you know? You belong here.

That was a lot of interesting ideas and too much to read for my sleepy morning. That said, you mentioned the right-hand column some times and, let me tell you as someone who uses the forum 80% on the mobile,
I haven't used it at all.

The mobile view doesn't show it (see screenshot) and I haven't missed out on a anything I can think of. However, I most certainly would be not happy if the mobile version would see a right-hand column being forcefully added (with some of the new ideas) as this would likely reduce the "main body" significantly and reading the forum would become a pain. Right now, as can be seen in the screenshot, it's a very pleasant experience to read the forum on mobile.

AnthonySmith · May 13

@Ympker said: Welcome back, Anth! We still remember you, you know? You belong here.

That was a lot of interesting ideas and too much to read for my sleepy morning. That said, you mentioned the right-hand column some times and, let me tell you as someone who uses the forum 80% on the mobile,

I haven't used it at all.

The mobile view doesn't show it (see screenshot) and I haven't missed out on a anything I can think of. However, I most certainly would be not happy if the mobile version would see a right-hand column being forcefully added (with some of the new ideas) as this would likely reduce the "main body" significantly and reading the forum would become a pain. Right now, as can be seen in the screenshot, it's a very pleasant experience to read the forum on mobile.

cheers yes fair point, I dont have access to any metrics yet or more accuratley i got access yesterday i wont have time to give it the time it needs until this weekend i think.

I will give it a once over and let that shape any decisions, for mobile I was thinking about having a burger or similar right-hand pull over on demand so you could see offers etc, the core will always be the forum, the idea is to keep discussion front and centre while also making offers more prominent at the same time but in their own way/section.

Its just loose thoughts right now, its not fully set in stone and anything I do will not be all or nothing. I will listen if it's clearly wrong and adjust.

I have to admit I am a bit worried that with every small change made, I will then have to deal with a community outburst by 1 or a few people each time that are just going to say 'no' to any change and If they dont like it and it's all or nothing, "I will never come back"

Having had that discussion with some people in the background who I won't throw under a bus, it may just have to be an acceptable loss, and they will be welcome to come back anyway.

Basically, constructive criticism is wanted but just because you make it does not make it right, and I fully expect to get things wrong.

anyway.. I am rambling...

taizi · May 13

@AnthonySmith said: but require a reply to reveal, maybe spend karma points on

offer is offer,deal is good then i pay
i don't want to waste time to flood every thread with meaningless words

somik · May 13

@taizi said:

@AnthonySmith said: but require a reply to reveal, maybe spend karma points on

offer is offer,deal is good thæn i pay
i don't want to waste time to flood every thread with meaningless words

Instead of post bumping, maybe something more simple like click thanks to unlock or make it visible to everyone that has made X posts in the last week/month?

euronodes · May 13

My 2 cents if I may: one of our clients complained about recharging account glitching on mobile. Who TF uses panel on mobile? So we installed analytics. Desktop browsers were 26%. On the freaking hosting panel

Also things change, we see ugly stuff that used to be pretty with the past eyes.
And we tend to forgive it more than we should.

WSS · May 13

@euronodes said:
Desktop browsers were 26%. On the freaking hosting panel

Shocking, isn't it? Antiquated software like Vanilla is actually kind of a burden to use on a phone. For instance, it took me 3 minutes to separate your post into two just to make this "your mama" joke.

@euronodes said:
Also things change, we see ugly stuff that used to be pretty with the past eyes.
And we tend to forgive it more than we should.

Much like your mom.

I agree completely with this poster. I know that part of the reason we ended up with vanilla was so it would be a similar interface to that other place - but why would you want to even acknowledge it?

We all came from that place battered, bruised, and torn asunder. Why rub it in every damn time?

That said, I cannot stand the Doom scrolling of Discourse. At all. I've stopped participating in forums who use it. So, that's a way to get rid of me.

somik · May 13

@euronodes said:
My 2 cents if I may: one of our clients complained about recharging account glitching on mobile. Who TF uses panel on mobile? So we installed analytics. Desktop browsers were 26%. On the freaking hosting panel

Also things change, we see ugly stuff that used to be pretty with the past eyes.
And we tend to forgive it more than we should.

Your clients use hosting panel on mobile? You got weird clients

Anyway, your idea is very good. @AnthonySmith add some analytics to see the ratio of mobile to desktop user before making any big decisions.

euronodes · May 13

@WSS said:
Shocking, isn't it? Antiquated software like Vanilla is actually kind of a burden to use on a phone. For instance, it took me 3 minutes to separate your post into two just to make this "your mama" joke.

Kinda, yes. My phone has chess.com and Brave to watch 9gag on the throne. And I have a desk with Mac Studio screwed under, because, well, computer has to have its place at home! Honestly, phone and web browsing arent in the same category in my head.

The problem is when "in my head" spills to general design for masses

AnthonySmith · May 13

@WSS said: I know that part of the reason we ended up with vanilla was so it would be a similar interface to that other place - but why would you want to even acknowledge it?

>

Well yeah, because to be honest, 2 OGF splits happened before this place ever existed, maybe more that I dont even know of, they never felt like a fork, they felt new, the forum has its name for a good reason, it was supposed to extract the core of the community values and leave the new scammy shit behind.

Since writing this post initially, I am more convinced than ever that a platform change is not required in terms of a new platform, but the existing one needs to be changed, we need a windows 3.1 theme and a winamp theme, then my work here is done.

WSS · May 13

@AnthonySmith said:
windows 3.1 theme

On it.

euronodes · May 13

@AnthonySmith said:
I am more convinced than ever that a platform change is not required in terms of a new platform

Well, how the elites in Washington say after hours: Лучшее - враг хорошего. So why change a working formula. I think there is another issue:

For a newcomer who is not familiar with the story behind LET/LES, this place will look weird. Not because of the look but because of the - nomen omen - spirit. I read on the story, its fascinating. I understood what @WSS said about "that place" and bruises.

But no random visitor would, who didnt read for few hours how you guys came to be.

Just my perspective. I love it as much as I loved Vietnam movies in the 80's: I wasnt the one who got hurt but the story was cool (hehe and at the end we won :P )

WSS · May 13

@AnthonySmith

/*
 * Windows 3.1 Theme for Vanilla 3.3
 * 
 * Installation:
 * 1. Copy this CSS into your theme's custom.css file
 *    (Dashboard → Appearance → Custom Theme → custom.css)
 * 2. Save and apply
 *
 * Classic Windows 3.1 color scheme:
 * - Teal:       #008080
 * - Button face: #c0c0c0
 * - Dark gray:  #808080
 * - White:      #ffffff
 * - Black:      #000000
 */

/* ========== ROOT / GLOBAL RESETS ========== */

:root {
  /* Win 3.1 color palette */
  --win31-teal: #008080;
  --win31-button-face: #c0c0c0;
  --win31-dark-gray: #808080;
  --win31-light-gray: #dfdfdf;
  --win31-white: #ffffff;
  --win31-black: #000000;
  --win31-yellow: #ffff00;

  /* Typography - MS Sans Serif approximation */
  --win31-font: "MS Sans Serif", "Microsoft Sans Serif", system-ui, -apple-system, sans-serif;
  --win31-mono-font: "Fixedsys", "Courier New", monospace;

  /* Border thickness */
  --win31-border-thick: 2px;
  --win31-border-thin: 1px;
}

* {
  box-sizing: border-box;
}

body {
  font-family: var(--win31-font) !important;
  font-size: 11px !important;
  background-color: var(--win31-teal) !important;
  color: var(--win31-black) !important;
  line-height: 1.3 !important;
}

/* ========== LAYOUT CONTAINERS ========== */

/* Main frame - simulates Program Manager window */
.Frame {
  background-color: var(--win31-button-face) !important;
  border: var(--win31-border-thick) solid;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-white),
    inset -1px -1px 0 var(--win31-dark-gray) !important;
  margin: 8px !important;
  padding: 0 !important;
}

.Frame-content {
  background-color: var(--win31-white) !important;
  border: var(--win31-border-thin) solid var(--win31-black) !important;
  margin: 3px !important;
  padding: 8px !important;
}

/* Content area */
.Container {
  background-color: var(--win31-white) !important;
}

/* ========== HEADER / TITLEBAR ========== */

.Frame-header,
.Header {
  background: linear-gradient(
    to right,
    var(--win31-teal) 0%,
    var(--win31-teal) 100%
  ) !important;
  color: var(--win31-white) !important;
  padding: 3px 5px !important;
  font-weight: bold !important;
  font-size: 11px !important;
  border: none !important;
  box-shadow: none !important;
  text-shadow: 1px 1px 0 var(--win31-black) !important;
}

.Header-logo {
  filter: brightness(0) invert(1) !important;
}

/* Navigation menu - styled as menu bar */
.Navigation {
  background-color: var(--win31-button-face) !important;
  border-top: var(--win31-border-thin) solid var(--win31-white) !important;
  border-bottom: var(--win31-border-thin) solid var(--win31-dark-gray) !important;
  padding: 2px 4px !important;
}

.Navigation-item {
  background-color: transparent !important;
  border: var(--win31-border-thin) solid transparent !important;
  padding: 3px 8px !important;
  margin: 0 2px !important;
  color: var(--win31-black) !important;
  font-weight: normal !important;
}

.Navigation-item:hover,
.Navigation-item:focus {
  background-color: var(--win31-teal) !important;
  color: var(--win31-white) !important;
  border-color: var(--win31-teal) !important;
  outline: var(--win31-border-thin) dotted var(--win31-yellow) !important;
  outline-offset: -3px !important;
}

/* ========== BUTTONS ========== */

button,
.Button,
input[type="submit"],
input[type="button"],
a.Button {
  background-color: var(--win31-button-face) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-light-gray),
    inset -1px -1px 0 var(--win31-dark-gray) !important;
  color: var(--win31-black) !important;
  font-family: var(--win31-font) !important;
  font-size: 11px !important;
  font-weight: bold !important;
  padding: 4px 12px !important;
  text-shadow: none !important;
  cursor: default !important;
  border-radius: 0 !important;
  min-height: 23px !important;
}

button:hover,
.Button:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
  background-color: var(--win31-button-face) !important;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
}

button:active,
.Button:active,
input[type="submit"]:active,
input[type="button"]:active {
  border-color: var(--win31-black) var(--win31-white) var(--win31-white) var(--win31-black) !important;
  box-shadow: 
    inset -1px -1px 0 var(--win31-light-gray),
    inset 1px 1px 0 var(--win31-dark-gray) !important;
  padding: 5px 11px 3px 13px !important; /* shift content down/right */
}

button:focus,
.Button:focus {
  outline: var(--win31-border-thin) dotted var(--win31-black) !important;
  outline-offset: -4px !important;
}

/* Primary button (OK style) */
.Button-Primary,
button.Primary {
  border: var(--win31-border-thick) solid var(--win31-black) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-white),
    inset -1px -1px 0 var(--win31-dark-gray) !important;
}

/* ========== FORM INPUTS ========== */

input[type="text"],
input[type="password"],
input[type="email"],
input[type="search"],
textarea,
select {
  background-color: var(--win31-white) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-dark-gray) var(--win31-white) var(--win31-white) var(--win31-dark-gray) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-black),
    inset -1px -1px 0 var(--win31-button-face) !important;
  color: var(--win31-black) !important;
  font-family: var(--win31-font) !important;
  font-size: 11px !important;
  padding: 3px 4px !important;
  border-radius: 0 !important;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus {
  outline: none !important;
  background-color: var(--win31-white) !important;
  border-color: var(--win31-dark-gray) var(--win31-white) var(--win31-white) var(--win31-dark-gray) !important;
}

/* Checkboxes and radio buttons */
input[type="checkbox"],
input[type="radio"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 13px !important;
  height: 13px !important;
  background-color: var(--win31-white) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-dark-gray) var(--win31-white) var(--win31-white) var(--win31-dark-gray) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-black),
    inset -1px -1px 0 var(--win31-button-face) !important;
  cursor: default !important;
  margin: 0 4px 0 0 !important;
  vertical-align: middle !important;
}

input[type="checkbox"]:checked {
  background-image: 
    linear-gradient(135deg, transparent 45%, var(--win31-black) 45%, var(--win31-black) 55%, transparent 55%),
    linear-gradient(45deg, transparent 45%, var(--win31-black) 45%, var(--win31-black) 55%, transparent 55%) !important;
  background-size: 8px 8px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

input[type="radio"] {
  border-radius: 50% !important;
}

input[type="radio"]:checked {
  background: 
    radial-gradient(circle, var(--win31-black) 30%, transparent 30%) !important;
  background-size: 100% 100% !important;
}

/* ========== DISCUSSION LISTS ========== */

.DataList,
.MessageList {
  background-color: var(--win31-white) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-dark-gray) var(--win31-white) var(--win31-white) var(--win31-dark-gray) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-black),
    inset -1px -1px 0 var(--win31-button-face) !important;
}

.DataList .Item,
.MessageList .Item {
  border-bottom: var(--win31-border-thin) solid var(--win31-button-face) !important;
  background-color: var(--win31-white) !important;
  padding: 6px 8px !important;
}

.DataList .Item:hover,
.MessageList .Item:hover {
  background-color: var(--win31-teal) !important;
  color: var(--win31-white) !important;
}

.DataList .Item:hover a,
.MessageList .Item:hover a {
  color: var(--win31-white) !important;
}

/* Selected/active item */
.DataList .Item.Active,
.MessageList .Item.Active {
  background-color: var(--win31-teal) !important;
  color: var(--win31-white) !important;
}

/* ========== PANELS / BOXES ========== */

.Box,
.Panel {
  background-color: var(--win31-button-face) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-light-gray),
    inset -1px -1px 0 var(--win31-dark-gray) !important;
  padding: 8px !important;
  margin-bottom: 12px !important;
  border-radius: 0 !important;
}

.Box-Header,
.Panel-Heading {
  background: linear-gradient(
    to right,
    var(--win31-teal) 0%,
    var(--win31-teal) 100%
  ) !important;
  color: var(--win31-white) !important;
  font-weight: bold !important;
  padding: 3px 6px !important;
  margin: -8px -8px 8px -8px !important;
  text-shadow: 1px 1px 0 var(--win31-black) !important;
}

/* ========== MODALS / POPUPS ========== */

.Modal,
.Popup {
  background-color: var(--win31-button-face) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
  box-shadow: 
    3px 3px 0 rgba(0, 0, 0, 0.5),
    inset 1px 1px 0 var(--win31-light-gray),
    inset -1px -1px 0 var(--win31-dark-gray) !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.Modal-Header,
.Popup-Header {
  background: linear-gradient(
    to right,
    var(--win31-teal) 0%,
    var(--win31-teal) 100%
  ) !important;
  color: var(--win31-white) !important;
  font-weight: bold !important;
  padding: 3px 6px !important;
  text-shadow: 1px 1px 0 var(--win31-black) !important;
  border: none !important;
}

.Modal-Body,
.Popup-Body {
  background-color: var(--win31-button-face) !important;
  padding: 12px !important;
}

/* Close button (X) styled as Win 3.1 system button */
.Close,
.Modal-Close {
  background-color: var(--win31-button-face) !important;
  border: var(--win31-border-thin) solid !important;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
  width: 16px !important;
  height: 14px !important;
  padding: 0 !important;
  font-size: 9px !important;
  line-height: 12px !important;
  color: var(--win31-black) !important;
  font-weight: bold !important;
}

/* ========== PAGINATION ========== */

.Pager {
  background-color: var(--win31-button-face) !important;
  padding: 6px !important;
  border: var(--win31-border-thin) solid var(--win31-dark-gray) !important;
}

.Pager a,
.Pager span {
  background-color: var(--win31-button-face) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-light-gray),
    inset -1px -1px 0 var(--win31-dark-gray) !important;
  color: var(--win31-black) !important;
  padding: 4px 8px !important;
  margin: 0 2px !important;
  text-decoration: none !important;
  font-weight: bold !important;
  border-radius: 0 !important;
  display: inline-block !important;
}

.Pager a:hover {
  background-color: var(--win31-button-face) !important;
}

.Pager .Current,
.Pager span.Current {
  border-color: var(--win31-black) var(--win31-white) var(--win31-white) var(--win31-black) !important;
  box-shadow: 
    inset -1px -1px 0 var(--win31-light-gray),
    inset 1px 1px 0 var(--win31-dark-gray) !important;
}

/* ========== LINKS ========== */

a {
  color: var(--win31-teal) !important;
  text-decoration: underline !important;
}

a:hover {
  color: var(--win31-black) !important;
}

a:visited {
  color: #800080 !important; /* Purple for visited links, classic web */
}

/* ========== SCROLLBARS (Webkit only) ========== */

::-webkit-scrollbar {
  width: 16px !important;
  height: 16px !important;
}

::-webkit-scrollbar-track {
  background: 
    repeating-conic-gradient(
      var(--win31-white) 0% 25%,
      var(--win31-button-face) 0% 50%
    ) 50% / 2px 2px !important;
  border: var(--win31-border-thin) solid var(--win31-black) !important;
}

::-webkit-scrollbar-thumb {
  background-color: var(--win31-button-face) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-light-gray),
    inset -1px -1px 0 var(--win31-dark-gray) !important;
}

::-webkit-scrollbar-thumb:hover {
  background-color: var(--win31-button-face) !important;
}

::-webkit-scrollbar-button {
  background-color: var(--win31-button-face) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-light-gray),
    inset -1px -1px 0 var(--win31-dark-gray) !important;
}

::-webkit-scrollbar-button:active {
  border-color: var(--win31-black) var(--win31-white) var(--win31-white) var(--win31-black) !important;
  box-shadow: 
    inset -1px -1px 0 var(--win31-light-gray),
    inset 1px 1px 0 var(--win31-dark-gray) !important;
}

/* Up arrow */
::-webkit-scrollbar-button:vertical:decrement {
  background-image: 
    linear-gradient(transparent 7px, var(--win31-black) 7px, var(--win31-black) 8px, transparent 8px),
    linear-gradient(90deg, transparent 6px, var(--win31-black) 6px, var(--win31-black) 10px, transparent 10px),
    linear-gradient(90deg, transparent 5px, var(--win31-black) 5px, var(--win31-black) 11px, transparent 11px) !important;
}

/* Down arrow */
::-webkit-scrollbar-button:vertical:increment {
  background-image: 
    linear-gradient(transparent 8px, var(--win31-black) 8px, var(--win31-black) 9px, transparent 9px),
    linear-gradient(90deg, transparent 6px, var(--win31-black) 6px, var(--win31-black) 10px, transparent 10px),
    linear-gradient(90deg, transparent 5px, var(--win31-black) 5px, var(--win31-black) 11px, transparent 11px) !important;
}

/* Left arrow */
::-webkit-scrollbar-button:horizontal:decrement {
  background-image: 
    linear-gradient(90deg, transparent 7px, var(--win31-black) 7px, var(--win31-black) 8px, transparent 8px),
    linear-gradient(transparent 6px, var(--win31-black) 6px, var(--win31-black) 10px, transparent 10px),
    linear-gradient(transparent 5px, var(--win31-black) 5px, var(--win31-black) 11px, transparent 11px) !important;
}

/* Right arrow */
::-webkit-scrollbar-button:horizontal:increment {
  background-image: 
    linear-gradient(90deg, transparent 8px, var(--win31-black) 8px, var(--win31-black) 9px, transparent 9px),
    linear-gradient(transparent 6px, var(--win31-black) 6px, var(--win31-black) 10px, transparent 10px),
    linear-gradient(transparent 5px, var(--win31-black) 5px, var(--win31-black) 11px, transparent 11px) !important;
}

/* ========== BADGES / LABELS ========== */

.Badge,
.Label {
  background-color: var(--win31-dark-gray) !important;
  color: var(--win31-white) !important;
  border: var(--win31-border-thin) solid var(--win31-black) !important;
  padding: 2px 6px !important;
  font-size: 10px !important;
  font-weight: bold !important;
  border-radius: 0 !important;
  text-shadow: 1px 1px 0 var(--win31-black) !important;
}

/* ========== TABLES ========== */

table {
  background-color: var(--win31-white) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-dark-gray) var(--win31-white) var(--win31-white) var(--win31-dark-gray) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-black),
    inset -1px -1px 0 var(--win31-button-face) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

thead th,
table th {
  background-color: var(--win31-button-face) !important;
  border-bottom: var(--win31-border-thin) solid var(--win31-dark-gray) !important;
  padding: 4px 8px !important;
  font-weight: bold !important;
  text-align: left !important;
}

tbody td,
table td {
  padding: 4px 8px !important;
  border-bottom: var(--win31-border-thin) solid var(--win31-button-face) !important;
}

tbody tr:hover,
table tr:hover {
  background-color: var(--win31-teal) !important;
  color: var(--win31-white) !important;
}

/* ========== CODE BLOCKS ========== */

code,
pre {
  font-family: var(--win31-mono-font) !important;
  font-size: 10px !important;
  background-color: var(--win31-white) !important;
  border: var(--win31-border-thin) solid var(--win31-dark-gray) !important;
  padding: 2px 4px !important;
}

pre {
  padding: 8px !important;
  overflow-x: auto !important;
}

/* ========== DISABLED STATE ========== */

button:disabled,
input:disabled,
select:disabled,
textarea:disabled,
.Button.Disabled {
  background-color: var(--win31-button-face) !important;
  color: var(--win31-dark-gray) !important;
  text-shadow: 1px 1px 0 var(--win31-white) !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

/* Hatched pattern for disabled items (optional) */
button:disabled::before,
.Button.Disabled::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: 
    repeating-linear-gradient(
      45deg,
      transparent,
      transparent 2px,
      var(--win31-white) 2px,
      var(--win31-white) 3px
    ) !important;
  pointer-events: none !important;
}

/* ========== ADDITIONAL TWEAKS ========== */

/* Remove modern shadows and rounded corners globally */
* {
  border-radius: 0 !important;
  text-shadow: none;
}

/* Exception: keep some specific text-shadow for titlebar text */
.Frame-header,
.Header,
.Box-Header,
.Panel-Heading,
.Modal-Header {
  text-shadow: 1px 1px 0 var(--win31-black) !important;
}

/* Remove smooth scrolling for authentic chunkiness */
html {
  scroll-behavior: auto !important;
}

/* User avatars - give them a Win 3.1 photo frame effect */
.PhotoWrap,
.ProfilePhoto {
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-dark-gray) var(--win31-white) var(--win31-white) var(--win31-dark-gray) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-black),
    inset -1px -1px 0 var(--win31-button-face) !important;
  border-radius: 0 !important;
}

/* Tooltips */
.Tooltip {
  background-color: var(--win31-yellow) !important;
  border: var(--win31-border-thin) solid var(--win31-black) !important;
  color: var(--win31-black) !important;
  padding: 4px 6px !important;
  font-size: 11px !important;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.3) !important;
  border-radius: 0 !important;
}

/* Search box */
.SearchBox,
.Search {
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-dark-gray) var(--win31-white) var(--win31-white) var(--win31-dark-gray) !important;
  box-shadow: 
    inset 1px 1px 0 var(--win31-black),
    inset -1px -1px 0 var(--win31-button-face) !important;
  background-color: var(--win31-white) !important;
}

/* Dropdown menus */
.Dropdown-menu,
.Menu {
  background-color: var(--win31-button-face) !important;
  border: var(--win31-border-thick) solid !important;
  border-color: var(--win31-white) var(--win31-black) var(--win31-black) var(--win31-white) !important;
  box-shadow: 
    2px 2px 0 rgba(0, 0, 0, 0.3),
    inset 1px 1px 0 var(--win31-light-gray) !important;
  padding: 2px !important;
  border-radius: 0 !important;
}

.Dropdown-item,
.Menu-item {
  padding: 4px 24px 4px 8px !important;
  color: var(--win31-black) !important;
  background-color: transparent !important;
}

.Dropdown-item:hover,
.Menu-item:hover {
  background-color: var(--win31-teal) !important;
  color: var(--win31-white) !important;
}

/* Horizontal rules */
hr {
  border: none !important;
  border-top: var(--win31-border-thin) solid var(--win31-dark-gray) !important;
  border-bottom: var(--win31-border-thin) solid var(--win31-white) !important;
  height: 2px !important;
  margin: 12px 0 !important;
}

/* ========== RESPONSIVE ADJUSTMENTS ========== */

@media (max-width: 768px) {
  body {
    font-size: 12px !important;
  }

  .Frame {
    margin: 4px !important;
  }

  button,
  .Button {
    padding: 6px 10px !important;
    font-size: 12px !important;
  }
}

/* ========== END OF THEME ========== */

AnthonySmith · May 13

thanks claude @WSS I will try it on dev when I get started haha (no really, I will)

WSS · May 13

@AnthonySmith said:
thanks claude @WSS I will try it on dev when I get started haha (no really, I will)

Claude was a cowriter.

Hello again LES - Things are probably going to change a bit, here are my ideas, I want your input.

Comments