current st... - Off-Topic@Heyuri

(165 KB, 1004x645)[ImgOps]

Anonymous 2025/05/25(Sun)23:22:16 No.144985

current stylesheets are good because u can feed a few to chatgpt so it learns the structure, describe what you want to have and have it create a new stylesheet in 10 seconds :nyaoo-closedeyes:

1 Anonymous 2025/05/25(Sun)23:51:39 No.144990

I nevar even thought of that :sweat:

2 Windows® ∞ 2025/05/26(Mon)00:58:54 No.144996

File: Screenshot 2025-05-26 at 03-53-35 Off-To(…).png

(516 KB, 2451x1337)[ImgOps]

>>144985
I still cherish my own custom made css so there is no need to change it :nyaoo-closedeyes:

showing post numbers, hiding posts, and filters for specific needs were good features but they came very late :sweat3:

3 Anonymous 2025/05/26(Mon)01:18:02 No.144999

I had to tweak this one a little - and it's still not perfect - but here's an "early 2000s deviantART" style that ChatGPT-san generated based off a screencap I fed it :iyahoo:

/* deviantart-retro.css */

:root {
	--color-bg-main: #9da89d;
	--color-fg-main: #000000;
	--color-fg-link: #374646;
	--color-fg-link-hover: #ebeee6;
	--color-bg-boardlist: #7f887f;
	--color-fg-boardlist: #ffffff;
	--color-bg-theading: #7f887f;
	--color-bg-theading2: #98a398;
	--color-bg-theading3: #b0bcb0;
	--color-bg-postblock: #7f887f;
	--color-fg-title: #000000;
	--color-fg-name: #000000;
	--color-fg-warning: #cc0000;
	--color-fg-warning-ip: #cc0000;
	--color-fg-quote: #7a7a7a;
	--color-fg-quote2: #aaaaaa;
	--color-bg-reply: #b9c4b9;
	--color-bg-reply-hl: #e0e8e0;
	--color-hi-contrast-border: #3a3a3a;
	--color-lo-contrast-border: #666666;
	--color-fg-logo: #000000;
	--color-fg-global-message: #000080;
	--color-bg-window-item-highlight: #dfe7df;
	--color-bg-postlists-header: #7f887f;
	--color-fg-postlists-header: #ffffff;
	--color-fg-postlists-header-link: #ffffcc;
	--color-bg-postlists-odd: #c0ccc0;
	--color-bg-postlists-even: #d8e2d8;
	--color-fg-quotelink: var(--color-fg-link);
	--color-fg-quotelink-hover: var(--color-fg-link-hover);
	--color-border-button: #000000;
	--color-bg-code: #c0ccc0;
	--color-fg-code: #000000;
	--color-bg-flashboard-even: #c0ccc0;
	--font-family-main: sans-serif;
	--font-size-main: 0.875em;
}

:root {
	--color-bg-postblock: #7f887f;
	--color-bg-theading: #6d766d;
	--color-bg-theading2: #808a80;
	--color-bg-theading3: #aab3aa;
	--color-hi-contrast-border: #3a3a3a;
	--color-lo-contrast-border: #666666;
}

/* Metallic beveled panels */
.theading, .theading2, .theading3,
.neomenuTopLevel, .detailsbox, .postblock, .reply, .window {
	border: 1px solid #3a3a3a;
	background: linear-gradient(to bottom, #b5beb5 0%, #949f94 100%);
	box-shadow: inset 0 1px 0 #d0d9d0, inset 0 -1px 2px #5f675f;
}

/* Panel sections (content boxes) */
.detailsboxContent, .centerBlock, .catComment {
	background: #d7dfd7;
	border: 1px solid #6f776f;
	box-shadow: inset 0 1px 1px #fff, inset 0 -1px 2px #aaa;
}

/* Button styling */
button {
	background: linear-gradient(to bottom, #e2eae2 0%, #c0c8c0 100%);
	border: 2px outset #888;
	color: #000;
	font-size: 0.875em;
	padding: 2px 6px;
	font-family: Tahoma, sans-serif;
	box-shadow: inset 2px 1px 0 #fff, inset -1px -1px 1px #666;
}

button:hover {
	background: linear-gradient(to bottom, #f0faf0 0%, #d6ded6 100%);
	border: 1px inset #666;
	cursor: pointer;
}

/* Inputs */
input[type="text"], input[type="password"], textarea, select {
	background: #e0e8e0;
	border: 1px solid #5f675f;
	padding: 2px;
	font-family: Tahoma, sans-serif;
	font-size: 0.875em;
	box-shadow: inset -1px -1px 2px #fff, inset 1px 1px 2px #aaa;
}

/* Scrollbar styling (WebKit only fallback for legacy vibes) */
body::-webkit-scrollbar {
	width: 14px;
}
body::-webkit-scrollbar-track {
	background: #c4ccc4;
	border-left: 1px solid #6f776f;
}
body::-webkit-scrollbar-thumb {
	background: linear-gradient(to bottom, #9ba39b, #7f877f);
	border: 1px solid #4a524a;
	box-shadow: inset 1px 1px 1px #fff;
}

/* Links */
a {
	text-decoration: underline;
	color: #0022aa;
}
a:hover {
	color: #ff6600;
}

/* Logo style */
.logo {
	/*font-family: 'Impact', 'Arial Black', sans-serif;*/
	font-size: 1.5em;
	text-shadow: 0px 0px 3px #fff
	color: #5c5f5d;
}

/* Deviation grid thumbnail placeholders */
#catalogTable .thread {
	background: #e0e8e0;
	border: 2px inset #7f887f;
	box-shadow: inset 1px 1px 0 #fff, inset -1px -1px 1px #777;
}

/* Text shadow for headings */
/*h1, h2, h3, h4 {
	text-shadow: 1px 1px 0 #fff;
	font-family: Verdana, sans-serif;
}*/

/* Devpacks, software, forum tabs mimic */
.neomenuTopLevel h2 {
	background: linear-gradient(to bottom, #b5beb5, #8f988f);
	border-bottom: 1px solid #4a524a;
	padding: 4px;
	color: #000;
}

/* Soft grid container shadow */
#catalogTable, .postlists {
	box-shadow: 2px 2px 4px rgba(0,0,0,0.25);
}

4 Anonymous SAGE! 2025/05/26(Mon)01:18:45 No.145000

File: deviantart css.png

(290 KB, 1076x1275)[ImgOps]

4got my screencap

5 Anonymous 2025/05/26(Mon)01:54:41 No.145002

Heyuri should hold a css contest and whoever makes the coolest one gets added to the list of official presets.

6 Anonymous 2025/05/26(Mon)05:40:43 No.145015

>>145000
holy shit, that one kicks ass

7 Anonymous 2025/05/26(Mon)12:24:30 No.145045

OP one just in case, was supposed to look liek 90s Windows UIs

@charset "UTF-8";
/* classic-windows.css */
/************************ Global **************************************/

:root {
	/* Global */
	--font-family-main: 'Courier New', monospace;
	--font-size-main: 11pt;
	--color-bg-main: #eaeaea;
	--color-bg-main-gradient: #c8c8d8;
	--color-fg-main: #333366;
	--color-fg-link: #004488;
	--color-fg-link-hover: #cc0044;
	--color-lo-contrast-border: #cccccc;
	--color-hi-contrast-border: #9999aa;
	--color-x-hi-contrast-border: #444466;
	--color-border-button: #8888aa;
	/* Navigation/admin bar */
	--color-bg-boardlist: #d0d0e0;
	--color-fg-boardlist: #334466;
	/* Board header */
	--color-fg-logo: #222255;
	--color-bg-theading: #b0b0c0;
	--color-bg-theading2: #a0a0c0;
	--color-bg-theading3: #d0d0e0;
	--color-fg-theading: #202040;
	/* Post form */
	--color-bg-postblock: #dcdcf0;
	--color-border-input: #8080a0;
	--color-fg-global-message: var(--color-fg-warning);
	/* Posts/replies */
	--color-bg-reply: #f3f3f8;
	--color-bg-reply-hl: #e2e2f0;
	--color-fg-title: #aa0055;
	--color-fg-name: #006666;
	--color-fg-warning: #aa0000;
	--color-fg-warning-ip: #000088;
	--color-fg-omitted: #888888;
	/* Post formatting */
	--color-fg-quotelink: #006699;
	--color-fg-quotelink-hover: var(--color-fg-link-hover);
	--color-fg-quote: #336600;
	--color-fg-quote2: #aa66aa;
	--color-bg-spoiler: #dddddd;
	--color-bg-code: #ffffff;
	--color-fg-code: #222222;
	/* Administrator mode */
	--color-bg-postlists-header: #ccccdd;
	--color-fg-postlists-header: #000000;
	--color-fg-postlists-header-link: #3333aa;
	--color-bg-postlists-odd: #f0f0f5;
	--color-bg-postlists-even: #e8e8ef;
	/* File board/flash board */
	--color-bg-flashboard-even: #e6e6f0;
	/* Windows */
	--color-bg-window-item-highlight: #ccccee;
}

body {
	background-image: linear-gradient(to bottom, var(--color-bg-main-gradient), var(--color-bg-main) 500px);
	background-size: 100% 500px;
	background-repeat: repeat-x;
	color: var(--color-fg-main);
	font-family: var(--font-family-main);
	font-size: var(--font-size-main);
}

a,
a:link,
a:visited {
	color: var(--color-fg-link);
	text-decoration: underline;
}

a:hover {
	color: var(--color-fg-link-hover);
}

hr {
	border: none;
	border-top: 2px dashed var(--color-hi-contrast-border);
}

textarea,
input:not([type="submit"]):not([type="reset"]):not([type="button"]):not([type="file"]) {
	border: 1px inset var(--color-border-button);
	background-color: var(--color-bg-code);
	color: var(--color-fg-code);
}

textarea:focus,
input:focus {
	outline: 2px dotted var(--color-fg-link);
	outline-offset: 1px;
}

button,
input,
textarea,
select,
pre {
	font-size: 0.909091em;
	font-family: var(--font-family-main);
}

button,
select,
input[type="button"],
input[type="submit"],
input[type="reset"],
input::file-selector-button {
	border-radius: 0;
	border: 2px outset var(--color-border-button);
	background-color: #e0e0f0;
	color: var(--color-fg-main);
}

/************************ Mobile **************************************/

@media screen and (max-width: 650px) {
	body {
		font-size: 12pt;
	}
	.rules {
		font-size: var(--font-size-x-small);
	}
}

>Heyuri should hold a css contest and whoever makes the coolest one gets added to the list of official presets.
We've done that b4 but picking just one could be hard, and I don't think having over 9000 "official" ones is a good idea - maybe there should be a way that anyone can contribute to a hueg list of "user-made CSSes" instead

8 Anonymous 2025/05/26(Mon)12:32:02 No.145047

>was supposed to look liek 90s Windows UIs
It did a pretty poor job in that case - I'll try to handcode something better :sweat2:

9 Anonymous SAGE! 2025/05/26(Mon)14:10:00 No.145056

>It did a pretty poor job in that case
it did seem somewhat nostalgic to me, but I was too shota then to remember well :sweat2:

10 Anonymous 2025/05/26(Mon)14:27:19 No.145060

File: win95 css.png

(182 KB, 1077x1274)[ImgOps]

It's a bit of a mess and far from perfect, but here's what I've got so far for a Win95 style:

@charset "UTF-8";
/* windows-95.css */

:root {
  /* Global */
  --font-family-main: "MS Sans Serif", sans-serif;
  --font-size-main: 10pt;
  --font-size-small: 0.9em;
  --color-bg-main: #008080;
  --color-bg-main-gradient: #006060;
  --color-fg-main: #ffffff;
  --color-fg-link: #000080;
  --color-fg-link-hover: #000080;
  --color-lo-contrast-border: #cccccc;
  --color-hi-contrast-border: #9999aa;
  --color-x-hi-contrast-border: #000000;
  --color-border-button: #c0c0c0;
  /* Navigation/admin bar */
  --color-bg-boardlist: var(--color-bg-reply);
  --color-fg-boardlist: #000000;
  /* Board header */
  --color-fg-logo: #ffffff;
  --color-bg-theading: #000080;
  --color-bg-theading2: #000080;
  --color-bg-theading3: #000080;
  --color-fg-theading: #ffffff;
  /* Post form */
  --color-bg-postblock: #000080;
  --color-border-input: #8080a0;
  --color-fg-global-message: var(--color-fg-warning);
  /* Posts/replies */
  --color-bg-reply: #c0c0c0;
  --color-bg-reply-hl: #e2e2f0;
  --color-fg-title: #ffffff;
  --color-fg-name: #ffffff;
  --color-fg-warning: #ff0000;
  --color-fg-warning-ip: #000080;
  --color-fg-omitted: #ffffff;
  /* Post formatting */
  --color-fg-quotelink: var(--color-fg-link);
  --color-fg-quotelink-hover: var(--color-fg-link-hover);
  --color-fg-quote: #008040;
  --color-fg-quote2: #800080;
  --color-bg-spoiler: #000000;
  --color-bg-code: #ffffff;
  --color-fg-code: #000000;
  /* Administrator mode */
  --color-bg-postlists-header: #000080;
  --color-fg-postlists-header: #ffffff;
  --color-fg-postlists-header-link: #ffff00;
  --color-bg-postlists-odd: #c0c0c0;
  --color-bg-postlists-even: #c0c0c0;
  /* File board/flash board */
  --color-bg-flashboard-even: #c0c0c0;
  /* Windows */
  --color-bg-window-item-highlight: #000080;
}

hr {
  border-color: #000000d0 #ffffff40 #ffffff40 #000000d0;
}

button,
select,
input[type="button"],
input[type="submit"],
input[type="reset"],
input::file-selector-button {
  background-color: var(--color-bg-reply);
  border-radius: 0;
  border: 1px solid;
  border-color: #dfdfdf #000000 #000000 #dfdfdf;
  box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #808080;
  min-width: 6em;
  min-height: 2em;
}

button:active,
select:active,
input[type="button"]:active,
input[type="submit"]:active,
input[type="reset"]:active,
input::file-selector-button:active {
  border-color: #000000;
  box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #808080;
}

button:focus,
select:focus,
input[type="button"]:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input::file-selector-button:focus{
  border-color: #000000;
}

.persistnav .boardlist {
  box-shadow: inset 0px -1px 0 #808080;
  border-color: #000000;
  padding: 0.225em;
}

.postblock,
.winbar {
  color: #ffffff;
}

.reply,
.postlists,
.flashboardList,
.previewBox,
.neomenuTopLevel,
.window,
#pager {
  background-color: var(--color-bg-reply);
  color: #000000;
  border: 1px solid;
  border-color: #dfdfdf #000000 #000000 #dfdfdf;
  box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #808080;
}

.inputtext,
.code,
.flashboardList td,
.flashboardList th,
.postlists td,
.postlists th,
.reply .postimg,
.reply .expandimg {
  border: 1px solid;
  border-color: #808080 #dfdfdf #dfdfdf #808080;
  box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #ffffff;
}

.inputtext {
  padding: 3px;
  font-family: var(--font-family-main);
  font-size: 0.9em;
}

textarea {
 font-family: Fixedsys, "Lucida Console", Consolas, monospace !important;
}

.reply .name,
.reply .title {
  color: #000000;
}

.window {
  background-color: #c0c0c0;
  color: #000000;
}

.winbar {
  margin: 3px;
  margin-bottom: 0;
  border: none;
}

.winctrl button {
  background-color: #c0c0c0;
}

.winctrl button:hover {
  background-color: #ffffff;
}

#settarea > label:hover,
.settab_selected {
  color: #ffffff !important;
}

.postlists,
.flashboardList,
.postlists .name,
.flashboardList .name,
.postlists .title,
.flashboardList .title {
  color: #000000;
}

.postlists caption {
  color: #ffffff;
}

.postlists td,
.postlists th,
.flashboardList td,
.flashboardList th {
  padding: 3px;
}

I also disabled ClearType for teh screencap :biggrin:

11 Anonymous 2025/05/26(Mon)15:12:04 No.145063

Rite, it did give a turquoise bg at first but it didn't look as nice as here so I asked to have grey-focused one. But this one rox!

12 Anonymous 2025/05/26(Mon)16:26:36 No.145071

File: wikipedia_theme.png

(103 KB, 1026x871)[ImgOps]

introducing... wikipedia theme for heyuri ( ´￢ ` )

13 Anonymous 2025/05/26(Mon)16:38:01 No.145072

File: wikipedia_theme2.png

(135 KB, 802x745)[ImgOps]

>>145071

Enjoy!

    /* Wikipedia-style custom.css */

:root {
    --color-bg-main: #f6f6f6;
    --color-fg-main: #202122;
    --color-fg-link: #0645ad;
    --color-fg-link-hover: #0b0080;
    --color-bg-boardlist: #f8f9fa;
    --color-fg-boardlist: #202122;
    --color-bg-theading: #eaecf0;
    --color-bg-theading2: #f8f9fa;
    --color-bg-theading3: #ffffff;
    --color-bg-postblock: #f8f9fa;
    --color-fg-title: #000000;
    --color-fg-name: #54595d;
    --color-fg-warning: #d73333;
    --color-fg-warning-ip: #d73333;
    --color-fg-quote: #54595d;
    --color-fg-quote2: #72777d;
    --color-bg-reply: #ffffff;
    --color-bg-reply-hl: #eaf3ff;
    --color-hi-contrast-border: #a2a9b1;
    --color-lo-contrast-border: #c8ccd1;
    --color-fg-logo: #000000;
    --color-fg-global-message: #202122;
    --color-bg-window-item-highlight: #eaf3ff;
    --color-bg-postlists-header: #eaecf0;
    --color-fg-postlists-header: #202122;
    --color-fg-postlists-header-link: #0645ad;
    --color-bg-postlists-odd: #f8f9fa;
    --color-bg-postlists-even: #ffffff;
    --color-fg-quotelink: var(--color-fg-link);
    --color-fg-quotelink-hover: var(--color-fg-link-hover);
    --color-border-button: #a2a9b1;
    --color-bg-code: #f8f9fa;
    --color-fg-code: #000000;
    --color-bg-flashboard-even: #f8f9fa;
    --font-family-main: 'Helvetica Neue', 'Helvetica', 'Nimbus Sans L', 'Arial', 'Liberation Sans', sans-serif;
    --font-size-main: 0.875em;
}

body {
    background-color: var(--color-bg-main);
    color: var(--color-fg-main);
    font-family: var(--font-family-main);
    font-size: var(--font-size-main);
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

/* Clean, flat panels n Stuff :DD*/
.theading, .theading2, .theading3,
.neomenuTopLevel, .detailsbox, .postblock, .reply, .window {
    border: 1px solid var(--color-hi-contrast-border);
    background: var(--color-bg-theading);
    box-shadow: none;
    border-radius: 0;
    padding: 0.5em 1em;
}

/* Panel sections (content boxes) */
.detailsboxContent, .centerBlock, .catComment {
    background: var(--color-bg-theading3);
    border: 1px solid var(--color-lo-contrast-border);
    box-shadow: none;
    padding: 1em;
    margin: 0.5em 0;
}

/* Button styling */
button {
    background-color: var(--color-bg-theading3);
    border: 1px solid var(--color-border-button);
    color: var(--color-fg-main);
    font-size: 0.875em;
    padding: 0.25em 1em;
    font-family: var(--font-family-main);
    box-shadow: none;
    border-radius: 2px;
    cursor: pointer;
}

button:hover {
    background-color: var(--color-bg-theading);
    border-color: var(--color-hi-contrast-border);
}

/* Inputs */
input[type="text"], input[type="password"], textarea, select {
    background: var(--color-bg-theading3);
    border: 1px solid var(--color-hi-contrast-border);
    padding: 0.25em 0.5em;
    font-family: var(--font-family-main);
    font-size: 0.875em;
    box-shadow: none;
}

/* Links */
a {
    text-decoration: none;
    color: var(--color-fg-link);
}

a:hover {
    text-decoration: underline;
    color: var(--color-fg-link-hover);
}

/* Logo stylin' */
.logo {
    font-family: 'Linux Libertine', 'Georgia', 'Times', serif;
    font-size: 1.5em;
    color: var(--color-fg-main);
    font-weight: normal;
}

/* Thread styling B) */
#catalogTable .thread {
    background: var(--color-bg-theading3);
    border: 1px solid var(--color-lo-contrast-border);
    box-shadow: none;
    padding: 1em;
}

/* Headings */
h1, h2, h3, h4 {
    font-family: 'Linux Libertine', 'Georgia', 'Times', serif;
    font-weight: normal;
    color: var(--color-fg-main);
    border-bottom: 1px solid var(--color-lo-contrast-border);
    padding-bottom: 0.25em;
}

/* Menu tabs */
.neomenuTopLevel h2 {
    background: var(--color-bg-theading);
    border-bottom: 1px solid var(--color-hi-contrast-border);
    padding: 0.5em 1em;
    color: var(--color-fg-main);
    font-size: 1em;
    font-weight: bold;
}

/* Remove shadows and gradients for teh clean wiki look */
#catalogTable, .postlists {
    box-shadow: none;
}

/* Kewl Quote styling */
blockquote {
    border-left: 4px solid var(--color-lo-contrast-border);
    padding-left: 1em;
    margin-left: 0;
    color: var(--color-fg-quote);
}

/* Code blocks */
pre, code {
    background-color: var(--color-bg-code);
    border: 1px solid var(--color-lo-contrast-border);
    padding: 0.5em;
    overflow: auto;
}

/* Tables */
table {
    border-collapse: collapse;
    margin: 1em 0;
}

th {
    background-color: var(--color-bg-theading);
    text-align: left;
    padding: 0.5em 1em;
}

td {
    padding: 0.5em 1em;
    border: 1px solid var(--color-lo-contrast-border);
    background-color: var(--color-bg-theading3);
}

14 Anonymous SAGE! 2025/05/26(Mon)16:40:20 No.145073

>>145072
Oh major fail! i messed up embedding my css.. :cry:

15 Anonymous 2025/05/26(Mon)17:16:43 No.145074

I think u just didn't put in scroll tag, which doesn't matter :sweat2:

Congrats on becoming teh first one to use language specific code tags though! (and making me notice a small bug in it...)

16 Anonymous 2025/05/26(Mon)17:59:30 No.145076

File: monochrome-amber.png

(173 KB, 1077x1274)[ImgOps]

Some of j00 may remember an earlier version I made of this several years ago: a simulation of an amber monochrome display!

It sits on top of any existing light style - it looks best with Sakomoto IMHO. You can also change the hue-rotate value to somewhere between 50-80deg for a green variant :biggrin:

html{
  filter:
    contrast(0.85)
    invert(1)
    sepia(1)
    brightness(0.8)
    hue-rotate(-10deg) /*change to 50-80deg for green phospher*/
    saturate(5);
}

body {
  background-color: #ffffff;
  background-image: none;
  color: #666666;
}

iframe,
.theading,
.theading2,
.theading3,
img:not([src$=".svg"]) {
  filter:
    invert(1);
}

#usercounter {
  background-color: #ffffff;
  color: #000000
}

17 Anonymous 2025/05/26(Mon)18:00:04 No.145077

File: monochrome-green.png

(160 KB, 1077x1274)[ImgOps]

And here's a screencap of the green variant

18 Anonymous 2025/05/26(Mon)18:44:12 No.145082

Introducing Aqua Theme for Heyuri. ヽ(´∇`)ノ

Top of the page cycles through various fun aquatic themed emojis every so often...

>>145074
Huh, I don't know how to do that. c(´￢`c)

19 Anonymous 2025/05/26(Mon)18:46:08 No.145083

File: Heyuri_Aqua_Theme.png

(67 KB, 815x870)[ImgOps]

>>145082
forgot to attach my image... LOL

20 cool Anonymous 2025/05/26(Mon)18:50:15 No.145085

File: Heyuri_Aqua_Theme_2.png

(151 KB, 951x683)[ImgOps]

>>145082
I've also added wave badges next to names. (´￢` )

21 Anonymous 2025/05/26(Mon)19:18:55 No.145089

>>145077
its like those 'puter terminals from fallout. :astonish:

22 Anonymous 2025/05/26(Mon)20:35:00 No.145095

File: f57.png

(213 KB, 500x600)[ImgOps]

it is pretty leet :cool:

23 Anonymous 2025/05/26(Mon)20:53:34 No.145096

i know light themes are not very popular but they help me stay awake and productive. :nyaoo-closedeyes:

24 Anonymous 2025/05/27(Tue)17:29:48 No.145184

File: Eiffel_65_Theme_for_Heyuri.png

(150 KB, 1012x867)[ImgOps]

I'm blue, dabba dee dabba die ヽ(´∇` )ノ

25 Anonymous 2025/05/28(Wed)03:50:32 No.145260

>>145184
looks good ヽ(´ー｀)ノ

26 Anonymous SAGE! 2025/05/28(Wed)05:26:46 No.145265

>>145260
thanks id post the css but i forgot how to do scroll tags.

27 Anonymous 2025/05/28(Wed)10:23:33 No.145280

>i forgot how to do scroll tags.
If u open up the BBCode section in the post form, there's now a button for it ヽ(´ー｀)ノ

28 Anonymous 2025/05/28(Wed)13:13:53 No.145289

>>144985
YUO DID NTO HAEV RIGHT TO SCREENCAP MY POST!!!
MY LOLIYER WILL BE COTNACTING U!!

29 Anonymous 2025/05/28(Wed)18:09:18 No.145331

File: screenshot.png

(1554 KB, 1652x1134)[ImgOps]

>>144985
teh glass!! :biggrin:

30 Anonymous 2025/05/28(Wed)21:53:00 No.145352

File: Eiffel_65_Theme_for_Heyuri_2.png

(47 KB, 877x289)[ImgOps]

"Blue" Eiffel 65 Style for Heyuri. Enjoy teh blue.

Big thanks to >>145280 for creating a scroll tag button just for my retarded ass (´￢`)

  /* "Eiffel 65"  Style for Heyuri */
:root {
    --color-bg-main: #000033;
    --color-fg-main: #e0e0ff;
    --color-fg-link: #00a8ff;
    --color-fg-link-hover: #00ffff;
    --color-bg-boardlist: #000066;
    --color-fg-boardlist: #aaddff;
    --color-bg-theading: #0000aa;
    --color-bg-theading2: #0044cc;
    --color-bg-theading3: #0066ff;
    --color-bg-postblock: #002288;
    --color-fg-title: #ffffff;
    --color-fg-name: #88ccff;
    --color-fg-warning: #ff5555;
    --color-fg-warning-ip: #ff0000;
    --color-fg-quote: #aaccff;
    --color-fg-quote2: #88aaff;
    --color-bg-reply: #001144;
    --color-bg-reply-hl: #003377;
    --color-hi-contrast-border: #00a8ff;
    --color-lo-contrast-border: #0088dd;
    --color-fg-logo: #00ffff;
    --color-fg-global-message: #00ffff;
    --color-bg-window-item-highlight: #0055aa;
    --color-bg-postlists-header: #0000aa;
    --color-fg-postlists-header: #00ffff;
    --color-fg-postlists-header-link: #88ffff;
    --color-bg-postlists-odd: #001155;
    --color-bg-postlists-even: #002266;
    --color-fg-quotelink: var(--color-fg-link);
    --color-fg-quotelink-hover: var(--color-fg-link-hover);
    --color-border-button: #00a8ff;
    --color-bg-code: #001133;
    --color-fg-code: #88ffff;
    --color-bg-flashboard-even: #001144;
    --font-family-main: 'Arial', 'Helvetica', sans-serif;
    --font-size-main: 0.875em;
}

body {
    background: linear-gradient(135deg, #000033 0%, #000055 100%);
    color: var(--color-fg-main);
    font-family: var(--font-family-main);
    font-size: var(--font-size-main);
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

/* Futuristic glowing panels */
.theading, .theading2, .theading3,
.neomenuTopLevel, .detailsbox, .postblock, .reply, .window {
    border: 1px solid var(--color-hi-contrast-border);
    background: linear-gradient(to bottom, #001166 0%, #000044 100%);
    box-shadow: 0 0 8px rgba(0, 170, 255, 0.3);
    border-radius: 4px;
    padding: 0.5em 1em;
    margin-bottom: 1em;
}

/* Glowing content boxes */
.detailsboxContent, .centerBlock, .catComment {
    background: rgba(0, 34, 102, 0.7);
    border: 1px solid var(--color-lo-contrast-border);
    box-shadow: inset 0 0 10px rgba(0, 136, 255, 0.2);
    padding: 1em;
    margin: 0.5em 0;
}

/* Cyber buttons */
button {
    background: linear-gradient(to bottom, #0088ff 0%, #0044aa 100%);
    border: 1px solid #00a8ff;
    color: white;
    font-size: 0.875em;
    padding: 0.25em 1em;
    font-family: var(--font-family-main);
    text-shadow: 0 0 5px rgba(0, 200, 255, 0.7);
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.3s ease;
}

button:hover {
    background: linear-gradient(to bottom, #00aaff 0%, #0066cc 100%);
    box-shadow: 0 0 10px rgba(0, 170, 255, 0.5);
}

/* Input Stuff */
input[type="text"], input[type="password"], textarea, select {
    background: rgba(0, 34, 68, 0.8);
    border: 1px solid var(--color-hi-contrast-border);
    padding: 0.25em 0.5em;
    font-family: var(--font-family-main);
    font-size: 0.875em;
    color: var(--color-fg-main);
    box-shadow: inset 0 0 5px rgba(0, 170, 255, 0.3);
}

/* Glowing links Effect*/
a {
    text-decoration: none;
    color: var(--color-fg-link);
    transition: all 0.3s ease;
}

a:hover {
    color: var(--color-fg-link-hover);
    text-shadow: 0 0 5px rgba(0, 200, 255, 0.7);
}

/* Glowing Logo Text */
.logo {
    font-family: 'Impact', 'Arial Black', sans-serif;
    font-size: 1.8em;
    color: var(--color-fg-logo);
    text-shadow: 0 0 10px rgba(0, 255, 255, 0.7);
    letter-spacing: 1px;
}

/* Thread styling with moar glow effect */
#catalogTable .thread {
    background: linear-gradient(to bottom, #001144 0%, #002266 100%);
    border: 1px solid var(--color-lo-contrast-border);
    box-shadow: 0 0 5px rgba(0, 170, 255, 0.3);
    padding: 1em;
    transition: all 0.3s ease;
}

#catalogTable .thread:hover {
    box-shadow: 0 0 15px rgba(0, 200, 255, 0.5);
}

/* Headings with light blue glow, very cool*/
h1, h2, h3, h4 {
    font-family: 'Arial Black', 'Impact', sans-serif;
    font-weight: normal;
    color: var(--color-fg-title);
    text-shadow: 0 0 5px rgba(0, 200, 255, 0.5);
    border-bottom: 1px solid var(--color-lo-contrast-border);
    padding-bottom: 0.25em;
}

/* Menu tabs with gradient */
.neomenuTopLevel h2 {
    background: linear-gradient(to right, #0000aa 0%, #0044cc 100%);
    border-bottom: 2px solid var(--color-hi-contrast-border);
    padding: 0.5em 1em;
    color: white;
    font-size: 1em;
    text-shadow: 0 0 3px rgba(0, 200, 255, 0.7);
}

/* Quote styling */
blockquote {
    border-left: 3px solid var(--color-hi-contrast-border);
    padding-left: 1em;
    margin-left: 0;
    color: var(--color-fg-quote);
    background: rgba(0, 51, 136, 0.3);
    padding: 0.5em;
}

/*Blue Circles for Users*/
.name:before {
    content: "🔵 ";
}

I'll post the css for my heyuri aqua theme later if anyonez interested.

31 Anonymous 2025/05/29(Thu)03:25:13 No.145378

>I'll post the css for my heyuri aqua theme later if anyonez interested.

yes plz ヽ(´ー｀)ノ

32 Anonymous 2025/05/29(Thu)20:39:33 No.145493

File: Thinking Cat.jpg

(308 KB, 800x600)[ImgOps]

>>145331
plz post css as text so I can copy-paste

Name
Email
Subject
Comment
File	Animated GIF
Password	(for deletion, 8 chars max)
Allowed file types are: gif, jpg, jpeg, png, bmp, swf, webm, mp4 Maximum file size allowed is 50000 KB. Images greater than 200 * 200 pixels will be thumbnailed. 24 unique users in the last 10 minutes (including lurkers) Switch form position \| BBCode reference Read the rules before you post. Protect your username, use a tripcode! 日本のへゆり

Heyuri!

Bulletin Boards

Heyuri★CGI

Other

Off-Topic@Heyuri

Posting mode: Reply