125 lines
2.1 KiB
CSS
125 lines
2.1 KiB
CSS
@import "../larry/styles.css";
|
|
|
|
:root {
|
|
--ink: #11212b;
|
|
--paper: #f1f1e9;
|
|
--acid: #c7ef4b;
|
|
--orange: #ff6b35;
|
|
--line: #b9c5bc;
|
|
--muted: #59706b;
|
|
--field: #fbfbf6;
|
|
}
|
|
|
|
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(17 33 43 / 5%) 50%, transparent 50.5%), linear-gradient(rgb(17 33 43 / 4%) 1px, transparent 1px);
|
|
background-size: 70px 70px, 7px 7px;
|
|
}
|
|
|
|
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(--ink);
|
|
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(--ink);
|
|
}
|
|
|
|
#messagelist tr.selected td {
|
|
background: var(--ink);
|
|
color: var(--paper);
|
|
}
|
|
|
|
input[type="text"],
|
|
input[type="password"],
|
|
textarea,
|
|
select {
|
|
border: 1px solid var(--ink);
|
|
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(--ink);
|
|
}
|
|
|
|
#login-form,
|
|
#login-form .box-inner,
|
|
#login-form .boxcontent {
|
|
border-color: var(--ink);
|
|
border-radius: 0;
|
|
box-shadow: none;
|
|
background: var(--paper);
|
|
}
|
|
|
|
#login-form #logo {
|
|
max-width: 260px;
|
|
height: auto;
|
|
} |