Merge pull request #2328 from thelounge/astorije/local-themes
Local themes
This commit is contained in:
Jérémie Astori
GitHub
commit
b08b23d59e
@ -293,7 +293,7 @@ function initialize() {
|
||||
}
|
||||
|
||||
$settings.on("change", "input, select, textarea", function(e) {
|
||||
// We only want to trigger on human triggerd changes.
|
||||
// We only want to trigger on human triggered changes.
|
||||
if (e.originalEvent) {
|
||||
const $self = $(this);
|
||||
const type = $self.prop("type");
|
||||
|
||||
@ -27,6 +27,12 @@ socket.on("configuration", function(data) {
|
||||
options.initialize();
|
||||
webpush.initialize();
|
||||
|
||||
// If localStorage contains a theme that does not exist on this server, switch
|
||||
// back to its default theme.
|
||||
if (!data.themes.map((t) => t.name).includes(options.settings.theme)) {
|
||||
options.processSetting("theme", data.defaultTheme, true);
|
||||
}
|
||||
|
||||
const forms = $("#connect form, #change-password form");
|
||||
|
||||
forms.on("submit", function() {
|
||||
|
||||
@ -1,115 +0,0 @@
|
||||
/*
|
||||
Crypto theme for The Lounge.
|
||||
|
||||
Installation instructions can be found here
|
||||
https://thelounge.chat/docs/server/configuration.html#theme
|
||||
|
||||
Author: Aynik
|
||||
GitHub: https://github.com/aynik
|
||||
*/
|
||||
|
||||
body {
|
||||
background: #000;
|
||||
font: 16px Consolas, Menlo, Monaco, "Lucida Console", "DejaVu Sans Mono", "Courier New", monospace;
|
||||
}
|
||||
|
||||
a,
|
||||
#chat a {
|
||||
color: #00ff0e;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
#chat a:hover {
|
||||
color: #3eff48;
|
||||
}
|
||||
|
||||
#windows .window h2,
|
||||
#windows .window h3 {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#windows .window h2 {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.container {
|
||||
margin: 40px auto;
|
||||
}
|
||||
|
||||
#sign-in label {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#sign-in label input {
|
||||
margin-top: 10px !important;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
border-color: #00ff0e;
|
||||
color: #00ff0e;
|
||||
}
|
||||
|
||||
.btn:disabled,
|
||||
.btn:hover {
|
||||
background: #00ff0e;
|
||||
}
|
||||
|
||||
#connection-error {
|
||||
background: #f00;
|
||||
}
|
||||
|
||||
#settings .opt {
|
||||
line-height: 20px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
#sidebar .chan.lobby {
|
||||
color: #00ff0e;
|
||||
}
|
||||
|
||||
#sidebar button,
|
||||
#sidebar .chan,
|
||||
#chat .time,
|
||||
#chat .count::before,
|
||||
#sidebar .empty {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#chat .unhandled .from {
|
||||
color: #ddd;
|
||||
}
|
||||
|
||||
#sidebar .active {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#windows .header .topic,
|
||||
.messages .msg,
|
||||
.userlist {
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
#chat .user {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#windows #form .input {
|
||||
font-family: inherit;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
#windows select.input {
|
||||
height: 38px;
|
||||
}
|
||||
|
||||
#footer .icon {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* Previews */
|
||||
|
||||
#chat .toggle-text {
|
||||
line-height: initial;
|
||||
}
|
||||
@ -1,7 +1,3 @@
|
||||
/**
|
||||
* This is just an empty theme.
|
||||
*/
|
||||
|
||||
body {
|
||||
padding: 4px;
|
||||
padding-left: 0;
|
||||
@ -1,23 +1,3 @@
|
||||
/*
|
||||
Morning theme for The Lounge.
|
||||
Has a bit more eye-friendly color scheme.
|
||||
|
||||
Installation instructions can be found here
|
||||
https://thelounge.chat/docs/server/configuration.html#theme
|
||||
|
||||
Author: Riku Rouvila
|
||||
GitHub: https://github.com/rikukissa
|
||||
*/
|
||||
|
||||
/*
|
||||
BACKGROUND #333c4a
|
||||
INPUT BACKGROUND #2e3642
|
||||
PRIMARY #fefefe
|
||||
SECONDARY #99a2b4
|
||||
BORDERS #2a323d
|
||||
QUIT #d0907d
|
||||
*/
|
||||
|
||||
body {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
@ -1,275 +0,0 @@
|
||||
/*
|
||||
Zenburn theme for The Lounge.
|
||||
Based on the Morning Theme by Riku Rouvila
|
||||
|
||||
Installation instructions can be found here
|
||||
https://thelounge.chat/docs/server/configuration.html#theme
|
||||
|
||||
Author: JP Smith
|
||||
GitHub: https://github.com/japesinator
|
||||
*/
|
||||
|
||||
/*
|
||||
BACKGROUND #3f3f3f
|
||||
INPUT BACKGROUND #434443
|
||||
PRIMARY #dcdccc
|
||||
SECONDARY #d2d39b
|
||||
BORDERS #333333
|
||||
QUIT #bc6c4c
|
||||
*/
|
||||
|
||||
body {
|
||||
background: #2b2b2b;
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
.logo {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.logo-inverted {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#main,
|
||||
#chat .userlist,
|
||||
#windows .chan,
|
||||
#windows .window {
|
||||
background: #3f3f3f;
|
||||
}
|
||||
|
||||
#settings,
|
||||
#sign-in,
|
||||
#connect .title {
|
||||
color: #88b090;
|
||||
}
|
||||
|
||||
#settings,
|
||||
#sign-in,
|
||||
#connect .opt {
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
background: #2b2b2b;
|
||||
}
|
||||
|
||||
#footer {
|
||||
background: #333;
|
||||
border-top: 1px solid #000;
|
||||
}
|
||||
|
||||
#chat .userlist .count {
|
||||
background-color: #434443;
|
||||
}
|
||||
|
||||
#chat .userlist .search {
|
||||
color: #88b090;
|
||||
padding: 15px 16px;
|
||||
}
|
||||
|
||||
/* Borders */
|
||||
#chat .content,
|
||||
#windows .header,
|
||||
#chat .user-mode::before,
|
||||
#chat .userlist {
|
||||
border-color: #333;
|
||||
}
|
||||
|
||||
/* User list */
|
||||
#chat .user-mode {
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
#chat .userlist .user.active {
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
/* Nicknames */
|
||||
#chat .user {
|
||||
color: #bc8cbc;
|
||||
}
|
||||
|
||||
#chat.colored-nicks .user.color-1 { color: #f7adf7; }
|
||||
#chat.colored-nicks .user.color-2 { color: #abf99f; }
|
||||
#chat.colored-nicks .user.color-3 { color: #86efdc; }
|
||||
#chat.colored-nicks .user.color-4 { color: #ca95ec; }
|
||||
#chat.colored-nicks .user.color-5 { color: #f9a4b3; }
|
||||
#chat.colored-nicks .user.color-6 { color: #f7999a; }
|
||||
#chat.colored-nicks .user.color-7 { color: #f497b9; }
|
||||
#chat.colored-nicks .user.color-8 { color: #f9a9d7; }
|
||||
#chat.colored-nicks .user.color-9 { color: #8babe5; }
|
||||
#chat.colored-nicks .user.color-10 { color: #a8b8ff; }
|
||||
#chat.colored-nicks .user.color-11 { color: #b999fc; }
|
||||
#chat.colored-nicks .user.color-12 { color: #f4aead; }
|
||||
#chat.colored-nicks .user.color-13 { color: #fc82b5; }
|
||||
#chat.colored-nicks .user.color-14 { color: #ff77e1; }
|
||||
#chat.colored-nicks .user.color-15 { color: #8cb6ea; }
|
||||
#chat.colored-nicks .user.color-16 { color: #f98a81; }
|
||||
#chat.colored-nicks .user.color-17 { color: #ed9b82; }
|
||||
#chat.colored-nicks .user.color-18 { color: #8df484; }
|
||||
#chat.colored-nicks .user.color-19 { color: #ffcce3; }
|
||||
#chat.colored-nicks .user.color-20 { color: #efcc81; }
|
||||
#chat.colored-nicks .user.color-21 { color: #96a6ee; }
|
||||
#chat.colored-nicks .user.color-22 { color: #f4d484; }
|
||||
#chat.colored-nicks .user.color-23 { color: #97ea70; }
|
||||
#chat.colored-nicks .user.color-24 { color: #fcbbba; }
|
||||
#chat.colored-nicks .user.color-25 { color: #eef975; }
|
||||
#chat.colored-nicks .user.color-26 { color: #c7ff93; }
|
||||
#chat.colored-nicks .user.color-27 { color: #ffade1; }
|
||||
#chat.colored-nicks .user.color-28 { color: #98ecf2; }
|
||||
#chat.colored-nicks .user.color-29 { color: #95a5f5; }
|
||||
#chat.colored-nicks .user.color-30 { color: #b49eea; }
|
||||
#chat.colored-nicks .user.color-31 { color: #f2a4eb; }
|
||||
#chat.colored-nicks .user.color-32 { color: #85f27d; }
|
||||
|
||||
#chat a {
|
||||
color: #8c8cbc;
|
||||
}
|
||||
|
||||
/* Increase contrast of some IRC colors */
|
||||
.irc-fg2 { color: #1b94ff; }
|
||||
.irc-fg5 { color: #e969a7; }
|
||||
.irc-fg12 { color: #6fb7ff; }
|
||||
|
||||
/* Message form */
|
||||
#form {
|
||||
background: #333;
|
||||
border-color: #101010;
|
||||
}
|
||||
|
||||
#windows #form .input {
|
||||
background-color: #434443 !important;
|
||||
border-color: #101010 !important;
|
||||
color: #dcdccc !important;
|
||||
}
|
||||
|
||||
#form #nick {
|
||||
background: #101010;
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
#form #submit:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
#chat .show-more-button {
|
||||
background: #434443;
|
||||
border-color: #101010;
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
#chat .show-more-button:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#chat .header {
|
||||
color: #d2d39b;
|
||||
}
|
||||
|
||||
/* Notification dot on the top right corner of the menu icon */
|
||||
#viewport .lt::after {
|
||||
border-color: #3f3f3f;
|
||||
}
|
||||
|
||||
#chat .unread-marker-text::before {
|
||||
background-color: #3f3f3f;
|
||||
}
|
||||
|
||||
#chat .date-marker::before {
|
||||
border-color: #97ea70;
|
||||
}
|
||||
|
||||
#chat .date-marker-text::before {
|
||||
background-color: #3f3f3f;
|
||||
color: #97ea70;
|
||||
}
|
||||
|
||||
/* Setup text colors */
|
||||
#chat .msg {
|
||||
color: #ffcfaf;
|
||||
}
|
||||
|
||||
#chat .message {
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
#chat .self .text {
|
||||
color: #d2d39b;
|
||||
}
|
||||
|
||||
#chat .error,
|
||||
#chat .error .from,
|
||||
#chat .channel .highlight,
|
||||
#chat .channel .highlight .from,
|
||||
#chat .channel .highlight .text {
|
||||
color: #bc6c4c;
|
||||
}
|
||||
|
||||
#chat .unhandled .from {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
#chat .msg.quit .time,
|
||||
#chat .msg.quit .from button {
|
||||
color: #bc6c9c !important;
|
||||
}
|
||||
|
||||
#chat .msg.topic {
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
#chat .msg.join .time,
|
||||
#chat .msg.join .from button {
|
||||
color: #8cd0d3 !important;
|
||||
}
|
||||
|
||||
#chat table.channel-list td {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
code,
|
||||
.irc-monospace {
|
||||
background: #333;
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
kbd {
|
||||
color: #eee;
|
||||
text-shadow: 0 -1px 0 #000;
|
||||
border-color: #000;
|
||||
background-color: #333;
|
||||
background-image: linear-gradient(rgba(0, 0, 0, 0.25), transparent);
|
||||
box-shadow: 0 2px 0 #000, inset 0 1px 1px #777, inset 0 -1px 3px #222;
|
||||
}
|
||||
|
||||
/* Previews */
|
||||
|
||||
#chat .toggle-content {
|
||||
background: #333;
|
||||
color: #dcdccc;
|
||||
}
|
||||
|
||||
#chat .toggle-content .body {
|
||||
color: #d2d39b;
|
||||
}
|
||||
|
||||
/* Form elements */
|
||||
|
||||
#chat-container ::-moz-placeholder {
|
||||
color: #d2d39b;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#chat-container ::-webkit-input-placeholder {
|
||||
color: #d2d39b;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#chat-container :-ms-input-placeholder {
|
||||
color: #d2d39b;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
/* End form elements */
|
||||
@ -54,9 +54,9 @@ module.exports = {
|
||||
// Find out how to add new themes at https://thelounge.github.io/docs/plugins/themes.html
|
||||
//
|
||||
// @type string
|
||||
// @default "example"
|
||||
// @default "default"
|
||||
//
|
||||
theme: "example",
|
||||
theme: "default",
|
||||
|
||||
//
|
||||
// Prefetch URLs
|
||||
|
||||
@ -102,6 +102,21 @@ function setHome(newPath) {
|
||||
// Load theme color from manifest.json
|
||||
const manifest = require("../public/manifest.json");
|
||||
this.config.themeColor = manifest.theme_color;
|
||||
|
||||
// TODO: Remove in future release
|
||||
if (["example", "crypto", "zenburn"].includes(this.config.theme)) {
|
||||
if (this.config.theme === "example") {
|
||||
log.warn(`The default theme ${colors.red("example")} was renamed to ${colors.green("default")} as of The Lounge v3.`);
|
||||
} else {
|
||||
log.warn(`The theme ${colors.red(this.config.theme)} was moved to a separate theme as of The Lounge v3.`);
|
||||
log.warn(`Install it with ${colors.bold("thelounge install thelounge-theme-" + this.config.theme)}.`);
|
||||
}
|
||||
|
||||
log.warn(`Falling back to theme ${colors.green("default")} will be removed in a future release.`);
|
||||
log.warn("Please update your configuration file accordingly.");
|
||||
|
||||
this.config.theme = "default";
|
||||
}
|
||||
}
|
||||
|
||||
function getHomePath() {
|
||||
|
||||
@ -555,6 +555,7 @@ function getClientConfiguration() {
|
||||
config.version = pkg.version;
|
||||
config.gitCommit = Helper.getGitCommit();
|
||||
config.themes = themes.getAll();
|
||||
config.defaultTheme = Helper.config.theme;
|
||||
|
||||
if (config.displayNetwork) {
|
||||
config.defaults = _.clone(Helper.config.defaults);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user