A classic mIRC look for The Lounge web IRC client: [time] (nick): message format, nick colors by rank, and full-line red highlights when someone mentions your name. The channel name also lights up red in the sidebar on a highlight, and turns blue for regular activity.
Usage: In The Lounge, go to Settings → Appearance → Custom CSS and paste the full code below.
#################################################################
Klasszikus mIRC kinézet a The Lounge webes IRC klienshez: [idő] (nick): üzenet formátum, rang szerinti nickszínek, és ha valaki kiírja a nevedet, a teljes sor pirosra vált, a szoba neve pedig pirosan kigyullad a listában. Sima aktivitásnál a szoba neve kék.
Használat: a The Lounge-ban a Settings → Appearance → Custom CSS mezőbe kell bemásolni a teljes kódot.
/* ==========================================================================
Klasszikus mIRC stílus – The Lounge téma
Created by Markus <[email protected]>
Web: https://ynm.hu
========================================================================== */
/* --------------------------------------------------------------------------
0. Változók (itt állítható minden szín és méret)
-------------------------------------------------------------------------- */
:root {
/* Betű */
--irc-font: "Courier New", Courier, monospace;
--irc-font-size: 21px;
--irc-line-height: 29px;
--irc-sidebar-font-size: 18px;
--irc-sidebar-line-height: 26px;
/* Alapszínek */
--irc-bg: #ffffff;
--irc-text: #000000;
--irc-border: #808080;
--irc-link: #0000ee;
/* Üzenettípusok és rangok */
--irc-navy: #000080; /* időbélyeg, üzenet szövege, sima nick */
--irc-green: #009300; /* join / part / quit / nick / kick */
--irc-teal: #009393; /* mode, topic, voice */
--irc-purple: #9c009c; /* akció (/me) */
--irc-brown: #7f0000; /* notice */
--irc-red: #ff0000; /* hiba, highlight, op */
--irc-blue: #0000ff; /* half-op, szoba aktivitás */
/* Oldalsáv (mIRC switchbar) */
--irc-sidebar-bg: #d4d0c8;
--irc-sidebar-active-bg: #0a246a;
--irc-sidebar-active-text: #ffffff;
}
/* --------------------------------------------------------------------------
1. Betűtípus, méret, vastagság
-------------------------------------------------------------------------- */
body, #chat, #chat .content, #chat .from, #chat .time,
#form #input, #sidebar, .userlist, .userlist .user {
font-family: var(--irc-font) !important;
font-size: var(--irc-font-size) !important;
font-weight: bold; /* normál vastagsághoz töröld ezt a sort */
}
/* --------------------------------------------------------------------------
2. Háttér és alapszín
-------------------------------------------------------------------------- */
#windows, #chat, #chat .chan, #chat .messages {
background: var(--irc-bg) !important;
color: var(--irc-text);
}
/* --------------------------------------------------------------------------
3. Sorok: tömör, egysoros elrendezés
-------------------------------------------------------------------------- */
#chat .msg {
padding: 0 4px;
line-height: var(--irc-line-height);
border: none;
}
#chat .msg .content { display: inline; }
/* --------------------------------------------------------------------------
4. Időbélyeg: [20:27:01]
-------------------------------------------------------------------------- */
#chat .msg .time {
display: inline;
width: auto;
min-width: 0;
margin-right: 4px;
}
#chat .msg .time,
#chat .msg .time time { color: var(--irc-navy) !important; }
#chat .msg .time time::before { content: "["; }
#chat .msg .time time::after { content: "]"; }
/* --------------------------------------------------------------------------
5. Nick: (nick): formátum, @/+ jel nélkül a chatben
-------------------------------------------------------------------------- */
#chat .msg .from {
display: inline;
width: auto;
min-width: 0;
text-align: left;
padding: 0;
margin-right: 4px;
}
#chat .msg[data-type="message"] .from .user::before { content: "(" !important; }
#chat .msg[data-type="message"] .from .user::after { content: "):" !important; }
#chat .msg .user-mode { display: none !important; }
/* Színezett nickek kikapcsolva (a rang szerinti színezés a 11. pontban van) */
#chat .user[class*="color-"] { color: var(--irc-text) !important; }
/* --------------------------------------------------------------------------
6. Üzenettípusok
-------------------------------------------------------------------------- */
/* Normál üzenet szövege */
#chat .msg[data-type="message"] .content { color: var(--irc-navy); }
/* Akció (/me) */
#chat .msg[data-type="action"],
#chat .msg[data-type="action"] .content,
#chat .msg[data-type="action"] .from .user { color: var(--irc-purple) !important; }
#chat .msg[data-type="action"] .from::before { content: "* "; }
/* Join / Part / Quit / Nick / Kick */
#chat .msg[data-type="join"], #chat .msg[data-type="join"] *,
#chat .msg[data-type="part"], #chat .msg[data-type="part"] *,
#chat .msg[data-type="quit"], #chat .msg[data-type="quit"] *,
#chat .msg[data-type="nick"], #chat .msg[data-type="nick"] *,
#chat .msg[data-type="kick"], #chat .msg[data-type="kick"] * {
color: var(--irc-green) !important;
}
/* Mode / Topic */
#chat .msg[data-type="mode"], #chat .msg[data-type="mode"] *,
#chat .msg[data-type="topic"], #chat .msg[data-type="topic"] *,
#chat .msg[data-type="topic_set_by"], #chat .msg[data-type="topic_set_by"] * {
color: var(--irc-teal) !important;
}
/* Notice */
#chat .msg[data-type="notice"], #chat .msg[data-type="notice"] * {
color: var(--irc-brown) !important;
}
/* Hiba */
#chat .msg[data-type="error"], #chat .msg[data-type="error"] * {
color: var(--irc-red) !important;
}
/* MOTD, whois */
#chat .msg[data-type="motd"], #chat .msg[data-type="motd"] *,
#chat .msg[data-type="whois"], #chat .msg[data-type="whois"] * {
color: var(--irc-text) !important;
}
/* --------------------------------------------------------------------------
7. Linkek
-------------------------------------------------------------------------- */
#chat a {
color: var(--irc-link);
text-decoration: underline;
}
/* --------------------------------------------------------------------------
8. Beviteli sor
-------------------------------------------------------------------------- */
#form {
background: var(--irc-bg);
border-top: 1px solid var(--irc-border);
}
#form #input {
background: var(--irc-bg);
color: var(--irc-text);
}
/* --------------------------------------------------------------------------
9. Nicklista (jobb oldalt)
-------------------------------------------------------------------------- */
.userlist {
background: var(--irc-bg) !important;
color: var(--irc-text) !important;
border-left: 1px solid var(--irc-border);
}
.userlist .user {
color: var(--irc-text) !important;
line-height: var(--irc-line-height);
}
/* Nincs "Operators" stb. fejléc, mint mIRC-ben */
.userlist .user-mode::before { display: none !important; }
/* --------------------------------------------------------------------------
10. Oldalsáv (szobalista)
-------------------------------------------------------------------------- */
/* Méret */
#sidebar .channel-list-item,
#sidebar .network .name,
#sidebar .channel-list-item .name {
font-size: var(--irc-sidebar-font-size) !important;
line-height: var(--irc-sidebar-line-height);
}
/* Háttér és alap szövegszín */
#sidebar, #sidebar .networks {
background: var(--irc-sidebar-bg) !important;
}
#sidebar, #sidebar .channel-list-item, #sidebar .network .name {
color: var(--irc-text) !important;
}
/* Aktív (kiválasztott) szoba */
#sidebar .channel-list-item.active {
background: var(--irc-sidebar-active-bg) !important;
color: var(--irc-sidebar-active-text) !important;
}
/* Jelvény (olvasatlan számláló) highlight esetén */
#sidebar .channel-list-item .badge.highlight {
background: var(--irc-red);
}
/* Sima aktivitás: a szoba neve kék */
#sidebar .channel-list-item:has(.badge):not(.active),
#sidebar .channel-list-item:has(.badge):not(.active) .name {
color: var(--irc-blue) !important;
}
/* Highlight (név említés): a szoba neve piros – ennek kell az aktivitás után jönnie */
#sidebar .channel-list-item:has(.badge.highlight):not(.active),
#sidebar .channel-list-item:has(.badge.highlight):not(.active) .name {
color: var(--irc-red) !important;
}
html body #sidebar .channel-list-item.has-highlight:not(.active),
html body #sidebar .channel-list-item.has-highlight:not(.active) .name,
html body #sidebar .channel-list-item.highlight:not(.active),
html body #sidebar .channel-list-item.highlight:not(.active) .name,
html body #sidebar .channel-list-item:has(.highlight):not(.active),
html body #sidebar .channel-list-item:has(.highlight):not(.active) .name,
html body #sidebar .channel-list-item:has([class*="highlight"]):not(.active),
html body #sidebar .channel-list-item:has([class*="highlight"]):not(.active) .name {
color: var(--irc-red) !important;
}
/* --------------------------------------------------------------------------
11. Rang szerinti nick színek
op/admin/owner = piros, half-op = kék, voice = türkiz, sima = sötétkék
-------------------------------------------------------------------------- */
/* Chat */
#chat .msg .user:has(.user-mode.op),
#chat .msg .user:has(.user-mode.admin),
#chat .msg .user:has(.user-mode.owner) { color: var(--irc-red) !important; }
#chat .msg .user:has(.user-mode.half-op) { color: var(--irc-blue) !important; }
#chat .msg .user:has(.user-mode.voice) { color: var(--irc-teal) !important; }
#chat .msg .user:has(.user-mode.normal) { color: var(--irc-navy) !important; }
/* Nicklista */
.userlist .user-mode.owner .user,
.userlist .user-mode.admin .user,
.userlist .user-mode.op .user { color: var(--irc-red) !important; }
.userlist .user-mode.half-op .user { color: var(--irc-blue) !important; }
.userlist .user-mode.voice .user { color: var(--irc-teal) !important; }
.userlist .user-mode.normal .user { color: var(--irc-navy) !important; }
/* --------------------------------------------------------------------------
12. Highlight a chatben: a teljes sor piros (idő, nick, szöveg, minden)
Ennek kell a legutolsónak lennie, hogy felülírja a rang szerinti színeket.
-------------------------------------------------------------------------- */
#chat .msg.highlight,
#chat .msg.highlight .content,
#chat .msg.highlight .from .user {
background: transparent !important;
font-weight: bold;
}
#chat .msg.highlight,
#chat .msg.highlight *,
#chat .msg.highlight .time time,
#chat .msg.highlight .user,
#chat .msg.highlight .content .user,
#chat .msg.highlight .user:has(.user-mode) {
color: var(--irc-red) !important;
}