Add Eternity-larry-wasteland dark theme
This commit is contained in:
@@ -84,6 +84,16 @@ $config['skin'] = 'eternity-classic';
|
||||
|
||||
Both variants use their own Eternity Project logo and browser icon. They are intended for Roundcube 1.6 installations where the matching legacy base skin is available.
|
||||
|
||||
### Eternity Larry Wasteland
|
||||
|
||||
`eternity-larry-wasteland` is the dark Larry variant using the Wasteland palette from `docker-ep-blog-web-server/themes`: charcoal surfaces, parchment text, olive selected states, rust-orange accents, and the technical-grid background.
|
||||
|
||||
It requires the Larry base skin, installed as described above, then activates with:
|
||||
|
||||
```php
|
||||
$config['skin'] = 'eternity-larry-wasteland';
|
||||
```
|
||||
|
||||
## Docker Install
|
||||
|
||||
### Docker Compose (persistent)
|
||||
@@ -194,6 +204,13 @@ eternity-larry/
|
||||
images/ Eternity Project logo and browser icon
|
||||
meta.json Larry child-skin registration
|
||||
styles.css Larry import and Eternity legacy UI overrides
|
||||
eternity-larry-wasteland/
|
||||
images/ Wasteland logo, browser icon, and preview watermark
|
||||
includes/links.html Larry shared asset links and browser icon
|
||||
mail.css Larry mail stylesheet import
|
||||
meta.json Larry Wasteland child-skin registration
|
||||
styles.css Wasteland palette and Larry UI overrides
|
||||
watermark.html Dark Wasteland preview background
|
||||
eternity-classic/
|
||||
images/ Eternity Project logo and browser icon
|
||||
common.css Classic common UI import and Eternity overrides
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-label="Eternity Project">
|
||||
<rect width="64" height="64" fill="#161210"/>
|
||||
<circle cx="32" cy="32" r="22" fill="none" stroke="#e7e2d3" stroke-width="3"/>
|
||||
<circle cx="22" cy="22" r="4" fill="#e4632c"/>
|
||||
<circle cx="41" cy="28" r="2.5" fill="#8fae3d"/>
|
||||
<circle cx="27" cy="43" r="3" fill="#e4632c"/>
|
||||
<line x1="22" y1="22" x2="41" y2="28" stroke="#e7e2d3" stroke-width="1.5"/>
|
||||
<line x1="22" y1="22" x2="27" y2="43" stroke="#e7e2d3" stroke-width="1.5"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 542 B |
@@ -0,0 +1,10 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 60" role="img" aria-label="Eternity Project">
|
||||
<circle cx="30" cy="30" r="22" fill="none" stroke="#e7e2d3" stroke-width="2"/>
|
||||
<circle cx="21" cy="21" r="3" fill="#e4632c"/>
|
||||
<circle cx="38" cy="26" r="2" fill="#8fae3d"/>
|
||||
<circle cx="26" cy="40" r="2.5" fill="#e4632c"/>
|
||||
<line x1="21" y1="21" x2="38" y2="26" stroke="#e7e2d3" stroke-width="1"/>
|
||||
<line x1="21" y1="21" x2="26" y2="40" stroke="#e7e2d3" stroke-width="1"/>
|
||||
<text x="66" y="30" font-family="'Space Grotesk','Helvetica Neue',sans-serif" font-size="24" font-weight="700" letter-spacing="1" fill="#e7e2d3">ETERNITY</text>
|
||||
<text x="67" y="46" font-family="'DM Mono','Courier New',monospace" font-size="11" letter-spacing="2" fill="#a89a86">PROJECT / FI</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 793 B |
@@ -0,0 +1,10 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 80" role="img" aria-label="Eternity Project">
|
||||
<circle cx="40" cy="40" r="28" fill="none" stroke="#8fae3d" stroke-width="3"/>
|
||||
<circle cx="28" cy="28" r="4" fill="#e4632c"/>
|
||||
<circle cx="51" cy="35" r="3" fill="#8fae3d"/>
|
||||
<circle cx="35" cy="54" r="3.5" fill="#e4632c"/>
|
||||
<line x1="28" y1="28" x2="51" y2="35" stroke="#8fae3d" stroke-width="2"/>
|
||||
<line x1="28" y1="28" x2="35" y2="54" stroke="#8fae3d" stroke-width="2"/>
|
||||
<text x="84" y="38" font-family="'Space Grotesk','Helvetica Neue',sans-serif" font-size="27" font-weight="700" letter-spacing="1" fill="#8fae3d">ETERNITY</text>
|
||||
<text x="85" y="57" font-family="'DM Mono','Courier New',monospace" font-size="11" letter-spacing="2" fill="#8fae3d">PROJECT / FI</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 793 B |
@@ -0,0 +1,13 @@
|
||||
<meta name="viewport" content="" id="viewport" />
|
||||
<roundcube:object name="meta" />
|
||||
<roundcube:object name="links" />
|
||||
<link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
|
||||
<link rel="shortcut icon" type="image/svg+xml" href="/images/favicon.svg" />
|
||||
<link rel="stylesheet" type="text/css" href="/styles.css" />
|
||||
<roundcube:if condition="in_array(env:task, array('mail','addressbook','settings'))" />
|
||||
<link rel="stylesheet" type="text/css" href="/<roundcube:var name="env:task" />.css" />
|
||||
<roundcube:endif />
|
||||
<script src="/ui.js"></script>
|
||||
<roundcube:add_label name="errortitle" />
|
||||
<roundcube:add_label name="toggleadvancedoptions" />
|
||||
<roundcube:add_label name="options" />
|
||||
@@ -0,0 +1,45 @@
|
||||
@import "../larry/mail.css";
|
||||
|
||||
#mailboxcontainer,
|
||||
#folderlist-content,
|
||||
#folderlist-footer,
|
||||
#messagelistcontainer,
|
||||
#messagelistheader,
|
||||
#messagelistfooter,
|
||||
#mailview-left,
|
||||
#mailview-right {
|
||||
background: var(--field);
|
||||
border-color: var(--line);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
#messagelistheader,
|
||||
#messagelistfooter {
|
||||
background: var(--field) !important;
|
||||
border-color: var(--line) !important;
|
||||
}
|
||||
|
||||
#messagelistheader a,
|
||||
#messagelistfooter a,
|
||||
#folderlist-footer a {
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
#messagelistheader a:hover,
|
||||
#messagelistfooter a:hover,
|
||||
#folderlist-footer a:hover {
|
||||
background: var(--acid);
|
||||
color: var(--paper);
|
||||
}
|
||||
|
||||
#mailboxmenulink.listbutton.groupactions {
|
||||
background: var(--field);
|
||||
border-color: var(--line);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
#mailboxmenulink.listbutton.groupactions:hover {
|
||||
background: var(--acid);
|
||||
border-color: var(--acid);
|
||||
color: var(--paper);
|
||||
}
|
||||
@@ -0,0 +1,13 @@
|
||||
{
|
||||
"name": "Eternity Larry Wasteland",
|
||||
"author": "Eternity Project",
|
||||
"license": "GNU Affero General Public License",
|
||||
"version": "1.0.0",
|
||||
"extends": "larry",
|
||||
"localization": false,
|
||||
"config": {
|
||||
"product_name": "eternityproject.fi",
|
||||
"skin_logo": "skins/eternity-larry-wasteland/images/logo.svg",
|
||||
"skin_favicon": "skins/eternity-larry-wasteland/images/favicon.svg"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,160 @@
|
||||
@import "../larry/styles.css";
|
||||
|
||||
:root {
|
||||
--ink: #e7e2d3;
|
||||
--paper: #161210;
|
||||
--acid: #8fae3d;
|
||||
--orange: #e4632c;
|
||||
--line: #4a3f33;
|
||||
--muted: #a89a86;
|
||||
--field: #211b17;
|
||||
}
|
||||
|
||||
html,
|
||||
body,
|
||||
#mainscreen,
|
||||
#layout,
|
||||
#main-menu,
|
||||
#taskbar,
|
||||
#mailboxlist,
|
||||
#messagelist,
|
||||
#messageframe {
|
||||
background: var(--paper);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Space Grotesk", "Helvetica Neue", sans-serif;
|
||||
background-image: linear-gradient(90deg, transparent 49.5%, rgb(228 98 44 / 7%) 50%, transparent 50.5%), linear-gradient(rgb(228 98 44 / 5%) 1px, transparent 1px);
|
||||
background-size: 70px 70px, 7px 7px;
|
||||
}
|
||||
|
||||
body::after {
|
||||
content: "";
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: -1;
|
||||
pointer-events: none;
|
||||
background-image: radial-gradient(circle at 12% 20%, rgb(143 174 61 / 12%), transparent 35%), radial-gradient(circle at 85% 75%, rgb(228 98 44 / 14%), transparent 40%);
|
||||
}
|
||||
|
||||
a,
|
||||
#taskbar a,
|
||||
#mailboxlist li a,
|
||||
#messagelist tr td {
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
#taskbar a:hover,
|
||||
#mailboxlist li a:hover {
|
||||
color: var(--orange);
|
||||
}
|
||||
|
||||
#taskbar,
|
||||
#mailboxlist,
|
||||
#messagelist,
|
||||
#messagelist-header,
|
||||
#mailboxlist-header,
|
||||
.box,
|
||||
.boxcontent,
|
||||
.popupmenu,
|
||||
.menu,
|
||||
.toolbar {
|
||||
border-color: var(--line);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#taskbar a.selected,
|
||||
#taskbar a:hover,
|
||||
#mailboxlist li.selected > a,
|
||||
#mailboxlist li a:hover,
|
||||
#messagelist tr:hover td {
|
||||
background: var(--acid);
|
||||
color: var(--paper);
|
||||
}
|
||||
|
||||
#messagelist tr.selected td {
|
||||
background: var(--ink);
|
||||
color: var(--paper);
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
textarea,
|
||||
select {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
background: var(--field);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
input:focus,
|
||||
textarea:focus,
|
||||
select:focus {
|
||||
outline: 3px solid var(--acid);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
input[type="submit"],
|
||||
input[type="button"],
|
||||
button,
|
||||
.button,
|
||||
.toolbar .button {
|
||||
border: 1px solid var(--ink);
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
background: var(--ink);
|
||||
color: var(--paper);
|
||||
font-family: "DM Mono", "Courier New", monospace;
|
||||
}
|
||||
|
||||
input[type="submit"]:hover,
|
||||
input[type="button"]:hover,
|
||||
button:hover,
|
||||
.button:hover,
|
||||
.toolbar .button:hover {
|
||||
background: var(--acid);
|
||||
color: var(--paper);
|
||||
}
|
||||
|
||||
#login-form,
|
||||
#login-form .box-inner,
|
||||
#login-form .boxcontent {
|
||||
border-color: var(--line);
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
background: var(--paper);
|
||||
}
|
||||
|
||||
#login-form #logo {
|
||||
max-width: 260px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#toplogo {
|
||||
display: block;
|
||||
width: 180px;
|
||||
max-width: calc(100% - 40px);
|
||||
height: auto;
|
||||
max-height: 36px;
|
||||
margin: 8px 12px;
|
||||
}
|
||||
|
||||
#topnav {
|
||||
background: var(--paper);
|
||||
border-bottom: 1px solid var(--line);
|
||||
}
|
||||
|
||||
#taskbar a.button-selected,
|
||||
#taskbar a.button-selected:hover {
|
||||
background: var(--acid);
|
||||
border-color: var(--acid);
|
||||
color: var(--paper);
|
||||
}
|
||||
|
||||
#taskbar a.button-selected::before,
|
||||
#taskbar a.button-selected:hover::before {
|
||||
color: var(--paper);
|
||||
}
|
||||
@@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title></title>
|
||||
<style type="text/css">
|
||||
html, body { height: 100%; margin: 0; overflow: hidden; }
|
||||
body {
|
||||
background-color: #161210;
|
||||
background-image: linear-gradient(90deg, transparent 49.5%, rgb(228 98 44 / 7%) 50%, transparent 50.5%), linear-gradient(rgb(228 98 44 / 5%) 1px, transparent 1px);
|
||||
background-size: 70px 70px, 7px 7px;
|
||||
}
|
||||
body::before {
|
||||
content: "";
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
background: url(images/watermark.svg) center no-repeat;
|
||||
background-size: min(48vw, 300px) auto;
|
||||
opacity: 0.52;
|
||||
}
|
||||
body::after {
|
||||
content: "";
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
background-image: radial-gradient(circle at 12% 20%, rgb(143 174 61 / 12%), transparent 35%), radial-gradient(circle at 85% 75%, rgb(228 98 44 / 14%), transparent 40%);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
||||
@@ -132,3 +132,20 @@ button:hover,
|
||||
max-height: 36px;
|
||||
margin: 8px 12px;
|
||||
}
|
||||
|
||||
#topnav {
|
||||
background: var(--paper);
|
||||
border-bottom: 1px solid var(--ink);
|
||||
}
|
||||
|
||||
#taskbar a.button-selected,
|
||||
#taskbar a.button-selected:hover {
|
||||
background: var(--acid);
|
||||
border-color: var(--acid);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
#taskbar a.button-selected::before,
|
||||
#taskbar a.button-selected:hover::before {
|
||||
color: var(--ink);
|
||||
}
|
||||
Reference in New Issue
Block a user